@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Cormorant:ital,wght@0,300..700;1,300..700&display=swap');



a:focus {

    outline: none;

}



img {

    max-width: 100%;

    height: auto;

}



.page-default-btn {

    display: none;

}



.show-mobile {

    display: none;

}



body {

    background-color: #fff !important;

}



li,

p,

a {

    font-family: 'Montserrat', sans-serif;

    text-decoration: none;

}



p a {

    color: #2b2f6c;

}



a:hover {

    color: #2b2f6c;

}



h1,

h2,

h3,

h4,

h5,

h6 {

    font-family: 'Cormorant', serif;

}



ul,

ol {

    margin: 0;

    padding: 0;

}



li {

    list-style: none;

}



body p {

    font-size: 18px;

    color: #5E5F60;

    line-height: 1.7;

}



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

    body p {

        font-size: 16px;

    }

}



.container {

    width: 100%;

    max-width: 1400px;

}



section {

    width: 100%;

    display: inline-block;

    vertical-align: top;

}



a:hover {

    text-decoration: none !important;

}



p:last-of-type {

    margin-bottom: 0;

}



body .container,

body .container-fluid {

    padding: 0 30px;

}



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



    body .container,

    body .grid-container {

        max-width: 100%;

        width: 100%;

    }

}



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



    body .container,

    body .grid-container {

        max-width: 100%;

        width: 100%;

    }

}



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



    body .container,

    body .grid-container {

        max-width: 920px;

        width: 100%;

    }

}



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



    body .container,

    body .grid-container {

        max-width: 960px;

        width: 100%;

    }

}



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



    body .container,

    body .grid-container {

        max-width: 1140px;

        width: 100%;

    }

}



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



    body .container,

    body .grid-container {

        max-width: 1210px;

        width: 100%;

    }

}



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



    body .container,

    body .grid-container {

        max-width: 1400px;

        width: 100%;

    }

}



.section_padding {

    padding: 100px 0;

}



.section_padding_small {

    padding: 60px 0;

}



.section_margin {

    margin: 100px 0;

}



.left-side-content {

    padding-right: 36px;

}



.right-side-content {

    padding-left: 36px;

}



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

    .section_padding {

        padding: 90px 0;

    }



    .section_margin {

        margin: 90px 0;

    }



    .left-side-content {

        padding-right: 30px;

    }



    .right-side-content {

        padding-left: 30px;

    }

}



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

    .section_padding {

        padding: 80px 0;

    }



    .section_margin {

        margin: 80px 0;

    }



    .left-side-content {

        padding-right: 20px;

    }



    .right-side-content {

        padding-left: 20px;

    }

}



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

    .section_padding {

        padding: 70px 0;

    }



    .section_margin {

        margin: 70px 0;

    }



    .left-side-content {

        padding-right: 10px;

    }



    .right-side-content {

        padding-left: 10px;

    }

}



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

    .section_padding {

        padding: 60px 0;

    }



    .section_padding_small {

        padding: 50px 0;

    }



    .section_margin {

        margin: 60px 0;

    }



    .left-side-content {

        padding-right: 0px;

    }



    .right-side-content {

        padding-left: 0px;

    }

}



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

    .section_padding {

        padding: 50px 0;

    }



    .section_padding_small {

        padding: 40px 0;

    }



    .section_margin {

        margin: 50px 0;

    }

}



/*=============================================

= Header  CSS

=============================================*/

header,

footer {

    padding: 10px 0;

    background: #2b2f6c;

}



footer {

    background: #2b2f6c;

}



header .row,

footer .row {

    align-items: center;

}



.logo img {

    width: 100%;

    max-width: 300px;
}



.lp-btn {

    font-size: 18px;

    font-weight: 600;

    line-height: 1.3;

    color: #ffffff;

    background: #15dbcd;

    border-radius: 8px;

    padding: 11px 35px;

    outline: none;

    border: 2px solid transparent;

    text-decoration: none;

    display: inline-block;

    text-align: center;

    /* transition: all 0.4s; */

}

.dr-content .lp-btn img {
    filter: invert(55%) sepia(97%) saturate(369%) hue-rotate(127deg) brightness(101%) contrast(97%);
}


.lp-btn img {

    margin-left: 4px;

    filter: brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(2461%) hue-rotate(333deg) brightness(118%) contrast(98%);

}



.lp-btn:hover img {

    filter: invert(55%) sepia(97%) saturate(369%) hue-rotate(127deg) brightness(101%) contrast(97%);

}



.lp-btn:hover {

    border: 2px solid #15dbcd;

    background: transparent;

    color: #15dbcd;

}



.lp-btn.white-btn {

    color: #15dbcd;

    background: #fff;

}



/* .lp-btn.white-btn img {

    filter: unset;

} */



.lp-btn.white-btn:hover {

    border-color: #fff;

    color: #fff;

    background-color: transparent;

    filter: brightness(0) saturate(100%) invert(100%) sepia(1%) saturate(2461%) hue-rotate(333deg) brightness(118%) contrast(98%);

}



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



    header,

    footer {

        padding: 20px 0;

    }



    .lp-btn {

        font-size: 16px;

        padding: 10px 25px;

    }

}



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

    header {

        padding: 15px 0;

    }



    .footer-row {

        row-gap: 15px;

    }



    .footer__branding {

        text-align: center;

    }



    .lp-btn {

        padding: 10px 20px;

        width: 100%;

    }



    .lp-btn span {

        display: none !important;

    }



    .logo img {

        width: 100%;

        max-width: 120px;

    }

}



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



    .header-button a,

    .footer-button a {

        font-size: 14px;

    }

}



