

 

.image-anime{ border-radius: 20px; position: relative; overflow: hidden;} 

.image-anime:after{ content: ""; position: absolute; width: 200%; height: 0%; left: 50%; top: 50%; background-color: rgba(255,255,255,.3); transform: translate(-50%,-50%) rotate(-45deg); z-index: 1;} 

.image-anime:hover:after{ height: 250%; transition: all 600ms linear; background-color: transparent;} 

.reveal{ position: relative; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; visibility: hidden; overflow: hidden;} 

.reveal img{ height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; -webkit-transform-origin: left; transform-origin: left;} 

.row{ margin-right: -15px; margin-left: -15px;} 

.row > *{ padding-right: 15px; padding-left: 15px;} 

.row.no-gutters{ margin-right: 0px; margin-left: 0px;} 

.row.no-gutters > *{ padding-right: 0px; padding-left: 0px;} 

.btn-default{ position: relative; display: inline-block; background: var(--accent-color); border-radius: 10px; font-size: 16px; font-weight: 700; line-height: 1em; text-transform: capitalize; color: var(--white-color); border: none; padding: 17px 42px 17px 20px; overflow: hidden; transition: all 0.4s ease-in-out; z-index: 0;} 

.btn-default::before{ content: ''; position: absolute; top: 50%; right: 20px; width: 12px; height: 12px; background: url('../images/arrow-white.svg') no-repeat; background-position: center center; background-size: cover; transform: translateY(-50%); transition: all 0.4s ease-in-out; z-index: 1;} 

.btn-default:hover::before{ transform: translateY(-50%) rotate(45deg);} 

.btn-default::after{ content: ''; position: absolute; left: 0; bottom: 0%; width: 102%; height: 100%; background-color: var(--primary-color); transition: all 0.5s ease-in-out; z-index: -1; transform: skewY(9.3deg) scaleY(0);} 

.btn-default:hover::after{ transform: skewY(0deg) scaleY(2);} 

.btn-default.btn-highlighted:hover{ color: var(--primary-color);} 

.btn-default.btn-highlighted:hover::before{ filter: brightness(0) invert(0);} 

.btn-default.btn-highlighted::after{ background-color: var(--white-color);} 

.readmore-btn{ position: relative; font-size: 16px; font-weight: 700; line-height: normal; text-transform: capitalize; color: var(--primary-color); padding-right: 20px; transition: all 0.4s ease-in-out;} 

.readmore-btn:hover{ color: var(--accent-color);} 

.readmore-btn::before{ content: ''; position: absolute; top: 6px; right: 0; background-image: url('../images/arrow-primary.svg'); background-repeat: no-repeat; background-size: cover; width: 10px; height: 10px; transition: all 0.4s ease-in-out;} 

.readmore-btn:hover::before{ transform: rotate(45deg);} 

.cb-cursor:before{ background: var(--accent-color);} 

.preloader{ position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 1000; background: var(--primary-color); display: flex; align-items: center; justify-content: center;} 

.loading-container,

.loading{ height: 100px; position: relative; width: 100px; border-radius: 100%;} 

.loading-container{ margin: 40px auto;} 

.loading{ border: 1px solid transparent; border-color: transparent var(--accent-color) transparent var(--accent-color); animation: rotate-loading 1.5s linear 0s infinite normal; transform-origin: 50% 50%;} 

.loading-container:hover .loading,

.loading-container .loading{ transition: all 0.5s ease-in-out;} 

#loading-icon{ position: absolute; top: 50%; left: 50%; max-width: 66px; transform: translate(-50%, -50%);} 

@keyframes rotate-loading{ 0%{ transform: rotate(0deg); }

 100%{ transform: rotate(360deg); }

} 

.bg-section{ width: 100%; max-width: 1820px; background-color: var(--secondary-color); border-radius: 20px; margin: 0 auto;} 

.bg-section .container-fluid{ padding: 0;} 

.dark-section{ background-color: var(--primary-color);} 

.section-row{ margin-bottom: 80px;} 

.section-row .section-title{ margin-bottom: 0;} 

.section-row .section-title.section-title-center{ width: 100%; max-width: 700px; margin: 0 auto; text-align: center;} 

.section-btn{ text-align: right;} 

.section-content-btn .section-btn{ margin-top: 30px; text-align: left;} 

.section-title-content p{ margin-bottom: 20px;} 

.section-title-content p:last-child{ margin-bottom: 0;}



.section-title{ margin-bottom: 40px;} 

.section-title h3{ position: relative; display: inline-block; font-family: var(--accent-font); font-size: 18px; font-weight: 400; font-style: italic; text-transform: capitalize; color: var(--primary-color); padding-left: 18px; margin-bottom: 10px;} 

.section-title h3::before{ content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background: var(--accent-color); border-radius: 50%; width: 8px; height: 8px;} 

.section-title h1{ font-size: 60px; font-weight: 600; line-height: 1.1em; letter-spacing: -0.02em; margin-bottom: 0; cursor: none;} 

.section-title h2{ font-size: 46px; font-weight: 600; line-height: 1.2em; letter-spacing: -0.02em; margin-bottom: 0; cursor: none;} 

.section-title h1 span,

.section-title h2 span{ font-family: var(--accent-font); font-weight: 400; font-style: italic;} 

.section-title p{ margin-top: 20px; margin-bottom: 0;} 

.dark-section .section-title h3,

.dark-section .section-title h1,

.dark-section .section-title h2,

.dark-section .section-title p,

.dark-section .section-title-content p{ color: var(--white-color);} 

.help-block.with-errors ul{ margin: 0; text-align: left;} 

.help-block.with-errors ul li{ color: var(--error-color); font-weight: 500; font-size: 14px;} 

 

/************************************/

/***         04. Hero css	      ***/

/************************************/ 

.hero{ background: transparent;} 

.hero.hero-bg-image{ position: relative; background: url('../images/hero-bg-image.jpg') no-repeat; background-position: center center; background-size: cover; min-height: 100vh; align-content: end; padding: 80px 0 80px; overflow: hidden;} 

.hero.hero-bg-image::before{ content: ''; display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: linear-gradient(180deg, rgba(38, 80, 94, 0) 13.1%, rgba(39, 58, 41, 0.9) 55.8%); width: 100%; height: 100%; z-index: 1;} 

.hero.hero-bg-image .hero-section{ position: relative; width: 100%; max-width: 1600px; margin: 0 auto; z-index: 2;} 

.hero.hero-bg-image.hero-video .hero-bg-video{ position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%;} 

.hero.hero-bg-image.hero-video .hero-bg-video video{ width: 100%; height: 100%; object-fit: cover;} 

.hero.hero-bg-image .hero-content{ position: relative; width: 100%; z-index: 2;} 

.hero.hero-bg-image .hero-content .section-title p{ font-size: 20px; max-width: 1000px;} 

.hero.hero-bg-image .hero-content .hero-body{ display: flex; flex-wrap: wrap; gap: 20px 40px;} 

.hero.hero-bg-image .hero-content-circle{ justify-content: end;} 

.hero.hero-bg-image .hero-content-circle img{ max-width: 150px;} 

.hero-section{ position: relative; display: flex; flex-wrap: wrap; gap: 30px; z-index: 2;} 

.hero-content{ width: calc(56% - 15px);} 

.hero-content-box{ background: var(--primary-color); border-radius: 20px; margin-bottom: 30px; padding: 3.125vw;} 

.hero-content-box .section-title{ margin-right: 50px;} 

.hero-content-circle{ display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end;} 

.hero-content-circle p{ width: 71%; font-size: 18px; color: var(--white-color); margin: 0;} 

.book-appointment-circle{ display: inline-block; text-align: right; border-radius: 50%;} 

.book-appointment-circle img{ width: 100%; max-width: 120px; border-radius: 50%; animation: infiniterotate 20s infinite linear;} 

@keyframes infiniterotate{ from{     transform: rotate(0deg); } to{     transform: rotate(360deg); }

} 

.book-appointment-circle:hover img{ animation-play-state: paused;} 

.working-hours-box{ display: flex; flex-wrap: wrap; gap: 30px;} 

.working-hour-image{ width: calc(55% - 15px);} 

.working-hour-image figure{ display: block; height: 100%; border-radius: 20px;} 

.working-hour-image img{ width: 100%; height: 100%; aspect-ratio: 1 / 0.48; object-fit: cover; border-radius: 20px;} 

.working-hours-item{ width: calc(45% - 15px); background: var(--accent-color); border-radius: 20px; padding: 2.083vw;} 

.working-hours-header{ border-bottom: 1px solid var(--dark-divider-color); margin-bottom: 30px; padding-bottom: 30px;} 

.working-hours-header h3{ font-size: 20px; color: var(--white-color); margin-bottom: 10px;} 

.working-hours-header p{ color: var(--white-color); margin-bottom: 0;} 

.working-hours-body ul{ list-style: none; padding: 0; margin: 0;} 

.working-hours-body ul li{ display: flex; justify-content: space-between; gap: 10px; color: var(--white-color); line-height: 1.5em; margin-bottom: 15px;} 

.working-hours-body ul li:last-child{ margin-bottom: 0;} 

.hero-image{ width: calc(44% - 15px);} 

.hero-image figure{ display: block; height: 100%; border-radius: 20px;} 

.hero-image img{ width: 100%; height: 100%; aspect-ratio: 1 / 1.065; object-fit: cover; border-radius: 20px;} 

.hero-benefit-list{ display: flex; flex-wrap: wrap; gap: 30px; background: var(--secondary-color); border-radius: 20px; margin-top: 30px; padding: 20px;} 

.hero-benefit-item{ width: calc(33.33% - 20px); display: flex; flex-wrap: wrap; align-items: center;} 

.hero-benefit-item .icon-box{ position: relative; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; background: var(--accent-color); border-radius: 50%; margin-right: 20px;} 

.hero-benefit-item .icon-box::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--primary-color); border-radius: 50%; width: 100%; height: 100%; transform: scale(0); transition: all 0.4s ease-in-out;} 

.hero-benefit-item:hover .icon-box::before{ transform: scale(1);} 

.hero-benefit-item .icon-box img{ position: relative; width: 100%; max-width: 24px; z-index: 1;} 

.hero-benefit-item-content{ width: calc(100% - 70px); text-align: left;} 

.hero-benefit-item-content h3{ font-size: 20px;} 

/************************************/

/***    05. About Us css   ***/

/************************************/ 

.about-us{

} 

.about-us-images{ display: flex; flex-wrap: wrap; margin-right: 15px;} 

.about-image-1{ padding-right:14.115vw;} 

.about-image-1 figure,

.about-image-2 figure{ display: block; border-radius: 20px;} 

.about-image-1 img,

.about-image-2 img{ width: 100%; object-fit: cover; border-radius: 20px;} 

/*.about-image-1 img{ aspect-ratio: 1 / 1.095;}*/

.about-image-2{ width: 100%; max-width: 360px; margin: -340px 0 0 auto;} 

.about-image-2 img{ aspect-ratio: 1 / 1.14;} 

.about-us-body{ display: flex; flex-wrap: wrap; align-items: center;} 

.about-us-circle{ margin-right: 40px;} 

.about-us-circle a{ display: inline-block; border-radius: 50%;} 

.about-us-circle a img{ width: 100%; max-width: 120px; border-radius: 50%; animation: infiniterotate 20s infinite linear;} 

.about-us-circle a:hover img{ animation-play-state: paused;} 

.about-body-content{ width: calc(100%);} 

.about-body-content p{ margin-bottom: 0;} 

.about-us-list{ border-top: 1px solid var(--divider-color); margin-top: 30px; padding-top: 30px;} 

.about-us-list ul{ display: flex; flex-wrap: wrap; gap: 15px 30px; margin: 0; padding: 0; list-style: none;} 

.about-us-list ul li{ position: relative; width: calc(50% - 15px); line-height: 1.5em; padding-left: 30px;} 

.about-us-list ul li::before{ content: '\f058'; font-family: 'Font Awesome 6 Free'; position: absolute; top: 0; left: 0; font-size: 18px; font-weight: 900; color: var(--accent-color);} 

/************************************/

/***  06. Our Services css	  ***/

/************************************/ 

.our-services{ padding: 0px 0;} 

.service-item{ position: relative; background: var(--white-color); box-shadow: 0px 0px 10px 0px #0B10300D; border-radius: 20px; height: calc(100% - 30px); margin-bottom: 30px; padding: 40px; overflow: hidden;} 

.service-item:before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: var(--white-color); border-radius: 20px; width: 100%; height: 100%; transition: all 0.5s ease-in-out; z-index: 1;} 

.service-item.active::before,

.service-item:hover::before{ transform: translate(100%, -100%);} 

.service-image{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; transition: all 0.4s ease-in-out;} 

.service-item.active .service-image,

.service-item:hover .service-image{ opacity: 1;} 

.service-image::after{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%;	 background-color: var(--primary-color); opacity: 70%;} 

.service-image img{ width: 100%; height: 100%; object-fit: cover;} 

.service-body{ position: relative; z-index: 2;} 

.service-body .icon-box{ width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; background: var(--accent-color); border-radius: 50%; margin-bottom: 30px; transition: all 0.4s ease-in-out;} 

.service-item.active .service-body .icon-box,

.service-item:hover .service-body .icon-box{ background: var(--secondary-color);} 

.service-body .icon-box img{ width: 100%; max-width: 24px; transition: all 0.4s ease-in-out;} 

.service-item.active .service-body .icon-box img,

.service-item:hover .service-body .icon-box img{ filter: brightness(0) invert(0);} 

.service-content{ border-bottom: 1px solid var(--divider-color); margin-bottom: 25px; padding-bottom: 25px; transition: all 0.4s ease-in-out;} 

.service-item.active .service-content,

.service-item:hover .service-content{ border-color: var(--dark-divider-color);} 

