@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
body, li {font-family: "Merriweather", serif;}
p { font-family: "Merriweather", serif; font-size: 15px;letter-spacing: 1px;color: #393939;margin: 0 0 20px 0;line-height: 1.8;}
a { text-decoration: none;}
h1, h2, h3 { font-family: "Merriweather", serif;}

.heading { font-size: 40px; color: #141414; font-weight: 500; margin: 0 0 20px 0;}
.sub-heading {font-size: 30px;color: #141414;font-weight: 400;margin: 0 0 15px 0;text-align: left;line-height: 1.4;}
.custom-btn {display: inline-block;background: #195fa4;color: #fff;padding: 12px 30px;font-size: 17px;font-weight: 600;letter-spacing: .5px;border-radius: 10px;}
.custom-btn:hover { background: #7dba3b; color: #fff;}

.top-header {padding: 10px 0;background: #2e2e2e;}
.top-header p { margin: 0;}
.top-header p a {color: #fff;font-size: 14px;}
.top-header p i { color: #7dba3b; font-size: 13px; margin: 0 5px 0 0;}
.top-header .social-icon a { display: inline-block; width: 28px; height: 28px; border-radius: 50%; background: #7dba3b; color: #fff; text-align: center; font-size: 14px; line-height: 1.9;}

.banner-section h1 { color: #141414; font-size: 42px; margin: 0 0 20px 0; font-weight: 500; line-height: 1.4;}
.banner-section p { font-size: 24px; margin: 0 0 30px 0;}
.banner-section .custom-btn {padding: 14px 34px;font-size: 18px;font-weight: 500;letter-spacing: .8px;border-radius: 10px;}

.query-section { background-image: url('image/query-bg.jpg'); background-size: cover; background-attachment: fixed; padding: 7% 0;}
.query-section .query-bx {padding: 40px;border-radius: 5px;background-image: linear-gradient(90deg,rgba(7, 7, 7, 0.8) 10%, rgba(25, 95, 164, .85));}
.query-section .query-bx .form-control { padding: 10px; background: transparent; border: 2px solid #e9e9e9; margin: 0 0 15px 0; color: #fff; font-size: 17px;}
.query-section .query-bx .form-control::placeholder { color: #fff;}
.query-section .query-bx input[type='button'] { background: #fff; color: #111111; font-weight: 600; border: none; padding: 12px;}
.query-section .query-bx input[type='button']:hover { background: #111111; color: #fff;}

.about-section {padding: 8% 0;background-image: url('image/bg-img.jpg');background-size: cover;background-repeat: no-repeat;} 
.about-section .about-pic img { border-radius: 240px 240px 0 0; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}
.about-section ul li { font-size: 15px; letter-spacing: 1px; color: #393939; margin: 0 0 10px 0;line-height: 1.8;}

.services-section {padding: 5% 0;}
.services-section .ser-card {margin: 16px 0;background: #fff;box-shadow: rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px;min-height: 330px;}
.services-section .ser-card .pic { overflow: hidden;}
.services-section .ser-card img { transition: all .4s ease-in-out;}
.services-section .ser-card:hover img { transform: scale(1.15);}
.services-section .ser-card .ser-name {padding: 27px 10px;}
.services-section .ser-card h3 {color: #195fa4;text-align: center;font-size: 19px;margin: 0;font-weight: 600;}

footer { background-image: url('image/footer-bg.jpg'); background-size: cover; background-attachment: fixed; padding: 6% 0 0 0; position: relative;}
footer::after {content: '';position: absolute;width: 100%;height: 100%;background-image: linear-gradient(90deg, rgb(25 95 164 / 70%), rgb(7 7 7) 60%);top: 0;left: 0;}
footer .footer-text { position: relative; z-index: 2;}
footer h4 { color: #fff; font-size: 22px; margin: 0 0 25px 0;}
footer p, footer p a { color: #dddddd;}
footer .footer-text p { display: flex; margin: 0 0 10px 0;}
footer p i { color: #1522c2; margin: 0 8px 0 0;}
footer .footer-bottom { padding: 18px 0; border-top: 1px solid rgba(255, 255, 255, .3); position: relative; z-index: 2; margin: 4% 0 0 0;}
footer .footer-bottom p { margin: 0;}
footer .footer-bottom .social-icon a { display: inline-block; background: #fff; width: 30px; height: 30px; border-radius: 50%; text-align: center; color: #1522c2; font-size: 14px; line-height: 2.2; } 

.services-page ul li, .services-page ul,.csm-card ul { list-style-type: none; margin: 0; padding: 0;}
.services-page ul li, .csm-card ul li { font-size: 15px;letter-spacing: 1px;color: #393939; margin: 0 0 13px 0;line-height: 1.5; display: flex;}
.services-page ul li i,.csm-card ul li i { color: #195fa4; font-size: 20px; margin: 0 5px 0 0;}
.csm-card{box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px; height:100%; padding:10px 20px; border-radius:5px; transition:.2s;}
.csm-card:hover{box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;}
.csm-card ul li {display:block;}

.team-page h4 { font-size: 24px; margin: 20px 0 15px 0; font-weight: 400;}
.team-page i { color: #195fa4; font-size: 27px; margin: 20px 0 0 0;}
.team-page .team-card { margin: 16px 0; background: #fff; box-shadow: rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px;}
.team-page .team-card .team-name {padding: 27px 10px;}
.team-page .team-card h3 {color: #195fa4;text-align: center;font-size: 19px;margin: 0;font-weight: 600;}

@media (min-width: 320px) and ( max-width: 768px) { 
    p { font-size: 14px;}
    
    .heading { font-size: 27px; margin: 0 0 15px 0;}
    .sub-heading {font-size: 21px;}
    .custom-btn { padding: 10px 23px; font-size: 14px;}

    .top-header {padding: 8px 0;}
    .top-header p a {font-size: 13px;}
    .top-header .social-icon a { width: 25px; height: 25px; font-size: 12px; line-height: 2;}

    .banner-section h1 { font-size: 27px; margin: 40px 0 10px 0;}
    .banner-section p { font-size: 16px; margin: 0 0 10px 0;}
    .banner-section .custom-btn { padding: 10px 24px; font-size: 14px; margin: 0 0 20px 0;}

    .services-section { padding: 0 0 5% 0;}
    .services-section .ser-card { margin: 12px 0;}
    .services-section .ser-card .ser-name {padding: 20px 10px;}
    .services-section .ser-card h3 { font-size: 18px;}

    footer h4 { font-size: 18px; margin: 20px 0 10px 0;}
    footer p, footer p a { font-size: 13px;margin: 0 0 5px 0;}

    .services-page ul li, .services-page ul { list-style-type: none; margin: 0; padding: 0;}
    .services-page ul li { font-size: 15px;letter-spacing: 1px;color: #393939; margin: 0 0 13px 0;line-height: 1.5; display: flex;}
    .services-page ul li i { color: #195fa4; font-size: 20px; margin: 0 5px 0 0;}

    .team-page h4 { font-size: 24px; margin: 20px 0 15px 0; font-weight: 400;}
    .team-page i { color: #195fa4; font-size: 27px; margin: 20px 0 0 0;}
    .team-page .team-card { margin: 16px 0; background: #fff; box-shadow: rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px;}
    .team-page .team-card .team-name {padding: 27px 10px;}
    .team-page .team-card h3 {color: #195fa4;text-align: center;font-size: 19px;margin: 0;font-weight: 600;}

}