/*=============================================

= Header  CSS

=============================================*/

/*=============================================

= Banner Section  CSS

=============================================*/

.lp_banner_section {

    background-size: cover;

    background-repeat: no-repeat;

    background-position: 80%;

    min-height: 750px;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    -webkit-box-align: center;

    -ms-flex-align: center;

    align-items: center;

    position: relative;

}



.banner-res-image {

    width: 100%;

    height: 100%;

    position: absolute;

    overflow: hidden;

    inset: 0;

}



.banner-res-image img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.banner-res-image iframe {

    position: absolute;

    top: 40%;

    left: 0;

    width: 100%;

    height: 100%;

    transform: translateY(-50%) scale(1.5);

}



.banner_title_inner {

    position: relative;

    z-index: 12;

    max-width: 650px;

    color: #ffffff;

}



.banner_title_inner h1 {

    font-size: 68px;

    font-weight: 700;

    line-height: 1.2;

    margin-bottom: 18px;

}



.banner_title_inner p {

    font-size: 24px;

    font-weight: 500;

    line-height: 1.6;

    color: #fff

}



.banner-btn {

    position: relative;

}



@media only screen and (max-width: 1200px) and (min-width: 1880px) {

    .lp_banner_section {

        min-height: 550px;

    }

}



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

    .lp_banner_section {

        min-height: 550px;

    }



    .banner-res-image iframe {

        transform: translateY(-50%) scale(2);

    }

}



@media only screen and (min-width: 768px) and (max-width: 1100px) {

    .section_title_inner.banner_title_inner {

        max-width: 450px;

    }

}



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

    .banner-res-image:after {

        position: absolute;

        content: "";

        inset: 0;

        background-color: rgba(0, 0, 0, .5);

        background: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);

        opacity: 0.9;

    }

}



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

    .banner_title_inner h1 {

        font-size: 60px;

    }

}



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

    .banner_title_inner h1 {

        font-size: 55px;

    }

}



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

    .banner_title_inner h1 {

        font-size: 50px;

    }



    .banner_title_inner p {

        font-size: 22px;

    }

}



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

    .lp_banner_section {

        min-height: 480px;

    }



    .banner_title_inner {

        position: relative;

        z-index: 11;

    }



    .banner_title_inner h1 {

        font-size: 45px;

    }



    .banner_title_inner p {

        font-size: 20px;

    }

}



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

    .lp_banner_section {

        background-image: none;

        background-color: #0E0E10;

    }



    .banner_title_inner {

        padding-top: 30px;

    }



    .banner_title_inner h1 {

        font-size: 40px;

    }



    .banner_title_inner p {

        font-size: 18px;

    }



    .banner-btn {

        padding-bottom: 50px;

    }



    .banner-res-image {

        position: unset;

    }



    .banner-res-image div iframe {

        top: 0;

        transform: none;

    }

}



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

    .banner_title_inner {

        padding-top: 20px;

    }



    .banner_title_inner h1 {

        font-size: 35px;

    }



    .banner_title_inner p {

        font-size: 16px;

    }

}



/*=============================================

= Banner Section  CSS

=============================================*/

/*=============================================

= Services Section  CSS

=============================================*/

.services-section {

    background-color: #eff6ff;

}



.heading-pb {

    padding-bottom: 60px;

}



.services-title {

    margin: 0 auto;

    width: 100%;

    max-width: 1050px;

}



.common-title h2 {

    font-size: 56px;

    font-weight: 700;

    line-height: 1.2;

    margin-bottom: 0;

}



.common-title h2 span {

    color: #2b2f6c;

}



.service-row {

    row-gap: 30px;

}



.services-box {

    background-color: #fff;

    padding: 32px;

    border-radius: 18px;

    text-align: center;

    height: 100%;

}



.services-box.side-badge::before {

    background-image: url("/lp-asset/lp-images/quality-logo.svg");

    width: 180px;

    height: 180px;

}



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

    .services-box.side-badge::before {

        top: -75px;

    }

}



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

    .services-box.side-badge::before {

        width: 160px;

        height: 160px;

    }

}



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

    .services-box.side-badge::before {

        width: 140px;

        height: 140px;

    }

}



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

    .services-box.side-badge::before {

        width: 120px;

        height: 120px;

    }

}



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

    .services-box.side-badge::before {

        width: 100px;

        height: 100px;

    }

}



.services-icon {

    box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 12px 0px;

    width: fit-content;

    padding: 24px;

    border-radius: 100%;

    margin: 0 auto 32px;

}



.services-icon img {

    width: 72px;

    aspect-ratio: 1;

}



.services-box h3 {

    font-size: 28px;

    font-weight: 600;

    line-height: 1.6;

    color: #323335;

    font-family: 'Montserrat', sans-serif;

    margin-bottom: 14px;

}



.services-box p {

    font-size: 20px;

    font-weight: 500;

    line-height: 1.6;

    color: #5E5F60;

}