.service-content h3{ font-size: 20px; margin-bottom: 10px; transition: all 0.4s ease-in-out;} 

.service-content h3 a{ color: inherit;} 

.service-content p{ margin-bottom: 0; transition: all 0.4s ease-in-out;} 

.service-item.active .service-content h3,

.service-item:hover .service-content h3,

.service-item.active .service-content p,

.service-item:hover .service-content p{ color: var(--white-color);} 

.service-item.active .service-readmore-btn .readmore-btn,

.service-item:hover .service-readmore-btn .readmore-btn{ color: var(--white-color);} 

.service-item.active .service-readmore-btn .readmore-btn::before,

.service-item:hover .service-readmore-btn .readmore-btn::before{ filter: brightness(0) invert(1);} 

.service-cta-box{ position: relative; border-radius: 20px; height: calc(100% - 30px); overflow: hidden; margin-bottom: 30px;} 

.service-cta-image{ height: 100%;} 

.service-cta-image figure{ display: block; height: 100%;} 

.service-cta-image img{ width: 100%; height: 100%; aspect-ratio: 1 / 0.8; object-fit: cover; transition: all 0.4s ease-in-out;} 

.service-cta-box:hover .service-cta-image img{ transform: scale(1.1);} 

.service-cta-content{ position: absolute; right: 30px; bottom: 30px; left: 30px; background: var(--dark-divider-color); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius: 10px; text-align: center; padding: 20px 30px; z-index: 1;} 

.service-cta-content h3{ font-size: 20px; color: var(--white-color); margin-bottom: 30px;} 

.section-footer-text{ margin-top: 30px; text-align: center;} 

.section-footer-text p{ margin: 0;} 

.dark-section .section-footer-text p{ color: var(--white-color);} 

.section-footer-text p span{ display: inline-block; line-height: 1.1em; color: var(--white-color); background: var(--accent-color); border-radius: 30px; padding: 4px 12px; margin-right: 10px;} 

.section-footer-text p a{ font-weight: 600; color: var(--accent-color); text-decoration: underline; transition: all 0.3s ease-in-out;} 

.section-footer-text p a:hover{ color: var(--primary-color);} 

.dark-section .section-footer-text p a:hover{ color: var(--white-color);} 

/************************************/

/***  07. Why Choose Us css	  ***/

/************************************/ 

.why-choose-us{ padding: 100px 0;} 

.why-choose-item{ display: flex; flex-wrap: wrap; border-bottom: 1px solid var(--divider-color); margin-bottom: 30px; padding-bottom: 30px;} 

.why-choose-item:last-child{ border-bottom: none; margin-bottom: 0; padding-bottom: 0;} 

.why-choose-item .icon-box{ position: relative; width: 60px; height: 60px; display: flex; justify-content: center; align-items: center; background: var(--accent-color); border-radius: 50%; margin-right: 20px;} 

.why-choose-item .icon-box::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--primary-color); border-radius: 50%; width: 100%; height: 100%; transform: scale(0); transition: all 0.4s ease-in-out;} 

.why-choose-item:hover .icon-box::before{ transform: scale(1);} 

.why-choose-item .icon-box img{ position: relative; width: 100%; max-width: 30px; z-index: 1;} 

.why-choose-item-content{ width: calc(100% - 80px);} 

.why-choose-item-content h3{ font-size: 20px; margin-bottom: 10px;} 

.why-choose-item-content p{ margin-bottom: 0;} 

.why-choose-images{ position: relative; margin-left: 15px; margin-bottom: 65px;} 

.why-choose-img-1{ position: relative; margin-left: 180px;} 

.why-choose-img-1 figure,

.why-choose-img-2 figure{ display: block; border-radius: 20px; overflow: hidden;} 

.why-choose-img-1 figure img,

.why-choose-img-2 figure img{ width: 100%; object-fit: cover; border-radius: 20px;} 

.why-choose-img-1 figure img{ aspect-ratio: 1 / 1.542;} 

.contact-us-circle{ position: absolute; right: 60px; bottom: 0; transform: translateY(50%);} 

.contact-us-circle a{ display: block; border: 4px solid var(--white-color); border-radius: 50%;} 

.contact-us-circle a img{ width: 100%; max-width: 130px; border-radius: 50%; animation: infiniterotate 20s infinite linear;} 

.contact-us-circle a:hover img{ animation-play-state: paused;} 

.why-choose-img-2{ position: absolute; top: 150px; left: 20px; width: 100%; max-width: 315px; box-shadow: 0px 4px 14px 0px #0000000D; transform: rotate(-10deg); z-index: 1;} 

.why-choose-img-2 img{ border: 6px solid var(--white-color); aspect-ratio: 1 / 1.22;} 

/************************************/

/***   08. How It Work css	  ***/

/************************************/ 

.how-it-work{ position: relative; background: url('../images/how-it-work-bg.jpg') no-repeat; background-position: center center; background-size: cover; padding: 100px 0; overflow: hidden;} 

.how-it-work::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 80%; background: var(--primary-color); width: 100%; height: 100%;} 

.how-it-work .container{ position: relative; z-index: 1;} 

.work-steps-item{ position: relative; background: var(--dark-divider-color); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius: 20px; height: calc(100% - 30px); margin-bottom: 30px; padding: 40px; overflow: hidden;} 

.work-steps-item::before{ content: ''; position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 0; background-color: var(--accent-color); border-radius: 999px 999px 0 0; transition: all 0.4s ease-in-out;} 

.work-steps-item.active::before,

.work-steps-item:hover::before{ height: 100%; border-radius: 0;} 

.work-step-no,

.work-step-content,

.work-step-btn{ position: relative; z-index: 1;} 

.work-steps-item .icon-box{ position: absolute; top: -5px; right: -5px; z-index: 1;} 

.work-steps-item .icon-box img{ width: 100%; max-width: 60px; transition: all 0.4s ease-in-out;} 

.work-step-no{ width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; background: var(--accent-color); border-radius: 50%; margin-bottom: 20px; transition: all 0.5s ease-in-out;} 

.work-steps-item.active .work-step-no,

.work-steps-item:hover .work-step-no{ background: var(--white-color);} 

.work-step-no h3{ font-family: var(--accent-font); font-size: 16px; font-weight: 500; color: var(--white-color); transition: all 0.5s ease-in-out;} 

.work-steps-item.active .work-step-no h3,

.work-steps-item:hover .work-step-no h3{ color: var(--primary-color);} 

.work-step-content{ margin-bottom: 20px;} 

.work-step-content h3{ font-size: 20px; line-height: 1.4em; color: var(--white-color); border-bottom: 1px solid var(--dark-divider-color); margin-bottom: 20px; padding-bottom: 20px; transition: all 0.4s ease-in-out;} 

.work-step-content p{ color: var(--white-color); margin-bottom: 0; transition: all 0.4s ease-in-out;} 

.work-step-btn .readmore-btn{ color: var(--accent-color);} 

.work-step-btn .readmore-btn::before{ background-image: url('../images/arrow-accent.svg');} 

.work-steps-item.active .work-step-content h3,

.work-steps-item:hover .work-step-content h3

.work-steps-item.active .work-step-content p,

.work-steps-item:hover .work-step-content p,

.work-steps-item.active .work-step-btn .readmore-btn,

.work-steps-item:hover .work-step-btn .readmore-btn{ color: var(--white-color);} 

.work-steps-item.active .work-step-btn .readmore-btn::before,

.work-steps-item:hover .work-step-btn .readmore-btn::before{ filter: brightness(0) invert(1);} 

/************************************/

/***    09. Our Facts css	  ***/

/************************************/ 

.our-facts{ padding: 100px 0;} 

.our-fact-box{ display: flex; flex-wrap: wrap; gap: 30px;} 

.fact-box-1,

.fact-box-3{ display: flex; flex-wrap: wrap; flex-direction: column; gap: 30px;} 

.fact-box-1{ width: calc(25% - 20px);} 

.fact-item{ position: relative; background-color: var(--accent-color); border-radius: 20px; display: flex; flex-direction: column; justify-content: space-between; flex-grow: 1; gap: 20px; padding: 40px; overflow: hidden;} 

.fact-item::before{ content: ''; position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 0; background-color: var(--primary-color); border-radius: 999px 999px 0 0; transition: all 0.4s ease-in-out;} 

.fact-item:hover::before{ height: 100%; border-radius: 0;} 

.fact-item.fact-dark-box{ background-color: var(--primary-color); padding: 30px 25px;} 

.fact-item.fact-dark-box::before{ background-color: var(--accent-color);} 

.fact-item .icon-box,

.fact-item-content{ position: relative; z-index: 1;} 

.fact-item .icon-box img{ width: 100%; max-width: 50px;} 

.fact-item.fact-dark-box .icon-box img{ max-width: 40px;} 

.fact-item-content h2{ font-size: 46px; color: var(--white-color); margin-bottom: 15px;} 

.fact-item.fact-dark-box .fact-item-content h2{ margin-bottom: 5px;} 

.fact-item-content p{ color: var(--white-color); margin-bottom: 0;} 

.fact-image figure{ display: block; border-radius: 20px;} 

.fact-image figure img{ width: 100%; object-fit: cover; border-radius: 20px;} 

.fact-box-1 .fact-image figure img{ aspect-ratio: 1 / 0.74;} 

.fact-box-2{ width: calc(38% - 20px);} 

.fact-box-2 .fact-image,

.fact-box-2 .fact-image figure,

.fact-box-2 .fact-image figure img{ height: 100%;} 

.fact-box-2 .fact-image figure img{ aspect-ratio: 1 /1.19;} 

.fact-box-3{ width: calc(37% - 20px); flex-direction: initial;} 

.fact-image-content{ width: 100%; display: flex; flex-wrap: wrap; gap: 30px;} 

.fact-image-content .fact-item,

.fact-image-content .fact-image{ width: calc(50% - 15px);} 

.fact-box-3 .fact-image figure img{ aspect-ratio: 1 / 0.667;} 

.fact-box-3 .fact-image-content .fact-image figure,

.fact-box-3 .fact-image-content .fact-image img{ height: 100%;} 

.fact-box-3 .fact-image-content .fact-image img{ aspect-ratio: 1 / 1.05;} 

/************************************/

/***  10. CTA Box css   ***/

/************************************/ 

.cta-box{ background-image: url('../images/cta-box-bg.png'); background-repeat: no-repeat; background-position: top center; background-size: 100% auto; padding: 100px 0 0;} 

.cta-box .section-row{ margin-bottom: 40px;} 

.cta-box-btn{ text-align: center; margin-top: 40px;} 

.cta-box-image{ width: 100%; max-width: 955px; margin: 0 auto;} 

.cta-box-image figure{ display: block;} 

.cta-box-image img{ width: 100%; object-fit: cover;} 

/************************************/

/***   11. Our Pricing css	  ***/

/************************************/ 

.our-pricing{ padding: 100px 0;} 

