@charset "utf-8";


/*~-~-~-~-~-~-~-~-~-~ Embeded fonts ~-~-~-~-~-~-~-~-~-~*/

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

/*~-~-~-~-~-~-~-~-~-~ Embeded fonts ~-~-~-~-~-~-~-~-~-~*/


    
/* ~-~-~-~-~-~-~-~-~-~ global adjustments ~-~-~-~-~-~-~-~-~-~ */

:root {

    /* ~-~-~-~-~ declare font family & weight ~-~-~-~-~ */
    --body-font: "Inter", sans-serif;
    --heading-font: "Inter", sans-serif;
    /* ~-~-~-~-~ declare font family & weight ~-~-~-~-~ */

    /* ~-~-~-~-~ declare font size ~-~-~-~-~ */
    --f-size-XXXL: 70px;
    --f-size-XXL: 46px;
    --f-size-XL: 30px;
    --f-size-L: 20px;
    --f-size-M: 18px;
    --f-size-S: 16px;
    --f-size-Body: 16px;
    /* ~-~-~-~-~ declare font size ~-~-~-~-~ */

    /* ~-~-~-~-~ common transition ~-~-~-~-~ */
    --common-transition: all 0.8s ease;
    /* ~-~-~-~-~ common transition ~-~-~-~-~ */

    /* ~-~-~-~-~ colors ~-~-~-~-~ */
    --color-white: #fff;
    --color-black-primary: #211F5D;
    --color-black-secondary: #374151;
    --color-body: #4B5563;
    --color-blue: #005AA7;
    --color-light-blue: #D8E8FF;
    /* ~-~-~-~-~ colors ~-~-~-~-~ */
}


/* html { overflow-x: hidden; } */
body { font-size: var(--f-size-Body);margin: 0; padding: 0; font-family: var(--body-font); line-height: 1.2; font-weight: 400; color: var(--color-body); transition: var(--common-transition); scroll-behavior: smooth; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 30px; padding: 0; line-height: 1.1; font-family: var(--heading-font); font-weight: 700; color: var(--color-black-primary); }

h1 {font-size: var(--f-size-XXXL);}
h2 {font-size: var(--f-size-XXL);}
h3 {font-size: var(--f-size-XL);}
h4 {font-size: var(--f-size-L);}
h5 {font-size: var(--f-size-M);}
h6 {font-size: var(--f-size-S);}
  
p{ margin: 0 0 30px; padding: 0; line-height: 1.3; font-family: var(--body-font); }
p:last-child {margin-bottom: 0;}

img { max-width: 100%; }
a, img { border: 0; text-decoration: none; outline: none; }
a, a:link, a:visited, a:focus, a:hover { color: var(--clr-black-primary); outline: none; text-decoration: none; transition: var(--common-transition); }
a:hover{  text-decoration: none; transition: var(--common-transition); }

.mb-15 {margin-bottom: 15px;}

button{border: none;}