.services-box p em {

    color: #323335;

}



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

    .common-title h2 {

        font-size: 50px;

    }



    .services-box {

        padding: 30px;

    }

}



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

    .heading-pb {

        padding-bottom: 50px;

    }



    .services-box {

        padding: 25px;

    }



    .common-title h2 {

        font-size: 45px;

    }



    .services-box h3 {

        font-size: 26px;

    }

}



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

    .heading-pb {

        padding-bottom: 40px;

    }



    .common-title h2 {

        font-size: 40px;

    }



    .services-box {

        padding: 20px;

    }



    .services-box h3 {

        font-size: 24px;

    }



    .services-box p {

        font-size: 18px;

    }



    .services-icon {

        padding: 18px;

        margin: 0 auto 26px;

    }



    .services-icon img {

        width: 62px;

    }

}



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

    .heading-pb {

        padding-bottom: 30px;

    }



    .common-title h2 {

        font-size: 35px;

    }



    .services-box h3 {

        font-size: 22px;

    }



    .services-box p {

        font-size: 16px;

    }



    .services-icon {

        padding: 18px;

        margin: 0 auto 22px;

    }

}



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

    .common-title h2 {

        font-size: 30px;

    }



    .services-box h3 {

        font-size: 20px;

    }



    .services-icon {

        padding: 18px;

        margin: 0 auto 12px;

    }



    .services-icon img {

        width: 52px;

    }

}



/*=============================================

= Services Section  CSS

=============================================*/

/*=============================================

= Appointment Section  CSS

=============================================*/

.appointment-row {

    display: flex;

    flex-wrap: wrap;

    gap: 60px;

}



.appointment-row .appointment-col {

    max-width: calc(50% - 30px);

    width: 100%;

}



.appointment-content {

    height: 100%;

    display: flex;

    justify-content: center;

    flex-direction: column;

    border-radius: 18px;

    padding: 48px;

    background: rgb(232 237 240 / 50%);

}



.appointment-content h2 {

    margin-bottom: 32px;

}



ul.contact-listing {

    margin-bottom: 20px;

}



ul.contact-listing li {

    display: flex;

    align-items: start;

    gap: 12px;

}



ul.contact-listing li:not(:last-child) {

    margin-bottom: 12px;

}



ul.contact-listing li a {

    text-decoration: none !important;

    color: #5E5F60;

    font-family: Montserrat;

    font-weight: 500;

    font-size: 18px;

    line-height: 1.6;

}



.appointment-img {

    height: 100%;

}



.appointment-img img {

    border-radius: 18px;

    height: 100%;

    object-fit: cover;

    object-position: center;

}



.appointment-content p {

    font-weight: 500;

    font-size: 20px;

    line-height: 1.4;

    margin-top: auto;

}



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

    .appointment-content h2 {

        font-size: 48px;

    }

}



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

    .appointment-row {

        gap: 24px;

    }



    .appointment-row .appointment-col {

        max-width: calc(50% - 12px);

    }



    .appointment-content {

        padding: 24px;

    }



    .appointment-content h2 {

        margin-bottom: 24px;

    }



    .appointment-content p,

    ul.contact-listing li a {

        font-size: 16px;

    }

}



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

    .appointment-row {

        flex-direction: column-reverse;

    }



    .appointment-row .appointment-col {

        max-width: 100%;

    }

}



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

    .appointment-content {

        padding: 15px;

    }



    ul.contact-listing li {

        gap: 5px;

    }

}



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

    ul.contact-listing li.mail-list a {

        font-size: 15px;

    }

}



/*=============================================

= Appointment Section  CSS

=============================================*/

/*=============================================

= Transformation Section  CSS

=============================================*/

.trnasformation-slider .slick-list {

    margin-left: -24px;

    margin-right: -24px;

}



.trnasformation-slide {

    padding: 0 24px;

}



.trnasformation-images {

    display: block;

    text-align: center;

}



.trnasformation-images img:first-of-type {

    margin-bottom: 12px;

}



.trnasformation-images img {

    border-radius: 12px;

    width: 100%;

    height: 100%;

    /*aspect-ratio: 3 / 4;*/

    object-fit: contain;

    object-position: center;

}



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

    .trnasformation-slider .slick-list {

        margin-left: -20px;

        margin-right: -20px;

    }



    .trnasformation-slide {

        padding: 0 20px;

    }

}



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

    .trnasformation-slider .slick-list {

        margin-left: -16px;

        margin-right: -16px;

    }



    .trnasformation-slide {

        padding: 0 16px;

    }

}



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

    .trnasformation-slider .slick-list {

        margin-left: -12px;

        margin-right: -12px;

    }



    .trnasformation-slide {

        padding: 0 12px;

    }

}



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



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

    .trnasformation-slider .slick-list {

        margin-left: auto;

        margin-right: auto;

    }



    .trnasformation-slide {

        padding: 0 5px;

    }

}



/*Transformation arrow Design*/

.transformation-main {

    position: relative;

}



.trnasformation-slider {

    position: unset;

}



.trnasformation-slider .slick-arrow {

    background: #eff6ff;

    width: 54px;

    height: 54px;

    z-index: 9;

    border-radius: 50%;

}



.trnasformation-slider .slick-prev {

    left: 30px;

}



.trnasformation-slider .slick-next {

    right: 30px;

}



.trnasformation-slider .slick-prev::before {

    background-image: url("/lp-asset/lp-images/slider-arrow-left.svg");

}



.trnasformation-slider .slick-next::before {

    background-image: url("/lp-asset/lp-images/slider-arrow-right.svg");

}



.trnasformation-slider .slick-prev::before,

.trnasformation-slider .slick-next::before {

    position: absolute;

    content: "";

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    opacity: 1;

    width: 22px;

    height: 22px;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

}



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

    .trnasformation-slider .slick-prev {

        left: 5px;

    }



    .trnasformation-slider .slick-next {

        right: 5px;

    }



    .trnasformation-slider .slick-arrow {

        width: 40px;

        height: 40px;

    }

}



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

    .trnasformation-slider .slick-arrow {

        width: 30px;

        height: 30px;

    }



    .trnasformation-slider .slick-prev::before,

    .trnasformation-slider .slick-next::before {

        width: 18px;

        height: 18px;

    }

}