.pricing-box{ background: #fff; border-radius: 20px; height: calc(100% - 30px); margin-bottom: 30px; padding: 15px; box-shadow: 0 4px 6px -1px rgb(0 0 0 / 10%), 0 2px 4px -1px rgb(0 0 0 / 6%); } 

.pricing-header{ margin-bottom: 20px;} 

.pricing-header h3{ font-size: 20px;} 

.pricing-price{ background: var(--accent-color); border-radius: 20px; margin-bottom: 30px; padding: 15px 15px;} 

.pricing-price h2{ font-size: 30px; color: var(--white-color);} 

.pricing-price h2 sub{ font-size: 16px; font-weight: 400; text-transform: capitalize; bottom: 0;} 

.pricing-body { margin-bottom: 15px;} 

.pricing-body h3{ font-size: 20px; margin-bottom: 30px;} 

.pricing-price h6 { margin: 0 0 0; font-size: 16px;}

.pricing-body ul{ margin: 0 !important; padding: 0; list-style: none;} 

.pricing-body ul li{ position: relative; line-height: 1.5em; padding-left: 30px; margin-bottom: 15px;} 

.pricing-body ul li:last-child{ margin-bottom: 0;} 

.pricing-body ul li::before{ content: '\f058'; font-family: 'Font Awesome 6 Free'; position: absolute; top: 0; left: 0; font-size: 18px; font-weight: 900; color: var(--accent-color);} 

.pricing-btn .btn-default{ width: 100%;} 

.pricing-box.highlighted-box{ background:#171542;} 

.pricing-box.highlighted-box .pricing-header h3,

.pricing-box.highlighted-box .pricing-body h3,

.pricing-box.highlighted-box .pricing-body ul li{ color: var(--white-color);} 

.pricing-benefit-list{ margin-top: 30px;} 

.pricing-benefit-list ul{ list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 20px 40px;} 

.pricing-benefit-list ul li{ color: var(--primary-color); display: inline-flex; align-items: center;} 

.pricing-benefit-list ul li img{ max-width: 20px; margin-right: 15px;} 

 


/************************************/

/***   12. Our Feature css	  ***/

/************************************/ 

.our-feature{ background-image: url('../images/feature-bg-image.png'); background-repeat: repeat; background-position: top center; background-size: cover; padding: 100px 0;} 

.our-feature h4.font-2 { margin: 0 0 20px;}

.holistic-support-content-box h4.font-2 { margin: 0 0 20px;}

.feature-item-list{ border-top: 1px solid var(--dark-divider-color); padding-top: 0;} 

.feature-item{ display: flex; flex-wrap: wrap; align-items: center; gap: 30px 40px; border-bottom: 1px solid #2aa1da; margin-bottom: 15px; padding-bottom: 15px;} 

.feature-item:last-child{ border-bottom: none; margin-bottom: 0; padding-bottom: 0;} 

.feature-item-header,

.feature-item-content{ width: calc(50% - 30px); color: #000;} 

.feature-item-content p{color: #000;} 

.feature-item-header{ display: flex; align-items: center; gap: 15px;} 

.feature-item-header .icon-box{ position: relative; width: 60px; height: 60px; background: var(--accent-color); border-radius: 50%; display: flex; justify-content: center; align-items: center;} 

.feature-item-header .icon-box::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--white-color); border-radius: 50%; width: 100%; height: 100%; transform: scale(0); transition: all 0.4s ease-in-out;} 

.feature-item:hover .feature-item-header .icon-box::before{ transform: scale(1);} 

.feature-item-header .icon-box img{ position: relative; width: 100%; max-width: 30px; transition: all 0.3s ease-in-out; z-index: 1;} 

.feature-item:hover .feature-item-header .icon-box img{ filter: brightness(0) invert(0);} 

.feature-item-title{ width: calc(100% - 50px);}

.feature-item-title h6{ font-size: 16px !important; line-height: 26px !important;} 



.feature-item-title h3{ font-size: 20px; line-height: 1.4em; color: #000;} 

.feature-item-content p{ color: #000; margin-bottom: 0;} 

.our-feature-images{ display: flex; flex-wrap: wrap; gap: 30px; margin-left: 15px;} 

.feature-image-box-1,

.feature-image-box-2{ width: calc(50% - 15px); display: flex; flex-direction: column; gap: 30px;} 

.feature-image{ height: 100%;} 

.feature-image figure{ display: flex; height: 100%; border-radius: 20px;} 

.feature-image img{ width: 100%; height: 100%; object-fit: cover; border-radius: 12px;} 

.feature-image-box-1 .feature-image img{ aspect-ratio: 1 / 1.74;} 

.review-box{ display: flex; flex-wrap: wrap; align-items: center; gap: 15px;} 

.review-images{ display: inline-flex; align-items: center;} 

.review-image{ position: relative; display: inline-block; margin-left: -10px; z-index: 1;} 

.review-image:first-child{ margin: 0;} 

.review-image figure{ display: block; border-radius: 50%;} 

.review-image img{ width: 100%; max-width: 45px; border: 1px solid var(--primary-color); border-radius: 50%;} 

.review-image.add-more{ width: 45px; height: 45px; background-color: var(--accent-color); border: 1px solid var(--primary-color); border-radius: 50%; display: flex; justify-content: center; align-items: center; transition: all 0.3s ease-in-out;} 

.review-image.add-more:hover{ background: var(--secondary-color);} 

.review-image.add-more i{ font-size: 20px; color: var(--white-color); transition: all 0.3s ease-in-out;} 

.review-image.add-more:hover i{ color: var(--primary-color);} 

.review-rating-star{ margin-bottom: 5px;} 

.review-rating-star i{ color: var(--accent-color); margin-right: 2px;} 

.review-rating-star span{ font-size: 12px; color: var(--white-color); font-weight: 600; background-color: var(--accent-color); border-radius: 100px; padding: 3px 10px;} 

.review-rating-content p{ color: var(--white-color); margin-bottom: 0;} 

.year-experience-circle{ position: relative; display: inline-flex; background: var(--dark-divider-color); border: 1px solid var(--dark-divider-color); border-radius: 50%; padding: 10px; margin: 0 auto;} 

.year-experience-circle img{ width: 100%; max-width: 120px; animation: infiniterotate 20s infinite linear;} 

.year-experience-circle:hover img{ animation-play-state: paused;} 

.year-experience-counter{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 75px; height: 75px; display: flex; justify-content: center; align-items: center; border: 1px solid var(--dark-divider-color); border-radius: 50%;} 

.year-experience-counter h2{ font-size: 26px; color: var(--white-color);} 

.feature-image-box-2 .feature-image img{ aspect-ratio: 1 / 1.406;} 

/************************************/

/***  13. Our FAQs css	  ***/

/************************************/ 

.our-faqs{ padding: 100px 0;} 

.faqs-content{ position: sticky; top: 30px; margin-right: 15px;} 

.faq-accordion .accordion-item{ position: relative; border-radius: 0; margin-bottom: 5px; overflow: hidden;} 

.faq-accordion .accordion-item:last-child{ margin-bottom: 0;} 

.faq-accordion .accordion-header .accordion-button{ font-size: 18px; font-weight: 600; line-height: 1.4em; background: transparent; color: var(--primary-color); border-bottom: 1px solid var(--divider-color); padding: 5px 30px 5px 20px; transition: all 0.3s ease-in-out;border-radius: 0; padding-left: 0;} 

.faq-accordion .accordion-header .accordion-button.collapsed{ background: transparent;} 

.faq-accordion .accordion-item:last-child .accordion-header .accordion-button.collapsed{ border-bottom: none; padding-bottom: 0;} 

.faq-accordion .accordion-item .accordion-button::after, 

.faq-accordion .accordion-item .accordion-button.collapsed::after{ content: '\2b'; font-family: 'FontAwesome'; position: absolute; right: 0; top: 0; width: 30px; height: 30px; display: flex; justify-content: center; align-items: center; background: var(--accent-color); border-radius: 50%; font-size: 14px; color: var(--white-color); transition: all 0.3s ease-in-out;} 

.faq-accordion .accordion-button:not(.collapsed)::after{ content: '-'; background: var(--primary-color);} 

.faq-accordion .accordion-item .accordion-body{ background: transparent; padding: 5px 0 15px 25px;} 

.faq-accordion .accordion-item .accordion-body p{ margin: 0;} 

/************************************/

/***   14. Our Testimonials css	  ***/

/************************************/ 

.our-testimonials{ position: relative; background-image: url('../images/testimonial-bg.jpg'); background-repeat: no-repeat; background-position: center center; background-size: cover; background-repeat: no-repeat; background-size: cover; padding: 100px 0; overflow: hidden;} 

.our-testimonials::before{ content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: var(--primary-color); opacity: 80%; width: 100%; height: 100%;} 

.our-testimonials .container{ position: relative; z-index: 1;} 

.testimonials-counter-box{ display: flex; flex-wrap: wrap; align-items: center; width: 100%; max-width: 400px;} 

.testimonials-counter-box h2{ width: 130px; font-size: 46px; font-weight: 600; color: var(--white-color);} 

.testimonials-counter-box p{ width: calc(100% - 150px); color: var(--white-color); border-left: 1px solid var(--dark-divider-color); margin: 0 0 0 15px; padding-left: 15px;} 

.testimonial-slider{ position: relative; background: var(--dark-divider-color); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius: 20px; padding: 40px;} 

.testimonial-slider .swiper-wrapper{ cursor: none;} 

.testimonial-header{ display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 30px;} 

.testimonial-company-logo img{ width: 100%; max-width: 150px;} 

.testimonial-quote img{ width: 100%; max-width: 40px;} 

.testimonial-content{ border-bottom: 1px solid var(--dark-divider-color); margin-bottom: 30px; padding-bottom: 30px;} 

.testimonial-content p{ color: var(--white-color);	 margin: 0;} 

.testimonial-author{ display: flex; align-items: center;} 

.author-image{ margin-right: 15px;} 

.author-image figure{ display: block; border-radius: 50%;} 

.author-image img{ width: 100%; max-width: 50px; border-radius: 50%;} 

.author-content h3{ font-size: 20px; text-transform: capitalize; color: var(--white-color); margin-bottom: 5px;} 

.author-content p{ color: var(--white-color); margin-bottom: 0;} 

.testimonial-btn{ position: relative; display: flex; justify-content: end; align-items: center; margin-top: -40px; z-index: 1;} 

.testimonial-slider .testimonial-button-next,

.testimonial-slider .testimonial-button-prev{ position: relative; width: 40px; height: 40px; background: var(--dark-divider-color); border-radius: 50%; transition: all 0.4s ease-in-out;} 

.testimonial-slider .testimonial-button-next{ margin-left: 20px;} 

.testimonial-slider .testimonial-button-next:hover,

.testimonial-slider .testimonial-button-prev:hover{ background: var(--accent-color);} 

.testimonial-slider .testimonial-button-next::before,

.testimonial-slider .testimonial-button-prev::before{ content: '\f061'; font-family: 'FontAwesome'; position: absolute; top: 50%; bottom: 0; left: 50%; right: 0; transform: translate(-50%, -50%); font-size: 18px; color: var(--white-color); display: flex; align-items: center; justify-content: center; transition: all 0.3s ease-in-out;} 

.testimonial-slider .testimonial-button-prev::before{ content: '\f060';} 

.company-supports-slider{ border-top: 1px solid var(--dark-divider-color); padding-top: 60px; margin-top: 60px;} 

.company-supports-logo{ text-align: center;} 

.company-supports-logo img{ width: 100%; max-height: 40px;} 

/************************************/

/***    15. Our Blog css   ***/

/************************************/ 

.our-blog{ padding: 100px 0 70px;} 

.post-item{ height: calc(100% - 30px); margin-bottom: 30px;} 

.post-featured-image{ margin-bottom: 20px;} 

.post-featured-image a{ cursor: none;	 display: block; border-radius: 20px; overflow: hidden;} 

.post-featured-image figure{ display: block;} 

.post-featured-image img{ aspect-ratio: 1 / 0.72; object-fit: cover; transition: all 0.4s ease-in-out;} 

.post-item:hover .post-featured-image img{ transform: scale(1.1);} 

.post-item-content{ margin-bottom: 20px;} 

.post-item-content h2{ font-size: 20px; line-height: 1.4em;} 

.post-item-content h2 a{ display: inline-block; color: inherit;} 

/************************************/

/***     16. Footer css    ***/

/************************************/ 

.main-footer{ background-image: url('../images/footer-bg.png'); background-repeat: no-repeat; background-position: top center; background-size: 100% auto; padding: 100px 0 0; margin-bottom: 50px;} 

.footer-logo{ margin-bottom: 20px;} 

.footer-logo img{ width: 100%; max-width: 165px;} 

.about-footer-content p{ color: var(--white-color); margin: 0;} 

.footer-social-links{ margin-top: 40px;} 

.footer-social-links ul{ margin: 0; padding: 0; list-style: none;} 

.footer-social-links ul li{ display: inline-block; margin-right: 12px;} 

.footer-social-links ul li:last-child{ margin-right: 0;} 

.footer-social-links ul li a{ width: 40px; height: 40px; color: var(--white-color); background: var(--dark-divider-color); border-radius: 50%; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease-in-out;} 

.footer-social-links ul li a:hover{ background: var(--accent-color);} 

.footer-social-links ul li a i{ font-size: 18px; color: inherit;} 

.footer-links h3{ font-size: 20px; text-transform: capitalize; color: var(--white-color); margin-bottom: 20px;} 

.footer-links p{ color: var(--white-color); margin: 0;} 

.footer-links p a{ color: inherit; transition: all 0.3s ease-in-out;} 

.footer-links p a:hover{ color: var(--accent-color);} 

.footer-links ul{ list-style: none; margin: 0; padding: 0;} 

.footer-links ul li{ position: relative; text-transform: capitalize; color: var(--white-color); line-height: normal; margin-bottom: 20px; padding-left: 24px;} 

.footer-links ul li:last-child{ margin-bottom: 0;} 

.footer-links ul li::before{ content: '\2a'; font-family: 'Font Awesome 6 Free'; position: absolute; top: 50%; left: 0; transform: translateY(-50%); font-size: 16px; font-weight: 900; color: var(--accent-color);} 

.footer-links ul li a{ color: inherit; transition: all 0.3s ease-in-out;} 

.footer-links ul li a:hover{ color: var(--accent-color);} 

.footer-contact-item{ margin-bottom: 30px;} 

.footer-contact-item:last-child{ margin-bottom: 0;} 

.footer-contact-item h3{ margin-bottom: 15px;} 

.footer-newsletter-form .form-group{ display: flex; border: 1px solid var(--dark-divider-color); border-radius: 10px; padding: 5px; margin-top: 20px;} 

.footer-newsletter-form .form-group .form-control{ width: calc(100% - 40px); font-size: 16px; font-weight: 500; line-height: 1.2em; color: var(--white-color); background: transparent; border: none; border-radius: 0; outline: none; box-shadow: none; padding: 10px 15px;} 

.footer-newsletter-form .form-group .form-control::placeholder{ font-size: 14px; color: var(--white-color); opacity: 50%;} 

.footer-newsletter-form .form-group .newsletter-btn{ width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; background-color: var(--accent-color); border-radius: 6px; border: none; padding: 0; transition: all 0.3s ease-in-out;} 

.footer-newsletter-form .form-group .newsletter-btn:hover{ background-color: var(--white-color);} 

.footer-newsletter-form .form-group .newsletter-btn i{ font-size: 18px; color: var(--white-color); padding-right: 3px; transition: all 0.3s ease-in-out;} 

.footer-newsletter-form .form-group .newsletter-btn:hover i{ color: var(--primary-color);} 

.footer-copyright{ display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; border-top: 1px solid var(--dark-divider-color); padding: 40px 0; margin-top: 60px;} 

.footer-copyright-text p{ color: var(--white-color); margin-bottom: 0;} 

.footer-privacy-policy{ text-align: right;} 

.footer-privacy-policy ul{ margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 32px;} 

.footer-privacy-policy ul li{ color: var(--white-color); text-transform: capitalize; line-height: 1.6em; transition: all 0.3s ease-in-out;} 

.footer-privacy-policy ul li::marker{ color: var(--white-color);} 

.footer-privacy-policy ul li:first-child::marker{ font-size: 0;} 

.footer-privacy-policy ul li:hover{ color: var(--accent-color);} 

.footer-privacy-policy ul li:last-child{ border-right: none; padding-right: 0; margin-right: 0;} 

.footer-privacy-policy ul li:last-child::before{ display: none;} 

.footer-privacy-policy ul li a{ color: inherit;} 

/************************************/

/***  17. About Us Page css   ***/

/************************************/ 

.page-header{ position: relative; background: var(--accent-color) url('../images/page-header-bg.png') no-repeat; background-position: top center; background-size: 100% auto; padding: 145px 0;} 

.page-header-box{ text-align: center;} 

.page-header-box h1{ display: inline-block; font-size: 60px; font-weight: 600; line-height: 1.1em; color: var(--white-color); margin-bottom: 10px; cursor: none;} 

.page-header-box h1 span{ font-family: var(--accent-font); font-weight: 400; font-style: italic;} 

.page-header-box ol{ margin: 0; padding: 0; justify-content: center;} 

.page-header-box ol li.breadcrumb-item{ font-size: 18px; text-transform: capitalize; line-height: normal; color: var(--white-color);} 

.page-header-box ol .breadcrumb-item+.breadcrumb-item::before{ color: var(--white-color);} 

.page-header-box ol li.breadcrumb-item a{ color: inherit;} 

.our-approach{ padding: 100px 0;} 

.approach-body-item{ display: flex; align-items: center; border-bottom: 1px solid var(--divider-color); margin-bottom: 40px; padding-bottom: 40px;} 

.approach-body-item:last-child{ margin-bottom: 0; padding-bottom: 0; border-bottom: none;} 

.approach-body-item .icon-box{ position: relative; width: 60px; height: 60px; display: flex; justify-content: center; align-items: center; background: var(--accent-color); border-radius: 50%; margin-right: 20px;} 

.approach-body-item .icon-box::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--primary-color); border-radius: 50%; width: 100%; height: 100%; transform: scale(0); transition: all 0.3s ease-in-out;} 

.approach-body-item:hover .icon-box::before{ transform: scale(1);} 

.approach-body-item .icon-box img{ position: relative; width: 100%; max-width: 30px; z-index: 1;} 

.approach-body-item-content{ width: calc(100% - 80px);} 

.approach-body-item-content h3{ font-size: 20px; line-height: 1.4em;} 

.approach-image-content{ position: relative;} 

.approach-image{ border-radius: 20px; overflow: hidden;} 

.approach-image figure{ display: block;} 

.approach-image img{ width: 100%; aspect-ratio: 1 / 1.303; object-fit: cover;} 

.approach-result-box{ position: absolute; right: 30px; bottom: 30px; left: 30px; background: var(--primary-color); border-radius: 18px; padding: 20px; z-index: 1;} 

.approach-result-box::before{ content: ''; position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 0; background-color: var(--accent-color); border-radius: 18px; transition: all 0.4s ease-in-out;} 

.approach-result-box:hover::before{ height: 100%;} 

.approach-result-header,

.approach-result-content{ position: relative; z-index: 1;} 

.approach-result-header{ display: flex; align-items: center; margin-bottom: 20px;} 

.approach-result-header .icon-box{ margin-right: 20px;} 

.approach-result-header .icon-box img{ width: 100%; max-width: 45px; transition: all 0.4s ease-in-out;} 

.approach-result-box:hover .approach-result-header .icon-box img{ filter: brightness(0) invert(1);} 

.approach-result-counter h2{ font-size: 46px;	 color: var(--white-color);} 

.approach-result-content p{ color: var(--white-color); margin-bottom: 0;} 

.mission-vision-item{ border-bottom: 1px solid var(--divider-color); margin-bottom: 20px; padding-bottom: 0px;} 

.mission-vision-item:last-child{ margin-bottom: 0; padding-bottom: 0; border-bottom: none;} 

.mission-vision-item .icon-box{ position: relative; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; background: var(--accent-color); border-radius: 50%; margin-bottom: 30px;} 

.mission-vision-item .icon-box::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--primary-color); border-radius: 50%; width: 100%; height: 100%; transform: scale(0); transition: all 0.3s ease-in-out;} 

.mission-vision-item:hover .icon-box::before{ transform: scale(1);} 

.mission-vision-item .icon-box img{ position: relative; width: 100%; max-width: 24px; z-index: 1;} 

.mission-vision-item-content h3{ font-size: 20px; line-height: 1.4em; margin-bottom: 15px;} 

.mission-vision-item-content p{ margin-bottom: 0;} 

.our-care{ padding: 100px 0;} 

.care-images{ position: relative; display: flex; flex-wrap: wrap; align-items: end; gap: 20px; margin-right: 15px;} 

.care-image-1{ width: calc(42% - 10px);} 

.care-image-1 figure{ display: block; border-radius: 20px; border-radius: 20px;} 

.care-image-1 img{ width: 100%; aspect-ratio: 1 / 1.63; object-fit: cover; border-radius: 20px;} 

.care-image-2{ width: calc(58% - 10px);} 

.care-image-2 figure{ display: block; mask-image: url('../images/care-image-bg-shape.svg'); background-image: url('../images/care-image-bg-shape.svg'); mask-size: cover; mask-position: left center; mask-repeat: no-repeat; border-radius: 20px; width: 100%; height: 100%;} 

.care-image-2 img{ width: 100%; aspect-ratio: 1 / 1.805; object-fit: cover; border-radius: 20px;} 

.customer-review-box{ position: absolute; top: 0; left: 0; width: 100%; max-width: 310px; background-color: var(--secondary-color); border-radius: 20px; padding: 30px; z-index: 1;} 

.customer-review-box .review-rating-star,

.customer-review-content{ margin-bottom: 20px;} 

.customer-review-content p{ margin-bottom: 0;} 

.customer-review-box .review-images .review-image img{ border-width: 2px; border-color: var(--secondary-color); max-width: 54px;} 

.care-body-list{ display: flex; flex-wrap: wrap; gap: 30px;} 

.care-body-item{ width: calc(50% - 15px); background: var(--secondary-color); border-radius: 20px; padding: 30px;} 

.care-body-header{ display: flex; align-items: center; margin-bottom: 20px;} 

.care-body-header .icon-box{ position: relative; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; background: var(--accent-color); border-radius: 50%; margin-right: 20px;} 

.care-body-header .icon-box::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--primary-color); border-radius: 50%; width: 100%; height: 100%; transform: scale(0); transition: all 0.3s ease-in-out;} 