textarea, select, .form-control, input { font-size: 18px; padding: 16px 20px; background-color: transparent; width: 100%; border-radius: 0; border: 1px solid #9D9D9D; outline: none !important; box-shadow: none !important; color: #626262; margin-bottom: 15px; height: 60px; font-family: var(--body-font); font-weight: 500; }

textarea { min-height: 105px !important; resize: none; }
input[type="submit"], button[type="submit"] { transition: all 0.3s ease 0s; outline: none; width: auto; font-size: 16px; background-image: url(../images/white-btn.svg); background-repeat: no-repeat; background-position: center right 45px; height: auto; margin: 0;}
input[type="submit"]:hover, button[type="submit"]:hover {background-image: url(../images/btn-arrow.svg); background-repeat: no-repeat; background-position: center right 35px;}
textarea:focus, select:focus, .form-control:focus, .form-select:focus { outline: none !important; box-shadow: inherit!important; border: 1px solid #D2CEDA; }

select, .form-select { font-size: 18px; padding: 16px 20px; background-color: transparent; border-radius:0; border: 1px solid #9D9D9D; background-image: url(../images/select-arrow.svg); background-repeat: no-repeat; background-position: center right 20px; background-size: 12px; color: #626262; height: 60px; cursor: pointer; }
input:focus, input:focus-visible { border: none; outline: none; box-shadow: none; border: 1px solid var(--clr-grey-secondary); }
.btn-check:focus+.btn, .btn:focus { box-shadow: inherit;}

/* --- for placeholder color --- */
input::-moz-placeholder , .form-control::-moz-placeholder { color: #626262; opacity: 1; }
input:-ms-input-placeholder, .form-control:-ms-input-placeholder { color: #626262; }
input::-webkit-input-placeholder, .form-control::-webkit-input-placeholder { color: #626262; }
/* --- for placeholder color --- */

label { margin-bottom: 10px; font-family: var(--body-font); font-weight: 500; font-size: 18px; color: var(--color-black-secondary); }
  
.common-padding{ padding-top: 100px; padding-bottom: 100px; }

.padding-top { padding-top: 100px; }
.padding-bottom { padding-bottom: 100px; }


.btn, a.btn {overflow: hidden; position: relative; z-index: 1; letter-spacing: 0; display: inline-flex; align-items: center; color: var(--color-white); padding: 18px 30px; line-height: 1; border-radius: 5px; font-weight: 600; text-align: center; text-transform: capitalize; background: var(--color-blue); border: 1px solid transparent; }

.btn img{margin-left: 15px; transition: transform 0.4s ease; }

.btn:hover{ background: var(--color-white); color: var(--color-black-primary); border: 1px solid var(--color-blue); }
.btn:hover img {transform: translateX(10px); filter: none;  filter: brightness(1) invert(1);}

.white-btn, a.white-btn {background: var(--color-white); border-color: var(--color-white); color: var(--color-black-primary); }
.white-btn:hover, a.white-btn:hover{background: var(--color-blue); color: var(--color-white); }
.white-btn:hover img, a.white-btn:hover img{filter: brightness(0) invert(1);}

/* ~-~-~-~-~-~-~-~-~-~ global adjustments ~-~-~-~-~-~-~-~-~-~ */

/* -- Header -- */

.hdr-wrap { display: flex; align-items: center; justify-content: space-between;  width: 80%; background: var(--color-black-primary); border-radius: 0 0 18px 18px; padding: 10px 45px; }

.main-header {position: absolute; top: 0; left: 0; right: 0;z-index: 9;}

.custom-header-wrap { display: flex; align-items: stretch; gap: 10px; }

.hdr-wrap ul { display: flex; align-items: center; padding: 0; list-style: none; margin: 0; }

.logo-wrap { width: 20%;background: var(--color-white); display: flex; align-items: center; justify-content: center; padding: 10px 22px; border-radius: 0 0 18px 18px; }
.logo-wrap a {display: block; width: 145px; }
.logo-wrap a img{ width: 100%;}

.main-menu { }
.main-menu ul li { text-align: center; padding: 0 25px; }
.main-menu ul li.current-menu-item a, .main-menu ul li:hover a { color: #FF71D1; }
.main-menu ul li a {color: var(--color-white);position: relative;display: block; text-transform: capitalize; padding: 25px 0; font-weight: 500; }

.header-btn { margin-left: 20px; }

.header-sticky  { left: 0; position: fixed; top: 0; width:100%; transition: all 0.5s; -ms-transition: all 0.5s; -webkit-transition: all 0.5s; animation: slide-down 0.7s; -ms-animation: slide-down 0.7s; -webkit-animation: slide-down 0.7s; z-index: 9;}
.header-sticky .main-header { margin: 0; }
.header-sticky .main-header .container-fluid { width: 100%; }

.nav_btn {
    display: none;
}


@keyframes slide-down { 

0% {transform: translateY(-100%); 
-moz-transform: translateY(-100%); 
-webkit-transform: translateY(-100%); 
-o-transform: translateY(-100%);
-ms-transform: translateY(-100%); } 
100% { 
transform: translateY(0); 
-moz-transform: translateY(0); 
-webkit-transform: translateY(0); 
-o-transform: translateY(0); 
-ms-transform: translateY(0); } 
}

/* -- Header -- */

/* Banner */

.banner-sec {height: 100vh; display: flex; align-items: center; position: relative; z-index: 1; }
.banner-sec .banner-img {position: relative; width: 100%; height: 100%; }
.banner-sec .banner-img img {width: 100%; height: 100%; object-fit: cover; }
.banner-sec .banner-img::after {content: ""; position: absolute; top: 0;right: 0;bottom: 0;left: 0;background: linear-gradient(180deg, #0A092F 0%, rgba(10, 9, 47, 0.3) 100%);
 z-index: 0;}
.banner-sec .banner-img img { width:100%; height: 100%; object-fit: cover; }
.banner-cont {position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%); }

.banner-info { max-width: 765px; margin: 0 auto; text-align: center; }
.banner-info h1 { color: var(--color-white); font-weight: 400; }
.banner-info p { color: var(--color-white); padding: 0 15%; }


/*About Us*/
.about-homepage { position:relative; }
.about-homepage:after {content: ''; background: url(../images/logo-watermark-left-cut.svg) no-repeat; background-size: 100%; width: 300px; height: 320px; position: absolute; left: 0; bottom: 30px; }

.about-stats {box-shadow: 0px 4px 20px 1px #00000012; border-radius: 20px; padding: 30px; max-width: 80%; margin: 0 0 30px; } 
.about-stats ul {margin: 0; padding: 0; list-style: none; display: flex; text-align: center; justify-content: space-between; }
.about-stats ul li {padding: 0 5px; } 
.about-stats ul li .icon-box {background: #D8E8FF; width: 50px; height: 45px; border-radius: 30px; margin: 0 auto 15px; display: inline-flex; align-items: center; justify-content: center; }
.about-stats ul li h4 {margin: 0 0 5px; font-size: 24px; color: var(--color-blue); } 
.about-stats ul li  p {font-size: 14px; }

.about-gird-rt {position: relative; } 
.about-gird-rt ul {display: flex; flex-wrap: wrap; gap: 20px; } 
.about-gird-rt ul li {width: 48%; display: inline-flex; align-items: flex-start; } 
.about-gird-rt ul li:first-child {align-items: end; justify-content: flex-end; } 
.about-gird-rt ul li img {border-radius: 5px; aspect-ratio: 1/1; object-fit: cover; } 
.about-gird-rt ul li:first-child img, .about-gird-rt ul li:last-child img {width: 82%; }
.about-gird-rt .video-play {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 3; }

/*About Us*/

.coi-hospital-block { padding-top: 170px; padding-bottom: 170px; }
.section-top-shape, .section-bottom-shape { position:relative; }
.section-top-shape:after { content: ''; background: url(../images/section-cutout-top.svg) no-repeat center bottom; position: absolute; right:0; top:-1px; left:0; height:68px; z-index:5; background-size: cover; }
.section-bottom-shape:before { content: ''; background: url(../images/section-cutout-bottom.svg) no-repeat center top; position: absolute; right:0; bottom:-1px; left:0; height:68px; z-index:5; background-size: cover; }

.coi-hospital-block {background: var(--color-light-blue); position: relative; }

.two-col-grid-img {display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: 24px; grid-row-gap: 24px; }
.two-col-grid-img .div1 { grid-area: 1 / 1 / 3 / 2; }
.two-col-grid-img .div2 { grid-area: 1 / 2 / 2 / 3; }
.two-col-grid-img .div3 { grid-area: 2 / 2 / 3 / 3; } 

.two-col-grid-img img { height: 100%; width:100%; object-fit: cover; border-radius: 5px; }

.coi-rt { padding-left: 20px; }
.logo-ttl {display: flex; margin: 0 0 30px; }
.logo-ttl .imgbox {width: 210px; background: var(--color-white); padding: 20px; border-radius: 20px; }
.logo-ttl h2 {padding-left: 20px; width: calc(100% - 210px); margin: 0; }

/*About Us*/


/*Offer Initiative*/

.heading-block-top {margin: 0 auto 30px; max-width: 700px; }

.init-list-wrap {  }
.init-list-wrap ul {padding: 0; margin: 0 -12px; list-style: none; display: flex; flex-wrap: wrap; }
.init-list-wrap ul li {width: 20%; padding: 0 12px; }
.init-list-wrap ul li .init-list {box-shadow: 0px 2.14px 4.28px 0px #0000001A; border-radius: 12px; }
.init-list-wrap ul li .init-list .imgbox {background: #F0F0F0; border-radius: 12px 12px 0 0; padding: 20px; }
.init-list-wrap ul li .init-list .info {padding: 20px; }
.init-list-wrap ul li .init-list .imgbox img {height: 100%; width: auto; }

/*Offer Initiative*/


/*Donate Block*/

.donate-block { position:relative; text-align: center;}
.donate-block .section-bg { min-height: 685px; position: relative; }
.donate-block .section-bg:after { content: ''; position: absolute; background: var(--color-black-primary); opacity:0.7; top:0; right:0; bottom:0; left: 0; z-index:1; }
.donate-block .section-bg img { display: block; width: 100%; height:100%; object-fit:cover; }


.donate-block .container {position: absolute; top: 50%; left: 0; right: 0; z-index: 5; transform: translateY(-50%); }
.donate-block h2 {color: var(--color-white); }
.donate-form ul {margin: 0 0 30px; padding: 0; list-style: none; display: flex; align-items: center; justify-content: center; }
.donate-form ul li {margin: 0 12px; position: relative; }
.donate-form ul li input[type="radio"] {position: absolute; width: 100%; height: 100%; margin: 0; z-index: 6; cursor: pointer; opacity: 0; }
.donate-form ul li input[type="radio"]:empty ~ label {border: 2px solid var(--color-white); padding: 12px 20px; border-radius: 10px; color: var(--color-white); margin: 0; }
.donate-form ul li input[type="radio"]:checked ~ label {background: var(--color-white); color: var(--color-black-primary); }

.custom-entry input {border: 1px solid var(--color-white); border-radius: 10px; max-width: 300px; margin: 0 auto 30px; color: var(--color-white); text-align: center; }

.donate-scure {padding: 30px 0 0; }
.donate-scure ul {margin: 0; padding: 0; list-style: none; display: flex; justify-content: center; align-items: center; }
.donate-scure ul li {display: inline-flex; align-items: center; padding: 0 12px; color: var(--color-white); }
.donate-scure ul li .icon-box {background: var(--color-white); width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; margin-right: 12px; }

/*Donate Block*/


.impact-stories {box-shadow: 0px 2px 18.6px 0px #0000001A; border-radius: 10px; }
.impact-stories .imgbox {padding: 0 0 67%; position: relative; }
.impact-stories .imgbox img {position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 10px 10px 0 0; width: 100%; height: 100%; object-fit: cover; }
.impact-stories .impact-info {padding: 20px; }
.impact-stories .impact-info a.read-more-link {text-decoration: underline; }
.impact-stories .impact-info .progress-report {background: #F5F1F0; padding: 15px 20px; border-radius: 5px; margin-top: 20px; }
.impact-stories .impact-info .progress-report p {margin: 0 0 5px; text-align: right; font-size: 12px; font-weight: 700;  color: var(--color-black-primary); }
.impact-stories .impact-info .progress-report .progress {height: 6px; margin: 0 0 10px; }
.impact-stories .impact-info .progress-report ul {margin: 0; padding: 0; list-style: none; display: flex; align-items: center; justify-content: space-between; font-size: 12px;  color: var(--color-black-primary); }



/* Homepage Upcoming projects */

.upcoming-project-sec {background-color: #D8E8FF;padding: 170px 0;}

.upcoming-project-sec .sec-ttl { width: 100%; max-width: 642px; margin: 0 auto 16px; text-align: center; }

.upcoming-card { display: flex; align-items: center; background: var(--color-white); box-shadow: 2px 8px 25px 0px #0000000D; padding: 15px; border-radius: 5px; margin-top: 24px; }
.upcoming-card .img-wrapper { flex: 0 0 50%; }
.upcoming-card .img-wrapper .date-wrap {font-size: 14px;right: inherit; left: 10px; bottom: inherit; top: 10px;font-weight: 500;}
.upcoming-card .upcmg-cnt { padding-left: 24px; width: 100%; max-width: 260px; }
.upcoming-card .upcmg-cnt .cnt-tp-time { margin: 0 0 10px; font-size: 12px; color: #000; }
.upcoming-card .upcmg-cnt .cnt-tp-time i { margin-right: 10px; }
.upcoming-card .upcmg-cnt a.learn-more {color: var(--color-black-primary);}

/* Homepage Upcoming projects */

/* Homepage about us section */

.testimonial-sec{background-color: #D8E8FF; background-repeat: no-repeat; background-position: 70px bottom; position: relative; z-index: 1; padding-top: 170px; }
.testimonial-sec::before {content: ''; background: url(../images/section-cutout-top.svg) no-repeat center top; position: absolute; right:0; top:-1px; left:0; height:68px; z-index:5; }

.testimonial-sec .sec-ttl {width: 100%;max-width: 320px;}

.testimonial-slide {background: var(--color-white); border-radius: 5px; padding: 30px;}
.testimonial-slide p {margin: 40px 0;}

.author-wrap { display: flex; align-items: center; }
.author-cnt { border-left: 1px solid #0000004D; padding: 0 30px 0 24px; } 
.author-cnt h5:last-child { margin: 0; color: #979797; }
.author-cnt h5 { margin: 0 0 8px; color: #404040; font-weight: 600; }

.author-img { width: 99px; height: 99px; }
.author-img img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }

.testimonial-slider { margin: 0 !important; }
.testimonial-slider::after { content: ""; position: absolute; left: calc(50% - 55px); bottom: -55px; transform: translateX(-50%); width: calc(100% - 240px); height: 1px; background: #000000; opacity: 30%; }

.testimonial-slider .slick-dots { text-align: left; bottom: -60px; }
.testimonial-slider .slick-dots li { margin: 0 3.5px; }
.testimonial-slider .slick-dots li, .testimonial-slider .slick-dots li button { width: 7px; height: 7px; padding: 0; }
.testimonial-slider .slick-dots li button::before { content: ""; width: 7px; height: 7px; background: #D9D9D9; border-radius: 50%; opacity: 1; }
.testimonial-slider .slick-dots li.slick-active, .testimonial-slider .slick-dots li.slick-active button, .testimonial-slider .slick-dots li.slick-active button::before { background: var(--color-black-primary); width: 10px; height: 10px; opacity: 1; border-radius: 50%; }

.slick-arrow { background: transparent; width: 73px; height: 73px; z-index: 1;display: flex ;align-items: center;justify-content: center; border: 1px solid #11060380; border-radius: 50%; font-size: 0; transition: var(--common-transition); }
.slick-arrow:hover, .slick-arrow:focus{background: #005AA7; border-color: #005AA7; }
.slick-arrow::before { content: ""; position: absolute; opacity: 1;width: 20px; height: 21px;font-size: 0; display: block; background-repeat: no-repeat; background-position: center;}
.slick-prev::before{background-image: url(../images/arrow-lt.svg);}
.slick-next::before{background-image: url(../images/arrow-lt.svg);transform: rotate(180deg);}
.slick-arrow:hover::before, .slick-arrow:focus::before {filter: brightness(0) invert(1);}

.testimonial-slider .slick-arrow {top: inherit;bottom: -93px;transform: inherit;}
.testimonial-slider .slick-prev {left: inherit;right: 88px;}
.testimonial-slider .slick-next {right: 0;}

/* Homepage about us section */

/* Homepage news section */

.latest-news-sec {position: relative;}
.latest-news-sec::after {content: ""; position: absolute; right: 0; bottom: -140px; background: url(../images/logo-watermark-right-cut.svg) no-repeat right bottom; width: 468px; height: 465px; }

.latest-news-sec .sec-ttl { margin-bottom: 40px; }

.latest-news-sec .row {position: relative;}
.latest-news-sec .row::after { content: ""; position: absolute; bottom: -100px; background: rgba(0, 0, 0, 0.25); height: 1px; left: 12px; right: 12px; }

.news-card { margin-top: 24px; }

.img-wrapper { position: relative; }
.news-img { position: relative; padding-bottom: 70%; display: block; }
.news-img img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 5px; }

.date-wrap { position: absolute; bottom: 20px; right: 20px; background: #DEDDFF; border-radius: 5px; padding: 10px 12px; display: flex; align-items: center; color: #211F5D; font-size: 18px; }
.date-wrap img { margin-right: 10px; }

.news-card-cnt { padding-top: 20px; }
.news-card-cnt h4, .news-card-cnt p { margin: 0 0 15px; }
.news-card-cnt a { color: #211F5D; font-weight: 500; }

.view-all { margin-top: 40px; }

/* Homepage news section */

/* Homepage events section */


.event-lt { width: 100%; max-width: 954px; margin-left: auto; }
.event-tabs { margin-top: 40px; }

.nav-tabs { border: 0; margin-bottom: 40px; }
.nav-link { background: #F6F6F6; padding: 17px 30px; border-radius: 5px; color: #211F5D; font-weight: 700;}
.nav-tabs .nav-link.active, .nav-tabs .nav-link:hover { background-color: #005AA7; box-shadow: none; color: #fff; }
.nav-tabs .nav-link:not(:last-child) { margin-right: 15px; }

.event-card { display: flex; align-items: center; border: 1px solid rgb(0 0 0 / 40%); border-radius: 5px; }
.event-card:not(:last-child) {margin-bottom: 24px;}
.event-img { flex: 0 0 336px; }

.event-content { display: flex; align-items: center; width: 100%; justify-content: space-between; padding: 0 24px; }
.event-cnt-lt {flex: 0 0 400px;}
.event-cnt-rt .time { font-size: 64px; color: #005AA7; font-weight: 600; line-height: 1; }
.event-cnt-rt .time span { font-size: 18px; font-weight: 500; }
.event-cnt-rt h5 { font-weight: 400; color: #000; margin: 0; }

.main-event { border-radius: 5px 0 0 5px; position: relative; padding: 40px; height: 100%; overflow: hidden; z-index: 1; }
.main-event::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(0, 90, 167, 0.7) 0%, rgba(0, 90, 167, 0.48) 45.29%, rgba(0, 90, 167, 0) 100%); }

.main-event-cnt {position: relative; z-index: 1; color: var(--color-white); width: 100%; max-width: 355px;}
.main-event-cnt h2 {font-weight: 500;}
.main-event-cnt h2, .main-event-cnt h5 {color: var(--color-white);}

/* Homepage events section */


.footer-main { background: var(--color-black-primary); }


@media only screen and (min-width: 1359px){

   .container {max-width: 1320px;} 

}

@media only screen and (max-width:1699px){

    :root {
    --f-size-XXXL: 80px;
    --f-size-XXL: 60px;
    --f-size-XL: 50px;
    --f-size-L: 24px;
    --f-size-M: 18px;
    --f-size-S: 16px;
    --f-size-Body: 16px;
    }
    .main-menu ul li a { padding: 26px 0; }
    .main-header .container-fluid { width: calc(100% - 99px); }

    .banner-content { max-width: 1300px; padding-top: 86px; }
    .banner-content p { font-size: 20px; }

    .ftr-menu ul li:not(:last-child) { margin-right: 60px; padding-right: 60px; }

    .ftr-btm-menu { font-size: 17px; }
    .ftr-btm-menu ul li i { margin-right: 10px; }

}

@media only screen and (max-width:1599px){


    .client-say-sec .row.align-items-end p { font-size: 20px; }

    .ftr-menu ul li:not(:last-child) { margin-right: 40px; padding-right: 40px; }

    .ftr-btm-menu { font-size: 15px; }

}

@media only screen and (max-width:1399px){

    :root {
    --f-size-XXXL: 60px;
    --f-size-XXL: 50px;
    --f-size-XL: 40px;
    --f-size-L: 18px;
    --f-size-M: 16px;
    --f-size-S: 15px;
    --f-size-Body: 15px;
    }

    .btn, a.btn { height: 64px; padding: 22px 30px; }

    .header-btn .btn {padding: 22px 45px 22px 20px;}

    .main-menu ul li { width: 120px; }
    .main-menu ul li a { padding: 22px 0; font-size: 14px; }

    .banner-content { max-width: 1100px;}

    .card-content { padding: 15px; }

    .slick-arrow { width: 70px; height: 70px; }
    
    .blog-slider .slick-prev { left: -35px; }
    .blog-slider .slick-next { right: -35px; }

    .logo-wrap a {width: 150px;}

    .team-info { padding: 30px; }

    .blog-content { padding: 30px; }

    .client-say-sec .row.align-items-end p { font-size: 16px; }

    .client-slide-item { padding: 20px; }

    footer .container-fluid { padding-left: 15px;}
    .ftr-lt { padding: 40px 0 0; }
    .ftr-lt-btm ul { margin: 0 0 50px; }
    .ftr-menu ul li a {font-size: 18px;}
    .ftr-btm-menu { padding-top: 40px; font-size: 13px; }
    .ftr-btm-rt-menu {font-size: 13px;}

}

@media only screen and (max-width:1199px){

    :root {
    --f-size-XXXL: 50px;
    --f-size-XXL: 40px;
    --f-size-XL: 40px;
    --f-size-L: 18px;
    --f-size-M: 16px;
    --f-size-S: 15px;
    --f-size-Body: 15px;
    }

    .common-padding { padding-top: 80px; padding-bottom: 80px; }
    .padding-top { padding-top: 80px; }
    .padding-bottom { padding-bottom: 80px; }


    h1, h2, h3, h4, h5, h6, p { margin: 0 0 20px;}

    .main-header .container-fluid { width: 100%; }

    .header-btn .btn {padding: 22px 30px;}

    .hdr-wrap { background: #ffffff70; backdrop-filter: none; }

    .main-menu { position: absolute; left: inherit; left: 0; right: 0; top: 0; z-index: 999; width: 100%; margin: 0 auto; background-color: var(--color-black-primary); border: 0; padding: 12rem 30px 60px; display: block; overflow: auto; display: none; height: 100vh; }
    .main-menu>ul {flex-direction: column;}
    .main-menu>ul li { width: 100%; text-align: center; margin: 15px 0; border: 0; }
    .main-menu ul li:not(:last-child) { margin-right: 0; }
    .main-menu>ul>li a { display: block; color: var(--color-white); padding: 0; }
    .main-menu ul li.current-menu-item a, .main-menu ul li:hover a{color: var(--color-white);}
    .hdr-rt ul li a {color: var(--color-white);padding: 10px;}

    .nav_btn { display: block; cursor: pointer; position: relative; margin: auto 10px auto 10px; width: 30px; height: 20px; z-index: 999; }
    .nav_btn::before {content: "";position: absolute;width: 100%;height: 2px;background: var(--color-blue);top: 0;right: 0;transition: ease-in-out 0.4s;}
    .nav_btn span {width: 100%;height: 2px;background: var(--color-blue);display: block;position: absolute;top: 50%;transform: translateY(-50%);}
    .nav_btn::after {content: "";position: absolute;width: 100%;height: 2px;background: var(--color-blue);right: 0;bottom: 0;transition: ease-in-out 0.4s;}

    .nav_btn.sidebar_active span {display: none;}
    .nav_btn.sidebar_active::after{transform: rotate(45deg);bottom: 9px; background: var(--color-white);}
    .nav_btn.sidebar_active::before{transform: rotate(135deg);top: 9px; background: var(--color-white);}

    
       
}
@media only screen and (max-width:991px){

    :root {
    --f-size-XXXL: 40px;
    --f-size-XXL: 30px;
    --f-size-XL: 30px;
    --f-size-L: 18px;
    --f-size-M: 16px;
    --f-size-S: 15px;
    --f-size-Body: 15px;
    }

    .btn, a.btn { height: auto; padding: 15px 20px; font-size: 14px; }
    .btn img { width: 20px; margin-left: 15px; }

    .common-padding { padding-top: 60px; padding-bottom: 60px; }
    .padding-top { padding-top: 60px; }
    .padding-bottom { padding-bottom: 60px; }

    .banner-content p { margin-top: 30px; }

    .logo-wrap { width: 30%; }
    .hdr-wrap { width: 70%; }

    

}
@media only screen and (max-width:767px){

    :root {
    --f-size-XXXL: 30px;
    --f-size-XXL: 28px;
    --f-size-XL: 26px;
    --f-size-L: 18px;
    --f-size-M: 16px;
    --f-size-S: 15px;
    --f-size-Body: 14px;
    }

    .common-padding { padding-top: 40px; padding-bottom: 40px; }
    .padding-top { padding-top: 40px; }
    .padding-bottom { padding-bottom: 40px; }

    .container{width: 95%;}

    .main-menu ul li.btn { display: inline-block; width: auto; }

    .see-more-wrap { width: 100%; aspect-ratio: 1 / 1; }

    .header-btn .btn { display: none; }

    textarea, select, .form-control, input, select, .form-select { padding: 12px 15px; height: 50px; }
    select, .form-select { background-position: center right 15px; }
    
    .logo-wrap { width: 50%; }
    .logo-wrap a { width: 120px; }
    
    .hdr-wrap { width: 50%; padding: 15px 0; }
    
    

}

@media only screen and (max-width:379px){

    :root {
    --f-size-XXXL: 28px;
    --f-size-XXL: 26px;
    --f-size-XL: 24px;
    --f-size-L: 18px;
    --f-size-M: 16px;
    --f-size-S: 15px;
    --f-size-Body: 14px;
    }

}