/*Transformation arrow Design*/

/*=============================================

= Transformation Section  CSS

=============================================*/

/*=============================================

= Book Appointment Section  CSS

=============================================*/

.book-appointment-section {

    background: #2b2f6c;

}



.book-appoint-ment-row {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 24px;

}



.book-appointment-content * {

    color: #fff;

}



.book-appointment-content h2 {

    margin-bottom: 18px;

}



.book-appointment-btn {

    max-width: 349px;

    width: 100%;

}



.book-appointment-btn a {

    width: 100%;

}



.book-appointment-btn a:last-child {

    background: transparent;

    border: 1px solid #fff;

    margin-top: 20px;

}



.book-appointment-btn a:last-child:hover {

    background-color: #FFF;

}



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

    .book-appoint-ment-row {

        flex-direction: column;

    }



    .book-appointment-content {

        text-align: center;

    }



    .book-appointment-content h2 {

        margin-bottom: 12px;

    }

}



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

    .book-col {

        width: 100%;

    }



    .book-appointment-btn {

        max-width: 100%;

    }

}



/*=============================================

= Book Appointment Section  CSS

=============================================*/

/*=============================================

= Stories Section  CSS

=============================================*/

.stories-section {

    background-color: #eff6ff;

}



.stories-content {

    position: relative;

}



.stories-slider {

    position: unset;

}



.stories-slider .slick-slide {

    padding: 0 15px;

}



.stories-video {

    padding: 56.66% 0 0;

    position: relative;

}



.stories-video iframe {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    border-radius: 12px;

}



.stories-slider .slick-arrow {

    background: #fff;

    width: 54px;

    height: 54px;

    z-index: 9;

    border-radius: 50%;

}



.stories-slider .slick-prev {

    left: 30px;

}



.stories-slider .slick-next {

    right: 30px;

}



.stories-slider .slick-prev::before {

    background-image: url("/lp-asset/lp-images/slider-arrow-left.svg");

}



.stories-slider .slick-next::before {

    background-image: url("/lp-asset/lp-images/slider-arrow-right.svg");

}



.stories-slider .slick-prev::before,

.stories-slider .slick-next::before {

    position: absolute;

    content: "";

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    opacity: 1;

    width: 22px;

    height: 22px;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

}



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

    .stories-slider .slick-prev {

        left: 5px;

    }



    .stories-slider .slick-next {

        right: 5px;

    }



    .stories-slider .slick-arrow {

        width: 40px;

        height: 40px;

    }

}



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

    .stories-slider .slick-arrow {

        width: 30px;

        height: 30px;

    }



    .stories-slider .slick-prev::before,

    .stories-slider .slick-next::before {

        width: 18px;

        height: 18px;

    }

}



/*=============================================

= Stories Section  CSS

=============================================*/

.video-title h2 {

    margin-bottom: 18px;

}



.video_main {

    width: 100%;

    max-width: 994px;

    margin: 0 auto;

}



.video_main iframe {

    border-radius: 18px;

    box-shadow: rgba(0, 0, 0, 0.18) 0px 0px 12px 0px;

}



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

    .video-title h2 {

        margin-bottom: 10px;

    }

}



/*=============================================

= Content Section  CSS

=============================================*/

.image-content-section {

    overflow: hidden;

}



.bg-color {

    background-color: #eff6ff;

}



.video-img-side img {

    width: 100%;

}



.video-img-side img,

.video-img-side iframe {

    border-radius: 18px;

}



.content-side h2 {

    margin-bottom: 32px;

}



.services-listing li:not(:last-of-type) {

    margin-bottom: 12px;

}



.services-listing li {

    color: #5E5F60;

    padding-left: 30px;

    position: relative;

    font-size: 20px;

    font-weight: 500;

    line-height: 1.6;

}



.services-listing li::before {

    position: absolute;

    content: "";

    top: 5px;

    left: 0;

    background-image: url("/lp-asset/lp-images/right-icon.svg");

    background-position: left center;

    background-repeat: no-repeat;

    background-size: contain;

    width: 22px;

    height: 22px;

}



.side-badge {

    position: relative;

    z-index: 1;

}



.side-badge::before {

    position: absolute;

    content: "";

    top: -55px;

    right: -30px;

    width: 110px;

    height: 110px;

    background-image: url("/lp-asset/lp-images/biofilm-logo.svg");

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

}



.side-image-content ul {

    margin-top: 16px;

}



.video-img-side img {

    width: 100%;

}

@media only screen and (max-width: 991px) {
.res-img img {
    width: 500px;
}

}

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

    .side-image-content ul li {

        font-size: 18px;

    }

}



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

    .content-side h2 {

        margin-bottom: 30px;

    }

}



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

    .content-side h2 {

        margin-bottom: 25px;

    }



    .services-listing li,

    .content-side p {

        font-size: 18px;

    }



    .services-listing li::before {

        top: 2px;

    }



    .side-badge::before {

        width: 90px;

        height: 90px;

        top: -45px;

    }

}



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

    .content-side {

        padding-top: 30px;

    }



    .content-side h2 {

        margin-bottom: 20px;

    }



    .side-badge::before {

        width: 70px;

        height: 70px;

        top: -35px;

        right: -25px;

    }

}



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

    .content-side h2 {

        margin-bottom: 15px;

    }



    .services-listing li,

    .content-side p {

        font-size: 16px;

    }

}



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