.care-body-item:hover .care-body-header .icon-box::before{ transform: scale(1);} 

.care-body-header .icon-box img{ position: relative; width: 100%; max-width: 24px; z-index: 1;} 

.care-body-title{ width: calc(100% - 70px);} 

.care-body-title h3{ font-size: 20px; line-height: 1.4em;} 

.care-body-content p{ margin-bottom: 0;} 

.our-care-btn{ margin-top: 40px;} 

.family-trust-us{ padding: 100px 0;} 

.family-trust-image{ position: relative; height: 100%;} 

.family-trust-image figure{ display: block; height: 100%; border-radius: 20px;} 

.family-trust-image figure img{ width: 100%; height: 100%; aspect-ratio: 1 / 1.05; object-fit: cover; border-radius: 20px;} 

.family-trust-image .contact-us-circle{ right: -15px; bottom: 100px; transform: translate(50%, 0); z-index: 2;} 

.family-trust-list{ display: flex; gap: 20px 40px; flex-wrap: wrap;} 

.family-trust-item{ width: calc(50% - 20px); display: flex; align-items: center;} 

.family-trust-item .icon-box{ position: relative; width: 60px; height: 60px; display: flex; justify-content: center; align-items: center; background: var(--accent-color); border-radius: 50%; margin-right: 20px;} 

.family-trust-item .icon-box::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--primary-color); border-radius: 50%; width: 100%; height: 100%; transform: scale(0); transition: all 0.3s ease-in-out;} 

.family-trust-item:hover .icon-box::before{ transform: scale(1);} 

.family-trust-item .icon-box img{ position: relative; width: 100%; max-width: 30px; z-index: 1;} 

.family-trust-item-title{ width: calc(100% - 80px);} 

.family-trust-item-title h3{ font-size: 20px; line-height: 1.4em;} 

.family-trust-body{ display: flex; flex-wrap: wrap; align-items: center; gap: 30px; margin-top: 30px;} 

.family-trust-body-image,

.family-trust-body-content{ width: calc(50% - 15px);} 

.family-trust-body-image figure{ display: block; border-radius: 20px; z-index: 0;} 

.family-trust-body-image img{ width: 100%; aspect-ratio: 1 / 0.79; object-fit: cover; border-radius: 20px;} 

.family-trust-body-item{ border-bottom: 1px solid var(--divider-color); margin-bottom: 20px; padding-bottom: 20px;} 

.family-trust-body-item:last-child{ margin-bottom: 0; padding-bottom: 0; border-bottom: none;} 

.family-trust-body-item h3{ font-size: 20px; line-height: 1.4em; margin-bottom: 15px;} 

.family-trust-body-item p{ margin-bottom: 0;} 

.our-team{ padding: 100px 0 70px;} 

.team-item{ height: calc(100% - 30px); margin-bottom: 30px;} 

.team-image{ position: relative; margin-bottom: 20px;} 

.team-image a,

.team-image figure{ display: block; cursor: none; border-radius: 20px; overflow: hidden;} 

.team-image img{ width: 100%; aspect-ratio: 1 / 1.153; object-fit: cover; transition: all 0.4s ease-in-out;} 

.team-item:hover .team-image img{ transform: scale(1.07);} 

.team-social-icon{ position: absolute; right: 30px; bottom: 0; left: 30px; background: var(--dark-divider-color); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-radius: 10px; padding: 15px; opacity: 0; visibility: hidden; transition: all 0.4s ease-in-out; z-index: 1;} 

.team-item:hover .team-social-icon{ bottom: 30px; opacity: 1; visibility: visible;} 

.team-social-icon ul{ list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px;} 

.team-social-icon ul li a{ width: 36px; height: 36px; background: var(--white-color); color: var(--accent-color); border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.4s ease-in-out;} 

.team-social-icon ul li a:hover{ background: var(--primary-color); color: var(--white-color);} 

.team-social-icon ul li a i{ font-size: 18px; color: inherit;} 

.team-content{ text-align: center;} 

.team-content h3{ font-size: 20px; text-transform: capitalize; margin-bottom: 5px;} 

.team-content h3 a{ color: inherit;} 

.team-content p{ text-transform: capitalize; margin: 0;} 

/************************************/

/***  18. Services Page css	  ***/

/************************************/ 

.page-services{ padding: 100px 0 70px;} 

/************************************/

/***  19. Service Single css	  ***/

/************************************/ 

.page-service-single{ padding: 100px 0;} 

.page-single-sidebar{ position: sticky; margin-right: 15px;} 

