@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
body { margin: 0; padding: 0; font-family: "Lato", sans-serif;}
p {color: #252525;font-size: 16px; letter-spacing: .6px;line-height: 1.8;margin: 0 0 20px 0;font-family: "Lato", sans-serif;}
.main-table li {color: #252525;font-size: 16px;letter-spacing: .4px;line-height: 1.5;margin: 0 0 10px 0; font-family: "Lato", sans-serif;}
a { text-decoration: none !important; font-family: "Lato", sans-serif;}
h1, h2, h3, h4, h5 { font-family: "Lato", sans-serif;}

.main-table { padding: 7% 0;}

.heading { margin: 0; position: relative; font-weight: 600; color: #334750; font-size: 26px; letter-spacing: 3px; text-transform: uppercase; text-align: center; margin: 0 0 60px 0;}
.heading::after { content: ''; position: absolute; width: 80px; height: 2px; background: #0e79bf; left: 0; right: 0; margin: 0 auto; bottom: -20px;}
.custom-btn { background: transparent; border: 1px solid #808080; display: inline-block; padding: 8px 16px; color: #334750; font-size: 12px; text-transform: uppercase; letter-spacing: .7px; font-weight: 500;}
.custom-btn1 { background: transparent; border: 1px solid #ffffff; display: inline-block; padding: 16px 32px; color: #fff; font-size: 12px; text-transform: uppercase; letter-spacing: 2px;}
.custom-btn1:hover { color: #fff;}
.team-name { color: #0e79bf; font-size: 18px; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; margin: 0 0 20px 0;}

header { background: #e9e8e4;}

.banner-section { background-image: url('image/banner-img.jpg'); background-size: cover; padding: 17% 0; border-bottom: 70px solid #0e79bf;}
.banner-section h1 {color: #fff;font-size: 32px;letter-spacing: 2px;text-transform: uppercase;font-weight: 600;margin: 0 0 20px 0;text-shadow: 1px 1px 23px rgba(0, 0, 0, .7);}
.banner-section p {font-size: 21px;text-shadow: 1px 1px 23px rgba(0, 0, 0, .7);letter-spacing: 4px;color: #fff;}
.banner-section span.line { width: 34px; background: rgb(243, 237, 237); display: inline-block; height: 2px; margin: 1px 0px 8px 0px; }

.about-section { padding: 9% 0;}
.about-section p { margin: 70px 0 20px 0;}
.about-section a { display: inline-block; font-size: 13px; text-transform: uppercase; letter-spacing: 3px; color: #0e79bf; font-weight: 600; margin: 30px 0 0 0;}
.about-section a i {margin: 0 0 10px 0;}

.query-card { border: 1px solid #808080; padding: 45px 30px 50px 30px;}
.query-card img { width: 50px; margin: 0 0 10px 0;}
.query-card h4 { color: #334750; margin: 20px 0; font-size: 19px; letter-spacing: 1px; font-weight: 600;}
.query-card p { font-size: 15px; margin: 0 0 30px 0;}
.query-card:hover { border-color: #06a8f1;}
.query-card:hover .custom-btn { background: #06a8f1; border-color: #06a8f1; color: #fff;}

.mission { padding: 9% 0;}
.mission .mission-bx { background-image: url('image/mission-bg.jpg'); background-size: cover; padding: 8% 0; }
.mission .mission-bx p { margin: 0 0 40px 0;}

.services-section .ser-card { border: 1px solid #808080; padding: 40px; margin: 15px 0;}
.services-section .ser-card h4 { color: #334750; font-size: 18px; letter-spacing: 1px; font-weight: 600; margin: 0;}
.services-section .ser-card i { color: #0e79bf; font-size: 21px;}
.services-section .ser-card:hover { border-color: #0e79bf;}

.team-section { padding: 9% 0;}
.team-section .team-card { position: relative;}
.team-section .team-card img { border: 1px solid #0e79bf; }
.team-section .team-card .details { position: absolute; background: rgba(0, 0, 0, .7); top: 0; left: 0; width: 100%; height: 100%; padding: 30px; display: none;}
.team-section .team-card .details .text { bottom: 0; position: absolute; width: 76%;}
.team-section .team-card .details h4 { color: #fff; font-size: 15px; text-transform: uppercase; font-weight: 500; letter-spacing: 1px; font-weight: 600; position: relative; margin: 0 0 18px 0;}
.team-section .team-card .details h4::after { content: ''; position: absolute; width: 40px; height: 2px; background: #0e79bf; bottom: -10px; left: 0;}
.team-section .team-card .details p { color: #ececec; font-size: 13px; line-height: 1.7;}
.team-section .team-card:hover .details { display: block;}

footer { background: #0e79bf; padding: 5% 0 0 0;}
footer h4 { color: #fff; font-size: 16px; letter-spacing: 2px; margin: 0 0 15px 0; text-transform: uppercase;}
footer p, footer p a { color: #f1f1f1; font-size: 14px; letter-spacing: .5px; margin: 0 0 5px 0;}
footer p a:hover { color: #fff;}
footer .footer-bottom { background: #334750; padding: 15px 0; margin: 4% 0 0 0;}
footer .footer-bottom p {margin: 0;}
footer .footer-bottom .social-icon a {  display: inline-block; background: #fff; color: #334750; width: 30px; height: 30px; text-align: center; border-radius: 50%; margin: 0 2px; line-height: 2; font-size: 14px;}

.inner-banner img { filter:grayscale(40%); height: 280px; object-fit: cover;}

.service-page .accordion-button:not(.collapsed) { background: transparent; box-shadow: none; color: #0e79bf;}
.service-page .accordion-button { padding: 35px; border: 1px solid transparent;}
.service-page .accordion-button:hover { border-color: #0e79bf;}
.service-page .accordion-button h4 { color: #334750; font-size: 22px; letter-spacing: 1px; font-weight: 550; margin: 0;} 

.contact-page .heading { text-align: left;}
.contact-page .heading::after { left: 0; margin: 0;}
.contact-page .contact-form .form-control { margin: 0 0 12px 0; border-radius: 0; padding: 17px;}
.contact-page .contact-form input[type='button'] {background: transparent; border: 1px solid #808080; padding: 12px 24px; color: #334750; font-size: 14px; text-transform: uppercase; letter-spacing: .7px; font-weight: 500;}
.contact-page .contact-form input[type='button']:hover { background: #0e79bf; border-color: #0e79bf; color: #fff;}

.team-page .team-card1 { border: 1px solid #0e79bf;}
.team-page .team-card1 .team-details{ padding: 15px;}
.team-page .team-card1 .team-details .icon { width: 30px; margin: 0 0 0 10px;}
.team-page .team-card1 .team-details .icon i {width: 22px; height: 22px; border-radius: 4px; background: #0e79bf; color: #f3f3f3; font-size: 12px; text-align: center; line-height: 1.8;}
.team-page .team-card1 .team-details h5 { color: #334750; font-size: 17px; letter-spacing: 1px; font-weight: 600;}
.team-page .team-card1 .team-details p {font-size: 14px; margin: 0; line-height: 1.7;}
.team-page .team-card1 .team-details { min-height: 178px;}

@media (min-width: 320px) and (max-width: 767px) {
   
    .heading { font-size: 21px; letter-spacing: 2px; margin: 0 0 40px 0;}
    
    header img{ width: 240px;}

    .banner-section { padding: 25% 0;}
    .banner-section h1 { font-size: 20px; line-height: 1.5; margin: 0 0 15px 0;}
    .banner-section p { font-size: 16px; margin: 0;}
    .banner-section span.line { margin: 10px 0px 8px 0px; }

    .query-card { padding: 30px; margin: 0 0 20px 0;}

    .mission { padding: 9% 0;}
    .mission .mission-bx { background-image: url('image/mission-bg.jpg'); background-size: cover; padding: 8% 0; }
    .mission .mission-bx p { margin: 0 0 40px 0;}

    .services-section .ser-card { padding: 30px; margin: 8px 0;}
    .services-section .ser-card h4 { font-size: 16px; letter-spacing: 1px; font-weight: 600; margin: 0;}

    .team-section .team-card { margin: 0 0 20px 0;}
    
    footer h4 { margin: 20px 0 10px 0;}

    .inner-banner img { height: 150px;}

    .service-page .accordion-button { padding: 30px;}
    .service-page .accordion-button h4 { font-size: 17px; letter-spacing: 1px; font-weight: 550; margin: 0;} 

    .contact-page { padding: 5%;}
}