/*=============================================

= Content Section  CSS

=============================================*/

/*=============================================

= Doctor Section  CSS

=============================================*/

.dr-section {

    background-color: #2b2f6c;

}



.dr-content h2 {

    margin-bottom: 13px;

}



.content-side h3 {

    font-size: 36px;

    font-weight: 700;

    line-height: 1.2;

    margin-bottom: 32px;

}



.dr-content {

    color: #fff;

}



.dr-content p {

    color: rgb(255 255 255 / 80%)

}



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

    .content-side h3 {

        font-size: 32px;

        margin-bottom: 30px;

    }

}



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

    .content-side h3 {

        font-size: 28px;

        margin-bottom: 25px;

    }

}



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

    .content-side h3 {

        font-size: 24px;

        margin-bottom: 20px;

    }

}



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

    .content-side h3 {

        font-size: 20px;

        margin-bottom: 15px;

    }

}



/*=============================================

= Doctor Section  CSS

=============================================*/

/*===============================================

= Start Dental Table CSS

================================================*/

.dental-table-row {

    row-gap: 30px;

}



.table-row-content {

    padding: 24px;

    vertical-align: top;

    background-color: #fff;

    box-shadow: rgba(0, 0, 0, 0.14) 0px 0px 12px 0px;

    border-radius: 18px;

    height: 100%;

    display: flex;

    flex-direction: column;

}



.table-row-content h3 {

    width: 100%;

    text-align: center;

    color: #2b2f6c;

    font-family: 'Montserrat', sans-serif;

    font-size: 26px;

    font-weight: 600;

    line-height: 1.3;

    padding: 0;

    margin-bottom: 12px;

}



.table-row-content span {

    display: block;

    width: 100%;

    text-align: center;

    color: #323335;

    font-family: 'Montserrat', sans-serif;

    font-size: 20px;

    font-weight: 500;

    line-height: 1.4;

    padding-bottom: 24px;

}



.home-table-img {

    width: 100%;

    padding-bottom: 24px;

    text-align: center;

}



.home-table-img img {

    border-radius: 16px;

}



.table-row-content ul li {

    width: 100%;

    margin: 0;

    padding: 14px 0px;

    text-align: center;

    list-style: none;

    border-bottom: 1px solid #eff6ff;

    color: #5E5F60;

    font-size: 16px;

    font-weight: 500;

    line-height: 1.4;

    font-family: 'Montserrat', sans-serif;

}



.pricing-btn {

    width: 100%;

    display: block;

    margin-top: auto;

    padding-top: 24px;

}



.table_btn {

    display: block;

    font-size: 17px;

    font-weight: 600;

    line-height: 1.3;

    color: #323335;

    background: #F4F6F8;

    border-radius: 12px;

    padding: 12px;

    outline: none;

    border: 2px solid transparent;

    text-decoration: none;

    transition: all 0.4s;

}



.middle {

    background-color: rgba(232, 237, 240, 0.5);

}



.middle .table_btn {

    background-color: #fff;

}



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

    .table-row-content {

        padding: 28px;

    }



    .table-row-content h3 {

        font-size: 28px;

    }

}



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

    .table-row-content {

        padding: 30px 25px;

    }



    .table-row-content h3 {

        font-size: 24px;

    }

}



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

    .table-row-content {

        padding: 25px 20px;

    }



    .table-row-content h3 {

        font-size: 20px;

    }



    .table-row-content span,

    .table-row-content ul li {

        font-size: 16px;

    }



    .table-row-content ul li {

        padding: 12px 0;

    }



    .table-row-content span,

    .home-table-img {

        padding-bottom: 20px;

    }

}



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

    .table-row-content {

        padding: 22px 15px;

        border-radius: 10px;

    }



    .table-row-content span,

    .table-row-content ul li,

    .table_btn {

        font-size: 16px;

    }



    .table-row-content ul li {

        padding: 10px 0;

    }



    .table-row-content span,

    .home-table-img {

        padding-bottom: 16px;

    }



    .home-table-img img {

        border-radius: 10px;

    }

}



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



    .table-row-content span,

    .home-table-img {

        padding-bottom: 16px;

    }

}



/*===============================================

= End Dental Table CSS

================================================*/

/*===============================================

= Start Testimonials CSS

================================================*/

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

    body .container1600 {

        max-width: 1600px;

    }

}



.review-slide {

    padding: 5px 16px;

}



.review-slider-content {

    background: #fff;

    box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.12);

    border-radius: 10px;

    padding: 32px;

    display: flex;

    flex-direction: column;

}



.review-slider-content h3 {

    font-size: 22px;

    color: #323335;

    font-weight: 600;

    margin-bottom: 8px;

    text-transform: capitalize;

    font-family: 'Montserrat', sans-serif;

}



.review-rating ul {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

}



.review-slider-main-content {

    margin-bottom: 24px;

}



.review-description {

    background-color: rgba(232, 237, 240, 0.5);

    padding: 18px;

    border-radius: 10px;

}



.review-content p {

    font-size: 20px;

    font-weight: 500;

    line-height: 1.6;

    letter-spacing: -0.2px;

}



.google-review {

    padding-top: 24px;

}



/*Readmore Design*/

.read-more-btn {

    color: #5E5F60;

    background: none;

    border: none;

    padding: 0px;

    font-size: 20px;

    font-weight: 600;

    cursor: pointer;

    margin-top: 60px;

    font-family: 'Montserrat', sans-serif;

}