.page-catagory-list{  background:#9fcfe2;    border: 1px solid #fff; border-radius: 20px; margin-bottom:0px; overflow: hidden; padding-top: 20px; text-align: center;}



.page-catagory-list h3{ font-size: 20px; color: var(--white-color); text-transform: capitalize; background: var(--accent-color); padding: 22px 20px;} 

.page-catagory-list p{ font-size: 15px; color: #000; padding: 10px 15px;} 

.page-catagory-list ul{ background: #9fcfe2; list-style: none; margin: 0; padding: 30px;} 

.page-catagory-list ul li{ line-height: 1.5em; border-bottom: 1px solid #ffffff8f; padding-bottom: 20px; margin-bottom: 20px;} 

.page-catagory-list ul li::before {     content: none  !important;} 

.page-catagory-list ul li a{ position: relative; display: block; text-transform: capitalize; color: var(--text-color); padding-right: 30px; transition: all 0.4s ease-in-out;} 

.page-catagory-list ul li:hover a{ color: var(--primary-color);} 

.page-catagory-list ul li a::before{ content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); background: url('../images/arrow-primary.svg') no-repeat; background-size: cover; background-position: center center; width: 14px; height: 14px; transition: all 0.4s ease-in-out;} 

.page-catagory-list ul li a:hover::before{ transform: translateY(-50%) rotate(45deg);} 

.sidebar-cta-box{ border: 1px solid var(--divider-color); border-radius: 20px; overflow: hidden;} 

.sidebar-cta-image figure{ display: block;} 

.sidebar-cta-image img{ width: 100%; aspect-ratio: 1 / 0.68; object-fit: cover; transition: all 0.4s ease-in-out;} 

.sidebar-cta-box:hover .sidebar-cta-image img{ transform: scale(1.1);} 

.sidebar-cta-content{ display: flex; background: var(--white-color); padding: 40px 30px;}  

.sidebar-cta-content .icon-box{ margin-right: 20px;} 

.sidebar-cta-content .icon-box img{ width: 100%; max-width: 30px;} 

.cta-item-content{ width: calc(100% - 50px);} 

.cta-item-content h3{ font-size: 20px; margin-bottom: 10px;} 

.cta-item-content p{ margin-bottom: 0;} 

.sidebar-cta-contact a{ display: inline-flex; align-items: center; width: 100%; font-weight: 700; color: var(--white-color); background: var(--accent-color); padding: 18px 30px; transition: all 0.3s ease-in-out;} 

.sidebar-cta-contact a:hover{ background: var(--primary-color);} 

.sidebar-cta-contact a img{ width: 100%; max-width: 26px; margin-right: 15px;} 

.page-single-image{ margin-bottom: 40px;} 

.page-single-image figure{ display: block; border-radius: 20px;} 

.page-single-image img{ width: 100%; aspect-ratio: 1 / 0.598; object-fit: cover; border-radius: 20px;} 

.service-entry{ margin-bottom: 0px;} 

.service-entry p{ margin-bottom: 20px;} 

.service-entry h2{ font-size: 46px; font-weight: 600; letter-spacing: -0.02em; margin-bottom: 10px;} 

.service-entry h2 span{ font-family: var(--accent-font); font-weight: 400; font-style: italic;} 

.service-entry ul{ list-style: none; margin: 0 0 25px; padding: 0;} 

.service-entry ul li{ position: relative; line-height: 1.5em; font-size: 13px; padding-left: 30px; margin-bottom: 15px;} 

.service-entry ul li:last-child{ margin-bottom: 0;} 

.service-entry ul li::before{ content: '\f058'; font-family: 'Font Awesome 6 Free'; position: absolute; top: 2px; left: 0; font-size: 18px; font-weight: 900; color: var(--accent-color);} 

.compassionate-box,

.service-support-box,

.personalized-step-box{ margin-top: 60px;} 

.compassionate-body-box{ display: flex; flex-wrap: wrap; align-items: center; gap: 30px; margin-top: 40px;} 

.compassionate-item-list,

.compassionate-content-box{ width: calc(100% - 0px);} 

.compassionate-content-box{ box-shadow: var(--bs-box-shadow)!important; position: relative; background: #9fcfe2; border-radius: 20px; padding: 30px 15px; overflow: hidden; text-align: left; color: #000 !important;} 

.compassionate-content-box::before { color: #fff; content: ''; position: absolute; left: 0; right: 0; bottom: 0; background-color: #9fcfe200; border-radius: 999px 999px 0 0; width: 100%; height: 0; transition: all 0.3s ease-in-out;}

.compassionate-content-box::before h3 p ul li { color: #fff !important;} 

.case-study-catagery-list ul li:hover::before{ color: #fff !important;} 

.our-services.service-entry  .page-single-sidebar.compassionate-content-box {top: inherit;}

 

.compassionate-content-box:hover::before{ border-radius: 0; height: 100%;} 

.compassionate-content-box .icon-box,

.compassionate-content{ position: relative; z-index: 1;} 

.compassionate-content-box .icon-box{ margin-bottom: 40px;} 

.compassionate-content-box .icon-box img{ width: 100%; max-width: 50px;} 

.compassionate-content h3{ font-size: 20px; color: var(--white-color); margin-bottom: 15px;} 

.compassionate-content p{ color: var(--white-color);} 

.service-support-body{ display: flex; flex-wrap: wrap; align-items: center; gap: 30px; margin-top: 40px;} 

.service-support-list{ width: calc(40% - 15px);} 

.service-support-item-list{ width: calc(60% - 15px); display: flex; flex-wrap: wrap; gap: 30px;} 

.service-support-item{ width: calc(50% - 15px); border: 1px solid var(--divider-color); border-radius: 20px; display: flex; flex-wrap: wrap; padding: 30px 20px;} 

.service-support-item .icon-box{ position: relative; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; background: var(--accent-color); border-radius: 50%; margin-right: 20px;}



.service-support-item .icon-box::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--primary-color); border-radius: 50%; width: 100%; height: 100%; transform: scale(0); transition: all 0.3s ease-in-out;} 

.service-support-item:hover .icon-box::before{ transform: scale(1);} 

.service-support-item .icon-box img{ position: relative; width: 100%; max-width: 24px; z-index: 1;} 

.service-support-item-content{ width: calc(100% - 70px);} 

.service-support-item-content h3{ font-size: 20px; margin-bottom: 5px;} 

.service-support-image-video{ display: flex; flex-wrap: wrap; gap: 30px; margin-top: 40px;} 

.service-support-image,

.service-support-video{ position: relative; width: calc(50% - 15px);} 

.service-support-image figure,

.service-support-video figure{ display: block; border-radius: 20px;} 

.service-support-image figure img,

.service-support-video figure img{ width: 100%; aspect-ratio: 1 / 0.591; object-fit: cover; border-radius: 20px;} 

.service-support-video figure:before{ content: ''; position: absolute; height: 100%; width: 100%; top: 0; right: 0; bottom: 0; left: 0; background-color: var(--primary-color); opacity: 50%;} 

.video-play-button{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1;} 

.video-play-button a{ position: relative; background: var(--accent-color); background-size: 200% auto; border-radius: 100%; width: 50px; height: 50px; margin: 0 auto; display: flex; align-items: center; justify-content: center; cursor: none;} 

.video-play-button a:before{ content: ''; position: absolute; top: -50%; left: -50%; width: 160%; height: 160%; border: 50px solid var(--white-color); opacity: 50%; border-radius: 50%; transform: scale(0.6); z-index: -1; animation: border-zooming 1.2s infinite linear;} 

.video-play-button a:after{ content: ''; position: absolute; top: -50%; left: -50%; width: 160%; height: 160%; border: 50px solid var(--white-color); opacity: 50%; border-radius: 50%; transform: scale(0.6); z-index: -1; animation: border-zooming 1.2s infinite linear; animation-delay: .3s;} 

@keyframes border-zooming{ 100%{ transform: scale(1); opacity: 0; }

} 

.video-play-button a i{ font-size: 20px; color: var(--white-color);} 

.personalized-step-item-list{ margin-top: 40px;} 

.personalized-step-item{ display: flex; flex-wrap: wrap; gap: 30px; margin-bottom: 30px;} 

.personalized-step-item:last-child{ margin-bottom: 0;} 

.personalized-step-item:nth-child(even){ flex-direction: row-reverse;} 

.personalized-step-info-box,

.personalized-step-image{ width: calc(50% - 15px);} 

.personalized-step-info-box{ border: 1px solid var(--divider-color); border-radius: 20px; padding: 40px;} 

.personalized-step-header{ display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--divider-color); margin-bottom: 40px; padding-bottom: 40px;} 

.personalized-step-title{ width: calc(100% - 80px);} 

.personalized-step-title h2{ margin-bottom: 0;} 

.personalized-step-btn a{ width: 50px; height: 50px; background-color: var(--secondary-color); border-radius: 50px; display: flex; justify-content: center; align-items: center; transition: all 0.3s ease-in-out;} 

.personalized-step-btn a:hover{ background: var(--accent-color);} 

.personalized-step-btn a img{ width: 100%; max-width: 14px; transition: all 0.3s ease-in-out;} 

.personalized-step-btn a:hover img{ transform: rotate(45deg);} 

.personalized-step-body h2{ opacity: 20%; font-weight: 800; text-align: right; margin-bottom: 0; transition: all 0.3s ease-in-out;} 

.personalized-step-info-box:hover .personalized-step-body h2{ opacity: 100%;} 

.personalized-step-image figure{ display: block; height: 100%; border-radius: 20px;} 

.personalized-step-image img{ width: 100%; height: 100%; aspect-ratio: 1 / 0.68; object-fit: cover; border-radius: 20px;} 

/************************************/

/***  20. Blog Archive css	  ***/

/************************************/ 

.page-blog{ padding: 100px 0;} 

.page-blog .post-item{ height: calc(100% - 40px); margin-bottom: 40px;} 

.page-pagination{ margin-top: 30px; text-align: center;} 

.page-pagination ul{ justify-content: center; padding: 0; margin: 0;} 

.page-pagination ul li a,

.page-pagination ul li span{ display: flex; text-decoration: none; justify-content: center; align-items: center; background: var(--secondary-color); color: var(--accent-color); border-radius: 10px; width: 40px; height: 40px; margin: 0 5px; font-weight: 600; line-height: 1em; transition: all 0.3s ease-in-out;} 

.page-pagination ul li.active a, 

.page-pagination ul li a:hover{ background: var(--accent-color); color: var(--white-color);} 

/************************************/

/***   21. Blog Single css	  ***/

/************************************/ 

.page-single-post{ padding: 100px 0;} 

.post-single-meta{ margin-top: 5px;} 

.post-single-meta ol li{ font-size: 18px; color: var(--white-color); margin-right: 15px;} 

.post-single-meta ol li:last-child{ margin-right: 0;} 

.post-single-meta ol li i{ font-size: 18px; color: var(--white-color); margin-right: 5px;} 

.post-image{ position: relative; margin-bottom: 30px;} 

.post-image figure{ display: block;	 border-radius: 20px; overflow: hidden;} 

.post-image img{ width: 100%; aspect-ratio: 1 / 0.50; object-fit: cover; border-radius: 20px;} 

.post-content{ width: 100%; max-width: 1100px; margin: 0 auto;} 

.post-entry{ border-bottom: 1px solid var(--divider-color); padding-bottom: 30px; margin-bottom: 30px;} 

.post-entry:after{ content: ''; display: block; clear: both;} 

.post-entry a{ color: var(--accent-color);} 

.post-entry h1,

.post-entry h2,

.post-entry h3,

.post-entry h4,

.post-entry h5,

.post-entry h6{ font-weight: 600; line-height: 1.2em; margin: 0 0 0.435em;} 

.post-entry h1{ font-size: 60px;} 

.post-entry h2{ font-size: 46px;} 

.post-entry h3{ font-size: 40px;} 

.post-entry h4{ font-size: 30px;} 

.post-entry h5{ font-size: 24px;} 

.post-entry h6{ font-size: 20px;} 

.post-entry p{ margin-bottom: 20px;} 

.post-entry p:last-child{ margin-bottom: 0;} 

.post-entry p strong{ color: var(--primary-color); font-size: 18px; font-weight: 600;} 

.post-entry ol{ margin: 0 0 30px;} 

.post-entry ul{ padding: 0; margin: 20px 0 20px; padding-left: 20px;} 

.post-entry ol li,

.post-entry ul li{ position: relative; font-size: 16px; font-weight: 500; line-height: 1.6em; color: var(--text-color); margin-bottom: 15px;} 

.post-entry ul li:last-child{ margin-bottom: 0;} 

.post-entry ul ul,

.post-entry ul ol,

.post-entry ol ol,

.post-entry ol ul{ margin-top: 20px; margin-bottom: 0;} 

.post-entry ul ul li:last-child,

.post-entry ul ol li:last-child,

.post-entry ol ol li:last-child,

.post-entry ol ul li:last-child{ margin-bottom: 0;} 

.post-entry blockquote{ background: url('../images/icon-blockquote.svg'), var(--accent-color); background-repeat: no-repeat; background-position: 30px 30px; background-size: 45px; border-radius: 20px; padding: 30px 30px 30px 90px; margin-bottom: 30px;} 

.post-entry blockquote p{ font-size: 20px; font-weight: 700; line-height: 1.4em; color: var(--white-color);} 

.post-entry blockquote p:last-child{ margin-bottom: 0;} 

.tag-links{ font-family: var(--accent-font); font-size: 20px; font-weight: 500; text-transform: capitalize; color: var(--primary-color); display: inline-flex; align-items: center; flex-wrap: wrap; gap: 15px;} 

.post-tags .tag-links a{ display: inline-block; font-family: var(--default-font); font-size: 16px; font-weight: 700; text-transform: capitalize; line-height: 1em; background: var(--accent-color); color: var(--white-color); border-radius: 10px; padding: 12px 20px; transition: all 0.3s ease-in-out;} 

.post-tags .tag-links a:hover{ background: var(--primary-color);} 

.post-social-sharing{ text-align: right;} 

.post-social-sharing ul{ list-style: none; padding: 0; margin: 0;} 

.post-social-sharing ul li{ display: inline-block; margin-right: 10px;} 

.post-social-sharing ul li:last-child{ margin-right: 0;} 

.post-social-sharing ul li a{ display: flex; align-items: center; justify-content: center; text-align: center; background: var(--accent-color); color: var(--white-color); border-radius: 10px; width: 40px; height: 40px; transition: all 0.3s ease-in-out;} 

.post-social-sharing ul li:hover a{ background: var(--primary-color);} 

.post-social-sharing ul li a i{ font-size: 18px; color: inherit;} 

/************************************/

/*** 22. Case Study Page css	  ***/

/************************************/ 

.page-case-study{ padding: 100px 0 60px;} 

.case-study-item{ height: calc(100% - 40px); margin-bottom: 40px;} 

.case-study-image{ position: relative; border-radius: 20px; margin-bottom: 20px; overflow: hidden;} 

.case-study-image::before{ content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; transform: scale(0); background: var(--primary-color); border-radius: 20px; opacity: 40%; width: 100%; height: 100%; transition: all 0.4s ease-in-out; z-index: 1;} 

.case-study-item:hover .case-study-image::before{ transform: scale(1);} 

.case-study-image figure{ display: block;} 

.case-study-image figure img{ width: 100%; aspect-ratio: 1 / 0.745; object-fit: cover; border-radius: 20px; transition: all 0.4s ease-in-out;} 

.case-study-item:hover .case-study-image figure img{ transform: scale(1.1);} 

.case-study-btn{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(0); opacity: 0; visibility: hidden; transition: all 0.4s ease-in-out; z-index: 1;} 

.case-study-item:hover .case-study-btn{ opacity: 1; visibility: visible; transform: translate(-50%, -50%) scale(1);} 

.case-study-btn a{ background: var(--accent-color); border-radius: 50%; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center;} 

.case-study-btn a img{ width: 100%; max-width: 16px; transition: 0.4s ease-in-out;} 

.case-study-btn a:hover img{ transform: rotate(45deg);} 

.case-study-content h2{ font-size: 20px; line-height: 1.4em;} 

.case-study-content h2 a{ color: inherit;} 

/************************************/

/***  23. Case Study Single css	  ***/

/************************************/ 

.page-case-study-single{ padding: 50px 0;} 

.case-study-catagery-list ul li{ font-weight: 600; display: flex; align-items: center; justify-content: space-between; white-space: nowrap; } 

.case-study-catagery-list ul li span{ width: 73%; font-weight: 400; display: inline-flex; gap: 10px; white-space: normal;} 

.case-study-catagery-list ul li span a{ background: var(--accent-color); border-radius: 50%; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; padding: 0; transition: all 0.4s ease-in-out;} 

.case-study-catagery-list ul li span a::before{ display: none;} 

.case-study-catagery-list ul li span a:hover{ background: var(--primary-color);} 

.case-study-catagery-list ul li span a i{ font-size: 16px; color: var(--white-color);} 

.case-study-entry{ margin-bottom: 60px;} 

.case-study-entry p{ margin-bottom: 20px;} 

.case-study-entry p:last-child{ margin-bottom: 0;} 

.case-study-entry h2{ font-size: 46px; font-weight: 600; letter-spacing: -0.02em; margin-bottom: 20px;} 

.case-study-entry h2 span{ font-family: var(--accent-font); font-weight: 400; font-style: italic;} 

.case-study-entry ul{ list-style: none; margin: 0; padding: 0;} 

.case-study-entry ul li{ position: relative; line-height: 1.5em; padding-left: 30px; margin-bottom: 15px;} 

.case-study-entry ul li:last-child{ margin-bottom: 0;} 

.case-study-entry ul li::before{ content: '\f058'; font-family: 'Font Awesome 6 Free'; position: absolute; top: 0; left: 0; font-size: 18px; font-weight: 900; color: var(--accent-color);} 

.holistic-support-box,

.empowering-box{ margin-top: 60px;} 

.holistic-support-content-box{ background: var(--secondary-color); border-radius: 20px; padding: 50px 40px 40px 40px;} 

.holistic-support-item-list{ display: flex; flex-wrap: wrap; /*gap: 30px;*/} 

/*.holistic-support-item{ width: calc(65% - 15px);}*/

.holistic-support-item .mission-vision-item{ border-bottom: 0px solid var(--divider-color); margin-bottom: 20px; padding-bottom: 0;} 

.empowering-item-list{ margin-top: 40px;} 

.empowering-item-list .why-choose-item{ background: var(--secondary-color); border-radius: 20px; margin-bottom: 40px; padding: 30px; border: none;} 



.empowering-item-list .why-choose-item:last-child{ margin-bottom: 0;} 

/************************************/

/***    24. Team Page css	  ***/

/************************************/ 

.page-team{ padding: 100px 0 70px;} 

/************************************/

/***  25. Team Single css	  ***/

/************************************/ 

.page-team-single{ padding: 100px 0;} 

.page-single-sidebar .team-item .team-social-icon{ bottom: 30px; opacity: 1; visibility: visible;} 

.team-skills-box,

.team-member-experience,

.team-member-about{ margin-bottom: 60px;} 

.contact-team-member{ background: var(--secondary-color); border-radius: 20px; padding: 30px 40px;} 

.contact-team-member ul{ list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 30px;} 

.contact-team-member ul li{ width: calc(50% - 15px); line-height: 1.5em;} 

.contact-team-member ul li span{ color: var(--primary-color); font-size: 20px; font-weight: 700;} 

.team-about-list{ margin-top: 40px; display: flex; flex-wrap: wrap; gap: 30px;} 

.team-about-item{ width: calc(50% - 15px);} 

.team-about-item h3{ position: relative; font-size: 20px; padding-left: 30px; margin-bottom: 10px;} 

.team-about-item h3::before{ content: '\f058'; font-family: 'Font Awesome 6 Free'; position: absolute; top: 0; left: 0; font-size: 18px; font-weight: 900; color: var(--accent-color);} 

.team-about-item p{ margin: 0;} 

.member-experience-boxes{ display: flex; flex-wrap: wrap; gap: 40px;} 

.member-experience-box{ width: 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 30px;} 

.member-experience-boxes .member-experience-box:nth-child(even){ flex-direction: row-reverse;} 

.member-experience-item{ width: calc(50% - 15px); border: 1px solid var(--divider-color); border-radius: 20px; display: flex; flex-wrap: wrap; padding: 30px;} 

.member-experience-item .icon-box{ position: relative; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; background: var(--accent-color); border-radius: 50%; margin-right: 20px; transition: all 0.4s ease-in-out;} 

.member-experience-item .icon-box::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--primary-color); border-radius: 50%; width: 100%; height: 100%; transform: scale(0); transition: all 0.4s ease-in-out;} 

.member-experience-item:hover .icon-box::before{ transform: scale(1);} 

.member-experience-item .icon-box img{ position: relative; max-width: 24px; z-index: 1;} 

.member-experience-item-content{ width: calc(100% - 70px);} 

.member-experience-item-content h3{ font-size: 20px; margin-bottom: 10px;} 

.member-experience-item-content p{ margin: 0;} 

.member-experience-image{ width: calc(50% - 15px);} 

.member-experience-image figure{ display: block; border-radius: 20px;} 

.member-experience-image figure img{ width: 100%; aspect-ratio: 1 / 0.415; object-fit: cover; border-radius: 20px;} 

.team-skills-list{ display: flex; flex-wrap: wrap; gap: 40px 30px;} 

.team-skills-list .skills-progress-bar{ width: calc(50% - 15px);} 

.skills-progress-bar .skill-data{ display: flex; justify-content: space-between; gap: 10px; margin-bottom: 20px;} 

.skills-progress-bar .skillbar .skill-progress{ position: relative; width: 100%; height: 16px; background: var(--divider-color); border-radius: 100px; overflow: hidden;} 

.skills-progress-bar .skillbar .skill-progress .count-bar{ position: absolute; top: 0; left: 0; bottom: 0; background: var(--accent-color); border-radius: 100px;} 

/************************************/

/***  26. Pricing Page css	  ***/

/************************************/ 

.page-pricing{ padding: 100px 0;} 

/************************************/

/***  27. Testimonials Page css	  ***/

/************************************/ 

.page-testimonials{ padding: 100px 0 70px;} 

.page-testimonials .testimonial-item{ background-color: var(--secondary-color); border-radius: 20px; height: calc(100% - 30px); margin-bottom: 30px; padding: 25px 25px 20px 25px;} 

.page-testimonials .testimonial-item .testimonial-content{ border-color: var(--divider-color);} 

.page-testimonials .testimonial-item .testimonial-content p{ color: var(--text-color);} 

.page-testimonials .testimonial-item .author-content h3{ color: #2ca2da;} 

.page-testimonials .testimonial-item .author-content p{ color: var(--text-color);} 

/************************************/

/***  28. Image Gallery css	  ***/

/************************************/ 

.page-gallery{ padding: 100px 0 70px;} 

.page-gallery-box .photo-gallery{ height: calc(100% - 30px); margin-bottom: 30px;} 

.page-gallery-box .photo-gallery a{ cursor: none;} 

.page-gallery-box .photo-gallery figure{ display: block; border-radius: 20px;} 

.page-gallery-box .photo-gallery img{ width: 100%; aspect-ratio: 1 / 0.829; object-fit: cover; border-radius: 20px;} 

/************************************/

/***  29. Video Gallery css	  ***/

/************************************/ 

.page-video-gallery{ padding: 100px 0 70px;} 

.video-gallery-image{ height: calc(100% - 30px); margin-bottom: 30px; overflow: hidden;} 

.video-gallery-image a{ position: relative; display: block; cursor: none;} 

.video-gallery-image a::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--primary-color); border-radius: 20px; opacity: 0%; visibility: hidden; width: 100%; height: 100%; z-index: 1; transform: scale(0); transition: all 0.4s ease-in-out;} 

.video-gallery-image:hover a::before{ opacity: 50%; visibility: visible; transform: scale(1);} 

.video-gallery-image a::after{ content: '\f04b'; font-family: 'FontAwesome'; position: absolute; top: 50%; left: 50%; right: 0; transform: translate(-50%, -50%); font-size: 20px; background: var(--accent-color); color: var(--white-color); border-radius: 50%; height: 60px; width: 60px; cursor: none; display: flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; transition: all 0.5s ease-in-out; z-index: 1;} 

.video-gallery-image:hover a::after{ opacity: 1; visibility: visible;} 

.video-gallery-image img{ width: 100%; aspect-ratio: 1 / 0.829; object-fit: cover; border-radius: 20px;} 

/************************************/

/***   30. FAQs Page css   ***/

/************************************/ 

.page-faqs{ padding: 100px 0;} 

.page-faqs .page-faq-accordion{ margin-bottom: 60px;} 

.page-faqs .page-faq-accordion:last-child{ margin-bottom: 0px;} 

/************************************/

/*** 31. Contact Us Page css	  ***/

/************************************/ 

.page-contact-us{ padding: 100px 0 50px;} 

.contact-us-content{ margin-right: 15px;} 

.opening-hours-box{ width: 100%; max-width: 420px; display: inline-block; background: var(--primary-color); border-radius: 20px; padding: 30px;} 

.opening-hours-header{ display: flex; align-items: center; margin-bottom: 30px;} 

.opening-hours-header .icon-box{ display: flex; width: 40px; height: 40px; background: var(--accent-color); border-radius: 50%; display: flex; justify-content: center; align-items: center; margin-right: 20px;} 

.opening-hours-header .icon-box img{ width: 100%; max-width: 20px;} 

.opening-hour-title h3{ font-size: 20px; color: var(--white-color);} 

.opening-hours-body ul{ list-style: none; margin: 0; padding: 0;} 

.opening-hours-body ul li{ display: flex; line-height: 1.5em; justify-content: space-between; align-items: center; gap: 10px; color: var(--white-color); margin-bottom: 15px;} 

.opening-hours-body ul li:last-child{ margin-bottom: 0;} 

.contact-form{ background-color: var(--secondary-color); border-radius: 20px; padding: 40px;} 

.contact-form form .form-control{ font-size: 16px; font-weight: 400; line-height: 1.5em; color: var(--text-color); background-color: var(--white-color); border: none; border-radius: 10px; padding: 17px 20px; outline: none; box-shadow: none;} 

.contact-form form .form-control.form-select{ padding: 17px 35px 17px 20px;} 

.contact-form form .form-control::placeholder{ color: var(--text-color);} 

.contact-form form .btn-default{ width: 100%; padding: 17px;} 

.contact-form form .btn-default::before{ display: none;} 

.contact-map-info{ padding: 50px 0 100px;} 

.google-map{ margin-right: 15px;} 

.google-map iframe{ width: 100%; height: 460px; border-radius: 20px; filter: grayscale(1); transition: all 0.4s ease-in-out;} 

.google-map iframe:hover{ filter: grayscale(0);} 

.contact-info-list{ display: flex; flex-wrap: wrap; gap: 30px;} 

.contact-info-item{ width: calc(33.33% - 20px);} 

.contact-info-item .icon-box{ position: relative; height: 50px; width: 50px; background: var(--accent-color); border-radius: 100px; display: inline-flex; justify-content: center; align-items: center; margin-bottom: 30px; transition: all 0.4s ease-in-out;} 

.contact-info-item .icon-box::before{ content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: var(--primary-color); border-radius: 50%; width: 100%; height: 100%; transform: scale(0); transition: all 0.4s ease-in-out;} 

.contact-info-item:hover .icon-box::before{ transform: scale(1);} 

.contact-info-item .icon-box img{ position: relative; width: 100%; max-width: 24px; z-index: 1;} 

.contact-item-content h3{ font-size: 20px; margin-bottom: 10px;} 

.contact-item-content p{ margin-bottom: 0;} 

.contact-item-content p a{ color: inherit; transition: all 0.3s ease-in-out;} 

.contact-item-content p a:hover{ color: var(--accent-color);} 

/************************************/

/***   32. Book Appointment css	  ***/

/************************************/ 

.page-book-appointment{ padding: 100px 0;} 

.book-appointment-content{ margin-right: 20px;} 

.appointment-info-body{ display: flex; flex-wrap: wrap; gap: 40px 30px;} 

.appointment-info-body .contact-info-item{ width: calc(50% - 15px); display: flex;} 

.appointment-info-body .contact-info-item .icon-box{ margin: 0 20px 0 0;} 

.appointment-info-body .contact-info-item .contact-item-content{ width: calc(100% - 70px);} 

.appointment-info-body .contact-info-item.location-item{ width: 100%; border-top: 1px solid var(--divider-color); padding-top: 40px;} 

/************************************/

/*** 33. 404 Error Page css	  ***/

/************************************/ 

.error-page{ padding: 100px 0;} 

.error-page-image{ text-align: center; margin-bottom: 30px;} 

.error-page-image img{ width: 100%; max-width: 45%;} 

.error-page-content{ text-align: center;} 

.error-page-content .section-title{ margin-bottom: 15px;} 

/************************************/

/***      34. Responsive css      ***/

/************************************/ 


.why-guardian-angel-hc-img{ position: absolute; right: 2%;} 

.gray-wrapp { background: var(--secondary-color); padding: 50px 0;}



@media only screen and (max-width: 1820px){  .bg-section{ max-width: calc(100% - 40px); margin: 0 20px; }

 .hero-content-box .section-title{ margin-right: 0; }

 .main-footer{ margin-bottom: 20px; }

} 

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

 .hero.hero-bg-image .container-fluid{ padding: 0 15px; }	

} 

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

 .main-menu ul li a{ padding: 14px 12px !important; }

 .hero-content, .hero-image{ width: 100%; }

 .hero-image img{ aspect-ratio: 1 / 0.5; }

 .hero-benefit-item-content h3{ font-size: 18px; }

 .main-menu ul li{ margin: 0; }

