@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@700&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@700&family=Lato&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=Fredoka&display=swap');
    /* ? Common Components css start*/
    
    .mb-show {
        display: none !important;
    }
    
    .bg-C2E {
        background-color: #C2EDCE !important;
    }
    
    .bg-388 {
        background: #388087;
    }
    
    .bg-6FB {
        background: #6FB3B8;
    }
    
    .black-000 {
        color: #000000 !important;
    }
    
    .green-C2E {
        color: #C2EDCE !important;
    }
    
    .blacl-3C3 {
        color: #3C3C3C !important;
    }
    /*! ============================================== HOMW PAGE CSS START ============================================================ */
    /* ? HEADER START */
    
    .nev-header-container {
        background: #6FB3B8;
        position: sticky;
        top: 0;
        z-index: 999;
    }
    
    .nev-slider {
        height: 121px;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: end;
    }
    
    .header-ul {
        list-style: none;
        margin-bottom: 0 !important;
    }
    
    .header-ul>li {
        float: left;
        margin-right: 2.5vw;
    }
    
    #so {
        display: none;
    }
    
    .header-ul>li>a,
    .nav-links {
        font-family: 'Lato' !important;
        font-style: normal;
        font-weight: 700;
        font-size: 15px !important;
        line-height: 18px !important;
        text-transform: uppercase;
        color: #3C3C3C !important;
        text-decoration: none;
    }
    
    .dropdown-menu {
    background: #BADFE7;
    border-radius: 0 0 20px 20px !important;
    padding: 10px !important;
    margin-top: 3px !important;
   }
    
    .service-dropdown {
        width: 195px !important;
    }
    
    .dropdown-item {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 700;
        font-size: 15px !important;
        line-height: 18px;
        text-transform: uppercase;
        color: #1B2431 !important;
        padding: 12px 15px;
        white-space: pre-wrap;
        width: auto !important;
    }
    
    .usd-dropdown {
        max-width: 98px !important;
        width: 98px !important;
    }
    
    .heder-logo {
        position: absolute;
        top: 23px;
        /* left: 18vw; */
    }
    
    .heder-logo-mb,
    .nav-bar {
        display: none;
    }
    /* ? HEADER END */
    /*  */
    /*  */
    /* ? HERO SECTION START */
    
    .wrap-all-body {
        background-color: #F6F6F2;
    }
    
    .home-hero-section {
        padding: 55px 0;
        position: relative;
        z-index: 1;
        max-height: 763px;
        border-radius: 0px 0px 0px 300px;
        background: #F8F8F8 url(../images/ServicesHeroBgImages.svg) no-repeat center;
        background-size: auto;
    }
    /* .home-hero-section::after {
    position: absolute;
    content: "";
    right: 5.6%;
    top: 11.5%;
    width: 27px;
    height: 25px;
    background: url("../images/lightRed-Donut.svg") no-repeat center;
    background-size: auto;
    z-index: -1;
}

.home-hero-section::before {
    position: absolute;
    content: "";
    top: 0;
    right: 36.5%;
    width: 92px;
    height: 159px;
    background: url("../images/DotedGroup.svg") center;
    background-size: contain;
    z-index: -1;
} */
    
    .custom-hero-container {
        display: flex;
    }
    
    .hero-colum:first-child {
        width: 54.5%;
        /* border: 1px solid red; */
    }
    
    .hero-colum:last-child {
        width: 45.5%;
        position: relative;
        /* border: 1px solid rgb(33, 167, 69); */
    }
    /* .hero-colum:last-child::after {
    position: absolute;
    content: "";
    right: 5%;
    bottom: 20%;
    width: 57px;
    height: 57px;
    background: url("../images/blue-Dote.svg") center;
    background-size: contain;
    z-index: -1;
}

.hero-colum:last-child::before {
    position: absolute;
    content: "";
    left: 10%;
    bottom: 10%;
    width: 25px;
    height: 25px;
    background: url("../images/Light-blue-donute.svg") center;
    background-size: contain;
    z-index: -1;
} */
    
    .home-hero-img {
        width: clamp(200px, 100%, 921px);
    }
    
    .mk-align-center {
        margin-top: 5vh;
    }
    
    .hero-heading-frame {
        width: clamp(200px, 100%, 660px);
        margin: 16% 0 0 -6%;
    }
    
    .hero-heading-farame-uiux {
        margin: 16% 0 0 -1%;
    }
    
    .hero-heading {
        font-family: 'Fredoka';
        font-style: normal;
        font-weight: 600;
        font-size: 64px;
        line-height: 77px;
        text-align: center;
        text-transform: capitalize;
        color: #388087;
    }
    
    .hero-sub-para {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 26px;
        text-align: center;
        letter-spacing: 0.5px;
        color: #3C3C3C;
    }
    
    .secondary-btn:hover {
        background: linear-gradient(0deg, rgba(194, 237, 206, 0.5), rgba(194, 237, 206, 0.5)), #FFFFFF;
    }
    
    .primary-btn:active,
    .secondary-btn:active {
        box-shadow: 1px 5px 1px -1px black;
    }
    
    .primary-btn,
    .secondary-btn {
        background: #FFFFFF;
        border: 1px solid #000000;
        border-radius: 49px;
        outline: none;
        font-family: 'Lato';
        font-style: normal;
        font-weight: 600;
        font-size: 16px;
        line-height: 19px;
        text-transform: uppercase;
        color: #000000;
        padding: 12px 42px;
        white-space: nowrap;
    }
    
    .secondary-btn {
        background: #C2EDCE;
    }
    
    .primary-btn:hover {
        background: #EFEFEF;
    }
    /* ? HERO SECTION END */
    /*  */
    /*  */
    /* ? CARD SECTION START  */
    
    .card-side-strips-container {
        position: relative;
        z-index: 1;
    }
    
    .card-side-strips-container::after {
        position: absolute;
        content: "";
        top: 16%;
        left: 32px;
        width: 92px;
        height: 159px;
        background: url("../images/DotedGroup.svg") no-repeat center;
        background-size: contain;
        z-index: -1;
    }
    
    .card-side-strips-container::before {
        position: absolute;
        content: "";
        top: 34%;
        right: 5%;
        width: 27px;
        height: 25px;
        background: url("../images/lightRed-Donut.svg") no-repeat center;
        background-size: auto;
        z-index: -1;
    }
    
    .card-colum {
        width: 325px;
        max-width: 300px;
        height: 300px;
        border-radius: 270px;
        margin: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }
    
    .fx-20 {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 700;
        font-size: 20px;
        line-height: 31px;
    }
    
    .fx-16 {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 26px;
        text-align: center;
        letter-spacing: 0.5px;
    }
    
    .card-frame {
        padding: 40px 0;
        flex-wrap: wrap;
    }
    /* ? CARD SECTION END  */
    /*  *
/*  */
    /* ? ABOUT SECTION START */
    
    .about-strips-container {
        padding: 40px 0 77px;
        position: relative;
        z-index: 1;
    }
    
    .about-strips-container::after {
        position: absolute;
        content: "";
        left: 0;
        top: 8%;
        width: 108px;
        height: 240px;
        background: url("../images/semi-circle.svg") center;
        background-size: cover;
        z-index: -1;
    }
    
    .about-strips-container::before {
        position: absolute;
        content: "";
        right: 20px;
        bottom: 6%;
        width: 91px;
        height: 159px;
        background: url("../images/DotedGroup.svg") center;
        background-size: cover;
        z-index: -1;
    }
    
    .fs-48-35 {
        font-family: 'Fredoka';
        font-style: normal;
        font-weight: 600;
        font-size: 48px;
        line-height: 58px;
        text-transform: capitalize;
        color: #388087;
    }
    
    .fs-48-34 {
        font-family: 'Fredoka';
        font-style: normal;
        font-weight: 600;
        font-size: 48px;
        line-height: 58px;
        text-transform: capitalize;
        color: #388087;
    }
    
    .about-colum {
        width: 50%;
    }
    
    .about-colum:last-child {
        padding: 10px 0 10px 6px;
    }
    
    .about-colum:first-child {
        padding-right: 10px;
    }
    
    .abc-box:first-child {
        padding-bottom: 10px;
    }
    
    .abc-box:last-child {
        padding-top: 10px;
    }
    
    .h-bout-r-img {
        width: clamp(200px, 100%, 684.38px);
        height: clamp(400px, 100%, 696.47px);
    }
    
    .h-about-L {
        width: clamp(200px, 100%, 678.58px);
        height: clamp(100px, 100%, 336.63px);
        /* float: right; */
    }
    
    .fs-32-16 {
        font-family: 'Fredoka';
        font-style: normal;
        font-weight: 500;
        font-size: 32px;
        line-height: 39px;
    }
    
    .para {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 26px;
        letter-spacing: 0.5px;
    }
    
    .fs-20-18 {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 700;
        font-size: 20px;
        line-height: 31px;
    }
    
    .about-col-content {
        bottom: 6%;
        left: 11%;
    }
    
    .about-box-content {
        bottom: 8%;
        left: 11%;
    }
    
    .mk-aligment {
        padding: 0 5%;
    }
    /* ? ABOUT SECTION END */
    /*  */
    /*  */
    /* ? HOW WORK SECTION START  */
    
    .work-section {
        height: 689px;
        display: flex;
        align-items: center;
        position: relative;
    }
    
    .work-section::before {
        position: absolute;
        content: "";
        right: 0;
        top: 0;
        width: 25vw;
        height: 100%;
        background: url("../images/DotRight.svg") no-repeat center;
        background-size: contain;
    }
    
    .work-section::after {
        position: absolute;
        content: "";
        left: 0;
        top: 0;
        width: 25vw;
        height: 100%;
        background: url("../images/DotLeft.svg") no-repeat center;
        background-size: contain;
    }
    
    .pin-box {
        width: clamp(200px, 100vw, 246px);
        height: clamp(290px, 100vh, 307px);
        margin: 30px 2vw;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    /* ? HOW WORK SECTION END  */
    /*  */
    /*  */
    /* ?SERVICE SECTION START */
    
    .seo-pak-praccing-section {
        padding: 20px 0 10px 0;
    }
    
    .home-service-section {
        padding: 40px 0 0 0;
        /* position: relative;
    overflow: hidden;
    z-index: 1; */
    }
    
    .home-about-wrapper {
        background: url(../images/HomeServicesBG.svg) no-repeat center;
        background-size: contain;
    }
    
    .servce-card-scroll-frame {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        padding: 40px 0;
        gap: 4vw;
    }
    
    .services-circle {
        min-width: 293px;
        width: 293px;
        height: 294px;
        margin: 76px 0;
        background: #BADFE7;
        box-shadow: 9px 8px 0 2px #7EADB8;
        border-radius: 190px;
        /* background: url(../images/service-circle-card.svg) no-repeat center;
    background-size: 100% 100%; */
        border-radius: 200px;
        padding: 10px;
    }
    
    .service-icon {
        width: 90px;
        height: 90px;
        object-fit: contain;
        aspect-ratio: 2/3;
        margin-top: -37px;
    }
    /* GROW BUSINESS SUB SECTION START  */
    
    .grow-business-sub-section {
        width: clamp(200px, 100%, 1394px);
        height: 523px;
        border: 8px solid #6FB3B8;
        box-shadow: 9px 8px 0 2px #6FB3B8;
        border-radius: 50px;
        background: #F8F8F8;
        margin: 100px 0;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
    }
    
    .colum {
        height: 100%;
    }
    
    .colum:first-child {
        width: 55%;
        /* border: 2px solid green; */
    }
    
    .colum:last-child {
        width: 45%;
        padding: 2% 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        height: 100%;
    }
    
    .add-p {
        padding: 0 5%;
    }
    
    .blue-388 {
        color: #388087 !important;
    }
    
    .img-box {
        display: flex;
        flex-direction: column;
    }
    
    .img-box:first-child {
        width: 40%;
        padding: 0 15px 0 26px;
        align-items: center;
        margin-top: -10px;
    }
    
    .img-box:last-child {
        width: 55%;
        align-items: start;
        justify-content: end;
        margin: 0 0 10px 10px;
    }
    
    .grow-img-lt {
        width: clamp(114px, 100%, 263px);
        /* height: clamp(114px, 100%, 270px); */
        margin-bottom: 10px;
    }
    
    .grow-img-lb {
        width: clamp(114px, 100%, 396px);
        height: clamp(114px, 100%, 270px);
        border-radius: 40px;
        margin-top: 10px;
    }
    
    .grow-img-rt {
        width: clamp(158px, 100%, 363px);
        /* height: clamp(157px, 100%, 373px); */
        border-radius: 40px;
        margin-bottom: 10px;
    }
    
    .grow-img-rb {
        width: clamp(114px, 100%, 263px);
        /* height: clamp(59px, 100%, 139px); */
        border-radius: 170px;
        margin-top: 10px;
    }
    /* GROW BUSINESS SUB SECTION END  */
    /* ?SERVICE SECTION END */
    /* * FOOTER SECTION START */
    
    .footer {
        background-color: #6FB3B8;
        padding: 82px 0 25px;
    }
    
    .footer-box:first-child {
        width: 32%;
        min-width: 330px;
    }
    
    .footer-box:nth-child(2) {
        padding-top: 3%;
        min-width: 319px;
    }
    
    .footer-box:last-child {
        padding-top: 3%;
        padding-left: 7%;
        min-width: 380px;
    }
    
    .add-border {
        border-bottom: 1.5px solid #388087;
        padding-bottom: 7px;
    }
    
    .footerUL>li>img {
        padding-right: 20px;
    }
    
    .footerUL>li {
        justify-content: start;
        align-items: center;
        padding: 6px 0;
    }
    
    .word-nowrap {
        white-space: nowrap;
        word-wrap: unset;
        word-break: unset;
    }
    
    .sub-footer-frame {
        align-items: start;
        justify-content: space-between;
    }
    
    .footer-ql-list>li {
        margin-top: 16px;
        white-space: nowrap
    }
    
    .copy-right {}
    /* * FOOTER SECTION END */
    /*! ============================================== HOMW PAGE CSS END ============================================================ */
    /*  */
    /*  */
    /*  */
    /* todo: ====================== SERVICE PAGE START ORM =============================== */
    /* ?WHAT IS ORM START */
    
    .text-justify {
        text-align: justify;
    }
    
    .whats-orm-section {
        padding: 40px 0;
    }
    
    .orm-frame {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .orm-box {
        width: 50%;
    }
    
    .orm-imgL {
        margin-left: 11%;
        width: clamp(250px, 100%, 584px);
    }
    
    .orm-box:first-child {
        padding: 40px 5px 40px 5%;
    }
    
    .show-120 {
        display: none;
    }
    /* ?WHAT IS ORM END */
    /* *--- */
    /* *--- */
    /* ?CHANNEL CSS START  */
    
    .channels-frame {
        margin-top: 40px;
        padding: 80px 0;
        border: 4px solid #6FB3B8;
        box-shadow: 9px 8px 0 2px #6FB3B8;
        border-radius: 50px;
        background: #F6F6F2;
    }
    
    .channels-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .channels-icon>img {
        margin: 40px 24px;
    }
    /* ?CHANNEL CSS END */
    /* * */
    /* * */
    /* ? YOUR DUSINESS NESS START  */
    
    .padding-TB {
        padding: 1% 18% 3%;
        text-align: center;
        /* max-width: 942px; */
    }
    
    .gray-F8F {
        color: #F8F8F8 !important;
    }
    
    .busMx-height {
        margin-top: 50px !important;
        padding: 80px 0 !important;
        height: auto;
    }
    
    .bus-box {
        width: clamp(200px, 100%, 275px);
        margin-top: 2.5%;
    }
    /* ? YOUR DUSINESS NESS END */
    /* ?=========================== ORM PACKAGES AND PRICING START =============================== */
    
    .circle-check,
    .off-close {
        width: 26.67PX;
        height: 26.67PX;
    }
    
    .mb-show {
        display: none;
    }
    
    .seo-pack-pri-table-frame {
        overflow: auto;
        display: flex;
        /* flex-direction: column; */
        justify-content: center;
    }
    
    .seo-pack-pri-table {
        width: clamp(1050px, 100%, 1230px) !important;
        width: 100%;
        max-width: 1300px;
        min-width: 1050px;
        /* background: #F4F4F4; */
        border-radius: 40px !important;
        overflow: hidden;
    }
    
    .seo-pack-pricing-buttons {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .seo-pk-active {
        background: #6FB3B8 !important;
    }
    
    .br-49 {
        border-radius: 49px;
    }
    
    .set-width {
        width: 25% !important;
    }
    
    .bg-F4F {
        background-color: #F4F4F4 !important;
    }
    
    .bg-D0D {
        background: #D0D0D0 !important;
    }
    
    .boder-r-rb {
        border-radius: 0 0 40px 0!important;
        outline: solid 1px rgb(224, 224, 224) !important;
        /* outline: solid 1px rgb(224, 224, 224) !important; */
    }
    
    .boder-r-lb {
        border-radius: 0 0 0 40px!important;
        outline: solid 1px rgb(224, 224, 224) !important;
    }
    
    .bR-bottm-lingh {
        border-bottom: 1px solid rgb(224, 224, 224) !important;
    }
    
    .left-b-w {
        border-left-width: 0 !important;
    }
    
    .right-b-w {
        border-right-width: 0 !important
    }
    
    .constum-select-seo {
        background-color: #F4F4F4;
        outline: none;
        background: #FFFFFF;
        border: 1px solid #9B9B9B;
        border-radius: 64px;
        box-shadow: none !important;
    }
    
    .constum-select-seo>button {
        outline: none !important;
        border: 0;
    }
    
    .tfoot-border>td {
        border: none;
        padding: 30px 10px 10px;
    }
    
    .fs-48-32 {
        font-family: 'Fredoka';
        font-style: normal;
        font-weight: 600;
        font-size: 48px;
        line-height: 58px;
    }
    /* ?=========================== ORM PACKAGES AND PRICING END =============================== */
    /* ? CUSTOM PACKAGES START */
    
    .custom-package-section {
        padding: 72px 0;
        background: linear-gradient(180deg, #F0F0E9 0%, #F6F6F2 100%);
    }
    
    .custom-section {
        display: flex;
        align-items: start;
        justify-content: center;
        flex-wrap: wrap;
        gap: 38px;
    }
    
    .custom-box {
        width: 30%;
    }
    
    .custom-box:nth-child(2),
    .custom-box:nth-child(3) {
        width: auto;
        max-width: 350px;
    }
    
    .text-algin {
        text-align: left;
    }
    
    .blue-6FB {
        color: #6FB3B8;
    }
    
    .fx-14 {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 21px;
    }
    
    .text-box {
        width: clamp(200px, 100%, 340px);
        height: 163px;
        display: block;
        font-size: 14px;
        color: #388087;
        line-height: 21px;
        border: 1px solid #BADFE7;
        box-shadow: 0 1px 2px rgba(50, 43, 95, 0.08);
        border-radius: 4px;
        margin: 4px 0;
        padding: 12px 16px;
    }
    
    .input-box::placeholder,
    .place-holder,
    .text-box::placeholder {
        font-size: 14px;
        color: #388087;
        line-height: 21px;
    }
    
    .input-box {
        width: clamp(200px, 100%, 340px);
        display: block;
        height: 45px;
        padding: 12px 16px;
        font-size: 14px;
        color: #388087;
        line-height: 21px;
        border: 1px solid #BADFE7;
        box-shadow: 0 1px 2px rgba(50, 43, 95, 0.08);
        border-radius: 4px;
        margin: 4px 0;
    }
    
    .sixe-custom {
        width: 24px;
        height: 24px;
        object-fit: contain;
        float: right;
    }
    
    .ck-box {
        width: 30px;
    }
    
    #checkbox {
        width: 18px;
        height: 18px;
    }
    
    .seo-ck-box:first-child {
        width: 30px;
    }
    
    .seo-ck-box:last-child {
        width: 95%;
    }
    
    .ck-text {}
    
    .blue-397 {
        color: #397BFC;
    }
    
    .input-field-box {
        display: flex;
        align-items: center;
        justify-content: space-between;
        border: 1px solid #BADFE7;
        box-shadow: 0 1px 2px rgba(50, 43, 95, 0.08);
        border-radius: 4px;
        background-color: white;
        margin: 4px 0;
        height: 45px;
        width: clamp(200px, 100%, 340px);
        padding: 12px 16px;
    }
    /* ? CUSTOM PACKAGES END */
    /*  */
    /* todo: ====================== SERVICE PAGE END ORM =============================== */
    /* *------------------------------------- ABOUT US PAGE START ------------------------------ */
    
    .about-us-section {
        max-height: 797px;
    }
    
    .about-hero-img {
        width: clamp(200px, 100%, 783px);
        height: clamp(400px, 100%, 686.06);
    }
    
    .add-mt-about {
        margin-top: 40px;
    }
    
    .about-sec-mxw {
        max-width: 595px;
    }
    
    .about-sec-p-mxw {
        max-width: 968px;
    }
    
    .about-sec-mxh {
        max-height: 539px;
    }
    
    .about-service-sec {
        margin: 40px 0 0;
    }
    
    .bg-doted-circle {
        position: relative;
        padding: 50px 0 0;
    }
    
    .bg-doted-circle::before {
        position: absolute;
        content: "";
        left: 5%;
        top: 5%;
        width: 118px;
        height: 118px;
        border-radius: 200px;
        background: #FDCF48;
    }
    
    .bg-doted-circle::after {
        position: absolute;
        content: "";
        right: 5%;
        bottom: 5%;
        width: 26px;
        height: 26px;
        border-radius: 200px;
        border: 5px solid #33D4BA;
    }
    /* *------------------------------------- ABOUT US PAGE END ------------------------------ */
    /*  */
    /*  */
    /* todo: ------------------------------ FAQ START ---------------------------------- */
    
    .faq-hero-frame {
        padding: 80px 0;
        position: relative;
    }
    
    .faq-hero-section {
        position: relative;
        background: #F8F8F8;
        border-radius: 0px 0px 0px 200px;
    }
    
    .faq-hero-frame::after {
        position: absolute;
        content: "";
        right: 20px;
        top: 42%;
        width: 57px;
        height: 57px;
        border-radius: 200px;
        background: #6DC3F2;
    }
    
    .faq-hero-frame::before {
        position: absolute;
        content: "";
        left: 15%;
        bottom: 24%;
        width: 25px;
        height: 25px;
        border-radius: 200px;
        border: 6px solid #33D4BA;
        /* background: #6DC3F2; */
    }
    
    .faq-p-mxw {
        max-width: 760px;
        width: 100%;
        margin: 24px auto;
    }
    
    .faq-hero-section::after {
        position: absolute;
        content: "";
        right: 5%;
        top: 19%;
        width: 25px;
        height: 25px;
        border-radius: 200px;
        border: 6px solid #F79596;
    }
    
    .faq-hero-section::before {
        position: absolute;
        content: "";
        left: 11%;
        top: 19%;
        width: 92px;
        height: 159px;
        background: url("../images/DotedGroup.svg") no-repeat center;
        background-size: contain;
    }
    
    .hero-container.faq {
        background: url("../images/faq-bg.png");
        height: auto;
    }
    
    .faq-hero {
        text-align: center;
        padding: 50px 0 100px;
    }
    
    .faq-body {
        background: #F6F6F2;
    }
    
    .hero-sub-heading.faq-subheading {
        text-align: center;
    }
    
    .faq-wrapper {
        /* padding: 55px 0; */
    }
    
    .accordion.faq-accordion {
        margin: 0 auto;
        padding: 2.1% 0;
    }
    
    .accordion-header {
        padding: 13px 51px;
        background: #BADFE7;
        border-radius: 95px;
        /* margin-bottom: 34px; */
    }
    
    .accordion-button.faq-accordion-button {
        background-color: transparent;
        box-shadow: none;
        font-family: 'Fredoka';
        font-style: normal;
        font-weight: 500;
        font-size: 32px;
        line-height: 39px;
        /* identical to box height */
        text-transform: capitalize;
        /* Grayscale/Black */
        color: #000000;
        padding: 17px 5%;
    }
    
    .accordion-body {
        width: 95%;
        padding: 40px 5% 20px 5%;
        font-family: 'Helvetica';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 30px;
        letter-spacing: 0.04em;
        text-transform: capitalize;
        color: #717171;
    }
    
    .faq-accordion-item {
        border: 0;
        margin-bottom: 30px;
        background-color: transparent;
    }
    
    .accordion-button::after {
        background: url(../images/plus.svg)no-repeat center;
        height: 30px;
        width: 30px;
    }
    
    .accordion-button:not(.collapsed)::after {
        background: url("../images/minus.svg") no-repeat center;
        transform: none;
        height: 30px;
    }
    /* todo: ------------------------------ FAQ END ---------------------------------- */
    /*  */
    /*  */
    
    .homeHerobgimg {
        background: url(../images/HomeHerobgimg.svg) no-repeat !important;
        background-size: contain !important;
    }
    /*  */
    /* todo: ------------------------------ ERROR START 404 ---------------------------------- */
    
    .error-404-section {
        padding: 80px 0;
        height: 992px;
    }
    
    .erro-image-colum {
        height: 587px;
        background: url("../images/Error_404-bg.svg") no-repeat right;
        background-size: contain;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .erro-img {
        width: clamp(200px, 100%, 1003px);
    }
    
    .fx-48 {
        font-family: 'Fredoka';
        font-style: normal;
        font-weight: 600;
        font-size: 48px;
        line-height: 58px;
    }
    
    .error-conten-colum {
        padding: 40px 5%;
    }
    /* todo: ------------------------------ ERROR 404 END ---------------------------------- */
    
    .term-con-bg-frmae {
        position: relative;
        background: #F6F6F2;
        padding: 30px 0 150px 0;
    }
    
    .term-con-bg-frmae::before {
        position: absolute;
        content: "";
        right: 0;
        top: 50%;
        width: 261px;
        height: 807px;
        transform: translateY(-50%);
        background: url(../images/TC-doted-left.svg) no-repeat center;
        background-size: contain;
    }
    
    .term-con-bg-frmae::after {
        position: absolute;
        content: "";
        left: 0;
        top: 50%;
        width: 261px;
        height: 807px;
        transform: translateY(-50%);
        background: url(../images/TC-doted-right.svg) no-repeat left;
        background-size: contain;
    }
    
    .terms-condtion-text {
        width: 100%;
        color: #3C3C3C;
        /* margin: 30px 0; */
        border-radius: 10px;
        text-align: justify !important;
        white-space: pre-line;
        word-wrap: break-word;
        background: linear-gradient(180deg, #F0F0E9 0%, #F6F6F2 100%), #FFFFFF;
        /* Moonstone blue */
        border: 8px solid #6FB3B8;
        box-shadow: 6px 3px 0 2px #6FB3B8;
        border-radius: 20px;
        padding: 40px;
    }
    
    .fs-20-14 {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 700;
        font-size: 20px;
        line-height: 31px;
    }
    
    .get-toch-box {
        width: clamp(200px, 100%, 848px);
        background: hwb(60 91% 6%);
        border: 8px solid #6FB3B8;
        box-shadow: 9px 8px 0 2px #6FB3B8;
        border-radius: 20px;
        padding: 70px;
    }
    
    .git-section {
        background: #EBEBEB url(../images/contactUsBgimg.svg) no-repeat;
        background-size: auto;
    }
    
    .get-toch-box {
        margin: 80px auto;
    }
    
    .input-frame {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 28px;
    }
    /* ? LOGIN START */
    
    .login-frame-box {
        width: clamp(200px, 100%, 571px);
        background: #F6F6F2;
        border: 8px solid #6FB3B8;
        box-shadow: 9px 8px 0px 2px #6FB3B8;
        border-radius: 20px;
        padding: 70px 24px 50px 24px;
        display: flex;
        justify-content: start;
        align-items: center;
        flex-direction: column;
        /* position: relative; */
    }
    /* .login-frame-box::after {
    position: absolute;
    content: "";
    width: 103%;
    height: 103%;
    background-color: #6FB3B8;
    border-radius: 20px;
    top: -1px;
    left: 4px;
    z-index: -1;
} */
    
    .login-section,
    .signup-section {
        padding: 80px 0;
        position: relative;
    }
    
    .blue-005 {
        color: #005BB9;
    }
    
    .mw-340 {
        max-width: 340px;
    }
    
    .signup-section::before {
        position: absolute;
        content: "";
        width: 92px;
        height: 159px;
        left: 9%;
        top: 61%;
        background: url(../images/DotedGroup.svg) no-repeat center;
        background-size: auto;
        z-index: -1;
    }
    
    .signup-section::after {
        position: absolute;
        content: "";
        width: 25px;
        height: 25px;
        left: 5%;
        top: 21%;
        border: 6px solid #33D4BA;
        border-radius: 200px;
        z-index: -1;
    }
    
    .login-section::before {
        position: absolute;
        content: "";
        width: 92px;
        height: 159px;
        right: 60px;
        top: 55%;
        background: url(../images/DotedGroup.svg) no-repeat center;
        background-size: auto;
        z-index: -1;
    }
    
    .login-section::after {
        position: absolute;
        content: "";
        width: clamp(200px, 100%, 1364px);
        height: 95%;
        max-height: 810px;
        /* border: 2px solid red; */
        right: 6vw;
        top: 6%;
        background: url(../images/LoginBG-dote.svg) no-repeat center;
        background-size: contain;
        z-index: -1;
    }
    
    .login-frame {
        display: flex;
        align-items: center;
        justify-content: left;
    }
    
    .login-colum {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .login-hero-img {
        width: clamp(200px, 100%, 926px);
    }
    
    .input-lable {
        width: 100%;
        max-width: 340px;
    }
    
    .popup-container {
        position: absolute;
        top: 50%;
        left: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100vh;
        background: rgba(0, 0, 0, 0.2);
    }
    
    #popup {
        transform: translate(-50%, -50%) scale(0);
        transition: all .3s;
    }
    
    .popup-frame {
        width: 100%;
        margin: auto;
        max-width: 891px;
        padding: 68px;
        background: #F6F6F2;
        border: 1px solid #388087;
        border-radius: 20px;
        text-align: center;
    }
    
    .adjest-w {
        width: clamp(197px, 50%, 340px) !important;
    }
    /* ? LOGIN END */
    /* ? SIGN UP START */
    
    .sign-frame {
        display: flex;
        justify-content: end;
    }
    
    .signup-hero-img {
        width: 100%;
        max-width: 1000px;
        max-height: 854px;
        margin-top: 80px;
    }
    
    .signup-colum:first-child {
        display: flex;
        justify-content: end;
        padding-right: 2%;
    }
    
    .signup-colum:last-child {
        background: url(../images/signUp-r-BG.svg)no-repeat center;
        background-size: contain;
    }
    
    .mw-signUp {
        width: clamp(200px, 100%, 594px);
        max-height: 859px;
    }
    
    .black-BAD {
        color: #BADFE7 !important;
    }
    /* ? SIGN UP END */
    /* ?___________-- CHECK OUT START ________________________________ */
    
    .checkout-form-section {
        position: relative;
        padding: 40px 0;
        max-height: 780px;
    }
    
    .checkout-form-section::after {
        position: absolute;
        content: "";
        width: 328px;
        height: 586px;
        right: 0;
        top: 207px;
        background: url(../images/DotRight.svg) no-repeat center;
        background-size: cover;
        z-index: -1;
    }
    
    .ChackContainer {
        padding: 0 5%;
    }
    
    .checkout-form-section::before {
        position: absolute;
        content: "";
        width: 328px;
        height: 586px;
        left: 0;
        top: 207px;
        background: url(../images/DotLeft.svg) no-repeat center;
        background-size: cover;
        z-index: -1;
    }
    
    .checkout-frame {
        display: flex;
        align-items: center;
        justify-content: center;
        /* flex-wrap: wrap; */
        gap: 33px;
    }
    
    .min-ck-w {
        min-width: 266px;
        max-width: 266px;
    }
    
    .fw-500 {
        font-weight: 500 !important;
    }
    
    .gray-9B9 {
        color: #9B9B9B;
    }
    
    .seo-p-pack:first-child {
        margin-top: 16px;
    }
    
    .seo-p-pack {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 16px 0;
    }
    
    .total-amount {
        border-bottom: 1px solid #656565;
        border-top: 1px solid #656565;
        margin-top: 25px;
    }
    /* *COPY CSS start-------------------------------- */
    
    .mw-checkout {
        width: clamp(200px, 100%, 729px);
        padding: 70px;
        background: #F0F0E9;
    }
    
    .fs-64-32 {
        font-family: 'Cormorant Garamond';
        font-style: normal;
        font-weight: 400;
        font-size: 64px;
        line-height: 89px;
    }
    
    .max-width-ck,
    .oder-summary {
        width: clamp(200px, 100%, 483px) !important;
    }
    
    .fx-24 {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 600;
        font-size: 24px;
        line-height: 24px;
    }
    /* *COPY CSS END-------------------------------- */
    
    .summary-frame-bx {
        width: clamp(200px, 100%, 528px);
        /* height: 881px; */
        background: #BADFE7;
        border-radius: 40px;
        padding: 86px 40px;
    }
    
    .fx-32 {
        font-family: 'Fredoka';
        font-style: normal;
        font-weight: 500;
        font-size: 32px;
        line-height: 39px;
    }
    
    .ck-input-wraper {
        gap: 24px;
    }
    /* ?___________-- CHECK OUT END ________________________________ */
    /*  */
    /*  */
    /* ?------------------ PamentSucces-section ------------------- */
    
    .PamentSucces-section {
        position: relative;
        padding: 40px 0;
    }
    
    .PamentSucces-section::after {
        position: absolute;
        content: "";
        width: 695px;
        height: 588px;
        left: 0;
        top: 73px;
        background: url(../images/sucess-left-dote.svg) no-repeat left;
        background-size: contain;
        z-index: -1;
    }
    
    .PamentSucces-section::before {
        position: absolute;
        content: "";
        width: 695px;
        height: 588px;
        right: 0;
        top: 73px;
        background: url(../images/succes-right-dote.svg) no-repeat right;
        background-size: contain;
        z-index: -1;
    }
    
    .bg-007 {
        background-color: #007800 !important;
    }
    
    .bg-C94 {
        background-color: #C94A4A !important;
    }
    /* ?------------------ PamentSucces-section End ------------------- */
    
    .mw-accountDetails {
        width: clamp(200px, 100%, 935px);
        padding: 70px !important;
        background: #F0F0E9;
    }
    /* ?================= ACCOUNT PAGE START ==================== */
    
    .fs-32-26 {
        font-family: 'Fredoka';
        font-style: normal;
        font-weight: 500;
        font-size: 32px;
        line-height: 39px;
        color: #388087;
    }
    
    .bg-F6F {
        background-color: #F6F6F2 !important;
    }
    
    .input-filed {
        width: 100%;
        padding: 12px 16px;
        background: #FFFFFF;
        border: 1px solid #BADFE7;
        box-shadow: 0px 1px 2px rgba(50, 43, 95, 0.08);
        border-radius: 4px;
        font-family: 'Lato';
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 21px;
    }
    
    .lab-mxw {
        max-width: 372.5px;
    }
    
    .input-lable {
        width: 100%;
    }
    
    .input-wrapper {
        gap: 28px;
        margin-top: 21px;
    }
    
    .margin-TB {
        margin: 32px auto;
    }
    
    .sec-box-acc {
        margin-top: 32px;
    }
    
    .side-nav-frame {
        width: clamp(200px, 100%, 500px);
        background: #388087;
        border-radius: 50px;
        padding: 25px 40px;
    }
    
    .side-nav-active {
        color: #000000 !important;
    }
    
    .checkout-form-section {
        max-height: none !important;
        background: #F6F6F2;
    }
    
    .fs-16-13 {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 600;
        font-size: 16px;
        line-height: 19px;
    }
    
    .nac-colum>a {
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: black;
        text-decoration: none;
        cursor: pointer;
    }
    
    .nac-colum>a>img {
        margin-right: 10px;
    }
    
    .fs-64-48 {
        font-family: 'Fredoka';
        font-style: normal;
        font-weight: 600;
        font-size: 64px;
        line-height: 77px;
        color: #F8F8F8;
    }
    /* ?================= ACCOUNT PAGE END ==================== */
    
    .orderhistory-form-section {
        /* height: 650px; */
        padding: 56px 0 64px 0;
        background: url(../images/OrderHistoryBgImg.svg) no-repeat center;
        background-size: contain;
    }
    
    .orderhistory-form-section::after,
    .orderhistory-form-section::before {
        top: 50% !important;
        transform: translateY(-50%);
        width: 100%;
        max-width: 540px;
        /* background-size: contain; */
    }
    
    .wrapper-oh {
        width: 867px;
        overflow: hidden;
        scroll-behavior: smooth;
        /* height: 530px; */
        background: #F0F0E9;
        border: 8px solid #6FB3B8;
        box-shadow: 9px 8px 0px 2px #6FB3B8;
        border-radius: 20px;
        padding: 70px 70px 60px 70px;
    }
    
    .fs-16-13 {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 26px;
        /* identical to box height, or 26px */
        letter-spacing: 0.5px;
    }
    
    .table-hesd {
        border-bottom: 1px solid #149CD6;
    }
    
    .pd-x {
        padding-left: 14px;
        padding-right: 21px;
    }
    
    .mt-57 {
        margin-top: 40px;
    }
    
    .fx-width {
        width: 119px;
        text-underline-offset: 5px;
    }
    
    .blue-005 {
        color: #005BB9 !important;
    }
    
    .fx-hero-heigh {
        max-height: 694.1px;
    }
@media only screen and (min-width: 1651px) and (max-width:1840px){
  .services-circle {
      min-width: 293px;
      width: 302px;
      height: 294px;
  }
}