.review-content {

    display: -webkit-box;

    line-clamp: 4;

    -webkit-line-clamp: 4;

    -webkit-box-orient: vertical;

    overflow: hidden;

    text-overflow: ellipsis;

}



.review-content.clamped {

    -webkit-line-clamp: unset;

    overflow: auto;

    height: 218px;

    padding-right: 8px;

}



.review-content::-webkit-scrollbar {

    width: 6px;

}



.review-content::-webkit-scrollbar-track {

    box-shadow: inset 0 0 5px grey;

    border-radius: 10px;

}



.review-content::-webkit-scrollbar-thumb {

    background: #15dbcd;

    border-radius: 10px;

}



/*Readmore Design*/

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

    .review-content p {

        font-size: 18px;

    }

}



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

    .read-more-btn {

        margin-top: 50px;

    }

}



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

    .read-more-btn {

        margin-top: 40px;

    }

}



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

    .review-description {

        padding: 18px 12px;

    }



    .read-more-btn {

        font-size: 18px;

        margin-top: 30px;

    }

}



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

    .review-slider-main-content {

        margin-bottom: 20px;

    }



    .review-slider-content h3 {

        font-size: 20px;

    }



    .review-content p,

    .read-more-btn {

        font-size: 16px;

    }



    .review-description {

        padding: 14px 10px;

    }



    .read-more-btn {

        margin-top: 20px;

    }



    .google-review {

        padding-top: 20px;

    }

}



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

    .review-slider-content {

        padding: 20px 15px;

    }



    .read-more-btn {

        margin-top: 15px;

    }

}



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

    .review-slide {

        padding: 5px;

    }

}



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

    .read-more-btn {

        margin-top: 10px;

    }

}



/*Review arrow Design*/

.review-part {

    position: relative;

}



.review-slider {

    position: unset;

}



.review-slider .slick-arrow {

    background: #fff;

    width: 54px;

    height: 54px;

    z-index: 9;

    border-radius: 50%;

}



.review-slider .slick-prev {

    left: 30px;

}



.review-slider .slick-next {

    right: 30px;

}



.review-slider .slick-prev::before {

    background-image: url("/lp-asset/lp-images/slider-arrow-left.svg");

}



.review-slider .slick-next::before {

    background-image: url("/lp-asset/lp-images/slider-arrow-right.svg");

}



.review-slider .slick-prev::before,

.review-slider .slick-next::before {

    position: absolute;

    content: "";

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    opacity: 1;

    width: 22px;

    height: 22px;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

}



.slick-disabled {

    opacity: 0.5;

    cursor: auto !important;

}



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

    .review-slider .slick-prev {

        left: 5px;

    }



    .review-slider .slick-next {

        right: 5px;

    }



    .review-slider .slick-arrow {

        width: 40px;

        height: 40px;

    }

}



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

    .review-slider .slick-arrow {

        width: 30px;

        height: 30px;

    }



    .review-slider .slick-prev::before,

    .review-slider .slick-next::before {

        width: 18px;

        height: 18px;

    }

}



/*Review arrow Design*/

/*===============================================

= End Testimonials CSS

================================================*/

/*===============================================

= Start Compare CSS

================================================*/

.compare-title {

    width: 100%;

    margin: 0 auto;

    max-width: 1024px;

}



.compare-title h2 {

    margin-bottom: 18px;

}



.compare-row {

    display: flex;

    flex-wrap: wrap;

    gap: 50px;

}



.compare-col {

    width: 100%;

    max-width: calc(50% - 25px);

}



.compare-box {

    height: 100%;

    background-color: #fff;

    padding: 30px;

    border-radius: 16px;

}



.compare-box h3 {

    font-size: 36px;

    font-weight: 700;

    line-height: 1.2;

    margin-bottom: 20px;

    color: #2b2f6c;

}



.compare-box ul+p {

    margin-top: 16px;

}



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

    .compare-row {

        gap: 40px;

    }



    .compare-col {

        max-width: calc(50% - 20px);

    }



    .compare-box h3 {

        font-size: 34px;

    }

}



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

    .compare-row {

        gap: 30px;

    }



    .compare-col {

        max-width: calc(50% - 15px);

    }



    .compare-box {

        padding: 20px;

    }



    .compare-box h3 {

        font-size: 30px;

    }

}



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

    .compare-col {

        max-width: 100%;

    }



    .compare-box h3 {

        font-size: 28px;

    }

}



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

    .compare-box h3 {

        font-size: 26px;

        margin-bottom: 18px;

    }

}



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

    .compare-box {

        padding: 20px 15px;

    }



    .compare-box h3 {

        font-size: 24px;

        margin-bottom: 15px;

    }

}



/*===============================================

= End Compare CSS

================================================*/

/* =========================================================

Start Before after css

============================================================= */

.before-after-slider {

    margin-bottom: 0 !important

}



.comparison-content {

    margin: 0 25px

}



.comparison-content h4 {

    padding-top: 15px;

    margin-bottom: 10px;

    text-align: center;

}



.comparison-content p {

    margin-bottom: 0px;

    text-align: center;

}



.repid-smile-bg .comparison-main .comparison {

    padding-bottom: 92%;

}



.repid-smile-bg .comparison-main>* {

    padding: 0;

}



.comparison {

    width: 100%;

    padding-bottom: 67%;

    overflow: hidden;

    position: relative;

}



.home .comparison {

    padding-bottom: 54%;

}