h4.font-2 { font-size: 26px;}

} 

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

.btn-default{ padding: 14px 35px 14px 15px; }  

.btn-default::before{ right: 15px; width: 10px; height: 10px; }   

.slicknav_nav li, .slicknav_nav ul{     display: block; }

 .responsive-menu, .navbar-toggle{ display: block; }  .header-btn{ display: none; }

 .bg-section{ max-width: 100%; border-radius: 0; margin: 0; }

 .bg-section .container-fluid{ padding: 0 15px; }  .section-row{ margin-bottom: 40px; }

 .section-row .section-title.section-title-center{ max-width: 100%; }

 .section-content-btn .section-btn{ margin-top: 20px; }  .section-title{ margin-bottom: 30px; }

 .section-title h3{ margin-bottom: 10px; }

 .section-title h1{ font-size: 42px; }

 .section-title h2{ font-size: 36px; }

 .section-title p{ margin-top: 10px; }

 .section-title-content{     margin-top: 10px; }

 .section-btn{     text-align: left;     margin-top: 15px; }

 .hero.hero-bg-image{ min-height: auto; padding: 160px 0 60px; }

 .hero.hero-bg-image::before{ background: linear-gradient(180deg, rgba(38, 80, 94, 0) 1.1%, rgba(39, 58, 41, 0.9) 30.8%); }

 .hero.hero-bg-image .hero-content .section-title p{ font-size: 16px; }

 .hero.hero-bg-image .hero-content-circle{ display: none; }

 .hero-content-box{ padding: 30px 20px; }

 .working-hours-item{ padding: 20px; }

 .working-hours-header{ margin-bottom: 20px; padding-bottom: 20px; }

 .hero-benefit-list{ gap: 20px; }

 .hero-benefit-item{ width: calc(50% - 10px); }

 .hero-benefit-item .icon-box{ margin-right: 15px; }

 .hero-benefit-item-content{ width: calc(100% - 65px); }

 .about-us{ padding: 50px 0; }

 .about-us-images{width: 100%;max-width: 90%;margin:0 0 0 0;position: relative;}

 .about-image-1{padding-right: 00;position: absolute;z-index: 1;right: 0;margin: 0 0 0 auto;max-width:70%;top: 40%;}

 .about-image-2{max-width: 190px;position: relative;top: 0;left: 0;margin: 0 0 0;}

 .about-us-circle{ margin-right: 20px; }

 .about-us-circle a img{ max-width: 100px; }

 .about-body-content{ width: calc(100% - 0px); }

 .about-us-list{ margin-top: 20px; padding-top: 20px; }

 .about-us-list ul{ gap: 10px 30px; }

 .about-us-list ul li{ padding-left: 25px; }

 .about-us-list ul li::before{ font-size: 16px; }

 .our-services{ padding: 50px 0; }

 .service-item{ padding: 30px 25px; }

 .service-body .icon-box{ margin-bottom: 20px; }

 .service-content{ margin-bottom: 15px; padding-bottom: 15px; }

 .service-cta-content{ right: 20px; bottom: 20px; left: 20px; padding: 15px 20px; }  .service-cta-content h3{ margin-bottom: 20px; }

 .section-footer-text{ margin-top: 10px; }

 .section-footer-text p span{ font-size: 14px; padding: 4px 8px; margin-right: 5px; }

 .why-choose-us{ padding: 50px 0; }

 .why-choose-content{ margin-bottom: 30px; }

 .why-choose-item{ margin-bottom: 20px; padding-bottom: 20px; }

 .why-choose-images{ max-width: 75%; margin: 0 auto 55px; }

 .why-choose-img-2{ max-width: 250px; top: 130px; }

 .contact-us-circle a img{ max-width: 110px; }

 .how-it-work{ padding: 50px 0; }

 .work-steps-item{ padding: 30px; }

 .work-step-content h3{ margin-bottom: 15px; padding-bottom: 15px; }

 .our-facts{ padding: 50px 0; }

 .our-fact-box, .fact-box-1, .fact-box-3, .fact-image-content{ gap: 20px; }

 .fact-box-1{ width: 100%; flex-direction: inherit; }

 .fact-box-2, .fact-box-3{ width: calc(50% - 10px); }

 .fact-item{ padding: 30px; }

 .fact-item.fact-dark-box{ padding: 20px 15px; }

 .fact-item-content h2{ font-size: 36px; margin-bottom: 10px; }

 .fact-item-content p{ font-size: 14px; }

 .fact-box-1 .fact-item, .fact-box-1 .fact-image{ width: calc(50% - 10px); }

 .fact-box-1 .fact-image img, .fact-box-1 .fact-image figure{ height: 100%; }

 .fact-box-1 .fact-image figure img{ aspect-ratio: 1 / 0.61; }

 .fact-image-content .fact-item, .fact-image-content .fact-image{ width: calc(50% - 10px); }

 .cta-box{ padding: 50px 0 0; }

 .cta-box-btn{ margin-top: 30px; }

 .cta-box-image{ max-width: 100%; }

 .our-pricing{ padding: 50px 0; }

 .pricing-box{ padding: 30px; }

 .pricing-price{ padding: 15px; margin-bottom: 20px; }

 .pricing-price h2{ font-size: 26px; }

 .pricing-body, .pricing-body h3{ margin-bottom: 20px; }

 .pricing-body ul li{ margin-bottom: 10px; padding-left: 25px; }

 .pricing-body ul li::before{ font-size: 16px; }

 .pricing-benefit-list{     margin-top: 5px; }

 .pricing-benefit-list ul{     gap: 15px 30px; }

 .our-feature{ padding: 50px 0; }

 .feature-content{ margin-bottom: 15px; }


 .feature-item{ margin-bottom: 20px; padding-bottom: 20px; }

 .our-feature-images{ width: 100%; max-width: 85%; margin: 0 auto; }

 .our-faqs{ padding: 50px 0; }

 .faqs-content{ position: initial; margin: 0 0 30px 0; }

 .faq-accordion .accordion-header .accordion-button{ padding: 0px 35px 15px 0px; }

 .faq-accordion .accordion-item .accordion-body{ padding: 15px 0 0 0; }

 .faq-accordion .accordion-item .accordion-button::after, .faq-accordion .accordion-item .accordion-button.collapsed::after{ width: 24px; height: 24px; font-size: 12px; }

 .our-testimonials{ padding: 50px 0; }

 .testimonials-content{ margin-bottom: 30px; }

 .testimonials-counter-box h2{ width: 100px; font-size: 36px; }

 .testimonials-counter-box p{ width: calc(100% - 115px); }

 .testimonial-slider{ padding: 30px; }

 .testimonial-header{ margin-bottom: 20px; }

 .testimonial-content{ margin-bottom: 20px; padding-bottom: 20px; }

 .company-supports-slider{ padding-top: 30px; margin-top: 30px; }

 .our-blog{ padding: 50px 0 20px; }

 .post-featured-image{ margin-bottom: 15px; }

 .main-footer{ padding: 50px 0 0; margin-bottom: 0; }

 .about-footer{ margin-bottom: 30px; }

 .footer-logo{ margin-bottom: 15px; }

 .footer-social-links{ margin-top: 20px; }

 .footer-links{ margin-bottom: 30px; }

 .footer-links h3{ margin-bottom: 15px; }

 .footer-links ul li{ margin-bottom: 15px; }

 .footer-copyright{ margin-top: 0; padding: 30px 0; }

 .page-header{ padding: 80px 0; }

 .page-header-box h1{ font-size: 42px; }

 .page-header-box ol li.breadcrumb-item{ font-size: 16px; }

 .our-approach{ padding: 50px 0; }

 .approach-content{ margin-bottom: 30px; }

 .approach-body-item{ margin-bottom: 20px; padding-bottom: 20px; }

 .approach-body-item .icon-box{ width: 50px; height: 50px; margin-right: 15px; }

 .approach-body-item .icon-box img{ max-width: 24px; }

 .approach-body-item-content{ width: calc(100% - 65px); }

 .approach-result-box{ right: 20px; bottom: 20px; left: 20px; }

 .approach-result-header{ margin-bottom: 15px; }

 .approach-result-counter h2{ font-size: 36px; }

 .mission-vision-item{ margin-bottom: 30px; padding-bottom: 15px; }

 .mission-vision-item .icon-box{ margin-bottom: 20px; }

 .mission-vision-item-content h3{ margin-bottom: 10px; }

 .our-care{ padding: 50px 0; }

 .care-images{ width: 100%; max-width: 75%; margin: 0 auto 30px; }

 .customer-review-box{ max-width: 285px; padding: 20px; }

 .care-body-item{ padding: 20px; }

 .care-body-header{ margin-bottom: 15px; }

 .our-care-btn{ margin-top: 30px; }  .family-trust-us{ padding: 50px 0; }

 .family-trust-content{ margin-bottom: 30px; }

 .family-trust-item .icon-box{ width: 50px; height: 50px; margin-right: 15px; }

 .family-trust-item .icon-box img{ max-width: 24px; }

 .family-trust-item-title{ width: calc(100% - 65px); }

 .family-trust-item-title h3{ font-size: 18px; }

 .family-trust-body-item h3{ margin-bottom: 10px; }

 .family-trust-image figure, .family-trust-image figure img{ height: auto; }	

 .family-trust-image figure img{ aspect-ratio: 1 / 0.65; }

 .family-trust-image .contact-us-circle{ top: -15px; left: 80px; bottom: auto; right: auto; transform: translate(0, -50%); }

 .our-team{ padding: 50px 0 20px; }

 .team-image{ margin-bottom: 15px; }

 .team-image img{ aspect-ratio: 1 / 1.1; }

 .page-services{ padding: 50px 0 20px; }

 .page-service-single{ padding: 50px 0; }

 .page-single-sidebar{ position: initial; margin: 0 0 30px; }

 .page-catagory-list{ margin-bottom: 30px; }

 .page-catagory-list h3{ padding: 16px 15px; }

 .page-catagory-list ul{ padding: 20px; }

 .page-catagory-list ul li{ margin-bottom: 15px; padding-bottom: 15px; }

 .page-catagory-list ul li a{ padding-right: 25px; }

 .page-catagory-list ul li a::before{ width: 12px; height: 12px; }

 .sidebar-cta-image img{ aspect-ratio: 1 / 0.45; }

 .sidebar-cta-content{ padding: 20px; }

 .sidebar-cta-contact a{ padding: 15px 20px; }

 .sidebar-cta-contact a img{ max-width: 22px; margin-right: 10px; }

 .page-single-image{ margin-bottom: 30px; }

 .service-entry{ margin-bottom: 40px; padding-top: 15px; }

 .our-services.service-entry { padding: 0;}


 .service-entry h2{ font-size: 36px; margin-bottom: 15px; }

 .service-entry ul li{ padding-left: 25px; margin-bottom: 10px; }

 .service-entry ul li::before{ font-size: 16px; }

 .compassionate-box, .service-support-box, .personalized-step-box{ margin-top: 40px; }

 .compassionate-body-box{ margin-top: 30px; }

 .compassionate-item-list .approach-body-item .approach-body-item-content h3{ font-size: 18px; }

 .compassionate-content-box{ padding: 20px; }

 .compassionate-content-box .icon-box{ margin-bottom: 30px; }

 .compassionate-content-box .icon-box img{ max-width: 40px; }

 .compassionate-content h3{ margin-bottom: 10px; }

 .service-support-body{ margin-top: 30px; }

 .service-support-item{ padding: 20px; }

 .service-support-image-video{ margin-top: 30px; }

 .personalized-step-item-list{ margin-top: 30px; }

 .personalized-step-info-box{ padding: 30px; }

 .personalized-step-header{ margin-bottom: 30px; padding-bottom: 30px; }

 .personalized-step-title h2, .personalized-step-body h2{ margin-bottom: 0; }

 .page-service{ padding: 50px 0; }

 .page-blog{ padding: 50px 0; }

 .page-blog .post-item{ height: calc(100% - 30px); margin-bottom: 30px; }

 .page-pagination{ margin-top: 10px; }

 .page-single-post{ padding: 50px 0; }  

 .post-image{ margin-bottom: 20px; }  

 .post-entry h1, .post-entry h2, .post-entry h3, .post-entry h4, .post-entry h5, .post-entry h6{     margin: 0 0 0.42em; }  

 .post-entry h2{ font-size: 36px; }  

 .post-entry p{
 	margin-bottom: 15px; }  .post-entry ol li, .post-entry ul li{     margin-bottom: 10px; }  .post-entry blockquote{     background-position: 20px 20px;     background-size: 40px;     padding: 20px 20px 20px 70px;     margin-bottom: 20px; }  .post-entry blockquote p{     font-size: 18px; }  .post-tags{     margin-bottom: 20px; }

 .tag-links{ gap: 10px; }  .post-tags .tag-links a{     padding: 10px 15px; }  .post-social-sharing ul{     text-align: left; }

 .page-case-study{ padding: 50px 0 20px; }

 .case-study-item{ height: calc(100% - 30px); margin-bottom: 30px; }

 .case-study-image{ margin-bottom: 15px; }

 .page-case-study-single{ padding: 50px 0 20px; }

 .case-study-entry{ margin-bottom: 40px; }

 .case-study-entry p{ margin-bottom: 15px; }

 .case-study-entry h2{ font-size: 36px; margin-bottom: 15px; }

 .case-study-entry ul li{ padding-left: 25px; margin-bottom: 10px; }

 .case-study-entry ul li::before{ font-size: 16px; }

 .holistic-support-box, .empowering-box{ margin-top: 40px; }

 .holistic-support-content-box{ padding: 50px 5px 20px 5px; margin: 0px 0; }

 .empowering-item-list{ margin-top: 30px; }

 .empowering-item-list .why-choose-item{ padding: 20px; margin-bottom: 30px; }

 .page-team{ padding: 50px 0 20px; }

 .page-team-single{ padding: 50px 0; }

 .page-single-sidebar .team-item .team-image img{     aspect-ratio: 1 / 0.7; }

 .team-skills-box, .team-member-experience, .team-member-about{ margin-bottom: 40px; }

 .contact-team-member{ border-radius: 14px; padding: 20px 30px; }

 .team-about-list{ margin-top: 30px; gap: 20px; }

 .team-about-item{ width: calc(50% - 10px); }

 .member-experience-boxes{ gap: 30px; }

 .member-experience-item{ padding: 20px; }

 .team-skills-list{     gap: 30px; }

 .skills-progress-bar .skill-data{ margin-bottom: 15px; }

 .page-pricing{ padding: 50px 0; }

 .page-testimonials{ padding: 50px 0 20px; }

 .page-testimonials .testimonial-item{ padding: 20px; }

 .page-gallery{ padding: 50px 0 20px; }

 .page-video-gallery{ padding: 50px 0 20px; }

 .page-faqs{ padding: 50px 0; }

 .page-faqs .page-faq-accordion{ margin-bottom: 40px; }

 .page-contact-us{ padding: 50px 0 25px; }

 .contact-us-content{ margin: 0 0 30px; }

 .opening-hours-box{ padding: 20px; }

 .opening-hours-header{ margin-bottom: 20px; }

 .opening-hours-body ul li{ margin-bottom: 10px; }

 .contact-form{ padding: 30px; }

 .contact-form form .form-control{ padding: 12px 15px; }

 .contact-form form .form-control.form-select{ padding: 12px 35px 12px 15px; }

 .contact-map-info{ padding: 25px 0 50px; }

 .google-map{ margin: 0; }

 .contact-info-content{ margin-bottom: 30px; }

 .contact-info-item .icon-box{ margin-bottom: 20px; }

 .page-book-appointment{ padding: 50px 0; }

 .book-appointment-content{ margin: 0 0 30px; }

 .appointment-info-body{ gap: 30px; }

 .appointment-info-body .contact-info-item.location-item{ padding-top: 30px; }

 .error-page{ padding: 50px 0; }  .error-page-image{ margin-bottom: 20px; }

 .error-page-image img{ max-width: 80%; }