.comparison-content p {

    font-size: 14px;

}



.figure {

    position: absolute;

    left: 0;

    top: 0;

    background-size: cover;

    font-size: 0;

    width: 100%;

    height: 100%;

    margin: 0;

    background-image: var(--after-img);

}



.divisor {

    background-size: cover;

    position: absolute;

    width: 50%;

    -webkit-box-shadow: 0 5px 10px -2px rgba(0, 0, 0, .3);

    box-shadow: 0 5px 10px -2px rgba(0, 0, 0, .3);

    bottom: 0;

    height: 100%;

    background-image: var(--before-img);

}



.divisor:before,

.divisor:after {

    content: "";

    position: absolute;

    right: -2px;

    width: 4px;

    height: calc(50% - 20px);

    background: #fff;

    z-index: 3;

}



.divisor:before {

    top: 0;

    -webkit-box-shadow: 0 -3px 8px 1px rgba(0, 0, 0, .3);

    box-shadow: 0 -3px 8px 1px rgba(0, 0, 0, .3);

}



.divisor:after {

    bottom: 0;

    -webkit-box-shadow: 0 3px 8px 1px rgba(0, 0, 0, .3);

    box-shadow: 0 3px 8px 1px rgba(0, 0, 0, .3);

}



figure.figure::before {

    position: absolute;

    content: "Before";

    top: auto;

    bottom: 10px;

    left: 10px;

    width: 57px;

    height: 24px;

    color: var(--blue_color);

    z-index: 1;

    font-size: 14px;

    font-weight: 400;

    line-height: 1.2;

    font-family: var(--recoleta);

    background-color: #EFF6F3;

    padding: 5px 8px;

    border-radius: 5px;

}



figure.figure::after {

    position: absolute;

    content: "After";

    top: auto;

    bottom: 10px;

    right: 10px;

    width: 48px;

    height: 24px;

    color: var(--blue_color);

    z-index: 1;

    font-size: 14px;

    font-weight: 400;

    line-height: 1.2;

    font-family: var(--recoleta);

    background-color: #EFF6F3;

    padding: 5px 8px;

    border-radius: 5px;

}



.divisor span {

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0;

    left: 0;

}



.handle {

    position: absolute;

    height: 50px;

    width: 50px;

    top: 50%;

    left: 50%;

    -webkit-transform: translateY(-50%) translateX(-50%);

    -ms-transform: translateY(-50%) translateX(-50%);

    transform: translateY(-50%) translateX(-50%);

    z-index: 1;

    border-radius: 100%;

}



.handle:before,

.handle:after {

    content: "";

    width: 0;

    height: 0;

    border: 6px inset transparent;

    position: absolute;

    top: 50%;

    margin-top: -6px;

}



.handle:before {

    border-right: 6px solid #fff;

    left: 50%;

    margin-left: -17px;

}



.handle:after {

    border-left: 6px solid #fff;

    right: 50%;

    margin-right: -17px;

}



.comparison input[type=range] {

    appearance: none;

    -webkit-appearance: none;

    -moz-appearance: none;

    position: absolute;

    top: 50%;

    left: -25px;

    -webkit-transform: translateY(-50%);

    -ms-transform: translateY(-50%);

    transform: translateY(-50%);

    background-color: transparent;

    width: calc(100% + 50px);

    z-index: 2;

    cursor: col-resize;

    border: none;

    max-width: inherit;

    padding: 0;

}



input[type=range]:focus,

input[type=range]:active {

    border: none;

    outline: none;

}



input[type=range]::-webkit-slider-thumb {

    -webkit-appearance: none;

    border: none;

    height: 40px;

    width: 40px;

    border-radius: 50%;

    background: 0 0;

    border: 3px solid #fff;

    -webkit-box-shadow: 0 0 8px 1px rgba(0, 0, 0, .3);

    box-shadow: 0 0 8px 1px rgba(0, 0, 0, .3);

}



input[type=range]::-moz-range-track {

    -moz-appearance: none;

    height: 15px;

    width: 100%;

    background-color: transparent;

    position: relative;

    outline: none;

}



.comprison-before-after {

    display: -ms-grid;

    display: grid;

    -ms-grid-columns: 1fr 24px 1fr 24px 1fr;

    grid-template-columns: repeat(3, 1fr);

    gap: 24px;

}



.comprison-before-after>* {

    padding: 0;

    border-radius: 4px;

    overflow: hidden;

}



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

    .comparison-content {

        margin: 0 15px;

    }

}



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

    .comparison-content {

        margin: 0 10px;

    }

}



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

    .comparison-content {

        margin: 0;

    }

}



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

    .comparison-content {

        padding: 0 !important;

    }

}



/* =========================================================

End Before after css

============================================================= */

.box-row {

    display: flex;

    flex-wrap: wrap;

    gap: 30px;

    justify-content: center;

}



.box-col {

    width: 100%;

    height: auto;

    max-width: calc(33.33% - 20px);

}



.box-content {

    padding: 30px 20px;

    background-color: #eff6ff;

    border-radius: 18px;

    height: 100%;

}



.box-content h3 {

    width: 100%;

    color: #2b2f6c;

    font-size: 30px;

    font-weight: 700;

    line-height: 1.3;

    margin-bottom: 15px;

}



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

    .box-col {

        max-width: calc(50% - 15px);

    }



    .box-content h3 {

        font-size: 28px;

    }

}



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

    .box-content {

        padding: 20px 15px;

    }



    .box-content h3 {

        font-size: 26px;

    }

}



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

    .box-content h3 {

        font-size: 24px;

    }

}



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

    .box-col {

        max-width: 100%;

    }

}



/*----------Patient Testimonials Video-------------*/



.patient_review_section_container {

    width: 90% !important;

}



.patients-stories-content .full_img {

    position: relative;

    padding-top: 55%;

}



.full_img iframe {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    display: block;

}



.patients-stories-slider .slick-prev,

.patients-stories-slider .slick-next {

    position: absolute;

    top: 50%;

    display: block;

    transform: translate(0, -50%);

    cursor: pointer;

    color: transparent;

    border: none;

    outline: none;

    background: transparent;

}



.patients-stories-slider .slick-prev {

    left: -40px;

}



.patients-stories-slider .slick-next {

    right: -40px;

}



.patients-stories-slider .slick-arrow {

    z-index: 11;

    border: none !important;

    width: 40px;

    height: 40px;

    line-height: 40px !important;

    background-color: #fff !important;

    border-radius: 50px !important;

    border: 1px solid #fff !important;

    padding: 0 !important;

    font-size: 0 !important;

    box-shadow: rgba(0, 0, 0, 0.15) 0px 1px 10px;

}



.patients-stories-slider .slick-arrow::before {

    transform: translate(-50%, -50%);

    content: "";

    background-image: url("/lp-asset/lp-images/slider-arrow-left.svg");

    background-repeat: no-repeat;

    background-size: contain;

    background-position: center;

    width: 20px;

    height: 20px;

    opacity: 1;

    position: absolute;

    left: 50%;

    top: 50%;

    filter: brightness(0);

}



.patients-stories-slider .slick-arrow.slick-next::before {

    content: "";

    background-image: url("/lp-asset/lp-images/slider-arrow-right.svg");

}



.patients-stories-slider .slick-arrow.slick-disabled {

    opacity: 0.7;

}



.patients-stories-slider .slick-arrow.slick-disabled::before {

    opacity: 0.7;

}



.patients-stories-slider .slick-track:before,

.patients-stories-slider .slick-track:after {

    content: unset !important;

}



.patients_stories_slider_blk {

    margin: 0 10px;

}



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

    .patients-stories-slider .slick-arrow {

        width: 35px;

        height: 35px;

    }

}



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

    .patients-stories-slider .slick-prev {

        left: -12px;

    }



    .patients-stories-slider .slick-next {

        right: -12px;

    }

}



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

    .patients-stories-slider .slick-prev {

        left: -20px;

    }



    .patients-stories-slider .slick-next {

        right: -20px;

    }

}



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

    .patients-stories-slider .slick-prev {

        left: -30px;

    }



    .patients-stories-slider .slick-next {

        right: -30px;

    }

}



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



/*----------Patient Testimonials Video-------------*/

/*----------Patient Testimonials Video content-------------*/

.video-review-row {

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 30px;

}

.video-review-col {

    width: 100%;

    max-width: calc(50% - 15px);

}

.video-review-content .review-rating {

    margin-bottom: 20px;

}

.video-review-col iframe {

    border-radius: 18px;

}

.video-review-content h3 {

    width: 100%;

    color: #212529;

    font-family: 'Montserrat', sans-serif;

    font-size: 24px;

    font-weight: 600;

    line-height: 1.3;

    padding: 0;

    margin-bottom: 15px;

}

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

    .video-review-col {

        max-width: 100%;

    }

    .video-review-col iframe {

        border-radius: 10px;

    }

}

/*Review arrow Design*/

.video-review-part {

    position: relative;

}



.video-review-slider {

    position: unset;

}

.patient-name {

    text-align: right;

    margin-top: 20px;

    font-weight: 600;

    text-transform: capitalize;

}

.video-review-slider .slick-arrow {

    background: #fff;

    width: 54px;

    height: 54px;

    z-index: 9;

    border-radius: 50%;

}

.video-review-slider .slick-prev {

    left: 200px;

}

.video-review-slider .slick-next {

    right: 200px;

}

.video-review-slider .slick-prev::before {

    background-image: url("/lp-asset/lp-images/slider-arrow-left.svg");

}

.video-review-slider .slick-next::before {

    background-image: url("/lp-asset/lp-images/slider-arrow-right.svg");

}

.video-review-slider .slick-prev::before,

.video-review-slider .slick-next::before {

    position: absolute;

    content: "";

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    opacity: 1;

    width: 22px;

    height: 22px;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

}

.slick-disabled {

    opacity: 0.5;

    cursor: auto !important;

}

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

    .video-review-slider .slick-prev {

        left: 120px;

    }

    .video-review-slider .slick-next {

        right: 120px;

    }

    .video-review-slider .slick-arrow {

        width: 40px;

        height: 40px;

    }

}

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

    .video-review-slider .slick-prev {

        left: 70px;

    }

    .video-review-slider .slick-next {

        right: 70px;

    }

}

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

    .video-review-slider .slick-prev {

        left: 30px;

    }

    .video-review-slider .slick-next {

        right: 30px;

    }

}

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

    .video-review-slider .slick-prev {

        left: 5px;

    }

    .video-review-slider .slick-next {

        right: 5px;

    }

}

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

    .video-review-slider .slick-arrow {

        width: 30px;

        height: 30px;

    }

    .video-review-slider .slick-prev::before,

    .video-review-slider .slick-next::before {

        width: 18px;

        height: 18px;

    }

}

/*Review arrow Design*/

/*----------Patient Testimonials Video content-------------*/