.our-services.service-entry .row.align-items-center { align-items: flex-start !important;  }

.dconsul-col1 { padding-bottom: 30px;}

 

.about-us-images.single-box { max-width: 100%; margin: 0 auto;}

.about-us-images.single-box .about-image-1 { position: relative; max-width: 100%; top: inherit; display: block;}

.about-us-images.single-box .about-image-1 { margin: 0 0 30px;}


.service-entry ul li:last-child { margin-bottom: 0; padding-bottom: 0 !important;}

.page-single-sidebar .page-catagory-list.case-study-catagery-list {  margin-bottom: 10px;}

.page-single-sidebar { margin-bottom: 45px;}

.our-services.service-entry { margin-bottom:0; }

} 



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

 .section-row{ margin-bottom: 30px; }

 .section-title h3{ font-size: 16px; }

 .section-title h1{ font-size: 28px; }

 .section-title h2{ font-size: 26px; }

 .hero-section{ gap: 20px; }

 .hero-content-box{ padding: 30px 15px; margin-bottom: 20px; }

 .hero-content-circle p{ width: 100%; font-size: 16px; margin-bottom: 15px; }

 .book-appointment-circle img{ max-width: 100px; }

 .working-hour-image, .working-hours-item{ width: 100%; }

 .working-hours-box{ gap: 20px; }

 .working-hour-image figure, .working-hour-image img{ height: auto; }

 .working-hour-image img, .hero-image img{ aspect-ratio: 1 / 0.6; }

 .hero-benefit-list{ margin-top: 20px; }

 .hero-benefit-item{ width: 100%; }  

 .about-us-images{ 	max-width: 100%; margin: 0 0 25px 0;}

 .about-image-1{ position: relative; top: inherit; max-width: 65%; margin: 0 0 60px;}

 .about-image-2{max-width: 50%;position: absolute;right: 0;z-index: 1;margin: 0 0 0 0;left: inherit;bottom: 0;top: inherit;}

 .about-body-content p{ font-size: 14px; }

 .about-us-list ul li{ width: 100%; }

 .service-item{     padding: 20px; }

 .service-content h3, .service-cta-content h3{ font-size: 18px; }

 .service-cta-image, .service-cta-image figure, .service-cta-image img{ height: auto; }

 .why-choose-item .icon-box{ width: 50px; height: 50px; margin-right: 10px; }

 .why-choose-item .icon-box img{ max-width: 24px; }  .why-choose-item-content{ width: calc(100% - 60px); }

 .why-choose-item-content h3{ font-size: 18px; }

 .why-choose-images{ max-width: 100%; margin: 0 0 55px; }

 .why-choose-img-1{ margin-left: 80px; }

 .why-choose-img-2{ max-width: 170px;     top: 90px; left: 10px; }

 .why-choose-img-2 img{ border-width: 4px; }

 .contact-us-circle{ right: 30px; }

 .contact-us-circle a img{     max-width: 90px; }

 .work-steps-item{ padding: 20px; }

 .work-step-content h3{ font-size: 18px; }  .fact-item{ padding: 20px; }  .fact-item .icon-box img{ max-width: 40px; }

 .fact-item-content h2{ font-size: 26px; margin-bottom: 5px; }  .fact-box-2, .fact-box-3{     width: 100%; }

 .fact-box-2 .fact-image, .fact-box-2 .fact-image figure, .fact-box-2 .fact-image figure img{ height: auto; }

 .fact-box-2 .fact-image figure img{ aspect-ratio: 1 / 0.8; }

 .cta-box .section-row{ margin-bottom: 30px; }

 .cta-box-btn{     margin-top: 20px; }

 .pricing-box{     padding: 20px; }

 .pricing-header h3{ font-size: 18px; }  .pricing-price{ padding: 12px 15px; border-radius: 12px; }

 .pricing-price h2{ font-size: 22px; }

 .pricing-body h3{ font-size: 18px; margin-bottom: 15px; }

 .pricing-benefit-list ul{ gap: 10px 15px; }

 .pricing-benefit-list ul li{ font-size: 14px; }

 .pricing-benefit-list ul li img{ max-width: 16px; margin-right: 5px; }

 .feature-item{ gap: 10px; }

 .feature-item-header{ gap: 15px; }

 .feature-item-header, .feature-item-content{ width: 100%; }

 .feature-item-header .icon-box{ width: 50px; height: 50px; }

 .feature-item-header .icon-box img{ max-width: 24px; }

 .feature-item-title{ width: calc(100% - 65px); }

 .feature-item-title h3{ font-size: 18px; }

 .our-feature-images{ max-width: 100%; gap: 20px; }

 .feature-image-box-1, .feature-image-box-2{ width: calc(50% - 10px); gap: 20px; }

 .year-experience-circle img{ max-width: 100px; }  .year-experience-counter{ width: 60px; height: 60px; }

 .year-experience-counter h2{ font-size: 20px; }

 .faq-accordion .accordion-item{ margin-bottom: 15px; }

 .faq-accordion .accordion-header .accordion-button{ font-size: 16px; }

 .faq-accordion .accordion-item .accordion-body p{ font-size: 14px; }

 .testimonials-counter-box{ max-width: 100%; }

 .testimonials-counter-box h2{     width: 80px;     font-size: 26px; }

 .testimonials-counter-box p{     width: calc(100% - 95px); font-size: 14px; }

 .testimonial-slider{     padding: 20px; }

 .author-content h3{ font-size: 18px; }

 .testimonial-btn{ justify-content: center; margin-top: 20px; }

 .testimonial-slider .testimonial-button-next{ margin-left: 10px; }

 .post-item-content h2{ font-size: 18px; }

 .footer-contact-item{ margin-bottom: 20px; }

 .footer-contact-item h3{ margin-bottom: 10px; }

 .footer-links h3{ font-size: 18px; }

 .footer-links ul li{     margin-bottom: 12px; }

 .footer-copyright{     justify-content: center;     padding: 15px 0; }  .page-header-box h1{ font-size: 28px; }

 .approach-body-item-content h3{ font-size: 18px; }

 .approach-image-content{ margin-bottom: 30px; }

 .approach-image img{ aspect-ratio: 1 / 0.99; }

 .approach-result-box{ right: 15px; bottom: 15px; left: 15px; }

 .approach-result-header .icon-box img{ max-width: 40px; }

 .approach-result-counter h2{ font-size: 26px; }

 .mission-vision-item{ margin-bottom: 18px; padding-bottom: 6px; }

 .mission-vision-item-content h3{ font-size: 18px; }

 .care-images{ max-width: 100%; }

 .customer-review-box{     max-width: 180px;     padding: 10px; }

 .customer-review-box .review-rating-star, .customer-review-content{ margin-bottom: 5px; }

 .customer-review-box .review-rating-star i{ font-size: 14px; }

 .customer-review-content p{ font-size: 12px; }

 .customer-review-box .review-images .review-image img{ max-width: 35px; }

 .care-body-list{ gap: 20px; }

 .care-body-item{ width: 100%; }

 .care-body-title h3{ font-size: 18px; }

 .family-trust-item{ width: 100%; }

 .family-trust-body{ flex-direction: column-reverse; }

 .family-trust-body-image, .family-trust-body-content{ width: 100%; }

 .family-trust-body-item{ margin-bottom: 15px; padding-bottom: 15px; }

 .family-trust-body-item h3{ font-size: 18px; }

 .family-trust-image .contact-us-circle{ left: 50%;     transform: translate(-50%, -50%); }

 .team-image img{     aspect-ratio: 1 / 1.1; }

 .page-catagory-list h3{ font-size: 18px; }

 .sidebar-cta-image img{ aspect-ratio: 1 / 0.6; }

 .cta-item-content h3{ font-size: 18px; }

 .page-single-image{ margin-bottom: 20px; }

 .page-single-image img{ aspect-ratio: 1 / 0.665; }

 .service-entry h2{ font-size: 26px; }

 .compassionate-item-list, .compassionate-content-box{ width: 100%; }

 .compassionate-content-box .icon-box{     margin-bottom: 20px; }

 .compassionate-content h3{ font-size: 18px; }

 .service-support-list, .service-support-item-list{ width: 100%; }

 .service-support-item-list{ gap: 20px; }

 .service-support-item{ width: calc(50% - 10px);     text-align: center;     padding: 12px; }

 .service-support-item .icon-box{ margin: 0 auto 10px; }

 .service-support-item-content{ width: 100%; }

 .service-support-item-content h3{ font-size: 18px;     margin-bottom: 5px; }

 .service-support-image-video{ gap: 20px; }

 .service-support-image, .service-support-video{ width: 100%; }

 .personalized-step-item{ gap: 20px; margin-bottom: 20px; }

 .personalized-step-info-box, .personalized-step-image{ width: 100%; }

 .personalized-step-info-box{ padding: 20px 15px; }

 .personalized-step-header{ gap: 10px;     margin-bottom: 15px;     padding-bottom: 15px; }

 .personalized-step-title{ width: calc(100% - 50px); }

 .personalized-step-btn a{ width: 40px; height: 40px; }

 .personalized-step-image figure, .personalized-step-image img{ height: auto; }

 .post-single-meta ol li{     font-size: 16px; }  .post-single-meta ol li i{     font-size: 16px; }  .post-image img{     aspect-ratio: 1 / 0.7; }  .post-entry blockquote{     background-position: 15px 15px;     padding: 60px 15px 15px 15px; }  .post-entry blockquote p{     font-size: 16px; }  .post-entry h2{     font-size: 26px; }

 .tag-links{ font-size: 18px; }

 .case-study-content h2{ font-size: 18px; }

 .case-study-catagery-list ul li{ font-size: 14px; }

 .case-study-entry h2{ font-size: 26px; }

 .holistic-support-item{ width: 100%; margin-bottom: 25px; }

 .holistic-support-item .mission-vision-item{ margin-bottom: 10px; padding-bottom: 10px; }

 .holistic-support-item .mission-vision-item:last-child { margin-bottom: 0; padding-bottom: 0;}


.icu-col1 img { width: fit-content; margin: 0 auto; display: block; max-width: 100%;}



h4.font-2 { font-size: 22px !important; line-height: 26px !important;}


 .empowering-item-list .why-choose-item{ padding: 15px; }

 .empowering-item-list .why-choose-item p{ font-size: 14px; }

 .page-single-sidebar .team-item .team-image img{     aspect-ratio: 1 / 1.1; }

 .page-single-sidebar .team-item .team-social-icon{ bottom: 20px; }

 .contact-team-member{ padding: 15px; }

 .contact-team-member ul{ gap: 15px; }

 .contact-team-member ul li{ width: 100%; }

 .contact-team-member ul li span{ font-size: 18px; }

 .team-about-item{     width: 100%; }

 .team-about-item h3{ font-size: 18px; padding-left: 25px; }

 .team-about-item h3::before{ font-size: 16px; top: 2px; }

 .member-experience-boxes, .member-experience-box{ gap: 20px; }

 .member-experience-image, .member-experience-item{ width: 100%; }

 .member-experience-item .icon-box{ margin-right: 15px; }

 .member-experience-item-content{ width: calc(100% - 65px); }

 .member-experience-item-content h3{ font-size: 18px; }

 .team-skills-list{     gap: 20px; }

 .team-skills-list .skills-progress-bar{ width: 100%; }

 .skills-progress-bar .skillbar .skill-progress{ height: 12px; }

 .opening-hours-box{ max-width: 100%; }

 .opening-hour-title h3{ font-size: 18px; }

 .contact-form{ padding: 30px 20px; }

 .contact-info-list{ gap: 20px; }

 .contact-info-item{ width: 100%; display: flex; }

 .contact-info-item .icon-box{ margin: 0 15px 0 0; }

 .contact-item-content{ width: calc(100% - 65px); }

 .contact-item-content h3{ font-size: 18px; }

 .google-map iframe{ height: 350px; }

 .appointment-info-body{ gap: 20px; }

 .appointment-info-body .contact-info-item{ width: 100%; }

 .appointment-info-body .contact-info-item.location-item{ padding: 0; border: none; }


.our-services.service-entry .page-faqs-catagery { margin-top: 45px;}

.our-services.service-entry .holistic-support-item-list.order-row .holistic-support-item { order: -1;}


.gray-wrapp .page-single-sidebar.compassionate-content-box.wow.fadeInUp { margin: 0;}


} 


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

h4.font-2 { font-size: 20px !important;}


}


