@import"https://api.fontshare.com/v2/css?f[]=lora@401,501&f[]=switzer@300,400,500,600&f[]=supreme@300,400,500,700&display=swap";

:root {
    --font-family: "Switzer", sans-serif;
    --font-family1: "Supreme", sans-serif;
    --font-family2: "Lora", serif;
    --color1: #469114;
    --color2: #f29d20;
    --color3: #f2f7ef;
    --color4: #f5f5dc;
    --color5: #ecebe3;
    --color6: #28cf8c;
    --highlight: #469114;
    --white: light-dark(#ffffff, #0f0f0f);
    --lightGray: light-dark(#f9f9f9, #272727);
    --borderGray: light-dark(#e8e8e9, #242323);
    --visibleGray: light-dark(#c4c7c5, #2c2b2b);
    --textGray: light-dark(#a3a3a4, #898989);
    --gray: light-dark(#5d5e5f, #454545);
    --darkGray: light-dark(#23262F, #b5b7be);
    --black: light-dark(#161718, #fafafa);
    --red: #ec4c4c;
    --green: #3cc274;
    --blue: #546bd4;
    --yellow: #f5a905;
    --inputColor: light-dark(#4a6a33, #c7f5d4);
    --inputColor1: color-mix(in srgb, var(--inputColor), var(--bg-color) 97%);
    --inputColor2: color-mix(in srgb, var(--inputColor), var(--bg-color) 90%);
    --inputColor3: color-mix(in srgb, var(--inputColor), var(--bg-color) 70%);
    --inputColor4: color-mix(in srgb, var(--inputColor), var(--bg-color) 50%);
    --inputColor5: color-mix(in srgb, var(--inputColor), var(--bg-color) 30%);
    --input-size: .75rem;
    --gradient1: radial-gradient(at 98.6% 68.3%, #ecffd4 0px, transparent 50%), radial-gradient(at 4.8% 63.1%, #f2f5ff 0px, transparent 50%), radial-gradient(at 7.8% 85.1%, #bdd4ff 0px, transparent 50%), radial-gradient(at 21% 80.7%, #c9dcff 0px, transparent 50%), radial-gradient(at 64.3% 80.3%, #eaffe6 0px, transparent 50%);
    --gradient2: linear-gradient(to right top, #111118, #13151a, #15181c, #181b1e, #1b1e20, #1c1f21, #1d1f22, #1e2023, #1d1f23, #1c1e22, #1b1c22, #1b1b21);
    --gradient3: linear-gradient(to right top, #eff3ff, #edf2ff, #ecf0ff, #eaefff, #e8eeff, #e6ecff, #e3ebff, #e1e9ff, #dee7ff, #dbe4ff, #d8e2ff, #d5dfff);
    --radius: 30px;
    --inputRadius: 15px;
    --btnRadius: 40px;
    --transition1: all .3s cubic-bezier(0.25, 0.1, 0.25, 1);
    --transition2: all .5s cubic-bezier(0.77, 0, 0.175, 1);
    --transition3: 0.7s cubic-bezier(0.37, 0, 0.63, 1);
    --shadow-1: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    --shadow-2: rgba(0, 0, 0, 0.075) 0px 3px 6px, rgba(0, 0, 0, 0.116) 0px 3px 6px;
    --shadow-3: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
    --text-color: light-dark(#121212, #e0e0e0);
    --bg-color: light-dark(#ffffff, #121212);
    --shade-1: color-mix(in srgb, var(--bg-color), #fdfdfd 80%);
    --shade-2: color-mix(in srgb, var(--bg-color), #ecf0ef 70%);
    --shade-3: color-mix(in srgb, var(--bg-color), #d9dfde 50%);
    --shade-4: color-mix(in srgb, var(--bg-color), #b0b6b1 40%);
    --shade-5: color-mix(in srgb, var(--bg-color), #8a8e8b 20%);
    --section-space-x: clamp(1.5rem, 4vw, 3rem);
    --section-space-y: clamp(1.5rem, 4vw, 3rem);
    --section-max-width: 1200px;
    --container-max-width: 100%
}

@font-face {
    font-family: "Recoleta";
    src: url("/assets/font/Recoleta-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal
}

@font-face {
    font-family: "Recoleta";
    src: url("/assets/font/Recoleta-RegularDEMO.woff") format("woff");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: "Recoleta";
    src: url("/assets/font/Recoleta-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal
}

@font-face {
    font-family: "Recoleta";
    src: url("/assets/font/Recoleta-SemiBold.woff") format("woff");
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: "Recoleta";
    src: url("/assets/font/Recoleta-Bold.woff") format("woff");
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: "Recoleta";
    src: url("/assets/font/Recoleta-ExtraBold.woff") format("woff");
    font-weight: 800;
    font-style: normal
}

@font-face {
    font-family: "Recoleta";
    src: url("/assets/font/Recoleta-Black.woff") format("woff");
    font-weight: 900;
    font-style: normal
}

.section {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden
}

.sectionLeft, .section-left {
    clear: both;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%)
}

.sectionRight, .section-right {
    clear: both;
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%)
}

.innerSection {
    width: 100%;
    padding-right: clamp(0px,(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(0px,(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    margin: 0 auto
}

.sectionPadding {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y)
}

.sectionPaddingTop {
    padding-top: var(--section-space-y)
}

.sectionPaddingBottom {
    padding-bottom: var(--section-space-y)
}

.btnDiv {
    margin-top: .7075rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: clamp(16px,1.5vw,20px)
}

a, button, [type=button] {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-family: inherit;
    background-color: rgba(0,0,0,0);
    -webkit-writing-mode: horizontal-tb;
    text-rendering: auto;
    list-style: 1;
    cursor: pointer
}

    a:disabled, button:disabled, [type=button]:disabled {
        font-weight: 500;
        color: var(--gray);
        background-color: var(--borderGray);
        border: 1px solid var(--borderGray);
        -webkit-box-shadow: none;
        box-shadow: none;
        opacity: .8;
        pointer-events: none;
        cursor: not-allowed
    }

    a img, button img, [type=button] img {
        margin: 0
    }

    a *, button *, [type=button] * {
        -webkit-transition: var(--transition1);
        transition: var(--transition1);
        cursor: pointer
    }

.loader {
    display: none;
    width: 15px;
    height: 15px
}

    .loader::before {
        content: "";
        display: block;
        width: 10px;
        height: 10px;
        background-color: rgba(0,0,0,0);
        border: 2px solid inherit;
        border-top: 2px solid rgba(0,0,0,0);
        border-radius: 100%;
        -webkit-animation: loader1 .5s ease-in-out infinite;
        animation: loader1 .5s ease-in-out infinite
    }

@-webkit-keyframes loader1 {
    0% {
        -webkit-transform: translate(0%, 0%) rotate(0deg);
        transform: translate(0%, 0%) rotate(0deg)
    }

    100% {
        -webkit-transform: translate(0%, 0%) rotate(360deg);
        transform: translate(0%, 0%) rotate(360deg)
    }
}

@keyframes loader1 {
    0% {
        -webkit-transform: translate(0%, 0%) rotate(0deg);
        transform: translate(0%, 0%) rotate(0deg)
    }

    100% {
        -webkit-transform: translate(0%, 0%) rotate(360deg);
        transform: translate(0%, 0%) rotate(360deg)
    }
}

body #mainContainer .headerSection .navbar .chatBtn, body #mainContainer .headerSection .wishlistBtn, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .btnDiv .backBtn, .searchWallSection form button, .searchWallSection form a, .searchWallSection form #searchSubmitBtn, .searchWallSection #searchForm button, .searchWallSection #searchForm a, .searchWallSection #searchForm #searchSubmitBtn, .searchWallSection .quickLinksDiv .quickLinks a, .heroSection form button, .heroSection .form button, .aboutHeroSection form button, .aboutHeroSection .form button, .wideHreoBannerSection form button, .wideHreoBannerSection .form button, .inputTable td button, .inputTable td [rowGeneratorCallback], .inputTable td [row_generator_callback], .addonModules .addonModuleCard td button, .addonModules .addonModuleCard td [rowGeneratorCallback], .addonModules .addonModuleCard td [row_generator_callback], .addonModules .addonModulesBtnDiv .addModuleBtn, .fileWrapper .uploadedFilesContainer .deleteFileButton, .btn-white-stroke, .btnWhiteStroke, .linkBtn, .textBtn, .outlinedBtn, .btn2, .filledTonalBtn, .filledBtn, .btn1, .btn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 4px;
    text-align: center;
    border-radius: var(--btnRadius);
    white-space: nowrap;
    line-height: 1;
    letter-spacing: .5px;
    overflow: hidden;
    -webkit-transition: background-color .5s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-transform .5s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-box-shadow .5s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: background-color .5s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-transform .5s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-box-shadow .5s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform .5s cubic-bezier(0.165, 0.84, 0.44, 1),background-color .5s cubic-bezier(0.165, 0.84, 0.44, 1),box-shadow .5s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: transform .5s cubic-bezier(0.165, 0.84, 0.44, 1),background-color .5s cubic-bezier(0.165, 0.84, 0.44, 1),box-shadow .5s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-transform .5s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-box-shadow .5s cubic-bezier(0.165, 0.84, 0.44, 1)
}

.filledBtn, .btn1 {
    color: var(--white);
    font-weight: 500;
    -webkit-filter: brightness(100%);
    filter: brightness(100%);
    background-color: var(--color1);
    border: 1px solid var(--color1);
    -webkit-box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
    box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2)
}

    .filledBtn:hover, .btn1:hover {
        color: var(--white);
        -webkit-filter: brightness(110%);
        filter: brightness(110%);
        border: 1px solid rgba(0,0,0,0);
        -webkit-box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
        box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
        -webkit-transition: background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-filter .5s ease-in,-webkit-box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-filter .5s ease-in,-webkit-box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: filter .5s ease-in,background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: filter .5s ease-in,background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-filter .5s ease-in,-webkit-box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1)
    }

    .filledBtn:active, .btn1:active {
        -webkit-filter: brightness(105%);
        filter: brightness(105%)
    }

    .filledBtn:visited, .btn1:visited {
        -webkit-filter: brightness(90%);
        filter: brightness(90%)
    }

    .filledBtn.secondary, .btn1.secondary {
        background-color: var(--color2);
        border: 1px solid var(--color2)
    }

    .filledBtn.tertiary, .btn1.tertiary {
        background-color: var(--color3);
        border: 1px solid var(--color3)
    }

    .filledBtn.black, .btn1.black {
        color: var(--white);
        background-color: var(--black);
        border: 1px solid var(--darkGray)
    }

    .filledBtn.white, .btn1.white {
        color: var(--black);
        background-color: var(--white);
        border: 1px solid var(--borderGray)
    }

    .filledBtn.red, .btn1.red {
        color: var(--white);
        background-color: var(--red);
        border: 1px solid var(--red)
    }

    .filledBtn.green, .btn1.green {
        color: var(--white);
        background-color: var(--green);
        border: 1px solid var(--green)
    }

    .filledBtn.blue, .btn1.blue {
        color: var(--white);
        background-color: var(--blue);
        border: 1px solid var(--blue)
    }

    .filledBtn.elevated, .btn1.elevated {
        -webkit-box-shadow: 0 4px 4px rgba(8,8,8,.08),0 1px 2px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.048),inset 0 1px 1px hsla(0,0%,100%,.2) !important;
        box-shadow: 0 4px 4px rgba(8,8,8,.08),0 1px 2px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.048),inset 0 1px 1px hsla(0,0%,100%,.2) !important
    }

        .filledBtn.elevated:hover, .btn1.elevated:hover {
            -webkit-box-shadow: 0 1px 1px rgba(8,8,8,.08),0 1px 1px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.12),inset 0 1px 1px hsla(0,0%,100%,.2) !important;
            box-shadow: 0 1px 1px rgba(8,8,8,.08),0 1px 1px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.12),inset 0 1px 1px hsla(0,0%,100%,.2) !important
        }

    .filledBtn .loader::before, .btn1 .loader::before {
        border: 2px solid var(--white)
    }

.filledTonalBtn {
    color: var(--color1);
    background-color: var(--color1)
}

.outlinedBtn, .btn2 {
    font-weight: 500;
    color: var(--color1);
    background-color: rgba(0,0,0,0);
    border: 1px solid var(--color1)
}

    .outlinedBtn:hover, .btn2:hover {
        opacity: .8
    }

    .outlinedBtn.secondary, .btn2.secondary {
        border: 1px solid var(--color2)
    }

    .outlinedBtn.tertiary, .btn2.tertiary {
        border: 1px solid var(--color3)
    }

    .outlinedBtn.black, .btn2.black {
        color: var(--black);
        border: 1px solid var(--black)
    }

    .outlinedBtn.white, .btn2.white {
        color: var(--white);
        border: 1px solid var(--white)
    }

    .outlinedBtn.gray, .btn2.gray {
        color: var(--textGray);
        border: 1px solid var(--textGray)
    }

    .outlinedBtn.red, .btn2.red {
        color: var(--red);
        border: 1px solid var(--red)
    }

    .outlinedBtn.green, .btn2.green {
        color: var(--green);
        border: 1px solid var(--green)
    }

    .outlinedBtn.blue, .btn2.blue {
        color: var(--blue);
        border: 1px solid var(--blue)
    }

.textBtn {
    color: var(--color1);
    background-color: rgba(0,0,0,0);
    border: none;
    border-radius: 0
}

    .textBtn:disabled {
        border-color: rgba(0,0,0,0);
        background-color: rgba(0,0,0,0)
    }

    .textBtn:hover {
        color: var(--white)
    }

    .textBtn.secondary {
        color: var(--color2)
    }

    .textBtn.tertiary {
        color: var(--color3)
    }

    .textBtn.black {
        color: var(--black)
    }

    .textBtn.white {
        color: var(--white)
    }

    .textBtn.red {
        color: var(--red)
    }

    .textBtn.green {
        color: var(--green)
    }

    .textBtn.blue {
        color: var(--blue)
    }

.linkBtn:disabled {
    border-color: rgba(0,0,0,0);
    background-color: rgba(0,0,0,0)
}

.linkBtn:hover {
    color: var(--white)
}

.btn-white-stroke, .btnWhiteStroke {
    color: var(--white);
    font-weight: 400;
    background-color: rgba(0,0,0,0);
    border: 1px solid var(--white)
}

    .btn-white-stroke:hover, .btnWhiteStroke:hover {
        color: var(--black);
        background-color: var(--white);
        border: 1px solid var(--white)
    }

    .btn-white-stroke i, .btnWhiteStroke i {
        color: var(--gray)
    }

    .btn-white-stroke .loader::before, .btnWhiteStroke .loader::before {
        border: 2px solid var(--gray)
    }

.xxsBtn {
    height: clamp(20px,5vw,24px);
    font-size: .878rem;
    padding: 0 8px
}

.xxsIcon {
    height: clamp(20px,5vw,24px);
    width: clamp(20px,5vw,24px);
    font-size: .878rem
}

.xsBtn {
    height: clamp(25px,5.5vw,28px);
    font-size: .937rem;
    padding: 0 16px
}

.xsIcon {
    height: clamp(25px,5.5vw,28px);
    height: clamp(25px,5.5vw,28px);
    font-size: .937rem
}

.smBtn, .fileWrapper .uploadedFilesContainer .deleteFileButton {
    height: clamp(29px,6vw,32px);
    font-size: .878rem;
    padding: 0 20px
}

.smIcon {
    height: clamp(29px,6vw,32px);
    width: clamp(29px,6vw,32px);
    font-size: .878rem
}

.mdBtn {
    height: clamp(32px,6vw,40px);
    font-size: .878rem;
    padding: 0 16px
}

.mdIcon {
    height: clamp(32px,6vw,40px);
    width: clamp(32px,6vw,40px);
    font-size: .878rem
}

.lgBtn, .inputTable td button, .inputTable td [rowGeneratorCallback], .inputTable td [row_generator_callback], .addonModules .addonModuleCard td button, .addonModules .addonModuleCard td [rowGeneratorCallback], .addonModules .addonModuleCard td [row_generator_callback], .addonModules .addonModulesBtnDiv .addModuleBtn {
    height: clamp(45px,6vw,48px);
    font-size: .937rem;
    padding: 0 20px
}

.lgIcon {
    height: clamp(45px,6vw,48px);
    width: clamp(45px,6vw,48px);
    font-size: .937rem
}

.xlBtn {
    height: clamp(53px,6.5vw,56px);
    font-size: 1rem;
    padding: 0 24px
}

.xlIcon {
    height: clamp(53px,6.5vw,56px);
    width: clamp(53px,6.5vw,56px);
    font-size: 1rem
}

.xxlBtn {
    height: clamp(61px,7vw,64px);
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    padding: 0 28px
}

.xxlIcon {
    height: clamp(61px,7vw,64px);
    width: clamp(61px,7vw,64px);
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
}

.xsCard {
    width: 24.5%;
    min-width: 100px;
    margin-right: .75%;
    margin-left: .75%
}

.smCard {
    width: 49.5%;
    min-width: 100px
}

@media(min-width: 1024px) {
    .smCard {
        width: 32.5%
    }
}

.mdCard {
    width: 100%
}

@media(min-width: 1024px) {
    .mdCard {
        width: 49.5%
    }
}

.xxlCard {
    width: 100%
}

.xlDiv {
    width: 100%;
    min-width: 100%
}

.lgDiv {
    width: 100%;
    min-width: 100%
}

@media(min-width: 768px) {
    .lgDiv {
        width: 49%;
        min-width: 49%
    }
}

@media(min-width: 1024px) {
    .lgDiv {
        width: 74%;
        min-width: 74%
    }
}

.mdDiv {
    width: 100%;
    min-width: 100%
}

@media(min-width: 768px) {
    .mdDiv {
        width: 49%;
        min-width: 49%
    }
}

.smDiv {
    width: 49%;
    min-width: 49%
}

@media(min-width: 768px) {
    .smDiv {
        width: 31.3%;
        min-width: 31.3%
    }
}

.xsDiv {
    width: 49%;
    min-width: 49%
}

@media(min-width: 768px) {
    .xsDiv {
        width: 24%;
        min-width: 24%
    }
}

.xxsDiv {
    width: 18%;
    min-width: 100px
}

::-moz-selection {
    color: var(--white);
    background-color: var(--highlight)
}

::selection {
    color: var(--white);
    background-color: var(--highlight)
}

[mode] .messageBox {
    padding: .5rem
}

    [mode] .messageBox:empty {
        display: none
    }

    [mode] .messageBox::before {
        display: none;
        position: absolute;
        left: 5px;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 20px;
        height: 20px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        border-radius: 100%;
        font-size: .937rem;
        font-family: var(--icon-style) !important;
        font-style: normal;
        font-weight: normal !important;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        text-transform: none;
        line-height: 1
    }

[mode=alert] textarea, [mode=alert] input:not([type=checkbox]):not([type=radio]) {
    border-color: #e78971;
    -webkit-box-shadow: #fddad4 0px 0px 0px 1px;
    box-shadow: #fddad4 0px 0px 0px 1px
}

[mode=alert] .messageBox {
    background-color: #fff1e7;
    color: #ce6122
}

    [mode=alert] .messageBox::before {
        content: "";
        color: #dd573f
    }

[mode=error] textarea, [mode=error] input:not([type=checkbox]):not([type=radio]) {
    border-color: #ffb0b0;
    -webkit-box-shadow: #ffe1e1 0px 0px 0px 1px;
    box-shadow: #ffe1e1 0px 0px 0px 1px
}

[mode=error] .messageBox {
    background-color: #ffe7e7;
    color: #ce2222
}

    [mode=error] .messageBox::before {
        content: "";
        color: #dd3f3f
    }

[mode=success] textarea, [mode=success] input:not([type=checkbox]):not([type=radio]) {
    border-color: #81d781;
    -webkit-box-shadow: #cbffcb 0px 0px 0px 1px;
    box-shadow: #cbffcb 0px 0px 0px 1px
}

[mode=success] .messageBox {
    background-color: #e8ffe7;
    color: #169c04
}

    [mode=success] .messageBox::before {
        content: "";
        color: #3fdd3f
    }

[mode=warning] textarea, [mode=warning] input:not([type=checkbox]):not([type=radio]) {
    border-color: #d7af81;
    -webkit-box-shadow: #ffe7cb 0px 0px 0px 1px;
    box-shadow: #ffe7cb 0px 0px 0px 1px
}

[mode=warning] .messageBox {
    background-color: #fffbe7;
    color: #9c8004
}

    [mode=warning] .messageBox::before {
        content: "";
        color: #dd713f
    }

[mode=info] .messageBox::before {
    content: "";
    color: #d4d4d4
}

[mode=note] .messageBox::before {
    content: "";
    color: #dfdfdf
}

.messageBox {
    width: 100%;
    min-width: 100%;
    margin-top: 10px;
    color: var(--black);
    font-size: .733rem;
    font-weight: 500;
    border-radius: var(--inputRadius)
}

    .messageBox::first-letter {
        text-transform: uppercase
    }

    .messageBox:empty {
        padding: 0;
        margin-top: 0
    }

.formDiv {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 0 2%
}

form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 0 2%
}

label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--gray);
    font-family: var(--font-family);
    font-size: .878rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin-bottom: .25rem;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

input, textarea, select, datalist, selected, item {
    width: 100%;
    padding: var(--input-size);
    font-family: var(--font-family);
    font-size: 1rem;
    font-weight: 400;
    color: var(--text-color);
    line-height: 1.3;
    letter-spacing: 0;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

    input::-webkit-input-placeholder, textarea::-webkit-input-placeholder, select::-webkit-input-placeholder, datalist::-webkit-input-placeholder, selected::-webkit-input-placeholder, item::-webkit-input-placeholder {
        color: inherit;
        font-family: inherit;
        font-weight: 400;
        opacity: .65
    }

    input::-moz-placeholder, textarea::-moz-placeholder, select::-moz-placeholder, datalist::-moz-placeholder, selected::-moz-placeholder, item::-moz-placeholder {
        color: inherit;
        font-family: inherit;
        font-weight: 400;
        opacity: .65
    }

    input:-ms-input-placeholder, textarea:-ms-input-placeholder, select:-ms-input-placeholder, datalist:-ms-input-placeholder, selected:-ms-input-placeholder, item:-ms-input-placeholder {
        color: inherit;
        font-family: inherit;
        font-weight: 400;
        opacity: .65
    }

    input::-ms-input-placeholder, textarea::-ms-input-placeholder, select::-ms-input-placeholder, datalist::-ms-input-placeholder, selected::-ms-input-placeholder, item::-ms-input-placeholder {
        color: inherit;
        font-family: inherit;
        font-weight: 400;
        opacity: .65
    }

    input::placeholder, textarea::placeholder, select::placeholder, datalist::placeholder, selected::placeholder, item::placeholder {
        color: inherit;
        font-family: inherit;
        font-weight: 400;
        opacity: .65
    }

[country-code]::before {
    content: attr(country-code);
    position: absolute;
    top: 32px;
    left: var(--input-size);
    z-index: 1;
    padding-right: .5rem;
    font-weight: 500;
    border-right: 1px solid var(--inputColor3)
}

[country-code] label {
    left: 60px
}

[country-code] input {
    padding-left: 60px
}

select {
    background-color: rgba(0,0,0,0);
    -webkit-appearance: auto;
    -moz-appearance: auto;
    appearance: auto
}

textarea {
    min-height: 100px;
    min-width: 100%;
    max-width: 100%;
    vertical-align: top;
    overflow: auto;
    resize: none
}

datalist {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

    datalist ::-webkit-calendar-picker-indicator {
        display: none;
        background-color: inherit;
        opacity: 0
    }

[type=radio], [type=checkbox], [type=date], [type=datetime], [type=datetime-local], [type=email], [type=month], [type=number], [type=password], [type=search], [type=tel], [type=text], [type=time], [type=url], [type=week], textarea, select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    width: 100%
}

::-webkit-calendar-picker-indicator {
    opacity: .6;
    -webkit-filter: invert(0.8);
    filter: invert(0.8)
}

[type=date], [type=datetime], [type=time], [type=datetime-local] {
    text-transform: uppercase
}

input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=number] {
    -moz-appearance: textfield
}

:-webkit-autofill, :-webkit-autofill:hover, :-webkit-autofill:focus {
    outline: 0 none;
    background: var(--bg-color) !important;
    -webkit-text-fill-color: var(--text-color) !important;
    -webkit-box-shadow: 0 0 0 1000px var(--bg-color) inset;
    -webkit-transition: background-color 5000s ease-in-out 0s;
    transition: background-color 5000s ease-in-out 0s
}

input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=file] {
    text-indent: 11%;
    text-align: center;
    color: var(--black);
    border: 2px dashed var(--inputColor2) !important
}

    input[type=file]:hover, input[type=file]:focus {
        -webkit-box-shadow: none !important;
        box-shadow: none !important
    }

    input[type=file]:invalid {
        text-indent: 0
    }

    input[type=file]:valid {
        text-indent: 12%;
        color: var(--inputColor)
    }

        input[type=file]:valid::before {
            opacity: 0
        }

    input[type=file]::-webkit-file-upload-button {
        opacity: 0;
        width: 0;
        margin: 0
    }

    input[type=file]::file-selector-button {
        opacity: 0;
        width: 0;
        margin: 0
    }

    input[type=file]::before {
        content: "Upload File";
        position: absolute;
        top: 50%;
        left: 0;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 100%;
        height: 20px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230964B0'%3E%3Cpath d='M18 15v3H6v-3H4v3c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2v-3h-2zM7 9l1.41 1.41L11 7.83V16h2V7.83l2.59 2.58L17 9l-5-5-5 5z'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: 20% center;
        background-size: contain;
        pointer-events: none;
        background-color: var(--white);
        text-align: center;
        text-indent: 15px
    }

.range-slider .irs {
    width: 100%
}

.range-slider .irs-to, .range-slider .irs-from {
    background-color: var(--darkGray)
}

.range-slider .irs-single {
    background-color: var(--darkGray)
}

.range-slider .irs--round .irs-bar {
    background-color: var(--inputColor3)
}

.range-slider .irs--round .irs-handle {
    border: 4px solid var(--inputColor4)
}

@supports(-webkit-appearance: none) or (-moz-appearance: none) {
    input[type=checkbox], input[type=radio] {
        --active: var(--inputColor5);
        --active-inner: #fff;
        --focus: 2px var(--inputColor4);
        --border: var(--borderGray);
        --border-hover: var(--inputColor3);
        --background: var(--white);
        --disabled: var(--inputColor1);
        --disabled-inner: var(--inputColor1);
        -webkit-appearance: none;
        -moz-appearance: none;
        height: 21px;
        outline: none;
        display: inline-block;
        vertical-align: top;
        padding: .5rem;
        margin-right: 10px;
        cursor: pointer;
        border: 1px solid var(--bc, var(--border));
        background: var(--b, var(--background));
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        input[type=checkbox]:after, input[type=radio]:after {
            content: "";
            display: block;
            left: -1px;
            top: -1px;
            position: absolute;
            -webkit-transition: opacity var(--d-o, 0.2s),-webkit-transform var(--d-t, 0.3s) var(--d-t-e, ease);
            transition: opacity var(--d-o, 0.2s),-webkit-transform var(--d-t, 0.3s) var(--d-t-e, ease);
            transition: transform var(--d-t, 0.3s) var(--d-t-e, ease),opacity var(--d-o, 0.2s);
            transition: transform var(--d-t, 0.3s) var(--d-t-e, ease),opacity var(--d-o, 0.2s),-webkit-transform var(--d-t, 0.3s) var(--d-t-e, ease)
        }

        input[type=checkbox]:checked, input[type=radio]:checked {
            --b: var(--active);
            --bc: var(--active);
            --d-o: .3s;
            --d-t: .6s;
            --d-t-e: cubic-bezier(.2, .85, .32, 1.2)
        }

            input[type=checkbox]:checked + label, input[type=radio]:checked + label {
                color: var(--black) !important
            }

                input[type=checkbox]:checked + label::before, input[type=radio]:checked + label::before {
                    border: 3px solid var(--color4) !important;
                    -webkit-box-shadow: 2px 4px 16px rgba(0,0,0,.16) !important;
                    box-shadow: 2px 4px 16px rgba(0,0,0,.16) !important
                }

                input[type=checkbox]:checked + label span, input[type=radio]:checked + label span {
                    text-shadow: none
                }

        input[type=checkbox]:disabled, input[type=radio]:disabled {
            --b: var(--disabled);
            cursor: not-allowed;
            opacity: .9
        }

            input[type=checkbox]:disabled:checked, input[type=radio]:disabled:checked {
                --b: var(--disabled-inner);
                --bc: var(--border)
            }

            input[type=checkbox]:disabled + label, input[type=radio]:disabled + label {
                cursor: not-allowed
            }

        input[type=checkbox]:hover:not(:checked):not(:disabled), input[type=radio]:hover:not(:checked):not(:disabled) {
            --bc: var(--border-hover)
        }

        input[type=checkbox]:focus, input[type=radio]:focus {
            -webkit-box-shadow: 0 0 0 var(--focus);
            box-shadow: 0 0 0 var(--focus)
        }

        input[type=checkbox]:not(.switch), input[type=radio]:not(.switch) {
            width: 20px;
            min-width: 20px;
            height: 20px
        }

            input[type=checkbox]:not(.switch):after, input[type=radio]:not(.switch):after {
                opacity: var(--o, 0)
            }

            input[type=checkbox]:not(.switch):checked, input[type=radio]:not(.switch):checked {
                --o: 1
            }

        input[type=checkbox] + label, input[type=radio] + label {
            font-size: .733rem;
            display: inline-block;
            vertical-align: top;
            cursor: pointer;
            margin-left: .5rem
        }

        input[type=checkbox]:not(.switch) {
            border-radius: var(--inputRadius)
        }

            input[type=checkbox]:not(.switch):after {
                width: 4px;
                height: 8px;
                border: 2px solid var(--active-inner);
                border-top: 0;
                border-left: 0;
                left: 5px;
                top: 2px;
                -webkit-transform: rotate(var(--r, 20deg));
                transform: rotate(var(--r, 20deg))
            }

            input[type=checkbox]:not(.switch):checked {
                --r: 43deg
            }

        input[type=checkbox].switch {
            width: 38px !important;
            border-radius: 11px;
            background: var(--b, var(--background)) !important;
            -webkit-transition-delay: unset !important;
            transition-delay: unset !important
        }

            input[type=checkbox].switch:after {
                left: 2px;
                top: 2px;
                border-radius: 50%;
                width: 15px;
                height: 15px;
                background: var(--ab, var(--border));
                -webkit-transform: translateX(var(--x, 0));
                transform: translateX(var(--x, 0))
            }

            input[type=checkbox].switch:checked {
                --ab: var(--active-inner);
                --x: 17px
            }

            input[type=checkbox].switch:disabled:not(:checked):after {
                opacity: .6
            }

    input[type=radio] {
        border-radius: 50%
    }

        input[type=radio]:after {
            width: 20px;
            height: 20px;
            border-radius: 50%;
            background: var(--active-inner);
            opacity: 0;
            -webkit-transform: scale(var(--s, 0.7));
            transform: scale(var(--s, 0.7))
        }

        input[type=radio]:checked {
            --s: .5
        }
}

input:not([type=radio]):not([type=checkbox]), textarea, select, datalist, selector selected, #noteInputElement, .searchBar, .dateRange, .contactSummaryNote {
    background-color: var(--inputColor2);
    border: 1px solid var(--inputColor2);
    border-radius: var(--inputRadius);
    -webkit-box-shadow: 0px 0px 0px 2px rgba(0,0,0,0);
    box-shadow: 0px 0px 0px 2px rgba(0,0,0,0);
    -webkit-transition: border .35s,-webkit-box-shadow .5s !important;
    transition: border .35s,-webkit-box-shadow .5s !important;
    transition: border .35s,box-shadow .5s !important;
    transition: border .35s,box-shadow .5s,-webkit-box-shadow .5s !important
}

    input:not([type=radio]):not([type=checkbox]):hover, textarea:hover, select:hover, datalist:hover, selector selected:hover, #noteInputElement:hover, .searchBar:hover, .dateRange:hover, .contactSummaryNote:hover {
        border: 1px solid var(--inputColor2)
    }

    input:not([type=radio]):not([type=checkbox]):focus, textarea:focus, select:focus, datalist:focus, selector selected:focus, #noteInputElement:focus, .searchBar:focus, .dateRange:focus, .contactSummaryNote:focus {
        outline: 0;
        background-color: var(--white);
        border: 1px solid var(--inputColor3);
        -webkit-box-shadow: 0 0 0 2.5px var(--inputColor3);
        box-shadow: 0 0 0 2.5px var(--inputColor3)
    }

    input:not([type=radio]):not([type=checkbox]):active, textarea:active, select:active, datalist:active, selector selected:active, #noteInputElement:active, .searchBar:active, .dateRange:active, .contactSummaryNote:active {
        background-color: var(--white);
        border: 1px solid var(--inputColor4)
    }

    input:not([type=radio]):not([type=checkbox]):visited, textarea:visited, select:visited, datalist:visited, selector selected:visited, #noteInputElement:visited, .searchBar:visited, .dateRange:visited, .contactSummaryNote:visited {
        background-color: var(--white);
        border: 1px solid var(--inputColor1)
    }

.uploadInput, .floatingLabel, .inputDiv {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: 1.413rem
}

    .uploadInput .inputBox [type=search], .floatingLabel .inputBox [type=search], .inputDiv .inputBox [type=search] {
        padding-right: 46px !important
    }

    .uploadInput .inputBox button, .floatingLabel .inputBox button, .inputDiv .inputBox button {
        height: clamp(32px,6vw,40px);
        font-size: .878rem;
        padding: 0 16px;
        position: absolute;
        top: 0;
        right: 0;
        height: 100%;
        background-color: rgba(0,0,0,0);
        border: 1px solid rgba(0,0,0,0);
        border-radius: var(--inputRadius);
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .uploadInput .inputBox button:hover i, .floatingLabel .inputBox button:hover i, .inputDiv .inputBox button:hover i {
            color: var(--color2)
        }

        .uploadInput .inputBox button i, .floatingLabel .inputBox button i, .inputDiv .inputBox button i {
            color: var(--color3);
            font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
            cursor: pointer;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

    .uploadInput selector, .floatingLabel selector, .inputDiv selector {
        width: 100%
    }

    .uploadInput .lgIcon, .floatingLabel .lgIcon, .inputDiv .lgIcon {
        position: absolute;
        top: 50%;
        right: 5px;
        z-index: 5;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        border-radius: var(--inputRadius)
    }

    .inputDiv label {
        margin-bottom: 10px
    }

    .inputDiv input:not([type=radio]):not([type=checkbox]):-webkit-autofill, .inputDiv textarea:-webkit-autofill, .inputDiv select:-webkit-autofill, .inputDiv datalist:-webkit-autofill {
        -webkit-box-shadow: 0 0 0 30px var(--inputColor1) inset !important
    }

    .inputDiv:has(.inputIcon) .inputIcon {
        position: absolute;
        top: 30px;
        left: 10px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        z-index: 1;
        border-radius: inherit;
        width: 30px;
        height: 30px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        color: inherit
    }

    .inputDiv:has(.inputIcon) label:not(:has(input)) {
        position: absolute;
        top: 6px;
        left: 50px;
        font-size: 14px;
        z-index: 1;
        color: inherit
    }

    .inputDiv:has(.inputIcon) input:not([type=radio]):not([type=checkbox]), .inputDiv:has(.inputIcon) textarea, .inputDiv:has(.inputIcon) select, .inputDiv:has(.inputIcon) datalist, .inputDiv:has(.inputIcon) selector selected, .inputDiv:has(.inputIcon) select {
        padding-top: 27px;
        padding-left: 50px;
        padding-bottom: 7px
    }

.floatingLabel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

    .floatingLabel label {
        position: absolute;
        top: 20px;
        left: 6px;
        padding: .25rem .5rem;
        pointer-events: none;
        display: block;
        z-index: 2
    }

    .floatingLabel input, .floatingLabel textarea, .floatingLabel select {
        margin-top: 10px;
        color: rgba(0,0,0,0)
    }

        .floatingLabel input::-webkit-input-placeholder, .floatingLabel textarea::-webkit-input-placeholder, .floatingLabel select::-webkit-input-placeholder {
            opacity: 0
        }

        .floatingLabel input::-moz-placeholder, .floatingLabel textarea::-moz-placeholder, .floatingLabel select::-moz-placeholder {
            opacity: 0
        }

        .floatingLabel input:-ms-input-placeholder, .floatingLabel textarea:-ms-input-placeholder, .floatingLabel select:-ms-input-placeholder {
            opacity: 0
        }

        .floatingLabel input::-ms-input-placeholder, .floatingLabel textarea::-ms-input-placeholder, .floatingLabel select::-ms-input-placeholder {
            opacity: 0
        }

        .floatingLabel input::placeholder, .floatingLabel textarea::placeholder, .floatingLabel select::placeholder {
            opacity: 0
        }

        .floatingLabel input:focus, .floatingLabel input:valid, .floatingLabel textarea:focus, .floatingLabel textarea:valid, .floatingLabel select:focus, .floatingLabel select:valid {
            color: var(--black)
        }

            .floatingLabel input:focus::-webkit-input-placeholder, .floatingLabel input:valid::-webkit-input-placeholder, .floatingLabel textarea:focus::-webkit-input-placeholder, .floatingLabel textarea:valid::-webkit-input-placeholder, .floatingLabel select:focus::-webkit-input-placeholder, .floatingLabel select:valid::-webkit-input-placeholder {
                opacity: 1
            }

            .floatingLabel input:focus::-moz-placeholder, .floatingLabel input:valid::-moz-placeholder, .floatingLabel textarea:focus::-moz-placeholder, .floatingLabel textarea:valid::-moz-placeholder, .floatingLabel select:focus::-moz-placeholder, .floatingLabel select:valid::-moz-placeholder {
                opacity: 1
            }

            .floatingLabel input:focus:-ms-input-placeholder, .floatingLabel input:valid:-ms-input-placeholder, .floatingLabel textarea:focus:-ms-input-placeholder, .floatingLabel textarea:valid:-ms-input-placeholder, .floatingLabel select:focus:-ms-input-placeholder, .floatingLabel select:valid:-ms-input-placeholder {
                opacity: 1
            }

            .floatingLabel input:focus::-ms-input-placeholder, .floatingLabel input:valid::-ms-input-placeholder, .floatingLabel textarea:focus::-ms-input-placeholder, .floatingLabel textarea:valid::-ms-input-placeholder, .floatingLabel select:focus::-ms-input-placeholder, .floatingLabel select:valid::-ms-input-placeholder {
                opacity: 1
            }

            .floatingLabel input:focus::placeholder, .floatingLabel input:valid::placeholder, .floatingLabel textarea:focus::placeholder, .floatingLabel textarea:valid::placeholder, .floatingLabel select:focus::placeholder, .floatingLabel select:valid::placeholder {
                opacity: 1
            }

            .floatingLabel input:focus ~ label, .floatingLabel input:valid ~ label, .floatingLabel textarea:focus ~ label, .floatingLabel textarea:valid ~ label, .floatingLabel select:focus ~ label, .floatingLabel select:valid ~ label {
                top: -5px;
                color: var(--inputColor5);
                font-weight: 500;
                background-color: var(--white)
            }

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title, .titleInput, .smartInput {
    margin-bottom: 1rem
}

    .multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input, .titleInput input, .smartInput input {
        color: var(--black);
        padding: .5rem 0;
        border: none;
        font-size: 1rem;
        background-color: rgba(0,0,0,0);
        border-bottom: 1px solid var(--borderGray);
        border-top: none;
        border-left: none;
        border-right: none;
        border-radius: 0
    }

@media(min-width: 768px) {
    .multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input, .titleInput input, .smartInput input {
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
    }
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input:is(:hover,:focus,:active,:visited,:valid), .titleInput input:is(:hover,:focus,:active,:visited,:valid), .smartInput input:is(:hover,:focus,:active,:visited,:valid) {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-top: none;
    border-left: none;
    border-right: none
}

.titleInput:has(input:valid) label {
    display: none
}

.titleInput {
    width: 100%
}

    .titleInput label {
        color: var(--highlight);
        display: block;
        margin-bottom: 0m
    }

    .titleInput input:not([type=radio]):not([type=checkbox]) {
        font-size: clamp(22.78125px,18.8433710526px + 0.0082039145*100vw,35.2512px);
        font-weight: 500;
        padding-left: 5px;
        background-color: rgba(0,0,0,0);
        border-radius: 0;
        border-top: none;
        border-left: none;
        border-right: none;
        caret-color: var(--inputColor5);
        -webkit-box-shadow: none;
        box-shadow: none;
        text-transform: capitalize
    }

@media(min-width: 1024px) {
    .titleInput input:not([type=radio]):not([type=checkbox]) {
        font-size: clamp(25.62890625px,20.3638955921px + 0.0109687722*100vw,42.30144px)
    }
}

@media(min-width: 1800px) {
    .titleInput input:not([type=radio]):not([type=checkbox]) {
        font-size: clamp(28.8325195313px,21.9075063306px + 0.0144271108*100vw,50.761728px)
    }
}

.titleInput input:not([type=radio]):not([type=checkbox]):focus + .messageBox::after {
    display: none
}

.titleInput input:not([type=radio]):not([type=checkbox]):valid + .messageBox:after {
    display: none
}

.titleInput input:not([type=radio]):not([type=checkbox])::-webkit-input-placeholder {
    font-size: inherit;
    font-weight: 500;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.titleInput input:not([type=radio]):not([type=checkbox])::-moz-placeholder {
    font-size: inherit;
    font-weight: 500;
    -moz-transition: var(--transition1);
    transition: var(--transition1)
}

.titleInput input:not([type=radio]):not([type=checkbox]):-ms-input-placeholder {
    font-size: inherit;
    font-weight: 500;
    -ms-transition: var(--transition1);
    transition: var(--transition1)
}

.titleInput input:not([type=radio]):not([type=checkbox])::-ms-input-placeholder {
    font-size: inherit;
    font-weight: 500;
    -ms-transition: var(--transition1);
    transition: var(--transition1)
}

.titleInput input:not([type=radio]):not([type=checkbox])::placeholder {
    font-size: inherit;
    font-weight: 500;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.titleInput .messageBox:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 30px;
    background-color: var(--inputColor5);
    left: 0;
    top: -5px;
    -webkit-transform: translateY(-130%);
    transform: translateY(-130%);
    -webkit-animation-name: blink;
    animation-name: blink;
    -webkit-animation-duration: 1000ms;
    animation-duration: 1000ms;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1
}

@-webkit-keyframes blink {
    from {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

@keyframes blink {
    from {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.horizontalInput, .horizontalInputDiv .inputDiv {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: .75rem
}

@media(min-width: 568px) {
    .horizontalInput, .horizontalInputDiv .inputDiv {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }
}

.horizontalInput label:not(:has([type=radio],[type=checkbox])), .horizontalInputDiv .inputDiv label:not(:has([type=radio],[type=checkbox])) {
    position: absolute;
    top: 8px;
    left: var(--input-size);
    z-index: 1
}

    .horizontalInput label:not(:has([type=radio],[type=checkbox])):has([class=switch]), .horizontalInputDiv .inputDiv label:not(:has([type=radio],[type=checkbox])):has([class=switch]) {
        min-width: auto;
        margin-bottom: 0;
        overflow: unset
    }

        .horizontalInput label:not(:has([type=radio],[type=checkbox])):has([class=switch])::after, .horizontalInputDiv .inputDiv label:not(:has([type=radio],[type=checkbox])):has([class=switch])::after {
            content: ""
        }

        .horizontalInput label:not(:has([type=radio],[type=checkbox])):has([class=switch]) input:not([type=radio]):not([type=checkbox]), .horizontalInputDiv .inputDiv label:not(:has([type=radio],[type=checkbox])):has([class=switch]) input:not([type=radio]):not([type=checkbox]) {
            --active: var(--green) !important;
            -webkit-transform: scale(1.25);
            transform: scale(1.25);
            margin-right: 0
        }

            .horizontalInput label:not(:has([type=radio],[type=checkbox])):has([class=switch]) input:not([type=radio]):not([type=checkbox])::before, .horizontalInputDiv .inputDiv label:not(:has([type=radio],[type=checkbox])):has([class=switch]) input:not([type=radio]):not([type=checkbox])::before {
                content: "";
                position: absolute;
                top: 50%;
                left: 50%;
                width: 200%;
                height: 100%;
                -webkit-transform: translate(-50%, -50%) scale(2);
                transform: translate(-50%, -50%) scale(2)
            }

@media(min-width: 568px) {
    .horizontalInput label:not(:has([type=radio],[type=checkbox])), .horizontalInputDiv .inputDiv label:not(:has([type=radio],[type=checkbox])) {
        position: relative;
        top: unset;
        left: unset;
        width: auto;
        min-width: 200px;
        margin: 0;
        margin-top: 10px;
        font-size: 1rem
    }
}

@media(min-width: 768px) {
    .horizontalInput label:not(:has([type=radio],[type=checkbox])), .horizontalInputDiv .inputDiv label:not(:has([type=radio],[type=checkbox])) {
        font-size: .937rem
    }
}

@media(min-width: 568px) {
    .horizontalInput label:not(:has([type=radio],[type=checkbox]))::after, .horizontalInputDiv .inputDiv label:not(:has([type=radio],[type=checkbox]))::after {
        content: ":";
        color: var(--textGray);
        margin-left: auto;
        margin-right: 1rem;
        margin-bottom: 3px
    }
}

.horizontalInput input, .horizontalInputDiv .inputDiv input, .horizontalInput select, .horizontalInputDiv .inputDiv select, .horizontalInput textarea, .horizontalInputDiv .inputDiv textarea, .horizontalInput selector selected item, .horizontalInputDiv .inputDiv selector selected item, .horizontalInput .inputBox, .horizontalInputDiv .inputDiv .inputBox, .horizontalInput .optionList, .horizontalInputDiv .inputDiv .optionList {
    padding-top: 30px;
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
}

@media(min-width: 568px) {
    .horizontalInput input, .horizontalInputDiv .inputDiv input, .horizontalInput select, .horizontalInputDiv .inputDiv select, .horizontalInput textarea, .horizontalInputDiv .inputDiv textarea, .horizontalInput selector selected item, .horizontalInputDiv .inputDiv selector selected item, .horizontalInput .inputBox, .horizontalInputDiv .inputDiv .inputBox, .horizontalInput .optionList, .horizontalInputDiv .inputDiv .optionList {
        padding-top: .7rem;
        font-size: 1rem
    }
}

.horizontalInput input:not([type=radio]):not([type=checkbox]), .horizontalInputDiv .inputDiv input:not([type=radio]):not([type=checkbox]), .horizontalInput select, .horizontalInputDiv .inputDiv select, .horizontalInput textarea, .horizontalInputDiv .inputDiv textarea, .horizontalInput selector, .horizontalInputDiv .inputDiv selector, .horizontalInput .optionList, .horizontalInputDiv .inputDiv .optionList {
    width: 100%
}

@media(min-width: 568px) {
    .horizontalInput input:not([type=radio]):not([type=checkbox]), .horizontalInputDiv .inputDiv input:not([type=radio]):not([type=checkbox]), .horizontalInput select, .horizontalInputDiv .inputDiv select, .horizontalInput textarea, .horizontalInputDiv .inputDiv textarea, .horizontalInput selector, .horizontalInputDiv .inputDiv selector, .horizontalInput .optionList, .horizontalInputDiv .inputDiv .optionList {
        width: auto !important;
        -webkit-box-flex: 1 !important;
        -ms-flex: 1 !important;
        flex: 1 !important
    }
}

.horizontalInput .optionList, .horizontalInputDiv .inputDiv .optionList {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.horizontalInput textarea, .horizontalInputDiv .inputDiv textarea {
    min-width: auto
}

@media(min-width: 568px) {
    .horizontalInput input:not([type=date]), .horizontalInputDiv .inputDiv input:not([type=date]) {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }
}

.horizontalInput select, .horizontalInputDiv .inputDiv select {
    width: auto;
    min-width: auto;
    border: none
}

.horizontalInput .messageBox, .horizontalInputDiv .inputDiv .messageBox {
    width: 100%
}

.minimalHorizontalInputDiv .inputDiv {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: .75rem
}

    .minimalHorizontalInputDiv .inputDiv label {
        width: auto;
        min-width: 200px;
        margin: 0;
        font-size: 1rem
    }

        .minimalHorizontalInputDiv .inputDiv label:has([class=switch]) {
            min-width: auto;
            margin-bottom: 0;
            overflow: unset
        }

            .minimalHorizontalInputDiv .inputDiv label:has([class=switch])::after {
                content: ""
            }

            .minimalHorizontalInputDiv .inputDiv label:has([class=switch]) input:not([type=radio]):not([type=checkbox]) {
                --active: var(--green) !important;
                -webkit-transform: scale(1.25);
                transform: scale(1.25);
                margin-right: 0
            }

                .minimalHorizontalInputDiv .inputDiv label:has([class=switch]) input:not([type=radio]):not([type=checkbox])::before {
                    content: "";
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    width: 200%;
                    height: 100%;
                    -webkit-transform: translate(-50%, -50%) scale(2);
                    transform: translate(-50%, -50%) scale(2)
                }

@media(min-width: 768px) {
    .minimalHorizontalInputDiv .inputDiv label {
        font-size: .937rem
    }
}

.minimalHorizontalInputDiv .inputDiv label::after {
    content: ":";
    color: var(--textGray);
    margin-left: auto;
    margin-right: 1rem;
    margin-bottom: 3px
}

.minimalHorizontalInputDiv .inputDiv input, .minimalHorizontalInputDiv .inputDiv select, .minimalHorizontalInputDiv .inputDiv textarea, .minimalHorizontalInputDiv .inputDiv selector selected item {
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
}

@media(min-width: 568px) {
    .minimalHorizontalInputDiv .inputDiv input, .minimalHorizontalInputDiv .inputDiv select, .minimalHorizontalInputDiv .inputDiv textarea, .minimalHorizontalInputDiv .inputDiv selector selected item {
        font-size: 1rem
    }
}

.minimalHorizontalInputDiv .inputDiv input:not([type=radio]):not([type=checkbox]), .minimalHorizontalInputDiv .inputDiv select, .minimalHorizontalInputDiv .inputDiv textarea, .minimalHorizontalInputDiv .inputDiv selector {
    width: auto !important;
    -webkit-box-flex: 1 !important;
    -ms-flex: 1 !important;
    flex: 1 !important
}

.minimalHorizontalInputDiv .inputDiv textarea {
    min-width: auto
}

.minimalHorizontalInputDiv .inputDiv input:not([type=date]) {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.minimalHorizontalInputDiv .inputDiv select {
    width: auto;
    min-width: auto;
    border: none
}

.minimalHorizontalInputDiv .inputDiv .messageBox {
    width: 100%
}

.actionInput selected {
    background-color: rgba(0,0,0,0);
    border: none !important;
    padding: 0
}

    .actionInput selected items {
        padding: 0
    }

    .actionInput selected item:not([value]) {
        min-height: 45px;
        border: 1px dashed var(--inputColor2);
        border-radius: var(--btnRadius);
        padding: 5px .7075rem
    }

.inputBox {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.passwordShowIconDiv {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 20px;
    width: 35px;
    height: 35px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 5px;
    border-radius: 1rem;
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

    .passwordShowIconDiv:hover {
        background-color: var(--lightGray)
    }

    .passwordShowIconDiv .hide {
        display: none
    }

    .passwordShowIconDiv .showIcon {
        display: block !important
    }

    .passwordShowIconDiv i {
        margin: auto;
        color: var(--textGray);
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
        display: none;
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .passwordShowIconDiv i:hover {
            color: var(--color1)
        }

.dateRange {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

    .dateRange i {
        color: var(--visibleGray);
        cursor: pointer
    }

    .dateRange .value {
        margin: 0 .5rem;
        margin-right: auto;
        cursor: pointer
    }

.checkboxList input::before, .radioList input::before {
    content: attr(data-label);
    color: var(--black);
    font-size: .878rem;
    margin-left: .7075rem
}

.checkBoxGridDiv {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 0 2%;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

    .checkBoxGridDiv label {
        width: 48%;
        padding: 10px 15px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        border-radius: var(--inputRadius)
    }

@media(min-width: 768px) {
    .checkBoxGridDiv label {
        width: 32%
    }
}

@media(min-width: 1024px) {
    .checkBoxGridDiv label {
        width: 23%
    }
}

.checkBoxGridDiv label i {
    color: var(--textGray);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 5px;
    pointer-events: none
}

.checkBoxGridDiv label .title {
    font-size: .937rem;
    pointer-events: none
}

.checkBoxGridDiv label .text {
    font-size: .733rem;
    pointer-events: none
}

.checkBoxGridDiv label input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    border-radius: var(--inputRadius) !important;
    background-color: rgba(0,0,0,0)
}

    .checkBoxGridDiv label input::after {
        display: none
    }

.inputCounter input[type=date]::-webkit-input-placeholder, .inputCounter input[type=datetime-local]::-webkit-input-placeholder, .inputCounter input[type=email]::-webkit-input-placeholder, .inputCounter input[type=file]::-webkit-input-placeholder, .inputCounter input[type=hidden]::-webkit-input-placeholder, .inputCounter input[type=month]::-webkit-input-placeholder, .inputCounter input[type=number]::-webkit-input-placeholder, .inputCounter input[type=password]::-webkit-input-placeholder, .inputCounter input[type=range]::-webkit-input-placeholder, .inputCounter input[type=search]::-webkit-input-placeholder, .inputCounter input[type=tel]::-webkit-input-placeholder, .inputCounter input[type=text]::-webkit-input-placeholder, .inputCounter input[type=time]::-webkit-input-placeholder, .inputCounter input[type=url]::-webkit-input-placeholder, .inputCounter input[type=week]::-webkit-input-placeholder, .inputCounter textarea::-webkit-input-placeholder, .inputCounter select::-webkit-input-placeholder, .inputCounter datalist::-webkit-input-placeholder {
    opacity: 1
}

.inputCounter input[type=date]::-moz-placeholder, .inputCounter input[type=datetime-local]::-moz-placeholder, .inputCounter input[type=email]::-moz-placeholder, .inputCounter input[type=file]::-moz-placeholder, .inputCounter input[type=hidden]::-moz-placeholder, .inputCounter input[type=month]::-moz-placeholder, .inputCounter input[type=number]::-moz-placeholder, .inputCounter input[type=password]::-moz-placeholder, .inputCounter input[type=range]::-moz-placeholder, .inputCounter input[type=search]::-moz-placeholder, .inputCounter input[type=tel]::-moz-placeholder, .inputCounter input[type=text]::-moz-placeholder, .inputCounter input[type=time]::-moz-placeholder, .inputCounter input[type=url]::-moz-placeholder, .inputCounter input[type=week]::-moz-placeholder, .inputCounter textarea::-moz-placeholder, .inputCounter select::-moz-placeholder, .inputCounter datalist::-moz-placeholder {
    opacity: 1
}

.inputCounter input[type=date]:-ms-input-placeholder, .inputCounter input[type=datetime-local]:-ms-input-placeholder, .inputCounter input[type=email]:-ms-input-placeholder, .inputCounter input[type=file]:-ms-input-placeholder, .inputCounter input[type=hidden]:-ms-input-placeholder, .inputCounter input[type=month]:-ms-input-placeholder, .inputCounter input[type=number]:-ms-input-placeholder, .inputCounter input[type=password]:-ms-input-placeholder, .inputCounter input[type=range]:-ms-input-placeholder, .inputCounter input[type=search]:-ms-input-placeholder, .inputCounter input[type=tel]:-ms-input-placeholder, .inputCounter input[type=text]:-ms-input-placeholder, .inputCounter input[type=time]:-ms-input-placeholder, .inputCounter input[type=url]:-ms-input-placeholder, .inputCounter input[type=week]:-ms-input-placeholder, .inputCounter textarea:-ms-input-placeholder, .inputCounter select:-ms-input-placeholder, .inputCounter datalist:-ms-input-placeholder {
    opacity: 1
}

.inputCounter input[type=date]::-ms-input-placeholder, .inputCounter input[type=datetime-local]::-ms-input-placeholder, .inputCounter input[type=email]::-ms-input-placeholder, .inputCounter input[type=file]::-ms-input-placeholder, .inputCounter input[type=hidden]::-ms-input-placeholder, .inputCounter input[type=month]::-ms-input-placeholder, .inputCounter input[type=number]::-ms-input-placeholder, .inputCounter input[type=password]::-ms-input-placeholder, .inputCounter input[type=range]::-ms-input-placeholder, .inputCounter input[type=search]::-ms-input-placeholder, .inputCounter input[type=tel]::-ms-input-placeholder, .inputCounter input[type=text]::-ms-input-placeholder, .inputCounter input[type=time]::-ms-input-placeholder, .inputCounter input[type=url]::-ms-input-placeholder, .inputCounter input[type=week]::-ms-input-placeholder, .inputCounter textarea::-ms-input-placeholder, .inputCounter select::-ms-input-placeholder, .inputCounter datalist::-ms-input-placeholder {
    opacity: 1
}

.inputCounter input[type=date]::placeholder, .inputCounter input[type=datetime-local]::placeholder, .inputCounter input[type=email]::placeholder, .inputCounter input[type=file]::placeholder, .inputCounter input[type=hidden]::placeholder, .inputCounter input[type=month]::placeholder, .inputCounter input[type=number]::placeholder, .inputCounter input[type=password]::placeholder, .inputCounter input[type=range]::placeholder, .inputCounter input[type=search]::placeholder, .inputCounter input[type=tel]::placeholder, .inputCounter input[type=text]::placeholder, .inputCounter input[type=time]::placeholder, .inputCounter input[type=url]::placeholder, .inputCounter input[type=week]::placeholder, .inputCounter textarea::placeholder, .inputCounter select::placeholder, .inputCounter datalist::placeholder {
    opacity: 1
}

.inputCounter .inputBox:has(button) input {
    text-align: center
}

.inputCounter .inputBox button {
    position: absolute;
    right: 0;
    z-index: 1;
    border-left: 1px solid var(--borderGray);
    padding: .75rem .5rem
}

    .inputCounter .inputBox button:hover {
        background-color: var(--black)
    }

        .inputCounter .inputBox button:hover i {
            color: var(--textGray)
        }

    .inputCounter .inputBox button:nth-child(1) {
        left: 0;
        right: unset;
        border: none;
        border-right: 1px solid var(--borderGray)
    }

    .inputCounter .inputBox button i {
        color: var(--gray)
    }

.optionList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px
}

    .optionList label {
        margin: 0;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        min-width: 100px;
        padding: var(--input-size);
        font-size: 1rem;
        z-index: 1;
        text-align: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

        .optionList label:has(:checked) {
            color: var(--inputColor)
        }

        .optionList label input[type=radio], .optionList label input[type=checkbox] {
            position: absolute;
            top: 0;
            left: 0;
            z-index: -1;
            width: 100%;
            height: 100%;
            border: 1px solid var(--textGray);
            background-color: var(--white);
            border-radius: var(--inputRadius);
            padding: 0;
            margin: 0;
            -webkit-transition: var(--transition1);
            transition: var(--transition1);
            cursor: pointer
        }

@media(min-width: 768px) {
    .optionList label input[type=radio], .optionList label input[type=checkbox] {
        border: 1px solid var(--borderGray)
    }
}

.optionList label input[type=radio]:hover, .optionList label input[type=checkbox]:hover {
    background-color: var(--inputColor1);
    border: 1px solid var(--inputColor1);
    -webkit-box-shadow: var(--inputColor2) 0px 0px 0px 1px;
    box-shadow: var(--inputColor2) 0px 0px 0px 1px
}

    .optionList label input[type=radio]:hover::after, .optionList label input[type=checkbox]:hover::after {
        color: var(--color1)
    }

.optionList label input[type=radio]::after, .optionList label input[type=checkbox]::after {
    position: absolute;
    left: 50%;
    top: 50%;
    content: attr(data-label);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    text-align: center;
    color: var(--darkGray);
    font-family: var(--font-family);
    font-size: 1rem;
    font-weight: 400;
    background-color: rgba(0,0,0,0);
    border-radius: 0;
    opacity: 1;
    -webkit-transform: none;
    transform: none;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    cursor: pointer;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.optionList label input[type=radio]:focus, .optionList label input[type=radio]:active, .optionList label input[type=checkbox]:focus, .optionList label input[type=checkbox]:active {
    border: 1px solid var(--inputColor3);
    -webkit-box-shadow: var(--inputColor2) 0px 0px 0px 1px;
    box-shadow: var(--inputColor2) 0px 0px 0px 1px;
    background-color: var(--inputColor1)
}

    .optionList label input[type=radio]:focus::after, .optionList label input[type=radio]:active::after, .optionList label input[type=checkbox]:focus::after, .optionList label input[type=checkbox]:active::after {
        color: var(--black)
    }

.optionList label input[type=radio]:checked, .optionList label input[type=checkbox]:checked {
    background-color: var(--white);
    border: 1px solid var(--inputColor5);
    -webkit-box-shadow: var(--inputColor4) 0px 0px 0px 1px;
    box-shadow: var(--inputColor4) 0px 0px 0px 1px
}

    .optionList label input[type=radio]:checked::after, .optionList label input[type=checkbox]:checked::after {
        color: var(--black)
    }

.optionForm {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
    text-align: center
}

    .optionForm label {
        margin: 0;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        min-width: 100px;
        padding: var(--input-size);
        font-size: 1rem;
        z-index: 1;
        text-align: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

        .optionForm label:has(:checked) {
            color: var(--inputColor)
        }

        .optionForm label input[type=radio], .optionForm label input[type=checkbox] {
            position: absolute;
            top: 0;
            left: 0;
            z-index: -1;
            width: 100%;
            height: 100%;
            border: 1px solid var(--textGray);
            background-color: var(--white);
            border-radius: var(--inputRadius);
            padding: 0;
            margin: 0;
            -webkit-transition: var(--transition1);
            transition: var(--transition1);
            cursor: pointer
        }

@media(min-width: 768px) {
    .optionForm label input[type=radio], .optionForm label input[type=checkbox] {
        border: 1px solid var(--borderGray)
    }
}

.optionForm label input[type=radio]:hover, .optionForm label input[type=checkbox]:hover {
    background-color: var(--inputColor1);
    border: 1px solid var(--inputColor1);
    -webkit-box-shadow: var(--inputColor2) 0px 0px 0px 1px;
    box-shadow: var(--inputColor2) 0px 0px 0px 1px
}

    .optionForm label input[type=radio]:hover::after, .optionForm label input[type=checkbox]:hover::after {
        color: var(--color1)
    }

.optionForm label input[type=radio]::after, .optionForm label input[type=checkbox]::after {
    position: absolute;
    left: 50%;
    top: 50%;
    content: attr(data-label);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    text-align: center;
    color: var(--darkGray);
    font-family: var(--font-family);
    font-size: 1rem;
    font-weight: 400;
    background-color: rgba(0,0,0,0);
    border-radius: 0;
    opacity: 1;
    -webkit-transform: none;
    transform: none;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    cursor: pointer;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.optionForm label input[type=radio]:focus, .optionForm label input[type=radio]:active, .optionForm label input[type=checkbox]:focus, .optionForm label input[type=checkbox]:active {
    border: 1px solid var(--inputColor3);
    -webkit-box-shadow: var(--inputColor2) 0px 0px 0px 1px;
    box-shadow: var(--inputColor2) 0px 0px 0px 1px;
    background-color: var(--inputColor1)
}

    .optionForm label input[type=radio]:focus::after, .optionForm label input[type=radio]:active::after, .optionForm label input[type=checkbox]:focus::after, .optionForm label input[type=checkbox]:active::after {
        color: var(--black)
    }

.optionForm label input[type=radio]:checked, .optionForm label input[type=checkbox]:checked {
    background-color: var(--white);
    border: 1px solid var(--inputColor5);
    -webkit-box-shadow: var(--inputColor4) 0px 0px 0px 1px;
    box-shadow: var(--inputColor4) 0px 0px 0px 1px
}

    .optionForm label input[type=radio]:checked::after, .optionForm label input[type=checkbox]:checked::after {
        color: var(--black)
    }

.optionForm label {
    width: 100%;
    text-align: center;
    margin-bottom: 1rem
}

.optionForm .options {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 0 10px
}

    .optionForm .options input[type=radio] {
        margin: 0;
        margin-bottom: 10px
    }

        .optionForm .options input[type=radio]:checked + .formDiv {
            -webkit-box-ordinal-group: 11;
            -ms-flex-order: 10;
            order: 10;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex
        }

    .optionForm .options .formDiv {
        display: none;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 100%;
        margin-top: 1rem;
        text-align: center
    }

        .optionForm .options .formDiv:empty {
            margin-top: 0
        }

        .optionForm .options .formDiv label {
            width: auto;
            text-align: left;
            margin-bottom: .5rem
        }

.gridOptionInput {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
    text-align: center;
    margin-top: 0
}

    .gridOptionInput label {
        margin: 0;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        min-width: 100px;
        padding: var(--input-size);
        font-size: 1rem;
        z-index: 1;
        text-align: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

        .gridOptionInput label:has(:checked) {
            color: var(--inputColor)
        }

        .gridOptionInput label input[type=radio], .gridOptionInput label input[type=checkbox] {
            position: absolute;
            top: 0;
            left: 0;
            z-index: -1;
            width: 100%;
            height: 100%;
            border: 1px solid var(--textGray);
            background-color: var(--white);
            border-radius: var(--inputRadius);
            padding: 0;
            margin: 0;
            -webkit-transition: var(--transition1);
            transition: var(--transition1);
            cursor: pointer
        }

@media(min-width: 768px) {
    .gridOptionInput label input[type=radio], .gridOptionInput label input[type=checkbox] {
        border: 1px solid var(--borderGray)
    }
}

.gridOptionInput label input[type=radio]:hover, .gridOptionInput label input[type=checkbox]:hover {
    background-color: var(--inputColor1);
    border: 1px solid var(--inputColor1);
    -webkit-box-shadow: var(--inputColor2) 0px 0px 0px 1px;
    box-shadow: var(--inputColor2) 0px 0px 0px 1px
}

    .gridOptionInput label input[type=radio]:hover::after, .gridOptionInput label input[type=checkbox]:hover::after {
        color: var(--color1)
    }

.gridOptionInput label input[type=radio]::after, .gridOptionInput label input[type=checkbox]::after {
    position: absolute;
    left: 50%;
    top: 50%;
    content: attr(data-label);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    text-align: center;
    color: var(--darkGray);
    font-family: var(--font-family);
    font-size: 1rem;
    font-weight: 400;
    background-color: rgba(0,0,0,0);
    border-radius: 0;
    opacity: 1;
    -webkit-transform: none;
    transform: none;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    cursor: pointer;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.gridOptionInput label input[type=radio]:focus, .gridOptionInput label input[type=radio]:active, .gridOptionInput label input[type=checkbox]:focus, .gridOptionInput label input[type=checkbox]:active {
    border: 1px solid var(--inputColor3);
    -webkit-box-shadow: var(--inputColor2) 0px 0px 0px 1px;
    box-shadow: var(--inputColor2) 0px 0px 0px 1px;
    background-color: var(--inputColor1)
}

    .gridOptionInput label input[type=radio]:focus::after, .gridOptionInput label input[type=radio]:active::after, .gridOptionInput label input[type=checkbox]:focus::after, .gridOptionInput label input[type=checkbox]:active::after {
        color: var(--black)
    }

.gridOptionInput label input[type=radio]:checked, .gridOptionInput label input[type=checkbox]:checked {
    background-color: var(--white);
    border: 1px solid var(--inputColor5);
    -webkit-box-shadow: var(--inputColor4) 0px 0px 0px 1px;
    box-shadow: var(--inputColor4) 0px 0px 0px 1px
}

    .gridOptionInput label input[type=radio]:checked::after, .gridOptionInput label input[type=checkbox]:checked::after {
        color: var(--black)
    }

.gridOptionInput label {
    width: 100%;
    text-align: center;
    margin-bottom: 1rem
}

.gridOptionInput .options {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 0 10px
}

    .gridOptionInput .options input[type=radio] {
        margin: 0;
        margin-bottom: 10px
    }

        .gridOptionInput .options input[type=radio]:checked + .formDiv {
            -webkit-box-ordinal-group: 11;
            -ms-flex-order: 10;
            order: 10;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex
        }

    .gridOptionInput .options .formDiv {
        display: none;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 100%;
        margin-top: 1rem;
        text-align: center
    }

        .gridOptionInput .options .formDiv:empty {
            margin-top: 0
        }

        .gridOptionInput .options .formDiv label {
            width: auto;
            text-align: left;
            margin-bottom: .5rem
        }

.gridOptionInput .options {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 2%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 1rem
}

    .gridOptionInput .options label {
        min-height: 150px;
        width: 48%;
        margin-bottom: 10px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        color: var(--black)
    }

@media(min-width: 568px) {
    .gridOptionInput .options label {
        width: 31%;
        margin-bottom: 1rem
    }
}

.gridOptionInput .options label i, .gridOptionInput .options label img {
    width: 50px;
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--textGray);
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    border-radius: var(--radius);
    pointer-events: none;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.gridOptionInput .options label * {
    z-index: 10
}

.gridOptionInput .options label .text {
    margin-top: 1rem
}

.gridOptionInput .options label input {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    border: 1px solid var(--borderGray);
    border-radius: var(--radius);
    margin: 0;
    -webkit-transform: translate(-50%, -50%) scale(0.97);
    transform: translate(-50%, -50%) scale(0.97);
    z-index: 1
}

    .gridOptionInput .options label input::after {
        height: auto;
        margin-top: 30px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .gridOptionInput .options label input:checked {
        background-color: var(--white);
        -webkit-box-shadow: var(--inputColor3) 0px 0px 0px 2px;
        box-shadow: var(--inputColor3) 0px 0px 0px 2px
    }

        .gridOptionInput .options label input:checked::after {
            color: var(--black)
        }

        .gridOptionInput .options label input:checked + i {
            color: var(--gray);
            background-color: var(--lightGray);
            border: 1px solid var(--borderGray)
        }

.gridListOptionInput {
    margin-top: 0
}

    .gridListOptionInput .options {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 0 1rem;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        margin-top: 1rem
    }

        .gridListOptionInput .options label {
            width: auto;
            min-height: 55px;
            margin-bottom: 10px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            cursor: pointer
        }

@media(min-width: 568px) {
    .gridListOptionInput .options label {
        margin-bottom: 1rem
    }
}

.gridListOptionInput .options label i, .gridListOptionInput .options label img {
    position: absolute;
    top: 50%;
    left: 7px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--textGray);
    font-size: 1rem;
    padding: 10px;
    background-color: var(--lightGray);
    border: 1px solid rgba(0,0,0,0);
    border-radius: var(--radius);
    z-index: 10;
    pointer-events: none;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.gridListOptionInput .options label input {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 1px solid var(--borderGray);
    border-radius: var(--radius);
    margin: 0;
    padding-left: 55px;
    cursor: pointer
}

    .gridListOptionInput .options label input::after {
        content: attr(data-label);
        width: 100%;
        height: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-transform: none;
        transform: none;
        cursor: pointer
    }

    .gridListOptionInput .options label input:checked {
        background-color: var(--white);
        -webkit-box-shadow: var(--inputColor3) 0px 0px 0px 2px;
        box-shadow: var(--inputColor3) 0px 0px 0px 2px
    }

        .gridListOptionInput .options label input:checked::after {
            color: var(--black)
        }

        .gridListOptionInput .options label input:checked + i {
            color: var(--gray);
            background-color: var(--lightGray);
            border: 1px solid var(--borderGray)
        }

.uploadInput:hover .inputBox {
    border: 1px dashed var(--inputColor4)
}

    .uploadInput:hover .inputBox label {
        color: var(--inputColor4)
    }

.uploadInput .inputBox {
    min-height: 200px;
    background-color: var(--lightGray);
    border: 1px dashed var(--inputColor3);
    border-radius: var(--inputRadius);
    overflow: hidden;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

    .uploadInput .inputBox label {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        color: var(--inputColor5);
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
        pointer-events: none;
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .uploadInput .inputBox label i {
            margin-right: .5rem;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

    .uploadInput .inputBox input {
        opacity: 0;
        z-index: 1;
        cursor: pointer
    }

.inputEditor {
    padding-top: 0
}

    .inputEditor .ql-container.ql-snow {
        border: 1px solid var(--inputBorder) !important;
        border-radius: var(--inputRadius)
    }

    .inputEditor .ql-toolbar.ql-snow {
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 100;
        width: 100%;
        border: none;
        border-top: 1px solid var(--borderGray);
        border-radius: .25rem
    }

    .inputEditor textarea {
        height: 200px;
        border: 1px solid var(--inputBorder) !important;
        padding-bottom: 2.83rem !important
    }

.taskListForm {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 0
}

    .taskListForm .content {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y)
    }

    .taskListForm .inputDiv {
        margin: 0;
        width: 100%;
        -webkit-box-align: unset;
        -ms-flex-align: unset;
        align-items: unset;
        border-bottom: 1px solid var(--borderGray)
    }

@media(min-width: 1024px) {
    .taskListForm .inputDiv {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }
}

.taskListForm .inputDiv:nth-child(even) {
    background: var(--inputColor1)
}

.taskListForm .inputDiv :is(h2,h3,h4,h5,p) {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    margin: 0;
    font-weight: 400;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media(min-width: 1024px) {
    .taskListForm .inputDiv :is(h2,h3,h4,h5,p) {
        border-right: 1px solid var(--borderGray)
    }
}

.taskListForm .inputDiv .inputBox {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
    max-width: -webkit-max-content;
    max-width: -moz-max-content;
    max-width: max-content;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center
}

    .taskListForm .inputDiv .inputBox label {
        margin: 0;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        min-width: 100px;
        padding: var(--input-size);
        font-size: 1rem;
        z-index: 1;
        text-align: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

        .taskListForm .inputDiv .inputBox label:has(:checked) {
            color: var(--inputColor)
        }

        .taskListForm .inputDiv .inputBox label input[type=radio], .taskListForm .inputDiv .inputBox label input[type=checkbox] {
            position: absolute;
            top: 0;
            left: 0;
            z-index: -1;
            width: 100%;
            height: 100%;
            border: 1px solid var(--textGray);
            background-color: var(--white);
            border-radius: var(--inputRadius);
            padding: 0;
            margin: 0;
            -webkit-transition: var(--transition1);
            transition: var(--transition1);
            cursor: pointer
        }

@media(min-width: 768px) {
    .taskListForm .inputDiv .inputBox label input[type=radio], .taskListForm .inputDiv .inputBox label input[type=checkbox] {
        border: 1px solid var(--borderGray)
    }
}

.taskListForm .inputDiv .inputBox label input[type=radio]:hover, .taskListForm .inputDiv .inputBox label input[type=checkbox]:hover {
    background-color: var(--inputColor1);
    border: 1px solid var(--inputColor1);
    -webkit-box-shadow: var(--inputColor2) 0px 0px 0px 1px;
    box-shadow: var(--inputColor2) 0px 0px 0px 1px
}

    .taskListForm .inputDiv .inputBox label input[type=radio]:hover::after, .taskListForm .inputDiv .inputBox label input[type=checkbox]:hover::after {
        color: var(--color1)
    }

.taskListForm .inputDiv .inputBox label input[type=radio]::after, .taskListForm .inputDiv .inputBox label input[type=checkbox]::after {
    position: absolute;
    left: 50%;
    top: 50%;
    content: attr(data-label);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    text-align: center;
    color: var(--darkGray);
    font-family: var(--font-family);
    font-size: 1rem;
    font-weight: 400;
    background-color: rgba(0,0,0,0);
    border-radius: 0;
    opacity: 1;
    -webkit-transform: none;
    transform: none;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    cursor: pointer;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.taskListForm .inputDiv .inputBox label input[type=radio]:focus, .taskListForm .inputDiv .inputBox label input[type=radio]:active, .taskListForm .inputDiv .inputBox label input[type=checkbox]:focus, .taskListForm .inputDiv .inputBox label input[type=checkbox]:active {
    border: 1px solid var(--inputColor3);
    -webkit-box-shadow: var(--inputColor2) 0px 0px 0px 1px;
    box-shadow: var(--inputColor2) 0px 0px 0px 1px;
    background-color: var(--inputColor1)
}

    .taskListForm .inputDiv .inputBox label input[type=radio]:focus::after, .taskListForm .inputDiv .inputBox label input[type=radio]:active::after, .taskListForm .inputDiv .inputBox label input[type=checkbox]:focus::after, .taskListForm .inputDiv .inputBox label input[type=checkbox]:active::after {
        color: var(--black)
    }

.taskListForm .inputDiv .inputBox label input[type=radio]:checked, .taskListForm .inputDiv .inputBox label input[type=checkbox]:checked {
    background-color: var(--white);
    border: 1px solid var(--inputColor5);
    -webkit-box-shadow: var(--inputColor4) 0px 0px 0px 1px;
    box-shadow: var(--inputColor4) 0px 0px 0px 1px
}

    .taskListForm .inputDiv .inputBox label input[type=radio]:checked::after, .taskListForm .inputDiv .inputBox label input[type=checkbox]:checked::after {
        color: var(--black)
    }

@media(min-width: 1024px) {
    .taskListForm .inputDiv .inputBox {
        width: 335px;
        text-align: center
    }
}

.taskListForm .inputDiv .inputBox [type=file] {
    width: 100%
}

.taskListForm .btnDiv {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

[drag_scroll] {
    overflow-x: auto;
    white-space: nowrap;
    cursor: -webkit-grab;
    cursor: grab;
    scroll-behavior: smooth
}

    [drag_scroll].active {
        cursor: -webkit-grabbing;
        cursor: grabbing
    }

[data-tooltip] {
    overflow: initial
}

    [data-tooltip]:not([data-tooltip]):before {
        display: none
    }

    [data-tooltip]:before {
        content: attr(data-tooltip);
        position: absolute;
        bottom: 100%;
        right: 50%;
        -webkit-transform: translateX(50%);
        transform: translateX(50%);
        z-index: 103;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        color: var(--lightGray);
        font-size: .733rem;
        font-weight: 400;
        letter-spacing: .25px;
        text-transform: capitalize;
        background: var(--darkGray);
        backdrop-filter: blur(10px);
        padding: .5rem .76rem;
        border-radius: .25rem;
        white-space: nowrap;
        opacity: 0;
        pointer-events: none
    }

    [data-tooltip]::after {
        content: "";
        position: absolute;
        bottom: 0;
        right: 50%;
        -webkit-transform: translateX(50%) rotate(180deg);
        transform: translateX(50%) rotate(180deg);
        width: 0;
        height: 0;
        border-left: 5px solid rgba(0,0,0,0);
        border-right: 5px solid rgba(0,0,0,0);
        border-bottom: 5px solid var(--darkGray);
        pointer-events: none;
        opacity: 0
    }

    [data-tooltip]:focus {
        z-index: 999
    }

        [data-tooltip]:focus::before, [data-tooltip]:focus::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

@media(min-width: 768px) {
    [data-tooltip]:hover {
        z-index: 999
    }

        [data-tooltip]:hover::before, [data-tooltip]:hover::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }
}

[data-tooltip-top] {
    overflow: initial
}

    [data-tooltip-top]:not([data-tooltip]):before {
        display: none
    }

    [data-tooltip-top]:before {
        content: attr(data-tooltip);
        position: absolute;
        bottom: 100%;
        right: 50%;
        -webkit-transform: translateX(50%);
        transform: translateX(50%);
        z-index: 103;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        color: var(--lightGray);
        font-size: .733rem;
        font-weight: 400;
        letter-spacing: .25px;
        text-transform: capitalize;
        background: var(--darkGray);
        backdrop-filter: blur(10px);
        padding: .5rem .76rem;
        border-radius: .25rem;
        white-space: nowrap;
        opacity: 0;
        pointer-events: none
    }

    [data-tooltip-top]::after {
        content: "";
        position: absolute;
        bottom: 0;
        right: 50%;
        -webkit-transform: translateX(50%) rotate(180deg);
        transform: translateX(50%) rotate(180deg);
        width: 0;
        height: 0;
        border-left: 5px solid rgba(0,0,0,0);
        border-right: 5px solid rgba(0,0,0,0);
        border-bottom: 5px solid var(--darkGray);
        pointer-events: none;
        opacity: 0
    }

    [data-tooltip-top]:focus {
        z-index: 999
    }

        [data-tooltip-top]:focus::before, [data-tooltip-top]:focus::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

@media(min-width: 768px) {
    [data-tooltip-top]:hover {
        z-index: 999
    }

        [data-tooltip-top]:hover::before, [data-tooltip-top]:hover::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }
}

[data-tooltip-top]::before {
    top: unset;
    right: unset;
    bottom: 100%;
    left: 50%;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

[data-tooltip-top]::after {
    top: 0;
    right: unset;
    bottom: unset;
    left: 50%;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateX(-50%) rotate(180deg);
    transform: translateX(-50%) rotate(180deg)
}

[data-tooltip-bottom] {
    overflow: initial
}

    [data-tooltip-bottom]:not([data-tooltip]):before {
        display: none
    }

    [data-tooltip-bottom]:before {
        content: attr(data-tooltip);
        position: absolute;
        bottom: 100%;
        right: 50%;
        -webkit-transform: translateX(50%);
        transform: translateX(50%);
        z-index: 103;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        color: var(--lightGray);
        font-size: .733rem;
        font-weight: 400;
        letter-spacing: .25px;
        text-transform: capitalize;
        background: var(--darkGray);
        backdrop-filter: blur(10px);
        padding: .5rem .76rem;
        border-radius: .25rem;
        white-space: nowrap;
        opacity: 0;
        pointer-events: none
    }

    [data-tooltip-bottom]::after {
        content: "";
        position: absolute;
        bottom: 0;
        right: 50%;
        -webkit-transform: translateX(50%) rotate(180deg);
        transform: translateX(50%) rotate(180deg);
        width: 0;
        height: 0;
        border-left: 5px solid rgba(0,0,0,0);
        border-right: 5px solid rgba(0,0,0,0);
        border-bottom: 5px solid var(--darkGray);
        pointer-events: none;
        opacity: 0
    }

    [data-tooltip-bottom]:focus {
        z-index: 999
    }

        [data-tooltip-bottom]:focus::before, [data-tooltip-bottom]:focus::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

@media(min-width: 768px) {
    [data-tooltip-bottom]:hover {
        z-index: 999
    }

        [data-tooltip-bottom]:hover::before, [data-tooltip-bottom]:hover::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }
}

[data-tooltip-bottom]::before {
    bottom: unset;
    right: unset;
    top: 100%;
    left: 50%;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

[data-tooltip-bottom]::after {
    top: unset;
    right: unset;
    bottom: 0;
    left: 50%;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

[data-tooltip-left] {
    overflow: initial
}

    [data-tooltip-left]:not([data-tooltip]):before {
        display: none
    }

    [data-tooltip-left]:before {
        content: attr(data-tooltip);
        position: absolute;
        bottom: 100%;
        right: 50%;
        -webkit-transform: translateX(50%);
        transform: translateX(50%);
        z-index: 103;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        color: var(--lightGray);
        font-size: .733rem;
        font-weight: 400;
        letter-spacing: .25px;
        text-transform: capitalize;
        background: var(--darkGray);
        backdrop-filter: blur(10px);
        padding: .5rem .76rem;
        border-radius: .25rem;
        white-space: nowrap;
        opacity: 0;
        pointer-events: none
    }

    [data-tooltip-left]::after {
        content: "";
        position: absolute;
        bottom: 0;
        right: 50%;
        -webkit-transform: translateX(50%) rotate(180deg);
        transform: translateX(50%) rotate(180deg);
        width: 0;
        height: 0;
        border-left: 5px solid rgba(0,0,0,0);
        border-right: 5px solid rgba(0,0,0,0);
        border-bottom: 5px solid var(--darkGray);
        pointer-events: none;
        opacity: 0
    }

    [data-tooltip-left]:focus {
        z-index: 999
    }

        [data-tooltip-left]:focus::before, [data-tooltip-left]:focus::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

@media(min-width: 768px) {
    [data-tooltip-left]:hover {
        z-index: 999
    }

        [data-tooltip-left]:hover::before, [data-tooltip-left]:hover::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }
}

[data-tooltip-left]::before {
    top: unset;
    left: unset;
    bottom: 50%;
    right: 100%;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateY(50%);
    transform: translateY(50%)
}

[data-tooltip-left]::after {
    top: unset;
    right: unset;
    bottom: 50%;
    left: -3px;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateY(50%) rotate(90deg);
    transform: translateY(50%) rotate(90deg)
}

[data-tooltip-right] {
    overflow: initial
}

    [data-tooltip-right]:not([data-tooltip]):before {
        display: none
    }

    [data-tooltip-right]:before {
        content: attr(data-tooltip);
        position: absolute;
        bottom: 100%;
        right: 50%;
        -webkit-transform: translateX(50%);
        transform: translateX(50%);
        z-index: 103;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        color: var(--lightGray);
        font-size: .733rem;
        font-weight: 400;
        letter-spacing: .25px;
        text-transform: capitalize;
        background: var(--darkGray);
        backdrop-filter: blur(10px);
        padding: .5rem .76rem;
        border-radius: .25rem;
        white-space: nowrap;
        opacity: 0;
        pointer-events: none
    }

    [data-tooltip-right]::after {
        content: "";
        position: absolute;
        bottom: 0;
        right: 50%;
        -webkit-transform: translateX(50%) rotate(180deg);
        transform: translateX(50%) rotate(180deg);
        width: 0;
        height: 0;
        border-left: 5px solid rgba(0,0,0,0);
        border-right: 5px solid rgba(0,0,0,0);
        border-bottom: 5px solid var(--darkGray);
        pointer-events: none;
        opacity: 0
    }

    [data-tooltip-right]:focus {
        z-index: 999
    }

        [data-tooltip-right]:focus::before, [data-tooltip-right]:focus::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

@media(min-width: 768px) {
    [data-tooltip-right]:hover {
        z-index: 999
    }

        [data-tooltip-right]:hover::before, [data-tooltip-right]:hover::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }
}

[data-tooltip-right]::before {
    top: unset;
    right: unset;
    bottom: 50%;
    left: 100%;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateY(50%);
    transform: translateY(50%)
}

[data-tooltip-right]::after {
    top: unset;
    left: unset;
    bottom: 50%;
    right: -3px;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateY(50%) rotate(-90deg);
    transform: translateY(50%) rotate(-90deg)
}

.moreBtn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: .25rem;
    cursor: pointer
}

    .moreBtn:hover .moreIcon {
        opacity: .5
    }

    .moreBtn:hover .btnMenuDiv {
        display: block;
        -webkit-transform: none;
        transform: none;
        opacity: 1;
        pointer-events: all
    }

    .moreBtn .moreIcon {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        color: var(--gray);
        font-size: .733rem;
        z-index: 1;
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

    .moreBtn .btnMenuDiv {
        position: absolute;
        top: 0;
        right: 0;
        z-index: 110;
        opacity: 0;
        pointer-events: none;
        padding-top: 2rem;
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .moreBtn .btnMenuDiv:hover {
            display: block;
            -webkit-transform: none;
            transform: none;
            opacity: 1;
            pointer-events: all
        }

        .moreBtn .btnMenuDiv .btnMenu {
            width: 100%;
            display: block;
            background-color: var(--shade-1);
            border-radius: var(--radius);
            border: 1px solid var(--shade-1);
            text-align: left;
            -webkit-box-shadow: rgba(50,50,93,.13) 0px 30px 60px -12px,rgba(0,0,0,.137) 0px 18px 36px -18px;
            box-shadow: rgba(50,50,93,.13) 0px 30px 60px -12px,rgba(0,0,0,.137) 0px 18px 36px -18px;
            overflow: hidden
        }

            .moreBtn .btnMenuDiv .btnMenu .changeStatusBtn::before {
                display: none
            }

            .moreBtn .btnMenuDiv .btnMenu label input {
                margin-right: 1rem;
                -webkit-transform: none;
                transform: none
            }

                .moreBtn .btnMenuDiv .btnMenu label input::before {
                    display: none
                }

            .moreBtn .btnMenuDiv .btnMenu a:not(.filledBtn,.outlinedBtn,.tonedBtn,.btn1,.btn2,.btn3,.btn3) {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                gap: 10px;
                padding: 1rem clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
                margin: 0;
                color: var(--text-color);
                font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
                font-weight: 400;
                white-space: nowrap;
                z-index: 1;
                cursor: pointer;
                -webkit-transition: var(--transition1);
                transition: var(--transition1)
            }

@media(min-width: 768px) {
    .moreBtn .btnMenuDiv .btnMenu a:not(.filledBtn,.outlinedBtn,.tonedBtn,.btn1,.btn2,.btn3,.btn3) {
        font-size: 1rem;
        padding: 1rem .7075rem
    }
}

.moreBtn .btnMenuDiv .btnMenu a:not(.filledBtn,.outlinedBtn,.tonedBtn,.btn1,.btn2,.btn3,.btn3)::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(linear, left top, right top, from(var(--shade-2)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(90deg, var(--shade-2) 0%, rgba(255, 255, 255, 0) 100%);
    opacity: 0;
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.moreBtn .btnMenuDiv .btnMenu a:not(.filledBtn,.outlinedBtn,.tonedBtn,.btn1,.btn2,.btn3,.btn3):hover {
    color: var(--text-color)
}

    .moreBtn .btnMenuDiv .btnMenu a:not(.filledBtn,.outlinedBtn,.tonedBtn,.btn1,.btn2,.btn3,.btn3):hover::before {
        opacity: 1
    }

.moreBtn .btnMenuDiv .btnMenu a:not(.filledBtn,.outlinedBtn,.tonedBtn,.btn1,.btn2,.btn3,.btn3):nth-child(1) {
    padding-top: 1.413rem
}

.moreBtn .btnMenuDiv .btnMenu a:not(.filledBtn,.outlinedBtn,.tonedBtn,.btn1,.btn2,.btn3,.btn3):nth-last-child(1) {
    padding-bottom: 1.413rem
}

.moreBtn .btnMenuDiv .btnMenu a:not(.filledBtn,.outlinedBtn,.tonedBtn,.btn1,.btn2,.btn3,.btn3) i {
    font-size: .733rem;
    line-height: 1
}

.moreBtn .btnMenuDiv .btnMenu .filledBtn, .moreBtn .btnMenuDiv .btnMenu .outlinedBtn, .moreBtn .btnMenuDiv .btnMenu .btn1, .moreBtn .btnMenuDiv .btnMenu .btn2, .moreBtn .btnMenuDiv .btnMenu .btn3, .moreBtn .btnMenuDiv .btnMenu .btn3 {
    width: calc(100% - 20px);
    margin: 10px;
    padding: .75rem .8rem !important;
    font-size: 1rem
}

.tabMenuNav {
    width: auto;
    overflow-x: auto;
    background-color: var(--white);
    --tab-width-mobile: 100px;
    --tab-width-web: 100px
}

    .tabMenuNav .tabMenuDiv {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        text-align: center;
        width: auto;
        margin: 0 auto
    }

        .tabMenuNav .tabMenuDiv:hover .tabMenu::before {
            background-color: rgba(0,0,0,0)
        }

        .tabMenuNav .tabMenuDiv:hover .tabMenuBorder {
            background-color: var(--highlight)
        }

        .tabMenuNav .tabMenuDiv .tabMenu {
            width: var(--tab-width-mobile);
            min-width: var(--tab-width-mobile);
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            color: var(--textGray);
            font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
            white-space: nowrap;
            padding: 1rem .5rem;
            border-radius: .7075rem;
            cursor: pointer;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

@media(min-width: 768px) {
    .tabMenuNav .tabMenuDiv .tabMenu {
        font-size: 1rem;
        padding: .7075rem 1rem;
        width: var(--tab-width-web);
        min-width: var(--tab-width-web)
    }
}

.tabMenuNav .tabMenuDiv .tabMenu::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    border-radius: 1rem;
    background-color: rgba(0,0,0,0);
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.tabMenuNav .tabMenuDiv .tabMenu:hover {
    color: var(--color1)
}

    .tabMenuNav .tabMenuDiv .tabMenu:hover ~ .tabMenuBorder {
        background-color: var(--highlight)
    }

.tabMenuNav .tabMenuDiv .tabMenu:active ~ .tabMenuBorder {
    background-color: var(--highlight);
    opacity: .5;
    -webkit-transition: all 250ms ease-out;
    transition: all 250ms ease-out
}

.tabMenuNav .tabMenuDiv .tabMenu img {
    width: 25px
}

.tabMenuNav .tabMenuDiv .tabMenu i {
    top: 1px;
    font-size: .878rem
}

.tabMenuNav .tabMenuDiv .tabMenu i, .tabMenuNav .tabMenuDiv .tabMenu img {
    margin-right: 10px
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(1).active ~ .tabMenuBorder {
    -webkit-transform: translateX(0%);
    transform: translateX(0%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(1):hover ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(1):hover ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(1):focus ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(1):focus ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(1):active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(1):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(0%);
    transform: translateX(0%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(2).active ~ .tabMenuBorder {
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(2):hover ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(2):hover ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(2):focus ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(2):focus ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(2):active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(2):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(3).active ~ .tabMenuBorder {
    -webkit-transform: translateX(200%);
    transform: translateX(200%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(3):hover ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(3):hover ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(3):focus ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(3):focus ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(3):active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(3):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(200%);
    transform: translateX(200%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(4).active ~ .tabMenuBorder {
    -webkit-transform: translateX(300%);
    transform: translateX(300%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(4):hover ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(4):hover ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(4):focus ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(4):focus ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(4):active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(4):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(300%);
    transform: translateX(300%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(5).active ~ .tabMenuBorder {
    -webkit-transform: translateX(400%);
    transform: translateX(400%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(5):hover ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(5):hover ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(5):focus ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(5):focus ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(5):active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(5):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(400%);
    transform: translateX(400%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(6).active ~ .tabMenuBorder {
    -webkit-transform: translateX(500%);
    transform: translateX(500%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(6):hover ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(6):hover ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(6):focus ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(6):focus ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(6):active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(6):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(500%);
    transform: translateX(500%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(7).active ~ .tabMenuBorder {
    -webkit-transform: translateX(600%);
    transform: translateX(600%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(7):hover ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(7):hover ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(7):focus ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(7):focus ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(7):active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(7):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(600%);
    transform: translateX(600%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(8).active ~ .tabMenuBorder {
    -webkit-transform: translateX(700%);
    transform: translateX(700%)
}

.tabMenuNav .tabMenuDiv .tabMenu:nth-child(8):hover ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(8):hover ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(8):focus ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(8):focus ~ .active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(8):active ~ .tabMenuBorder, .tabMenuNav .tabMenuDiv .tabMenu:nth-child(8):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(700%);
    transform: translateX(700%)
}

.tabMenuNav .tabMenuDiv .activeTabMenu {
    color: var(--black);
    font-weight: 500
}

    .tabMenuNav .tabMenuDiv .activeTabMenu::before {
        background-color: var(--highlight)
    }

.tabMenuNav .tabMenuDiv .tabMenuBorder {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2px;
    width: var(--tab-width-mobile);
    min-width: var(--tab-width-mobile);
    margin: 0;
    border: 0;
    border-radius: 1rem;
    background-color: rgba(0,0,0,0);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transition: all 375ms ease-out;
    transition: all 375ms ease-out;
    will-change: transform,background
}

@media(min-width: 768px) {
    .tabMenuNav .tabMenuDiv .tabMenuBorder {
        width: var(--tab-width-web);
        min-width: var(--tab-width-web)
    }
}

.tabBarWrapper {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    left: 0;
    -webkit-transition: var(--transition2);
    transition: var(--transition2)
}

    .tabBarWrapper .tabBarSlide {
        width: 100%;
        min-width: 100%;
        max-width: 100%;
        height: 0
    }

        .tabBarWrapper .tabBarSlide:nth-child(1) {
            height: auto
        }

.dropDownDiv, .dropSection {
    width: 100%;
    margin: 0 auto
}

    .dropDownDiv .dropList, .dropSection .dropList {
        display: block
    }

        .dropDownDiv .dropList .dropBox, .dropSection .dropList .dropBox {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: justify;
            -ms-flex-pack: justify;
            justify-content: space-between;
            padding: 1rem 0;
            -webkit-transition: var(--transition1);
            transition: var(--transition1);
            cursor: pointer
        }

            .dropDownDiv .dropList .dropBox .moreBtn, .dropSection .dropList .dropBox .moreBtn {
                margin-left: auto;
                padding: 1rem
            }

            .dropDownDiv .dropList .dropBox div, .dropSection .dropList .dropBox div {
                cursor: pointer;
                -webkit-transition: var(--transition1);
                transition: var(--transition1)
            }

                .dropDownDiv .dropList .dropBox div i, .dropSection .dropList .dropBox div i {
                    color: inherit;
                    font-size: .878rem;
                    cursor: pointer;
                    -webkit-transition: var(--transition1);
                    transition: var(--transition1)
                }

                .dropDownDiv .dropList .dropBox div .dropRemove, .dropSection .dropList .dropBox div .dropRemove {
                    display: none
                }

        .dropDownDiv .dropList .dropContent, .dropSection .dropList .dropContent {
            display: none;
            width: 100%
        }

            .dropDownDiv .dropList .dropContent p:nth-child(1), .dropSection .dropList .dropContent p:nth-child(1) {
                margin-top: 0
            }

.multiStepForm {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    counter-reset: form-steps
}

    .multiStepForm .multiStepSummary {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        z-index: 1;
        background: var(--bgShadeWeb)
    }

@media(min-width: 1280px) {
    .multiStepForm .multiStepSummary {
        position: fixed;
        top: 0;
        left: var(--menuBarWidth);
        min-height: 100vh;
        width: 400px;
        max-width: 400px
    }
}

@media(min-width: 1800px) {
    .multiStepForm .multiStepSummary {
        padding: 5.65rem;
        width: 500px;
        max-width: 500px
    }
}

.multiStepForm .multiStepSummary .headingDiv {
    text-align: center;
    margin-bottom: 2rem
}

@media(min-width: 1024px) {
    .multiStepForm .multiStepSummary .headingDiv {
        text-align: left;
        margin-bottom: 50px
    }
}

.multiStepForm .multiStepSummary .headingDiv .breadcrumb {
    margin-bottom: 10px
}

    .multiStepForm .multiStepSummary .headingDiv .breadcrumb a {
        color: var(--black);
        font-size: .878rem;
        padding-right: 15px;
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .multiStepForm .multiStepSummary .headingDiv .breadcrumb a:hover {
            color: var(--highlight)
        }

        .multiStepForm .multiStepSummary .headingDiv .breadcrumb a::after {
            position: absolute;
            top: 50%;
            right: 0;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
            content: "";
            font-family: var(--icon-style) !important;
            font-style: normal;
            font-weight: normal !important;
            font-variant: normal;
            text-transform: none;
            line-height: 1;
            -webkit-font-smoothing: antialiased;
            opacity: .7
        }

        .multiStepForm .multiStepSummary .headingDiv .breadcrumb a:nth-last-child(1) {
            padding-right: 0;
            color: var(--highlight);
            pointer-events: none
        }

            .multiStepForm .multiStepSummary .headingDiv .breadcrumb a:nth-last-child(1)::after {
                display: none
            }

.multiStepForm .multiStepSummary .headingDiv .heading {
    margin: 0;
    font-weight: 400
}

.multiStepForm .multiStepSummary .headingDiv p {
    opacity: .8
}

.multiStepForm .multiStepSummary ul {
    position: absolute;
    left: 50%;
    bottom: 0;
    -webkit-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%);
    width: 100%;
    margin-bottom: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media(min-width: 1024px) {
    .multiStepForm .multiStepSummary ul {
        position: relative;
        left: unset;
        bottom: unset;
        -webkit-transform: none;
        transform: none;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.multiStepForm .multiStepSummary ul .tabMenu {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-height: 40px;
    --bg-shade-visibility: 1;
    --bg-shade-bg-color: light-dark( #ffffffc7, #000000c9);
    --bg-shade-blur: blur(40px);
    --bg-shade-border: 1px solid #ffffff0d;
    --bg-shade-border-top: 1px solid #f1f6ff3d;
    --bg-shade-border-bottom: 1px solid #fcfdff17;
    --bg-shade-shadow: inset 0 3px 25px -0.5px #f6faff0f
}

    .multiStepForm .multiStepSummary ul .tabMenu::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: var(--bg-shade-visibility);
        backdrop-filter: var(--bg-shade-blur);
        background-color: var(--bg-shade-bg-color);
        border: var(--bg-shade-border);
        border-top: var(--bg-shade-border-top);
        border-bottom: var(--bg-shade-border-bottom);
        -webkit-box-shadow: var(--bg-shade-shadow);
        box-shadow: var(--bg-shade-shadow);
        border-radius: inherit;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

@media(min-width: 1024px) {
    .multiStepForm .multiStepSummary ul .tabMenu {
        -webkit-box-flex: 0;
        -ms-flex: none;
        flex: none;
        width: 100%;
        padding-left: 60px;
        margin-bottom: .7075rem
    }
}

.multiStepForm .multiStepSummary ul .tabMenu::before {
    counter-increment: form-steps;
    content: counter(form-steps);
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1;
    width: 40px;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--black);
    font-size: 1rem;
    font-weight: 500;
    text-align: center;
    background-color: rgba(251,255,250,.3568627451);
    border: 1px solid var(--highlight);
    border-radius: 100%;
    -webkit-transition: var(--transition2);
    transition: var(--transition2)
}

@media(min-width: 1024px) {
    .multiStepForm .multiStepSummary ul .tabMenu::before {
        left: 0;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

.multiStepForm .multiStepSummary ul .tabMenu::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 51%;
    width: 91%;
    height: 1px;
    border-bottom: 2px dashed var(--borderGray);
    -webkit-transition: var(--transition2);
    transition: var(--transition2)
}

@media(min-width: 1024px) {
    .multiStepForm .multiStepSummary ul .tabMenu::after {
        top: 20px;
        left: 20px;
        width: 1px;
        height: 75%;
        border: none;
        border-left: 2px dashed var(--borderGray)
    }
}

.multiStepForm .multiStepSummary ul .tabMenu:nth-last-child(1)::after {
    display: none
}

.multiStepForm .multiStepSummary ul .tabMenu .title {
    display: none;
    margin: 0;
    color: var(--textGray);
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    font-weight: 400
}

@media(min-width: 1024px) {
    .multiStepForm .multiStepSummary ul .tabMenu .title {
        display: block;
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
    }
}

.multiStepForm .multiStepSummary ul .tabMenu p {
    display: none;
    margin-top: 5px;
    color: var(--gray);
    font-size: .878rem;
    font-weight: 400
}

@media(min-width: 1024px) {
    .multiStepForm .multiStepSummary ul .tabMenu p {
        display: block;
        font-size: .937rem
    }
}

.multiStepForm .multiStepSummary ul .activeTabMenu::before {
    background-color: var(--highlight);
    border: 1px solid rgba(0,0,0,0);
    color: var(--white);
    -webkit-box-shadow: hsla(0,0%,100%,.1) 0px 1px 1px 0px inset,rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    box-shadow: hsla(0,0%,100%,.1) 0px 1px 1px 0px inset,rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px
}

.multiStepForm .multiStepSummary ul .activeTabMenu::after {
    border-left: 2px dashed var(--inputColor2)
}

.multiStepForm .multiStepSummary ul .activeTabMenu .title {
    color: var(--black);
    font-weight: 500
}

.multiStepForm .multiStepSummary dotlottie-player {
    display: none
}

@media(min-width: 1024px) {
    .multiStepForm .multiStepSummary dotlottie-player {
        display: block
    }
}

.multiStepForm .formWrapper {
    width: 100%;
    min-height: 100vh;
    overflow: hidden;
    background-color: var(--white)
}

@media(min-width: 1024px) {
    .multiStepForm .formWrapper {
        width: calc(100% - 400px);
        margin-left: auto
    }
}

@media(min-width: 1800px) {
    .multiStepForm .formWrapper {
        width: calc(100% - 500px)
    }
}

.multiStepForm .formWrapper .heading {
    margin: 0;
    display: block;
    width: 100%;
    margin-bottom: .7075rem
}

.multiStepForm .formWrapper .dropDownDiv {
    width: 100%;
    overflow: hidden;
    background-color: var(--white);
    border-radius: .7075rem
}

.multiStepForm .formWrapper .multiStepWrapper {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

    .multiStepForm .formWrapper .multiStepWrapper .formContainer {
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        width: 100%;
        min-width: 100%;
        height: 0;
        opacity: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 0 2%
    }

@media(min-width: 1024px) {
    .multiStepForm .formWrapper .multiStepWrapper .formContainer {
        padding-left: 5.65rem;
        padding-right: 5.65rem
    }
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer:nth-child(1) {
    height: auto;
    opacity: 1
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding: 0
}

    .multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title {
        width: 100%;
        margin: 0
    }

        .multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input {
            font-size: clamp(22.78125px,18.8433710526px + 0.0082039145*100vw,35.2512px);
            padding-left: 5px;
            caret-color: var(--inputColor5);
            text-transform: capitalize
        }

@media(min-width: 1024px) {
    .multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input {
        font-size: clamp(25.62890625px,20.3638955921px + 0.0109687722*100vw,42.30144px)
    }
}

@media(min-width: 1800px) {
    .multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input {
        font-size: clamp(28.8325195313px,21.9075063306px + 0.0144271108*100vw,50.761728px)
    }
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input::before {
    content: "";
    position: absolute;
    width: 2px;
    height: 60%;
    background-color: var(--inputColor5);
    left: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input:focus + .messageBox::after {
    display: none
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input:valid + .messageBox:after {
    display: none
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input::-webkit-input-placeholder {
    font-size: inherit;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input::-moz-placeholder {
    font-size: inherit;
    -moz-transition: var(--transition1);
    transition: var(--transition1)
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input:-ms-input-placeholder {
    font-size: inherit;
    -ms-transition: var(--transition1);
    transition: var(--transition1)
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input::-ms-input-placeholder {
    font-size: inherit;
    -ms-transition: var(--transition1);
    transition: var(--transition1)
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title input::placeholder {
    font-size: inherit;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .title .messageBox:after {
    content: "";
    display: block !important;
    position: absolute;
    width: 2px;
    height: 30px;
    background-color: var(--inputColor5);
    left: 0;
    top: 0;
    -webkit-transform: translateY(-130%);
    transform: translateY(-130%);
    -webkit-animation-name: blink;
    animation-name: blink;
    -webkit-animation-duration: 1000ms;
    animation-duration: 1000ms;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    opacity: 1
}

@keyframes blink {
    from {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .titleDiv .text {
    max-width: 600px;
    line-height: 1.3;
    font-size: 1rem;
    font-weight: 400
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .detailsBox {
    padding: 0
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .multiStepBtnDiv {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 100;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    background-color: rgba(0,0,0,0);
    -webkit-box-shadow: none;
    box-shadow: none;
    gap: 0 2%
}

@media(min-width: 1024px) {
    .multiStepForm .formWrapper .multiStepWrapper .formContainer .multiStepBtnDiv {
        width: calc(100% - 400px - var(--menuBarWidth));
        padding: .7075rem 2rem
    }
}

@media(min-width: 1800px) {
    .multiStepForm .formWrapper .multiStepWrapper .formContainer .multiStepBtnDiv {
        width: calc(100% - 500px - var(--menuBarWidth))
    }
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .multiStepBtnDiv::before {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 150%;
    background: #fff;
    background: -webkit-gradient(linear, left bottom, left top, from(rgb(255, 255, 255)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
    pointer-events: none
}

.multiStepForm .formWrapper .multiStepWrapper .formContainer .multiStepBtnDiv a, .multiStepForm .formWrapper .multiStepWrapper .formContainer .multiStepBtnDiv button {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

@media(min-width: 768px) {
    .multiStepForm .formWrapper .multiStepWrapper .formContainer .multiStepBtnDiv a, .multiStepForm .formWrapper .multiStepWrapper .formContainer .multiStepBtnDiv button {
        max-width: 200px
    }
}

.multiStepForm .formWrapper .gridOptionInput, .multiStepForm .formWrapper .optionForm {
    text-align: left
}

    .multiStepForm .formWrapper .gridOptionInput label, .multiStepForm .formWrapper .optionForm label {
        margin: 0
    }

    .multiStepForm .formWrapper .gridOptionInput .options, .multiStepForm .formWrapper .optionForm .options {
        margin-top: 1rem;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

    .multiStepForm .formWrapper .gridOptionInput .formDiv, .multiStepForm .formWrapper .optionForm .formDiv {
        margin-bottom: 1rem;
        padding: 1rem;
        border-radius: 5px;
        background-color: var(--white)
    }

        .multiStepForm .formWrapper .gridOptionInput .formDiv label, .multiStepForm .formWrapper .optionForm .formDiv label {
            margin-bottom: 10px
        }

.multiStepForm .formWrapper .checkboxList, .multiStepForm .formWrapper .radioList {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 1rem;
    border-radius: 5px;
    background-color: var(--lightGray)
}

    .multiStepForm .formWrapper .checkboxList label, .multiStepForm .formWrapper .radioList label {
        width: 100%;
        color: var(--black);
        font-size: 1rem;
        font-weight: 500;
        margin-bottom: 1rem
    }

@media(min-width: 568px) {
    .multiStepForm .formWrapper .checkboxList label, .multiStepForm .formWrapper .radioList label {
        width: 50%
    }
}

@media(min-width: 568px) {
    .multiStepForm .formWrapper .checkboxList label:nth-child(odd), .multiStepForm .formWrapper .radioList label:nth-child(odd) {
        padding-right: 1rem
    }
}

.multiStepForm .formWrapper .checkboxList label:nth-last-child(1), .multiStepForm .formWrapper .radioList label:nth-last-child(1) {
    margin-bottom: 0
}

@media(min-width: 568px) {
    .multiStepForm .formWrapper .checkboxList label:nth-last-child(2), .multiStepForm .formWrapper .radioList label:nth-last-child(2) {
        margin-bottom: 0
    }
}

.inputTable {
    width: 100%;
    background-color: var(--standard-bg-color);
    border-collapse: collapse;
    margin: 1rem 0
}

    .inputTable [border=left] {
        border-left: 1px solid var(--borderGray)
    }

    .inputTable [border=right] {
        border-right: 1px solid var(--borderGray)
    }

    .inputTable th {
        padding: 10px 20px;
        font-size: .733rem;
        font-weight: 400;
        text-transform: uppercase;
        line-height: 1.3;
        letter-spacing: 1px
    }

@media(min-width: 1024px) {
    .inputTable th {
        padding: 10px .7075rem
    }
}

.inputTable .rowTitle {
    background-color: var(--inputColor1)
}

.inputTable tr {
    background-color: rgba(0,0,0,0);
    border: none;
    text-align: left
}

    .inputTable tr:nth-child(even) {
        background-color: rgba(0,0,0,0)
    }

    .inputTable tr:nth-last-child(1) .deleteFieldBtn, .inputTable tr:nth-last-child(1) [rowGeneratorDeleteRowButton], .inputTable tr:nth-last-child(1) [row_generator_delete_row_button] {
        display: none !important
    }

    .inputTable tr:nth-last-child(1) .addFieldBtn, .inputTable tr:nth-last-child(1) [rowGeneratorAddRowButton], .inputTable tr:nth-last-child(1) [row_generator_add_row_button] {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .inputTable tr .deleteFieldBtn, .inputTable tr [rowGeneratorDeleteRowButton], .inputTable tr [row_generator_delete_row_button] {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .inputTable tr .addFieldBtn, .inputTable tr [rowGeneratorAddRowButton], .inputTable tr [row_generator_add_row_button] {
        display: none
    }

.inputTable td {
    border-bottom: 1px solid var(--borderGray)
}

    .inputTable td button, .inputTable td [rowGeneratorCallback], .inputTable td [row_generator_callback] {
        overflow: initial;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        min-width: 100%;
        min-height: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        background-color: rgba(0,0,0,0);
        border: none;
        border-radius: 0;
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .inputTable td button:not([data-tooltip]):before, .inputTable td [rowGeneratorCallback]:not([data-tooltip]):before, .inputTable td [row_generator_callback]:not([data-tooltip]):before {
            display: none
        }

        .inputTable td button:before, .inputTable td [rowGeneratorCallback]:before, .inputTable td [row_generator_callback]:before {
            content: attr(data-tooltip);
            position: absolute;
            bottom: 100%;
            right: 50%;
            -webkit-transform: translateX(50%);
            transform: translateX(50%);
            z-index: 103;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            color: var(--lightGray);
            font-size: .733rem;
            font-weight: 400;
            letter-spacing: .25px;
            text-transform: capitalize;
            background: var(--darkGray);
            backdrop-filter: blur(10px);
            padding: .5rem .76rem;
            border-radius: .25rem;
            white-space: nowrap;
            opacity: 0;
            pointer-events: none
        }

        .inputTable td button::after, .inputTable td [rowGeneratorCallback]::after, .inputTable td [row_generator_callback]::after {
            content: "";
            position: absolute;
            bottom: 0;
            right: 50%;
            -webkit-transform: translateX(50%) rotate(180deg);
            transform: translateX(50%) rotate(180deg);
            width: 0;
            height: 0;
            border-left: 5px solid rgba(0,0,0,0);
            border-right: 5px solid rgba(0,0,0,0);
            border-bottom: 5px solid var(--darkGray);
            pointer-events: none;
            opacity: 0
        }

        .inputTable td button:focus, .inputTable td [rowGeneratorCallback]:focus, .inputTable td [row_generator_callback]:focus {
            z-index: 999
        }

            .inputTable td button:focus::before, .inputTable td button:focus::after, .inputTable td [rowGeneratorCallback]:focus::before, .inputTable td [rowGeneratorCallback]:focus::after, .inputTable td [row_generator_callback]:focus::before, .inputTable td [row_generator_callback]:focus::after {
                opacity: 1;
                -webkit-transition: var(--transition1);
                transition: var(--transition1)
            }

@media(min-width: 768px) {
    .inputTable td button:hover, .inputTable td [rowGeneratorCallback]:hover, .inputTable td [row_generator_callback]:hover {
        z-index: 999
    }

        .inputTable td button:hover::before, .inputTable td button:hover::after, .inputTable td [rowGeneratorCallback]:hover::before, .inputTable td [rowGeneratorCallback]:hover::after, .inputTable td [row_generator_callback]:hover::before, .inputTable td [row_generator_callback]:hover::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }
}

.inputTable td button::before, .inputTable td [rowGeneratorCallback]::before, .inputTable td [row_generator_callback]::before {
    top: unset;
    right: unset;
    bottom: 100%;
    left: 50%;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.inputTable td button::after, .inputTable td [rowGeneratorCallback]::after, .inputTable td [row_generator_callback]::after {
    top: 0;
    right: unset;
    bottom: unset;
    left: 50%;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateX(-50%) rotate(180deg);
    transform: translateX(-50%) rotate(180deg)
}

.inputTable td button:hover, .inputTable td [rowGeneratorCallback]:hover, .inputTable td [row_generator_callback]:hover {
    background-color: var(--inputColor1);
    color: var(--inputColor4)
}

.inputTable td button i, .inputTable td [rowGeneratorCallback] i, .inputTable td [row_generator_callback] i {
    margin: auto;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.checkboxDropDownGroup {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    z-index: 1
}

    .checkboxDropDownGroup .heading {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin: 0;
        margin-bottom: .7075rem;
        border-left: 3px solid var(--highlight);
        padding-left: 10px;
        color: var(--black);
        font-weight: 500
    }

    .checkboxDropDownGroup .checkboxListDiv {
        width: 100%;
        margin: 0 auto;
        width: 100%;
        margin: 0 auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 3%
    }

        .checkboxDropDownGroup .checkboxListDiv .dropList {
            display: block
        }

            .checkboxDropDownGroup .checkboxListDiv .dropList .dropBox {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                justify-content: space-between;
                padding: 1rem 0;
                -webkit-transition: var(--transition1);
                transition: var(--transition1);
                cursor: pointer
            }

                .checkboxDropDownGroup .checkboxListDiv .dropList .dropBox .moreBtn {
                    margin-left: auto;
                    padding: 1rem
                }

                .checkboxDropDownGroup .checkboxListDiv .dropList .dropBox div {
                    cursor: pointer;
                    -webkit-transition: var(--transition1);
                    transition: var(--transition1)
                }

                    .checkboxDropDownGroup .checkboxListDiv .dropList .dropBox div i {
                        color: inherit;
                        font-size: .878rem;
                        cursor: pointer;
                        -webkit-transition: var(--transition1);
                        transition: var(--transition1)
                    }

                    .checkboxDropDownGroup .checkboxListDiv .dropList .dropBox div .dropRemove {
                        display: none
                    }

            .checkboxDropDownGroup .checkboxListDiv .dropList .dropContent {
                display: none;
                width: 100%
            }

                .checkboxDropDownGroup .checkboxListDiv .dropList .dropContent p:nth-child(1) {
                    margin-top: 0
                }

        .checkboxDropDownGroup .checkboxListDiv .dropList {
            margin-bottom: 1.3333rem;
            -webkit-transition: var(--transition2);
            transition: var(--transition2)
        }

@media(min-width: 360px) {
    .checkboxDropDownGroup .checkboxListDiv .dropList {
        width: 48.5%
    }
}

@media(min-width: 768px) {
    .checkboxDropDownGroup .checkboxListDiv .dropList {
        width: 31%
    }
}

.checkboxDropDownGroup .checkboxListDiv .dropList .dropBox {
    padding: 10px;
    padding-left: 1rem;
    background-color: var(--inputColor1);
    border: 1px solid var(--inputColor2);
    border-radius: var(--inputRadius);
    -webkit-box-shadow: var(--inputColor2) 0px 0px 0px 0px;
    box-shadow: var(--inputColor2) 0px 0px 0px 0px
}

    .checkboxDropDownGroup .checkboxListDiv .dropList .dropBox .title {
        margin-top: 0
    }

    .checkboxDropDownGroup .checkboxListDiv .dropList .dropBox .arrowBtn {
        width: 30px;
        height: 30px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        background-color: var(--inputColor1);
        border-radius: var(--radius);
        border: 1px solid rgba(0,0,0,0);
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .checkboxDropDownGroup .checkboxListDiv .dropList .dropBox .arrowBtn .dropRemove::after {
            content: "";
            position: fixed;
            top: 50%;
            left: 50%;
            width: 100%;
            height: 100%;
            -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%)
        }

@media(min-width: 568px) {
    .checkboxDropDownGroup .checkboxListDiv .dropList .dropBox .arrowBtn .dropRemove::after {
        display: none
    }
}

.checkboxDropDownGroup .checkboxListDiv .dropList .dropContent {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    z-index: 2;
    display: none;
    padding: 10px 0;
    background-color: var(--white);
    border: 1px solid var(--borderGray);
    border-top: none;
    border-radius: var(--radius);
    -webkit-box-shadow: rgba(22,23,26,.103) 0px 15px 25px,rgba(0,0,0,.05) 0px 5px 10px;
    box-shadow: rgba(22,23,26,.103) 0px 15px 25px,rgba(0,0,0,.05) 0px 5px 10px
}

    .checkboxDropDownGroup .checkboxListDiv .dropList .dropContent label {
        padding: 10px 0;
        padding-left: 1rem;
        font-weight: 500;
        border-bottom: 1px solid var(--lightGray);
        cursor: pointer
    }

        .checkboxDropDownGroup .checkboxListDiv .dropList .dropContent label:nth-last-child(1) {
            border-bottom: none
        }

.addonModules {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0
}

    .addonModules .title {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin: 0;
        margin-bottom: 1rem;
        border-left: 3px solid var(--highlight);
        padding-left: 5px;
        color: var(--black);
        font-weight: 500
    }

        .addonModules .title::after {
            content: "";
            height: 1px;
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            margin-left: 1rem;
            background-color: var(--inputBorder)
        }

    .addonModules .addonModuleCard {
        width: 100%;
        background-color: var(--standard-bg-color);
        border-collapse: collapse;
        margin: 1rem 0;
        margin: 0;
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 0 2%;
        padding: 1.413rem;
        border: 1px solid var(--lightGray);
        border-radius: .7075rem;
        -webkit-box-shadow: rgba(0,0,0,.058) 0px 10px 15px -3px,rgba(0,0,0,.05) 0px 4px 6px -2px;
        box-shadow: rgba(0,0,0,.058) 0px 10px 15px -3px,rgba(0,0,0,.05) 0px 4px 6px -2px;
        margin-bottom: .7075rem
    }

        .addonModules .addonModuleCard [border=left] {
            border-left: 1px solid var(--borderGray)
        }

        .addonModules .addonModuleCard [border=right] {
            border-right: 1px solid var(--borderGray)
        }

        .addonModules .addonModuleCard th {
            padding: 10px 20px;
            font-size: .733rem;
            font-weight: 400;
            text-transform: uppercase;
            line-height: 1.3;
            letter-spacing: 1px
        }

@media(min-width: 1024px) {
    .addonModules .addonModuleCard th {
        padding: 10px .7075rem
    }
}

.addonModules .addonModuleCard .rowTitle {
    background-color: var(--inputColor1)
}

.addonModules .addonModuleCard tr {
    background-color: rgba(0,0,0,0);
    border: none;
    text-align: left
}

    .addonModules .addonModuleCard tr:nth-child(even) {
        background-color: rgba(0,0,0,0)
    }

    .addonModules .addonModuleCard tr:nth-last-child(1) .deleteFieldBtn, .addonModules .addonModuleCard tr:nth-last-child(1) [rowGeneratorDeleteRowButton], .addonModules .addonModuleCard tr:nth-last-child(1) [row_generator_delete_row_button] {
        display: none !important
    }

    .addonModules .addonModuleCard tr:nth-last-child(1) .addFieldBtn, .addonModules .addonModuleCard tr:nth-last-child(1) [rowGeneratorAddRowButton], .addonModules .addonModuleCard tr:nth-last-child(1) [row_generator_add_row_button] {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .addonModules .addonModuleCard tr .deleteFieldBtn, .addonModules .addonModuleCard tr [rowGeneratorDeleteRowButton], .addonModules .addonModuleCard tr [row_generator_delete_row_button] {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .addonModules .addonModuleCard tr .addFieldBtn, .addonModules .addonModuleCard tr [rowGeneratorAddRowButton], .addonModules .addonModuleCard tr [row_generator_add_row_button] {
        display: none
    }

.addonModules .addonModuleCard td {
    border-bottom: 1px solid var(--borderGray)
}

    .addonModules .addonModuleCard td button, .addonModules .addonModuleCard td [rowGeneratorCallback], .addonModules .addonModuleCard td [row_generator_callback] {
        overflow: initial;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        min-width: 100%;
        min-height: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        background-color: rgba(0,0,0,0);
        border: none;
        border-radius: 0;
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .addonModules .addonModuleCard td button:not([data-tooltip]):before, .addonModules .addonModuleCard td [rowGeneratorCallback]:not([data-tooltip]):before, .addonModules .addonModuleCard td [row_generator_callback]:not([data-tooltip]):before {
            display: none
        }

        .addonModules .addonModuleCard td button:before, .addonModules .addonModuleCard td [rowGeneratorCallback]:before, .addonModules .addonModuleCard td [row_generator_callback]:before {
            content: attr(data-tooltip);
            position: absolute;
            bottom: 100%;
            right: 50%;
            -webkit-transform: translateX(50%);
            transform: translateX(50%);
            z-index: 103;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            color: var(--lightGray);
            font-size: .733rem;
            font-weight: 400;
            letter-spacing: .25px;
            text-transform: capitalize;
            background: var(--darkGray);
            backdrop-filter: blur(10px);
            padding: .5rem .76rem;
            border-radius: .25rem;
            white-space: nowrap;
            opacity: 0;
            pointer-events: none
        }

        .addonModules .addonModuleCard td button::after, .addonModules .addonModuleCard td [rowGeneratorCallback]::after, .addonModules .addonModuleCard td [row_generator_callback]::after {
            content: "";
            position: absolute;
            bottom: 0;
            right: 50%;
            -webkit-transform: translateX(50%) rotate(180deg);
            transform: translateX(50%) rotate(180deg);
            width: 0;
            height: 0;
            border-left: 5px solid rgba(0,0,0,0);
            border-right: 5px solid rgba(0,0,0,0);
            border-bottom: 5px solid var(--darkGray);
            pointer-events: none;
            opacity: 0
        }

        .addonModules .addonModuleCard td button:focus, .addonModules .addonModuleCard td [rowGeneratorCallback]:focus, .addonModules .addonModuleCard td [row_generator_callback]:focus {
            z-index: 999
        }

            .addonModules .addonModuleCard td button:focus::before, .addonModules .addonModuleCard td button:focus::after, .addonModules .addonModuleCard td [rowGeneratorCallback]:focus::before, .addonModules .addonModuleCard td [rowGeneratorCallback]:focus::after, .addonModules .addonModuleCard td [row_generator_callback]:focus::before, .addonModules .addonModuleCard td [row_generator_callback]:focus::after {
                opacity: 1;
                -webkit-transition: var(--transition1);
                transition: var(--transition1)
            }

@media(min-width: 768px) {
    .addonModules .addonModuleCard td button:hover, .addonModules .addonModuleCard td [rowGeneratorCallback]:hover, .addonModules .addonModuleCard td [row_generator_callback]:hover {
        z-index: 999
    }

        .addonModules .addonModuleCard td button:hover::before, .addonModules .addonModuleCard td button:hover::after, .addonModules .addonModuleCard td [rowGeneratorCallback]:hover::before, .addonModules .addonModuleCard td [rowGeneratorCallback]:hover::after, .addonModules .addonModuleCard td [row_generator_callback]:hover::before, .addonModules .addonModuleCard td [row_generator_callback]:hover::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }
}

.addonModules .addonModuleCard td button::before, .addonModules .addonModuleCard td [rowGeneratorCallback]::before, .addonModules .addonModuleCard td [row_generator_callback]::before {
    top: unset;
    right: unset;
    bottom: 100%;
    left: 50%;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.addonModules .addonModuleCard td button::after, .addonModules .addonModuleCard td [rowGeneratorCallback]::after, .addonModules .addonModuleCard td [row_generator_callback]::after {
    top: 0;
    right: unset;
    bottom: unset;
    left: 50%;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateX(-50%) rotate(180deg);
    transform: translateX(-50%) rotate(180deg)
}

.addonModules .addonModuleCard td button:hover, .addonModules .addonModuleCard td [rowGeneratorCallback]:hover, .addonModules .addonModuleCard td [row_generator_callback]:hover {
    background-color: var(--inputColor1);
    color: var(--inputColor4)
}

.addonModules .addonModuleCard td button i, .addonModules .addonModuleCard td [rowGeneratorCallback] i, .addonModules .addonModuleCard td [row_generator_callback] i {
    margin: auto;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.addonModules .addonModulesBtnDiv {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 1rem
}

    .addonModules .addonModulesBtnDiv .addModuleBtn {
        color: var(--borderGray);
        font-weight: 500;
        background-color: var(--black);
        border: 1px solid var(--borderGray);
        border-radius: 3rem
    }

.detailsBox {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-top: 5px;
    margin: 0
}

    .detailsBox .title {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin: 0;
        margin-bottom: 1rem;
        border-left: 3px solid var(--highlight);
        padding-left: 5px;
        color: var(--black);
        font-weight: 500
    }

        .detailsBox .title::after {
            content: "";
            height: 1px;
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            margin-left: 1rem;
            background-color: var(--shade-5)
        }

    .detailsBox .inputDiv label {
        color: var(--text-color);
        font-size: .878rem;
        margin-bottom: 5px;
        opacity: .7
    }

.fileWrapper {
    width: 100%
}

    .fileWrapper .fileContainer {
        width: 100%;
        border: 2px dashed var(--inputColor2);
        background-color: var(--inputColor1);
        padding: 2rem;
        border-radius: var(--radius);
        -webkit-transition: var(--transition1);
        transition: var(--transition1);
        cursor: pointer
    }

        .fileWrapper .fileContainer:hover {
            border: 2px dashed var(--inputColor3)
        }

            .fileWrapper .fileContainer:hover:before {
                color: var(--inputColor5)
            }

        .fileWrapper .fileContainer:before {
            content: attr(data-label);
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            text-align: center;
            color: var(--gray);
            font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
            font-weight: 500;
            -webkit-transition: var(--transition1);
            transition: var(--transition1);
            cursor: pointer
        }

        .fileWrapper .fileContainer input {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0
        }

    .fileWrapper .uploadedFilesContainer {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        background-color: var(--inputColor1);
        padding: 1rem;
        border-radius: var(--radius);
        margin-top: 10px
    }

        .fileWrapper .uploadedFilesContainer .uploadedFile {
            width: 100%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: justify;
            -ms-flex-pack: justify;
            justify-content: space-between;
            padding: .7075rem 1rem;
            padding-right: 50px;
            border: 1px solid var(--lightGray);
            border-radius: var(--radius);
            background-color: var(--white);
            margin-top: 10px;
            -webkit-box-shadow: rgba(0,0,0,.05) 0px 1px 2px 0px;
            box-shadow: rgba(0,0,0,.05) 0px 1px 2px 0px
        }

            .fileWrapper .uploadedFilesContainer .uploadedFile:hover {
                -webkit-box-shadow: rgba(33,35,38,.1) 0px 10px 10px -10px;
                box-shadow: rgba(33,35,38,.1) 0px 10px 10px -10px
            }

            .fileWrapper .uploadedFilesContainer .uploadedFile:nth-child(1) {
                margin-top: 0
            }

        .fileWrapper .uploadedFilesContainer .deleteFileButton {
            position: absolute;
            top: 50%;
            right: 0;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
            width: 50px;
            margin-left: 1rem;
            color: var(--black);
            border-radius: 0;
            border-left: 1px solid var(--borderGray);
            background-color: rgba(0,0,0,0)
        }

            .fileWrapper .uploadedFilesContainer .deleteFileButton:hover {
                color: var(--red)
            }

            .fileWrapper .uploadedFilesContainer .deleteFileButton i {
                -webkit-transform: none;
                transform: none
            }

        .fileWrapper .uploadedFilesContainer .noFileLabel {
            width: 100%;
            text-align: center;
            color: var(--gray);
            font-weight: 400
        }

.tableDiv {
    width: 100%
}

table {
    width: 100%;
    display: table;
    border-spacing: 0;
    border-collapse: collapse
}

    table tr {
        display: table-row;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

    table th, table td {
        border-collapse: collapse;
        background-clip: padding-box;
        text-align: left;
        padding: .25rem .75rem
    }

        table th:has(input,select,textarea,selector selected item), table td:has(input,select,textarea,selector selected item) {
            padding: 0
        }

        table th:has(textarea), table td:has(textarea) {
            min-width: 250px
        }

        table th:has(input,textarea), table td:has(input,textarea) {
            padding-top: 0;
            padding-bottom: 0;
            z-index: 3 !important
        }

        table th:has(selector), table td:has(selector) {
            z-index: 4 !important;
            padding: 0
        }

            table th:has(selector) selected item, table td:has(selector) selected item {
                padding-top: 0;
                padding-bottom: 0
            }

        table th input:not([type=checkbox],[type=radio]), table th select, table th textarea, table th selector selected item, table td input:not([type=checkbox],[type=radio]), table td select, table td textarea, table td selector selected item {
            width: 100%;
            height: 100%;
            font-size: 1rem;
            padding: .65rem 20px;
            border: none !important;
            border-radius: 0;
            background: rgba(0,0,0,0) !important;
            border-color: rgba(0,0,0,0) !important
        }

@media(min-width: 1024px) {
    table th input:not([type=checkbox],[type=radio]), table th select, table th textarea, table th selector selected item, table td input:not([type=checkbox],[type=radio]), table td select, table td textarea, table td selector selected item {
        padding: .65rem .7075rem
    }
}

table th input:not([type=checkbox],[type=radio]):focus, table th input:not([type=checkbox],[type=radio]):active, table th select:focus, table th select:active, table th textarea:focus, table th textarea:active, table th selector selected item:focus, table th selector selected item:active, table td input:not([type=checkbox],[type=radio]):focus, table td input:not([type=checkbox],[type=radio]):active, table td select:focus, table td select:active, table td textarea:focus, table td textarea:active, table td selector selected item:focus, table td selector selected item:active {
    background: rgba(0,0,0,0) !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

table th p, table td p {
    margin: 0
}

table th selector, table td selector {
    width: 100%;
    height: 100%
}

    table th selector selected, table td selector selected {
        width: inherit;
        height: inherit;
        background: inherit !important;
        border-color: rgba(0,0,0,0) !important;
        border-radius: 0
    }

        table th selector selected items, table td selector selected items {
            background: inherit !important;
            border-color: rgba(0,0,0,0) !important
        }

table th textarea, table td textarea {
    height: 70px;
    min-height: 70px
}

    table th textarea::-webkit-input-placeholder, table td textarea::-webkit-input-placeholder {
        -webkit-transform: translateY(50%);
        transform: translateY(50%);
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

    table th textarea::-moz-placeholder, table td textarea::-moz-placeholder {
        transform: translateY(50%);
        -moz-transition: var(--transition1);
        transition: var(--transition1)
    }

    table th textarea:-ms-input-placeholder, table td textarea:-ms-input-placeholder {
        transform: translateY(50%);
        -ms-transition: var(--transition1);
        transition: var(--transition1)
    }

    table th textarea::-ms-input-placeholder, table td textarea::-ms-input-placeholder {
        transform: translateY(50%);
        -ms-transition: var(--transition1);
        transition: var(--transition1)
    }

    table th textarea::placeholder, table td textarea::placeholder {
        -webkit-transform: translateY(50%);
        transform: translateY(50%);
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

    table th textarea:focus::-webkit-input-placeholder, table td textarea:focus::-webkit-input-placeholder {
        opacity: 0
    }

    table th textarea:focus::-moz-placeholder, table td textarea:focus::-moz-placeholder {
        opacity: 0
    }

    table th textarea:focus:-ms-input-placeholder, table td textarea:focus:-ms-input-placeholder {
        opacity: 0
    }

    table th textarea:focus::-ms-input-placeholder, table td textarea:focus::-ms-input-placeholder {
        opacity: 0
    }

    table th textarea:focus::placeholder, table td textarea:focus::placeholder {
        opacity: 0
    }

table th input[type=time], table td input[type=time] {
    font-size: clamp(25.62890625px,20.3638955921px + 0.0109687722*100vw,42.30144px)
}

table td {
    border-bottom: 1px solid hsla(0,0%,100%,.5411764706);
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    word-break: break-all;
    font-size: 1rem;
    line-height: 1.2;
    white-space: nowrap
}

    table td .xlIcon, table td .lgIcon {
        overflow: initial
    }

        table td .xlIcon:not([data-tooltip]):before, table td .lgIcon:not([data-tooltip]):before {
            display: none
        }

        table td .xlIcon:before, table td .lgIcon:before {
            content: attr(data-tooltip);
            position: absolute;
            bottom: 100%;
            right: 50%;
            -webkit-transform: translateX(50%);
            transform: translateX(50%);
            z-index: 103;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            color: var(--lightGray);
            font-size: .733rem;
            font-weight: 400;
            letter-spacing: .25px;
            text-transform: capitalize;
            background: var(--darkGray);
            backdrop-filter: blur(10px);
            padding: .5rem .76rem;
            border-radius: .25rem;
            white-space: nowrap;
            opacity: 0;
            pointer-events: none
        }

        table td .xlIcon::after, table td .lgIcon::after {
            content: "";
            position: absolute;
            bottom: 0;
            right: 50%;
            -webkit-transform: translateX(50%) rotate(180deg);
            transform: translateX(50%) rotate(180deg);
            width: 0;
            height: 0;
            border-left: 5px solid rgba(0,0,0,0);
            border-right: 5px solid rgba(0,0,0,0);
            border-bottom: 5px solid var(--darkGray);
            pointer-events: none;
            opacity: 0
        }

        table td .xlIcon:focus, table td .lgIcon:focus {
            z-index: 999
        }

            table td .xlIcon:focus::before, table td .xlIcon:focus::after, table td .lgIcon:focus::before, table td .lgIcon:focus::after {
                opacity: 1;
                -webkit-transition: var(--transition1);
                transition: var(--transition1)
            }

@media(min-width: 768px) {
    table td .xlIcon:hover, table td .lgIcon:hover {
        z-index: 999
    }

        table td .xlIcon:hover::before, table td .xlIcon:hover::after, table td .lgIcon:hover::before, table td .lgIcon:hover::after {
            opacity: 1;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }
}

table td .xlIcon::before, table td .lgIcon::before {
    top: unset;
    right: unset;
    bottom: 100%;
    left: 50%;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

table td .xlIcon::after, table td .lgIcon::after {
    top: 0;
    right: unset;
    bottom: unset;
    left: 50%;
    -webkit-transform: none;
    transform: none;
    -webkit-transform: translateX(-50%) rotate(180deg);
    transform: translateX(-50%) rotate(180deg)
}

[width=xxs] {
    width: 45px;
    min-width: 45px
}

[width=xs] {
    width: 75px;
    min-width: 75px
}

[width=sm] {
    width: 100px;
    min-width: 100px
}

[width=md] {
    width: 150px;
    min-width: 150px
}

[width=lg] {
    width: 200px;
    min-width: 200px
}

[width=xl] {
    width: 250px;
    min-width: 250px
}

[width=xxl] {
    width: 300px;
    min-width: 300px
}

[width=xxxl] {
    width: 350px;
    min-width: 350px
}

[align=left] {
    text-align: left
}

[align=center] {
    text-align: center !important
}

    [align=center] * {
        margin: 0 auto;
        text-align: center
    }

[align=right] {
    text-align: right
}

[align=justify] {
    text-align: justify
}

.textLimit {
    overflow: hidden
}

.name {
    color: var(--text-color);
    margin: 0;
    font-weight: 500;
    text-transform: capitalize;
    pointer-events: none;
    z-index: 2
}

.price {
    color: var(--text-color);
    margin: 0;
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    font-weight: 500;
    white-space: noWrap;
    pointer-events: none;
    z-index: 2
}

    .price:empty {
        display: none
    }

    .price span {
        font-weight: 400
    }

.cost {
    display: inline-block
}

    .cost span {
        color: var(--text-color);
        text-align: right;
        display: block;
        font-weight: 400
    }

        .cost span:nth-child(1) {
            font-size: .878rem;
            font-weight: 500
        }

        .cost span:nth-child(2) {
            margin-top: .5rem;
            font-size: .667rem;
            font-weight: 400;
            padding-left: .25rem
        }

            .cost span:nth-child(2)::after {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                width: 2px;
                height: 11px;
                background-color: var(--green);
                border-radius: var(--radius)
            }

.datePeriod {
    color: var(--text-color)
}

    .datePeriod span, .datePeriod p {
        display: block;
        font-weight: 400;
        padding-left: .7rem
    }

        .datePeriod span::after, .datePeriod p::after {
            content: "";
            position: absolute;
            top: 3px;
            left: -1.5px;
            width: 5px;
            height: 5px;
            z-index: 1;
            border-radius: var(--radius)
        }

        .datePeriod span::before, .datePeriod p::before {
            content: "";
            position: absolute;
            left: 0;
            top: 0;
            height: 100%;
            width: 1px;
            background-color: var(--borderGray)
        }

        .datePeriod span:nth-child(1)::after, .datePeriod p:nth-child(1)::after {
            background-color: #81c376
        }

        .datePeriod span:nth-child(2), .datePeriod p:nth-child(2) {
            margin-top: .25rem
        }

            .datePeriod span:nth-child(2)::after, .datePeriod p:nth-child(2)::after {
                background-color: #e57575
            }

.contactActionList {
    margin-top: .5rem
}

    .contactActionList .contactList {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        padding: .25rem 0;
        z-index: 2
    }

        .contactActionList .contactList:hover .contactCopy {
            opacity: 1;
            -webkit-transform: scale(1.1);
            transform: scale(1.1)
        }

            .contactActionList .contactList:hover .contactCopy i {
                opacity: .5
            }

        .contactActionList .contactList:nth-last-child(1) {
            border-bottom: none
        }

        .contactActionList .contactList .phone, .contactActionList .contactList .email, .contactActionList .contactList .whatsapp {
            padding: .25rem 0
        }

        .contactActionList .contactList .contactCopy {
            opacity: 0;
            width: 25px;
            height: 25px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            padding: .35rem;
            margin-left: .5rem;
            border-radius: var(--inputRadius);
            background-color: var(--inputColor1);
            cursor: pointer;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

            .contactActionList .contactList .contactCopy:hover i {
                opacity: 1;
                color: var(--text-color)
            }

            .contactActionList .contactList .contactCopy:focus, .contactActionList .contactList .contactCopy:active {
                color: var(--standard-bg-color);
                background-color: var(--text-color)
            }

            .contactActionList .contactList .contactCopy i {
                color: var(--text-color);
                cursor: pointer
            }

.email, .whatsapp, .phone, .idText, .dateText, .timeText, .subSourceText, .sourceText, .departmentText, .addressText, .locationText, .userText {
    color: var(--text-color);
    display: inline-block;
    font-size: .937rem;
    font-weight: 500;
    white-space: noWrap;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

    .email:empty, .whatsapp:empty, .phone:empty, .idText:empty, .dateText:empty, .timeText:empty, .subSourceText:empty, .sourceText:empty, .departmentText:empty, .addressText:empty, .locationText:empty, .userText:empty {
        margin: 0 !important
    }

        .email:empty::before, .whatsapp:empty::before, .phone:empty::before, .idText:empty::before, .dateText:empty::before, .timeText:empty::before, .subSourceText:empty::before, .sourceText:empty::before, .departmentText:empty::before, .addressText:empty::before, .locationText:empty::before, .userText:empty::before {
            display: none !important
        }

    .email::before, .whatsapp::before, .phone::before, .idText::before, .dateText::before, .timeText::before, .subSourceText::before, .sourceText::before, .departmentText::before, .addressText::before, .locationText::before, .userText::before {
        top: 2px;
        margin-right: .5rem;
        color: inherit;
        font-family: var(--icon-style) !important;
        font-style: normal;
        font-weight: normal !important;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -webkit-transform: translateY(2px);
        transform: translateY(2px);
        opacity: .7
    }

.userText {
    font-weight: 600;
    text-transform: capitalize;
    pointer-events: none;
    z-index: 2
}

    .userText::before {
        content: ""
    }

.addressText, .locationText {
    font-size: .937rem;
    text-transform: capitalize;
    z-index: 2
}

    .addressText::before, .locationText::before {
        content: ""
    }

.departmentText {
    text-transform: capitalize;
    pointer-events: none;
    z-index: 2
}

    .departmentText::before {
        content: ""
    }

.sourceText {
    font-weight: 400;
    text-transform: capitalize;
    pointer-events: none;
    pointer-events: none;
    z-index: 2
}

    .sourceText::before {
        content: "ï’ƒ"
    }

.subSourceText {
    font-size: .733rem;
    text-transform: capitalize;
    font-weight: 400;
    margin-top: .5rem;
    pointer-events: none;
    pointer-events: none;
    z-index: 2
}

    .subSourceText::before {
        display: none;
        opacity: 0;
        content: ""
    }

.timeText {
    pointer-events: none;
    z-index: 2
}

    .timeText::before {
        content: ""
    }

.dateText {
    font-size: .878rem;
    pointer-events: none;
    opacity: .7;
    pointer-events: none;
    z-index: 2
}

    .dateText::before {
        content: ""
    }

.idText {
    font-size: .878rem;
    opacity: .7;
    pointer-events: none;
    z-index: 2
}

    .idText::before {
        content: "#"
    }

.phone {
    font-size: .95rem;
    letter-spacing: .5px;
    opacity: .95
}

    .phone:hover {
        color: #293db1
    }

    .phone::before {
        content: ""
    }

.whatsapp {
    font-size: .95rem;
    letter-spacing: .5px;
    opacity: .95
}

    .whatsapp:hover {
        color: #293db1
    }

    .whatsapp::before {
        content: ""
    }

.email {
    font-size: .95rem;
    letter-spacing: .5px;
    opacity: .95
}

    .email:hover {
        color: #293db1
    }

    .email::before {
        content: "î—¾"
    }

.messageText {
    z-index: 2
}

    .messageText:hover .label {
        color: var(--color1)
    }

    .messageText:hover .message {
        display: block;
        z-index: 101
    }

    .messageText .label {
        color: var(--text-color);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        font-size: .733rem;
        font-weight: 500;
        text-transform: uppercase;
        cursor: pointer
    }

        .messageText .label i {
            font-size: .733rem;
            color: inherit;
            padding-right: 5px;
            margin-right: 5px;
            border-right: 1px solid var(--inputColor3)
        }

    .messageText .message {
        color: var(--text-color);
        display: none;
        position: absolute;
        top: 100%;
        left: -1px;
        width: 300px;
        font-size: .937rem;
        font-weight: 400;
        line-height: 1.5 !important;
        white-space: wrap;
        background-color: var(--white);
        border: 1px solid var(--borderGray);
        border-radius: 0 0 var(--radius) var(--radius);
        padding: 1rem
    }

@media(min-width: 768px) {
    .messageText .message {
        width: 500px
    }
}

.sText {
    color: var(--text-color);
    display: block;
    font-size: .878rem;
    font-weight: 400;
    margin-bottom: .5rem;
    pointer-events: none;
    z-index: 2
}

.bText {
    color: var(--text-color);
    display: block;
    font-size: .937rem;
    margin: 0;
    pointer-events: none;
    z-index: 2
}

[reminder=active] {
    border: 1px solid #b6f3b6
}

[reminder=done] {
    background-color: #ecffef
}

    [reminder=done] .btn {
        display: none
    }

[reminder=cancel] {
    background-color: var(--lightGray);
    border: 1px solid var(--borderGray);
    opacity: .5
}

    [reminder=cancel] .btn {
        display: none
    }

[label] {
    height: 24px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    white-space: nowrap;
    font-size: .733rem;
    font-weight: 500;
    padding: 5px;
    border-radius: 3px 0 0 3px
}

    [label]:empty {
        padding: 0
    }

        [label]:empty:before {
            display: none
        }

    [label]::after {
        content: "";
        position: absolute;
        top: 0;
        right: -18px;
        height: 0;
        display: inline-block;
        border: 12px solid #e8e9ee;
        border-right: 10px inset rgba(0,0,0,0) !important
    }

[label=red] {
    color: var(--white);
    background-color: #ff5b5b
}

    [label=red]::after {
        border-color: #ff5b5b rgba(0,0,0,0) #ff5b5b #ff5b5b
    }

[label=orange] {
    color: var(--white);
    background-color: #ff8146
}

    [label=orange]::after {
        border-color: #ff8146 rgba(0,0,0,0) #ff8146 #ff8146
    }

[label=yellow] {
    color: var(--darkGray);
    background-color: #fff75b
}

    [label=yellow]::after {
        border-color: #fff75b rgba(0,0,0,0) #fff75b #fff75b
    }

[label=green] {
    color: var(--white);
    background-color: #36bb22
}

    [label=green]::after {
        border-color: #36bb22 rgba(0,0,0,0) #36bb22 #36bb22
    }

[label=blue] {
    color: var(--white);
    background-color: #5b69ff
}

    [label=blue]::after {
        border-color: #5b69ff rgba(0,0,0,0) #5b69ff #5b69ff
    }

[label=gray] {
    color: var(--darkGray);
    background-color: #e8e9ee
}

    [label=gray]::after {
        border-color: #e8e9ee rgba(0,0,0,0) #e8e9ee #e8e9ee
    }

.timeShow {
    display: block
}

.popupWindow, .centerPopupDiv, .alertPopupDiv, .messageDiv {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

    .popupWindow .icon, .centerPopupDiv .icon, .alertPopupDiv .icon, .messageDiv .icon {
        width: 100px;
        margin: 0 auto;
        font-size: clamp(25.62890625px,20.3638955921px + 0.0109687722*100vw,42.30144px)
    }

    .popupWindow .image, .centerPopupDiv .image, .alertPopupDiv .image, .messageDiv .image {
        width: 100%;
        max-width: 300px;
        margin: 0 auto
    }

    .popupWindow .subTitle, .centerPopupDiv .subTitle, .alertPopupDiv .subTitle, .messageDiv .subTitle {
        color: var(--color1)
    }

    .popupWindow .name, .popupWindow .subHeading, .centerPopupDiv .name, .centerPopupDiv .subHeading, .alertPopupDiv .name, .alertPopupDiv .subHeading, .messageDiv .name, .messageDiv .subHeading {
        display: block;
        margin-bottom: 0
    }

    .popupWindow .heading, .popupWindow .title, .centerPopupDiv .heading, .centerPopupDiv .title, .alertPopupDiv .heading, .alertPopupDiv .title, .messageDiv .heading, .messageDiv .title {
        margin: 0;
        margin-bottom: 1rem
    }

    .popupWindow .heading, .centerPopupDiv .heading, .alertPopupDiv .heading, .messageDiv .heading {
        display: block;
        color: var(--black);
        font-weight: 600
    }

    .popupWindow .text, .centerPopupDiv .text, .alertPopupDiv .text, .messageDiv .text {
        font-size: .937rem
    }

    .popupWindow *:not(input):not(textarea):not(img):not(i):not(.viewBtn):not(.popupWindowClose):empty, .centerPopupDiv *:not(input):not(textarea):not(img):not(i):not(.viewBtn):not(.popupWindowClose):empty, .alertPopupDiv *:not(input):not(textarea):not(img):not(i):not(.viewBtn):not(.popupWindowClose):empty, .messageDiv *:not(input):not(textarea):not(img):not(i):not(.viewBtn):not(.popupWindowClose):empty {
        display: none
    }

    .popupWindow p, .centerPopupDiv p, .alertPopupDiv p, .messageDiv p {
        line-height: 1.3
    }

    .popupWindow .listDiv, .centerPopupDiv .listDiv, .alertPopupDiv .listDiv, .messageDiv .listDiv {
        margin-top: 1rem
    }

        .popupWindow .listDiv li, .centerPopupDiv .listDiv li, .alertPopupDiv .listDiv li, .messageDiv .listDiv li {
            color: var(--darkGray);
            font-size: .878rem;
            margin-bottom: 1rem;
            padding-left: 1rem
        }

            .popupWindow .listDiv li .sText, .centerPopupDiv .listDiv li .sText, .alertPopupDiv .listDiv li .sText, .messageDiv .listDiv li .sText {
                margin-top: .25rem
            }

            .popupWindow .listDiv li::before, .centerPopupDiv .listDiv li::before, .alertPopupDiv .listDiv li::before, .messageDiv .listDiv li::before {
                content: "";
                position: absolute;
                left: 0;
                top: 5px;
                width: 5px;
                height: 5px;
                background-color: var(--color3);
                border-radius: var(--radius)
            }

    .popupWindow .tableList, .centerPopupDiv .tableList, .alertPopupDiv .tableList, .messageDiv .tableList {
        width: 100%;
        margin-top: 1rem
    }

        .popupWindow .tableList li, .centerPopupDiv .tableList li, .alertPopupDiv .tableList li, .messageDiv .tableList li {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            padding-top: .5rem;
            padding-bottom: .5rem
        }

            .popupWindow .tableList li label, .centerPopupDiv .tableList li label, .alertPopupDiv .tableList li label, .messageDiv .tableList li label {
                position: relative;
                top: 0;
                left: 0;
                -webkit-box-flex: 1;
                -ms-flex: 1;
                flex: 1;
                margin: 0;
                color: var(--textGray);
                font-size: .878rem;
                font-weight: 400;
                padding: 0;
                line-height: 1.6
            }

            .popupWindow .tableList li p, .centerPopupDiv .tableList li p, .alertPopupDiv .tableList li p, .messageDiv .tableList li p {
                -webkit-box-flex: 2;
                -ms-flex: 2;
                flex: 2;
                margin: 0;
                color: var(--darkGray);
                font-size: .878rem;
                font-weight: 500;
                line-height: 1.6
            }

            .popupWindow .tableList li span, .centerPopupDiv .tableList li span, .alertPopupDiv .tableList li span, .messageDiv .tableList li span {
                color: var(--textGray);
                margin: 0 .5rem
            }

    .popupWindow .editDetailsBtn, .centerPopupDiv .editDetailsBtn, .alertPopupDiv .editDetailsBtn, .messageDiv .editDetailsBtn {
        margin: 0;
        border-radius: var(--inputRadius);
        margin-left: auto
    }

    .popupWindow .tabMenuNav, .centerPopupDiv .tabMenuNav, .alertPopupDiv .tabMenuNav, .messageDiv .tabMenuNav {
        padding: 1rem;
        padding-bottom: 0
    }

    .popupWindow #tabWrapper .tabBarSlide, .centerPopupDiv #tabWrapper .tabBarSlide, .alertPopupDiv #tabWrapper .tabBarSlide, .messageDiv #tabWrapper .tabBarSlide {
        padding: 1rem
    }

    .popupWindow .popupCloseBg, .centerPopupDiv .popupCloseBg, .alertPopupDiv .popupCloseBg, .messageDiv .popupCloseBg {
        margin: 0;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background-color: rgba(0,0,0,.253);
        opacity: 0;
        pointer-events: none;
        -webkit-transition: opacity 1s ease-in;
        transition: opacity 1s ease-in
    }

    .popupWindow .btnDiv, .popupWindow .btnSection, .centerPopupDiv .btnDiv, .centerPopupDiv .btnSection, .alertPopupDiv .btnDiv, .alertPopupDiv .btnSection, .messageDiv .btnDiv, .messageDiv .btnSection {
        gap: 20px;
        margin-top: 2rem
    }

        .popupWindow .btnDiv a, .popupWindow .btnDiv button, .popupWindow .btnSection a, .popupWindow .btnSection button, .centerPopupDiv .btnDiv a, .centerPopupDiv .btnDiv button, .centerPopupDiv .btnSection a, .centerPopupDiv .btnSection button, .alertPopupDiv .btnDiv a, .alertPopupDiv .btnDiv button, .alertPopupDiv .btnSection a, .alertPopupDiv .btnSection button, .messageDiv .btnDiv a, .messageDiv .btnDiv button, .messageDiv .btnSection a, .messageDiv .btnSection button {
            min-width: 150px;
            padding: 1rem;
            font-size: 1rem
        }

.popupPadding {
    padding-left: 1rem;
    padding-right: 1rem
}

@media(min-width: 768px) {
    .popupPadding {
        padding-left: 2rem;
        padding-right: 2rem
    }
}

.infoMessagePopup, .warningMessagePopup, .successMessagePopup, .errorMessagePopup, .timeOutPopup, .commonPopup, .centerPopup, [side-popup], .sidePopup, .infoAlertPopup, .infoPopup, .warningAlertPopup, .warningPopup, .successAlertPopup, .successPopup, .errorAlertPopup, .alertPopup, .alertPopup {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 305;
    width: 100%;
    height: 100vh;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.infoAlertPopup, .infoPopup, .warningAlertPopup, .warningPopup, .successAlertPopup, .successPopup, .errorAlertPopup, .alertPopup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 0;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: opacity .5s ease-in-out;
    transition: opacity .5s ease-in-out;
    overflow: auto;
    padding: 1rem;
    z-index: 380
}

    .infoAlertPopup .alertPopupDiv, .infoPopup .alertPopupDiv, .warningAlertPopup .alertPopupDiv, .warningPopup .alertPopupDiv, .successAlertPopup .alertPopupDiv, .successPopup .alertPopupDiv, .errorAlertPopup .alertPopupDiv, .alertPopup .alertPopupDiv {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        width: 100%;
        max-width: 450px;
        height: auto;
        min-height: 300px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin: auto;
        background-color: var(--white);
        -webkit-box-shadow: rgba(50,50,93,.034) 0px 50px 100px -20px,rgba(0,7,36,.041) 0px 30px 60px -30px;
        box-shadow: rgba(50,50,93,.034) 0px 50px 100px -20px,rgba(0,7,36,.041) 0px 30px 60px -30px;
        border-radius: var(--radius);
        text-align: center;
        overflow: hidden;
        z-index: 115
    }

        .infoAlertPopup .alertPopupDiv .alertIcon, .infoPopup .alertPopupDiv .alertIcon, .warningAlertPopup .alertPopupDiv .alertIcon, .warningPopup .alertPopupDiv .alertIcon, .successAlertPopup .alertPopupDiv .alertIcon, .successPopup .alertPopupDiv .alertIcon, .errorAlertPopup .alertPopupDiv .alertIcon, .alertPopup .alertPopupDiv .alertIcon {
            font-size: 1.413rem;
            margin-bottom: clamp(20.25px,17.3681052632px + 0.0060039474*100vw,29.376px)
        }

        .infoAlertPopup .alertPopupDiv .heading, .infoPopup .alertPopupDiv .heading, .warningAlertPopup .alertPopupDiv .heading, .warningPopup .alertPopupDiv .heading, .successAlertPopup .alertPopupDiv .heading, .successPopup .alertPopupDiv .heading, .errorAlertPopup .alertPopupDiv .heading, .alertPopup .alertPopupDiv .heading {
            color: var(--darkGray);
            font-size: clamp(28.8325195313px,21.9075063306px + 0.0144271108*100vw,50.761728px);
            font-weight: 500;
            margin: 0;
            line-height: 1
        }

        .infoAlertPopup .alertPopupDiv .text, .infoPopup .alertPopupDiv .text, .warningAlertPopup .alertPopupDiv .text, .warningPopup .alertPopupDiv .text, .successAlertPopup .alertPopupDiv .text, .successPopup .alertPopupDiv .text, .errorAlertPopup .alertPopupDiv .text, .alertPopup .alertPopupDiv .text {
            font-size: 1rem;
            text-transform: capitalize
        }

    .infoAlertPopup .popupCloseIcon, .infoPopup .popupCloseIcon, .warningAlertPopup .popupCloseIcon, .warningPopup .popupCloseIcon, .successAlertPopup .popupCloseIcon, .successPopup .popupCloseIcon, .errorAlertPopup .popupCloseIcon, .alertPopup .popupCloseIcon {
        position: absolute;
        top: 1rem;
        right: 1rem;
        z-index: 10;
        width: 30px;
        height: 30px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: .25rem;
        background-color: var(--lightGray);
        border-radius: var(--inputRadius);
        border: 1px solid var(--lightGray);
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .infoAlertPopup .popupCloseIcon:hover, .infoPopup .popupCloseIcon:hover, .warningAlertPopup .popupCloseIcon:hover, .warningPopup .popupCloseIcon:hover, .successAlertPopup .popupCloseIcon:hover, .successPopup .popupCloseIcon:hover, .errorAlertPopup .popupCloseIcon:hover, .alertPopup .popupCloseIcon:hover {
            background-color: var(--borderGray)
        }

        .infoAlertPopup .popupCloseIcon i, .infoPopup .popupCloseIcon i, .warningAlertPopup .popupCloseIcon i, .warningPopup .popupCloseIcon i, .successAlertPopup .popupCloseIcon i, .successPopup .popupCloseIcon i, .errorAlertPopup .popupCloseIcon i, .alertPopup .popupCloseIcon i {
            color: var(--black);
            font-size: .667rem;
            cursor: pointer;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

    .infoAlertPopup .popupCloseBg, .infoPopup .popupCloseBg, .warningAlertPopup .popupCloseBg, .warningPopup .popupCloseBg, .successAlertPopup .popupCloseBg, .successPopup .popupCloseBg, .errorAlertPopup .popupCloseBg, .alertPopup .popupCloseBg {
        position: fixed;
        top: 0;
        left: 0;
        width: 0;
        height: 100vh;
        background-color: rgba(0,9,27,.089);
        cursor: pointer;
        -webkit-transition: opacity .3s !important;
        transition: opacity .3s !important
    }

    .errorAlertPopup .alertIcon, .alertPopup .alertIcon {
        color: var(--red)
    }

    .successAlertPopup .alertIcon, .successPopup .alertIcon {
        color: var(--green)
    }

    .warningAlertPopup .alertIcon, .warningPopup .alertIcon {
        color: #f3d571
    }

    .infoAlertPopup .alertIcon, .infoPopup .alertIcon {
        color: var(--textGray)
    }

[side-popup], .sidePopup {
    min-height: 100vh;
    text-align: left;
    background-color: var(--white);
    border-left: 1px solid var(--borderGray);
    -webkit-box-shadow: rgba(50,50,93,.25) 0px 100px 10px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    box-shadow: rgba(50,50,93,.25) 0px 100px 10px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    -webkit-transform: translateX(120%);
    transform: translateX(120%);
    overflow: auto
}

@media(min-width: 768px) {
    [side-popup], .sidePopup {
        max-width: 500px;
        -webkit-transform: translateX(800px);
        transform: translateX(800px)
    }
}

[side-popup] .popupCloseIcon, .sidePopup .popupCloseIcon {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 10;
    width: 30px;
    height: 30px;
    padding: 1rem;
    background-color: var(--color2);
    border-radius: var(--radius);
    border: 1px solid var(--borderGray);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

    [side-popup] .popupCloseIcon:hover, .sidePopup .popupCloseIcon:hover {
        background-color: var(--color3)
    }

        [side-popup] .popupCloseIcon:hover i, .sidePopup .popupCloseIcon:hover i {
            color: var(--white)
        }

    [side-popup] .popupCloseIcon i, .sidePopup .popupCloseIcon i {
        color: var(--white);
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

[side-popup] .sidePopupSection, .sidePopup .sidePopupSection {
    z-index: 1;
    height: 100vh;
    background-color: var(--white)
}

    [side-popup] .sidePopupSection .btnSection, .sidePopup .sidePopupSection .btnSection {
        margin-top: clamp(20.25px,17.3681052632px + 0.0060039474*100vw,29.376px)
    }

        [side-popup] .sidePopupSection .btnSection .btn, .sidePopup .sidePopupSection .btnSection .btn {
            margin: 0;
            margin-right: 1rem !important
        }

.commonPopup, [center-popup], .centerPopup {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 0;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: opacity .5s ease-in-out;
    transition: opacity .5s ease-in-out;
    overflow: auto;
    padding: 1rem
}

    .commonPopup .centerPopupDiv, [center-popup] .centerPopupDiv, .centerPopup .centerPopupDiv {
        margin: auto;
        width: 100%;
        max-width: 500px;
        height: auto;
        min-height: 300px;
        padding: 2rem;
        background-color: var(--white);
        -webkit-box-shadow: rgba(50,50,93,.034) 0px 50px 100px -20px,rgba(0,7,36,.041) 0px 30px 60px -30px;
        box-shadow: rgba(50,50,93,.034) 0px 50px 100px -20px,rgba(0,7,36,.041) 0px 30px 60px -30px;
        border-radius: var(--radius);
        text-align: center;
        overflow: hidden;
        z-index: 115
    }

    .commonPopup .popupCloseIcon, [center-popup] .popupCloseIcon, .centerPopup .popupCloseIcon {
        position: absolute;
        top: 1rem;
        right: 1rem;
        z-index: 10;
        width: 30px;
        height: 30px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: .25rem;
        background-color: var(--lightGray);
        border-radius: var(--inputRadius);
        border: 1px solid var(--lightGray);
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .commonPopup .popupCloseIcon:hover, [center-popup] .popupCloseIcon:hover, .centerPopup .popupCloseIcon:hover {
            background-color: var(--borderGray)
        }

            .commonPopup .popupCloseIcon:hover i, [center-popup] .popupCloseIcon:hover i, .centerPopup .popupCloseIcon:hover i {
                color: var(--color1)
            }

        .commonPopup .popupCloseIcon i, [center-popup] .popupCloseIcon i, .centerPopup .popupCloseIcon i {
            color: var(--color2);
            font-size: .667rem;
            cursor: pointer;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

    .commonPopup .popupCloseBg, [center-popup] .popupCloseBg, .centerPopup .popupCloseBg {
        position: fixed;
        top: 0;
        left: 0;
        width: 0;
        height: 100vh;
        background-color: rgba(0,9,27,.089);
        cursor: pointer;
        -webkit-transition: opacity .3s !important;
        transition: opacity .3s !important
    }

.commonPopup {
    z-index: 380
}

.timeOutPopup {
    display: none;
    width: 100%;
    -webkit-transform: translateY(-100%) !important;
    transform: translateY(-100%) !important;
    -webkit-transition: opacity .5s ease-in-out;
    transition: opacity .5s ease-in-out;
    overflow: auto;
    -webkit-animation: timeOutPopup 2.5s ease-out;
    animation: timeOutPopup 2.5s ease-out
}

@-webkit-keyframes timeOutPopup {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    1% {
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }

    80% {
        opacity: 1
    }

    90% {
        -webkit-transform: none;
        transform: none
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

@keyframes timeOutPopup {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    1% {
        -webkit-transform: none;
        transform: none;
        opacity: 1
    }

    80% {
        opacity: 1
    }

    90% {
        -webkit-transform: none;
        transform: none
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

.timeOutPopup .timeOutPopupDiv {
    margin: 0 auto;
    margin-top: 5%;
    width: 100%;
    max-width: 500px;
    height: auto;
    min-height: 200px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-self: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: var(--white);
    -webkit-box-shadow: rgba(50,50,93,.034) 0px 50px 200px -20px,rgba(0,7,36,.041) 0px 30px 60px -30px;
    box-shadow: rgba(50,50,93,.034) 0px 50px 200px -20px,rgba(0,7,36,.041) 0px 30px 60px -30px;
    border-radius: var(--radius);
    border: 1px solid var(--borderGray);
    text-align: center;
    overflow: hidden;
    z-index: 115
}

    .timeOutPopup .timeOutPopupDiv .btnSection {
        margin-top: 2rem
    }

        .timeOutPopup .timeOutPopupDiv .btnSection .btn {
            margin: 0 .5rem
        }

.timeOutPopup .popupCloseIcon {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 10;
    width: 30px;
    height: 30px;
    padding: 1rem;
    background-color: var(--lightGray);
    border-radius: var(--radius);
    border: 1px solid var(--borderGray);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

    .timeOutPopup .popupCloseIcon:hover {
        background-color: var(--borderGray)
    }

        .timeOutPopup .popupCloseIcon:hover i {
            color: var(--color2)
        }

    .timeOutPopup .popupCloseIcon i {
        color: var(--color2);
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

.timeOutPopup .popupCloseBg {
    position: fixed;
    top: 0;
    left: 0;
    width: 0;
    height: 100vh;
    background-color: rgba(0,9,27,.24);
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.infoMessagePopup, .warningMessagePopup, .successMessagePopup, .errorMessagePopup {
    position: fixed;
    top: unset;
    bottom: 2rem;
    right: 2rem;
    z-index: 110;
    width: 100%;
    height: auto;
    max-width: 400px;
    margin-left: auto;
    display: none;
    border-radius: var(--radius);
    border: 1px solid var(--borderGray);
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    -webkit-box-shadow: rgba(17,12,46,.062) 0px 48px 100px 0px;
    box-shadow: rgba(17,12,46,.062) 0px 48px 100px 0px;
    -webkit-transform: translateY(150%);
    transform: translateY(150%);
    overflow: hidden
}

    .infoMessagePopup .messageDiv, .warningMessagePopup .messageDiv, .successMessagePopup .messageDiv, .errorMessagePopup .messageDiv {
        padding: 1rem;
        padding-left: calc(70px + 1rem)
    }

        .infoMessagePopup .messageDiv .iconDiv, .warningMessagePopup .messageDiv .iconDiv, .successMessagePopup .messageDiv .iconDiv, .errorMessagePopup .messageDiv .iconDiv {
            position: absolute;
            top: 0;
            left: 0;
            width: 70px;
            height: 100%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            padding: 1rem;
            display: flex;
            align-items: center
        }

            .infoMessagePopup .messageDiv .iconDiv i, .warningMessagePopup .messageDiv .iconDiv i, .successMessagePopup .messageDiv .iconDiv i, .errorMessagePopup .messageDiv .iconDiv i {
                margin: auto;
                font-size: clamp(28.8325195313px,21.9075063306px + 0.0144271108*100vw,50.761728px)
            }

        .infoMessagePopup .messageDiv .title, .warningMessagePopup .messageDiv .title, .successMessagePopup .messageDiv .title, .errorMessagePopup .messageDiv .title {
            margin: 0
        }

        .infoMessagePopup .messageDiv p, .warningMessagePopup .messageDiv p, .successMessagePopup .messageDiv p, .errorMessagePopup .messageDiv p {
            margin-top: .5rem;
            color: var(--gray);
            font-size: .878rem;
            font-weight: 400;
            line-height: 1.4
        }

    .infoMessagePopup .popupClose, .warningMessagePopup .popupClose, .successMessagePopup .popupClose, .errorMessagePopup .popupClose {
        position: absolute;
        top: 1rem;
        right: 1rem;
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .infoMessagePopup .popupClose:hover, .warningMessagePopup .popupClose:hover, .successMessagePopup .popupClose:hover, .errorMessagePopup .popupClose:hover {
            opacity: .5
        }

        .infoMessagePopup .popupClose i, .warningMessagePopup .popupClose i, .successMessagePopup .popupClose i, .errorMessagePopup .popupClose i {
            font-size: .878rem;
            cursor: pointer
        }

    .errorMessagePopup .iconDiv {
        background-color: #ffd5d5;
        color: var(--red)
    }

    .successMessagePopup .iconDiv {
        background-color: #e9ffe9;
        color: #309130
    }

    .warningMessagePopup .iconDiv {
        background-color: #fff0c1;
        color: var(--white)
    }

    .infoMessagePopup .iconDiv {
        background-color: var(--lightGray);
        color: var(--gray)
    }

.rightFloatingPopup {
    position: fixed;
    bottom: 0;
    right: 100%;
    z-index: 380;
    width: 100%;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0
}

    .rightFloatingPopup.popupIntro .popupWindow {
        -webkit-transform: translateZ(0) !important;
        transform: translateZ(0) !important;
        -webkit-transition-delay: .3s;
        transition-delay: .3s;
        -webkit-transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
        transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1) !important
    }

    .rightFloatingPopup .popupWindow {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        max-height: 75vh;
        padding: var(--btnRadius) var(--btnRadius) 0 0;
        background-color: var(--white);
        border-top: 1px solid var(--borderGray);
        border-radius: 1rem 1rem 0 0;
        -webkit-box-shadow: rgba(50,50,93,0) 0px -50px 100px -20px,rgba(0,0,0,0) 0px -30px 60px -30px;
        box-shadow: rgba(50,50,93,0) 0px -50px 100px -20px,rgba(0,0,0,0) 0px -30px 60px -30px;
        z-index: 2;
        -webkit-transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1);
        transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1);
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        will-change: transform;
        scroll-behavior: auto;
        -webkit-transition-delay: 0ms;
        transition-delay: 0ms
    }

        .rightFloatingPopup .popupWindow::before {
            content: "";
            position: absolute;
            top: 7px;
            left: 50%;
            width: 50px;
            height: 5px;
            border-radius: var(--radius);
            background-color: var(--borderGray);
            z-index: 1;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
            pointer-events: none
        }

@media(min-width: 1024px) {
    .rightFloatingPopup .popupWindow::before {
        display: none
    }
}

.rightFloatingPopup .popupWindow::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 35px;
    height: 35px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--textGray);
    font-family: var(--icon-style) !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    padding: 5px;
    border-radius: 100%;
    background-color: var(--black);
    border: 1px solid var(--black);
    border-top: 1px solid var(--darkGray);
    opacity: 0;
    z-index: 1;
    -webkit-transform: translate(-50%, -150%);
    transform: translate(-50%, -150%);
    pointer-events: none;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

@media(min-width: 1024px) {
    .rightFloatingPopup .popupWindow::after {
        display: none
    }
}

.rightFloatingPopup .popupWindowClose, .rightFloatingPopup .popupCloseBg {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    pointer-events: none;
    background-color: rgba(0,0,0,0);
    -webkit-transition: all 375ms ease-out;
    transition: all 375ms ease-out
}

@media(min-width: 1024px) {
    .rightFloatingPopup.popupIntro {
        -webkit-transform: none;
        transform: none
    }
}

.rightFloatingPopup .popupWindow {
    padding: 2rem 0;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

@media(min-width: 1024px) {
    .rightFloatingPopup .popupWindow {
        left: unset;
        right: 0;
        width: clamp(500px,40vw,600px);
        height: 100vh;
        max-height: 100vh;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        border-radius: 0;
        -webkit-transform: none;
        transform: none;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        -webkit-box-shadow: rgba(0,0,0,.1) 10px 0 15px -3px,rgba(0,0,0,.05) 4px 0 6px -2px;
        box-shadow: rgba(0,0,0,.1) 10px 0 15px -3px,rgba(0,0,0,.05) 4px 0 6px -2px;
        overflow-y: auto
    }
}

.rightFloatingPopup .popupWindow .popupCloseIcon {
    display: none;
    position: absolute;
    top: .7075rem;
    right: .7075rem;
    z-index: 1;
    width: 30px;
    height: 30px;
    padding: 5px;
    background-color: var(--lightGray);
    border-radius: var(--radius);
    cursor: pointer
}

@media(min-width: 1024px) {
    .rightFloatingPopup .popupWindow .popupCloseIcon {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

.rightFloatingPopup .popupWindow .popupCloseIcon i {
    margin: auto;
    cursor: pointer
}

.rightFloatingPopup .popupWindow .heading {
    margin: 0;
    margin-bottom: .7075rem;
    width: 100%;
    text-align: center
}

.rightFloatingPopup .popupWindow .formDiv {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden
}

.rightFloatingPopup .popupWindow .btnDiv {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 1rem
}

    .rightFloatingPopup .popupWindow .btnDiv a, .rightFloatingPopup .popupWindow .btnDiv button {
        margin: 0;
        width: 48%
    }

@media(min-width: 1024px) {
    .rightFloatingPopup .popupWindowClose {
        opacity: 0
    }
}

.moreOptionPopup:hover .moreIcon {
    opacity: .8
}

.moreOptionPopup .partialDataUpdatePopup, .moreOptionPopup .moreOptionView {
    position: fixed;
    bottom: 0;
    right: 100%;
    z-index: 380;
    width: 100%;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0
}

    .moreOptionPopup .partialDataUpdatePopup.popupIntro .popupWindow, .moreOptionPopup .moreOptionView.popupIntro .popupWindow {
        -webkit-transform: translateZ(0) !important;
        transform: translateZ(0) !important;
        -webkit-transition-delay: .3s;
        transition-delay: .3s;
        -webkit-transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
        transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1) !important
    }

    .moreOptionPopup .partialDataUpdatePopup .popupWindow, .moreOptionPopup .moreOptionView .popupWindow {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        max-height: 75vh;
        padding: var(--btnRadius) var(--btnRadius) 0 0;
        background-color: var(--white);
        border-top: 1px solid var(--borderGray);
        border-radius: 1rem 1rem 0 0;
        -webkit-box-shadow: rgba(50,50,93,0) 0px -50px 100px -20px,rgba(0,0,0,0) 0px -30px 60px -30px;
        box-shadow: rgba(50,50,93,0) 0px -50px 100px -20px,rgba(0,0,0,0) 0px -30px 60px -30px;
        z-index: 2;
        -webkit-transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1);
        transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1);
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        will-change: transform;
        scroll-behavior: auto;
        -webkit-transition-delay: 0ms;
        transition-delay: 0ms
    }

        .moreOptionPopup .partialDataUpdatePopup .popupWindow::before, .moreOptionPopup .moreOptionView .popupWindow::before {
            content: "";
            position: absolute;
            top: 7px;
            left: 50%;
            width: 50px;
            height: 5px;
            border-radius: var(--radius);
            background-color: var(--borderGray);
            z-index: 1;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
            pointer-events: none
        }

@media(min-width: 1024px) {
    .moreOptionPopup .partialDataUpdatePopup .popupWindow::before, .moreOptionPopup .moreOptionView .popupWindow::before {
        display: none
    }
}

.moreOptionPopup .partialDataUpdatePopup .popupWindow::after, .moreOptionPopup .moreOptionView .popupWindow::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 35px;
    height: 35px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--textGray);
    font-family: var(--icon-style) !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    padding: 5px;
    border-radius: 100%;
    background-color: var(--black);
    border: 1px solid var(--black);
    border-top: 1px solid var(--darkGray);
    opacity: 0;
    z-index: 1;
    -webkit-transform: translate(-50%, -150%);
    transform: translate(-50%, -150%);
    pointer-events: none;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

@media(min-width: 1024px) {
    .moreOptionPopup .partialDataUpdatePopup .popupWindow::after, .moreOptionPopup .moreOptionView .popupWindow::after {
        display: none
    }
}

.moreOptionPopup .partialDataUpdatePopup .popupWindowClose, .moreOptionPopup .partialDataUpdatePopup .popupCloseBg, .moreOptionPopup .moreOptionView .popupWindowClose, .moreOptionPopup .moreOptionView .popupCloseBg {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    pointer-events: none;
    background-color: rgba(0,0,0,0);
    -webkit-transition: all 375ms ease-out;
    transition: all 375ms ease-out
}

@media(min-width: 768px) {
    .moreOptionPopup .partialDataUpdatePopup, .moreOptionPopup .moreOptionView {
        position: absolute;
        top: 100%;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        height: -webkit-max-content;
        height: -moz-max-content;
        height: max-content;
        display: none;
        -webkit-transform: scale(0.8);
        transform: scale(0.8);
        padding: .7075rem;
        overflow: unset;
        pointer-events: none
    }
}

.moreOptionPopup .partialDataUpdatePopup .popupWindow, .moreOptionPopup .moreOptionView .popupWindow {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    padding-right: 0;
    padding-left: 0
}

@media(min-width: 768px) {
    .moreOptionPopup .partialDataUpdatePopup .popupWindow, .moreOptionPopup .moreOptionView .popupWindow {
        position: relative;
        min-width: 230px;
        min-height: auto;
        background-color: var(--shade-1);
        border-radius: var(--radius);
        border: 1px solid var(--shade-1);
        padding: 0;
        opacity: 0;
        -webkit-transform: none;
        transform: none;
        -webkit-box-shadow: rgba(50,50,93,.13) 0px 30px 60px -12px,rgba(0,0,0,.137) 0px 18px 36px -18px !important;
        box-shadow: rgba(50,50,93,.13) 0px 30px 60px -12px,rgba(0,0,0,.137) 0px 18px 36px -18px !important
    }
}

@media(min-width: 768px) {
    .moreOptionPopup .partialDataUpdatePopup .popupWindow:before, .moreOptionPopup .partialDataUpdatePopup .popupWindow:after, .moreOptionPopup .moreOptionView .popupWindow:before, .moreOptionPopup .moreOptionView .popupWindow:after {
        display: none
    }
}

@media(min-width: 768px) {
    .moreOptionPopup .partialDataUpdatePopup .popupWindowClose, .moreOptionPopup .moreOptionView .popupWindowClose {
        opacity: 0
    }
}

@media(min-width: 768px) {
    .moreOptionPopup .popupIntro {
        display: block;
        -webkit-transform: none;
        transform: none;
        right: 0;
        opacity: 1;
        pointer-events: all
    }
}

.moreOptionPopup .popupIntro .popupWindow {
    min-height: -webkit-min-content;
    min-height: -moz-min-content;
    min-height: min-content
}

@media(min-width: 768px) {
    .moreOptionPopup .popupIntro .popupWindow {
        opacity: 1
    }
}

.moreOptionPopup .popupIntro .popupWindow a {
    -webkit-box-flex: unset;
    -ms-flex: unset;
    flex: unset
}

    .moreOptionPopup .popupIntro .popupWindow a:not(.filledBtn,.outlinedBtn,.tonedBtn,.textBtn) {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

@media(min-width: 768px) {
    .moreOptionPopup .popupIntro .popupWindow a:not(.filledBtn,.outlinedBtn,.tonedBtn,.textBtn) {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

.changeUserPopup, .changeStatusPopup, .partialDataUpdatePopup {
    position: fixed;
    bottom: 0;
    right: 100%;
    z-index: 380;
    width: 100%;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0
}

    .changeUserPopup.popupIntro .popupWindow, .changeStatusPopup.popupIntro .popupWindow, .partialDataUpdatePopup.popupIntro .popupWindow {
        -webkit-transform: translateZ(0) !important;
        transform: translateZ(0) !important;
        -webkit-transition-delay: .3s;
        transition-delay: .3s;
        -webkit-transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
        transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1) !important
    }

    .changeUserPopup .popupWindow, .changeStatusPopup .popupWindow, .partialDataUpdatePopup .popupWindow {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        max-height: 75vh;
        padding: var(--btnRadius) var(--btnRadius) 0 0;
        background-color: var(--white);
        border-top: 1px solid var(--borderGray);
        border-radius: 1rem 1rem 0 0;
        -webkit-box-shadow: rgba(50,50,93,0) 0px -50px 100px -20px,rgba(0,0,0,0) 0px -30px 60px -30px;
        box-shadow: rgba(50,50,93,0) 0px -50px 100px -20px,rgba(0,0,0,0) 0px -30px 60px -30px;
        z-index: 2;
        -webkit-transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1);
        transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1);
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        will-change: transform;
        scroll-behavior: auto;
        -webkit-transition-delay: 0ms;
        transition-delay: 0ms
    }

        .changeUserPopup .popupWindow::before, .changeStatusPopup .popupWindow::before, .partialDataUpdatePopup .popupWindow::before {
            content: "";
            position: absolute;
            top: 7px;
            left: 50%;
            width: 50px;
            height: 5px;
            border-radius: var(--radius);
            background-color: var(--borderGray);
            z-index: 1;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
            pointer-events: none
        }

@media(min-width: 1024px) {
    .changeUserPopup .popupWindow::before, .changeStatusPopup .popupWindow::before, .partialDataUpdatePopup .popupWindow::before {
        display: none
    }
}

.changeUserPopup .popupWindow::after, .changeStatusPopup .popupWindow::after, .partialDataUpdatePopup .popupWindow::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 35px;
    height: 35px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--textGray);
    font-family: var(--icon-style) !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    padding: 5px;
    border-radius: 100%;
    background-color: var(--black);
    border: 1px solid var(--black);
    border-top: 1px solid var(--darkGray);
    opacity: 0;
    z-index: 1;
    -webkit-transform: translate(-50%, -150%);
    transform: translate(-50%, -150%);
    pointer-events: none;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

@media(min-width: 1024px) {
    .changeUserPopup .popupWindow::after, .changeStatusPopup .popupWindow::after, .partialDataUpdatePopup .popupWindow::after {
        display: none
    }
}

.changeUserPopup .popupWindowClose, .changeUserPopup .popupCloseBg, .changeStatusPopup .popupWindowClose, .changeStatusPopup .popupCloseBg, .partialDataUpdatePopup .popupWindowClose, .partialDataUpdatePopup .popupCloseBg {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    pointer-events: none;
    background-color: rgba(0,0,0,0);
    -webkit-transition: all 375ms ease-out;
    transition: all 375ms ease-out
}

@media(min-width: 1024px) {
    .changeUserPopup, .changeStatusPopup, .partialDataUpdatePopup {
        position: fixed;
        bottom: 0;
        right: 100%;
        z-index: 380;
        width: 100%;
        height: 100vh;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin: 0;
        overflow: hidden
    }

        .changeUserPopup .popupWindow, .changeStatusPopup .popupWindow, .partialDataUpdatePopup .popupWindow {
            position: relative;
            bottom: unset;
            left: unset;
            width: 100%;
            max-width: 450px;
            min-height: 350px;
            max-height: 650px;
            padding: 2rem;
            background-color: var(--white);
            border-radius: var(--radius);
            -webkit-box-shadow: rgba(50,50,93,0) 0px -50px 100px -20px,rgba(0,0,0,0) 0px -30px 60px -30px;
            box-shadow: rgba(50,50,93,0) 0px -50px 100px -20px,rgba(0,0,0,0) 0px -30px 60px -30px;
            z-index: 2;
            -webkit-transition: all 375ms ease-out;
            transition: all 375ms ease-out;
            -webkit-transform: translateY(110%) scale(0.95);
            transform: translateY(110%) scale(0.95)
        }

            .changeUserPopup .popupWindow::before, .changeStatusPopup .popupWindow::before, .partialDataUpdatePopup .popupWindow::before {
                content: "";
                position: absolute;
                top: 7px;
                left: 50%;
                width: 50px;
                height: 5px;
                border-radius: var(--radius);
                background-color: var(--borderGray);
                z-index: 1;
                -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
                pointer-events: none
            }
}

@media(min-width: 1024px)and (min-width: 1024px) {
    .changeUserPopup .popupWindow::before, .changeStatusPopup .popupWindow::before, .partialDataUpdatePopup .popupWindow::before {
        display: none
    }
}

@media(min-width: 1024px) {
    .changeUserPopup .popupWindow::after, .changeStatusPopup .popupWindow::after, .partialDataUpdatePopup .popupWindow::after {
        content: "";
        position: absolute;
        top: -50px;
        left: 50%;
        width: 25px;
        height: 25px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        color: var(--borderGray);
        font-family: var(--icon-style) !important;
        font-style: normal;
        font-weight: normal !important;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        padding: 5px;
        border-radius: 100%;
        background-color: var(--black);
        border: 1px solid var(--gray);
        opacity: 0;
        z-index: 1;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        pointer-events: none;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }
}

@media(min-width: 1024px)and (min-width: 1024px) {
    .changeUserPopup .popupWindow::after, .changeStatusPopup .popupWindow::after, .partialDataUpdatePopup .popupWindow::after {
        display: none
    }
}

@media(min-width: 1024px) {
    .changeUserPopup .popupWindowClose, .changeStatusPopup .popupWindowClose, .partialDataUpdatePopup .popupWindowClose {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1;
        width: 100%;
        height: 100%;
        pointer-events: none;
        background-color: rgba(0,0,0,0);
        -webkit-transition: all 375ms ease-out;
        transition: all 375ms ease-out;
        cursor: pointer
    }
}

.changeUserPopup .popupWindow, .changeStatusPopup .popupWindow, .partialDataUpdatePopup .popupWindow {
    padding-top: 2rem
}

    .changeUserPopup .popupWindow .heading, .changeStatusPopup .popupWindow .heading, .partialDataUpdatePopup .popupWindow .heading {
        margin: 0;
        margin-bottom: .7075rem;
        width: 100%;
        text-align: center
    }

    .changeUserPopup .popupWindow .popupCloseIcon, .changeStatusPopup .popupWindow .popupCloseIcon, .partialDataUpdatePopup .popupWindow .popupCloseIcon {
        display: none;
        position: absolute;
        top: .7075rem;
        right: .7075rem;
        z-index: 1;
        width: 30px;
        height: 30px;
        padding: 5px;
        background-color: var(--lightGray);
        border-radius: var(--radius);
        cursor: pointer
    }

@media(min-width: 1024px) {
    .changeUserPopup .popupWindow .popupCloseIcon, .changeStatusPopup .popupWindow .popupCloseIcon, .partialDataUpdatePopup .popupWindow .popupCloseIcon {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

.changeUserPopup .popupWindow .popupCloseIcon i, .changeStatusPopup .popupWindow .popupCloseIcon i, .partialDataUpdatePopup .popupWindow .popupCloseIcon i {
    margin: auto;
    cursor: pointer
}

.changeUserPopup .popupWindow .btnDiv, .changeStatusPopup .popupWindow .btnDiv, .partialDataUpdatePopup .popupWindow .btnDiv {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 1rem
}

    .changeUserPopup .popupWindow .btnDiv a, .changeUserPopup .popupWindow .btnDiv button, .changeStatusPopup .popupWindow .btnDiv a, .changeStatusPopup .popupWindow .btnDiv button, .partialDataUpdatePopup .popupWindow .btnDiv a, .partialDataUpdatePopup .popupWindow .btnDiv button {
        margin: 0;
        width: 48%
    }

.changeUserPopup .popupWindow, .changeStatusPopup .popupWindow, .partialDataUpdatePopup .popupWindow {
    min-height: 400px;
    padding: 0
}

    .changeUserPopup .popupWindow .heading, .changeStatusPopup .popupWindow .heading, .partialDataUpdatePopup .popupWindow .heading {
        padding-top: var(--section-space-y);
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        font-weight: 500;
        margin-bottom: 1rem;
        padding-bottom: 1rem
    }

        .changeUserPopup .popupWindow .heading::before, .changeStatusPopup .popupWindow .heading::before, .partialDataUpdatePopup .popupWindow .heading::before {
            content: "";
            position: absolute;
            bottom: 0;
            left: 50%;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
            width: 100px;
            height: 3px;
            border-radius: 1rem;
            background: var(--highlight)
        }

    .changeUserPopup .popupWindow .titleDiv, .changeStatusPopup .popupWindow .titleDiv, .partialDataUpdatePopup .popupWindow .titleDiv {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: 2.83rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center;
        margin: 0 !important
    }

@media(min-width: 1024px) {
    .changeUserPopup .popupWindow .titleDiv, .changeStatusPopup .popupWindow .titleDiv, .partialDataUpdatePopup .popupWindow .titleDiv {
        padding-top: 2rem
    }
}

.changeUserPopup .popupWindow .titleDiv .label, .changeStatusPopup .popupWindow .titleDiv .label, .partialDataUpdatePopup .popupWindow .titleDiv .label {
    margin: 0;
    color: var(--textGray);
    font-size: .878rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 10px
}

.changeUserPopup .popupWindow .scrollFormDiv, .changeStatusPopup .popupWindow .scrollFormDiv, .partialDataUpdatePopup .popupWindow .scrollFormDiv {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    overflow-y: auto;
    max-height: 60vh;
    padding-bottom: 100px
}

@media(min-width: 1024px) {
    .changeUserPopup .popupWindow .scrollFormDiv, .changeStatusPopup .popupWindow .scrollFormDiv, .partialDataUpdatePopup .popupWindow .scrollFormDiv {
        max-height: 500px
    }
}

.changeUserPopup .popupWindow .scrollFormDiv .inputDiv:nth-last-child(1), .changeStatusPopup .popupWindow .scrollFormDiv .inputDiv:nth-last-child(1), .partialDataUpdatePopup .popupWindow .scrollFormDiv .inputDiv:nth-last-child(1) {
    margin-bottom: 0
}

.changeUserPopup .popupWindow .formDiv, .changeStatusPopup .popupWindow .formDiv, .partialDataUpdatePopup .popupWindow .formDiv {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: 100px
}

    .changeUserPopup .popupWindow .formDiv .inputDiv:nth-last-child(1), .changeStatusPopup .popupWindow .formDiv .inputDiv:nth-last-child(1), .partialDataUpdatePopup .popupWindow .formDiv .inputDiv:nth-last-child(1) {
        margin-bottom: 0
    }

.changeUserPopup .popupWindow selector, .changeStatusPopup .popupWindow selector, .partialDataUpdatePopup .popupWindow selector {
    width: 100%
}

    .changeUserPopup .popupWindow selector item, .changeStatusPopup .popupWindow selector item, .partialDataUpdatePopup .popupWindow selector item {
        width: 100%;
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
        padding: 1rem .7075rem
    }

    .changeUserPopup .popupWindow selector selected, .changeStatusPopup .popupWindow selector selected, .partialDataUpdatePopup .popupWindow selector selected {
        width: inherit;
        border-radius: var(--radius)
    }

.changeUserPopup .popupWindow .profileInput item, .changeStatusPopup .popupWindow .profileInput item, .partialDataUpdatePopup .popupWindow .profileInput item {
    min-height: 60px;
    padding: 5px .7075rem
}

    .changeUserPopup .popupWindow .profileInput item img, .changeStatusPopup .popupWindow .profileInput item img, .partialDataUpdatePopup .popupWindow .profileInput item img {
        width: 50px;
        min-width: 50px;
        height: 50px
    }

.changeUserPopup .popupWindow [multi] selected item, .changeStatusPopup .popupWindow [multi] selected item, .partialDataUpdatePopup .popupWindow [multi] selected item {
    padding: 5px
}

    .changeUserPopup .popupWindow [multi] selected item img, .changeStatusPopup .popupWindow [multi] selected item img, .partialDataUpdatePopup .popupWindow [multi] selected item img {
        width: 40px;
        min-width: 40px;
        height: 40px
    }

.changeUserPopup .popupWindow .avatarCenterView, .changeStatusPopup .popupWindow .avatarCenterView, .partialDataUpdatePopup .popupWindow .avatarCenterView {
    min-width: 260px;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--inputColor1);
    border-radius: 2rem;
    margin-bottom: 1rem;
    overflow: hidden
}

    .changeUserPopup .popupWindow .avatarCenterView::before, .changeStatusPopup .popupWindow .avatarCenterView::before, .partialDataUpdatePopup .popupWindow .avatarCenterView::before {
        position: absolute;
        top: 10px;
        left: calc(56px + 1rem);
        content: attr(data-label);
        display: block;
        color: var(--inputColor5);
        font-size: .733rem;
        font-weight: 400;
        text-transform: uppercase;
        letter-spacing: 1px;
        margin-bottom: 3px
    }

    .changeUserPopup .popupWindow .avatarCenterView .avatar, .changeStatusPopup .popupWindow .avatarCenterView .avatar, .partialDataUpdatePopup .popupWindow .avatarCenterView .avatar {
        width: 50px;
        height: 50px;
        border-radius: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: top;
        object-position: top;
        overflow: hidden;
        margin: 6px;
        margin-right: 1rem
    }

    .changeUserPopup .popupWindow .avatarCenterView [src=""], .changeStatusPopup .popupWindow .avatarCenterView [src=""], .partialDataUpdatePopup .popupWindow .avatarCenterView [src=""] {
        display: none
    }

    .changeUserPopup .popupWindow .avatarCenterView .name, .changeStatusPopup .popupWindow .avatarCenterView .name, .partialDataUpdatePopup .popupWindow .avatarCenterView .name {
        margin: 0;
        margin-top: 17px;
        padding-right: .7075rem
    }

        .changeUserPopup .popupWindow .avatarCenterView .name:empty, .changeStatusPopup .popupWindow .avatarCenterView .name:empty, .partialDataUpdatePopup .popupWindow .avatarCenterView .name:empty {
            margin: 0;
            padding: 0
        }

.changeUserPopup .popupWindow [type=date], .changeUserPopup .popupWindow [type=datetime-local], .changeStatusPopup .popupWindow [type=date], .changeStatusPopup .popupWindow [type=datetime-local], .partialDataUpdatePopup .popupWindow [type=date], .partialDataUpdatePopup .popupWindow [type=datetime-local] {
    text-transform: uppercase
}

.changeUserPopup .popupWindow .btnSection, .changeUserPopup .popupWindow .btnDiv, .changeStatusPopup .popupWindow .btnSection, .changeStatusPopup .popupWindow .btnDiv, .partialDataUpdatePopup .popupWindow .btnSection, .partialDataUpdatePopup .popupWindow .btnDiv {
    position: absolute;
    bottom: 0;
    left: 0;
    padding-bottom: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 0 2%;
    border-radius: inherit;
    background: inherit
}

    .changeUserPopup .popupWindow .btnSection a, .changeUserPopup .popupWindow .btnSection button, .changeUserPopup .popupWindow .btnDiv a, .changeUserPopup .popupWindow .btnDiv button, .changeStatusPopup .popupWindow .btnSection a, .changeStatusPopup .popupWindow .btnSection button, .changeStatusPopup .popupWindow .btnDiv a, .changeStatusPopup .popupWindow .btnDiv button, .partialDataUpdatePopup .popupWindow .btnSection a, .partialDataUpdatePopup .popupWindow .btnSection button, .partialDataUpdatePopup .popupWindow .btnDiv a, .partialDataUpdatePopup .popupWindow .btnDiv button {
        margin: 0;
        width: 48%
    }

@media(min-width: 1024px) {
    .changeStatusPopup .popupWindow {
        overflow: hidden
    }
}

.changeStatusPopup .popupWindow .partialDataUpdateUserDetails {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px dashed var(--inputColor2)
}

    .changeStatusPopup .popupWindow .partialDataUpdateUserDetails .userDetailsList .label {
        margin: 0;
        color: var(--gray);
        font-size: .878rem;
        font-weight: 400;
        margin-bottom: 10px
    }

    .changeStatusPopup .popupWindow .partialDataUpdateUserDetails .userDetailsList .partialDataUpdateUserName {
        margin: 0;
        font-weight: 500
    }

    .changeStatusPopup .popupWindow .partialDataUpdateUserDetails .userDetailsList [status] {
        font-size: 1rem
    }

.changeStatusPopup .popupWindow .changeStatusModule {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    width: 100%;
    margin-top: auto
}

    .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons, .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons {
        width: 100%;
        min-width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        overflow: hidden
    }

        .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .reasonContainer, .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            max-height: 60vh;
            width: 100%;
            min-width: 100%;
            overflow-y: auto
        }

@media(min-width: 768px) {
    .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .reasonContainer, .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer {
        max-height: 400px
    }
}

.changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .reasonContainer:empty, .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer:empty {
    display: none
}

.changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons:hover .activeStatus::after, .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons:hover [active_status]::after {
    opacity: 0
}

.changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .statusList {
    width: 100%;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    color: var(--black);
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    font-weight: 500;
    clear: both;
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-left: 3.9975rem;
    margin: 0;
    padding-top: 1.413rem;
    padding-bottom: 1.413rem;
    background-color: rgba(0,0,0,0);
    border: none;
    border-bottom: 1px solid var(--lightGray);
    -webkit-transition: var(--transition2);
    transition: var(--transition2);
    cursor: pointer
}

    .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .statusList * {
        background-color: rgba(0,0,0,0);
        border: none;
        border-radius: 0;
        cursor: pointer
    }

    .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .statusList::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -webkit-transition: var(--transition2);
        transition: var(--transition2);
        pointer-events: none;
        opacity: 0
    }

    .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .statusList::before {
        content: "";
        position: absolute;
        top: 38%;
        left: 2rem;
        width: 10px;
        height: 10px;
        border-radius: .7075rem;
        z-index: 1;
        -webkit-transition: var(--transition2);
        transition: var(--transition2)
    }

    .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .statusList input {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 100%;
        cursor: pointer
    }

        .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .statusList input:focus {
            -webkit-box-shadow: none;
            box-shadow: none
        }

.changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .activeStatus, .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons [active_status] {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    pointer-events: none
}

    .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .activeStatus::after, .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons [active_status]::after {
        opacity: 1
    }

    .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .activeStatus::before, .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons [active_status]::before {
        -webkit-animation: status-pulse 2s infinite;
        animation: status-pulse 2s infinite
    }

    .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons .activeStatus input::before, .changeStatusPopup .popupWindow .changeStatusModule .primaryStatusReasons [active_status] input::before {
        content: "Current Status";
        position: absolute;
        top: 50%;
        right: .7075rem;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        color: var(--textGray);
        font-size: .667rem;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 1px;
        background-color: var(--lightGray);
        border: 1px solid var(--borderGray);
        border-radius: var(--radius);
        padding: 5px 10px
    }

.changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

    .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        color: var(--black);
        padding: 0 1rem;
        margin: 0;
        padding-top: 1rem;
        padding-bottom: 1rem;
        background-color: rgba(0,0,0,0);
        border: none;
        border-bottom: 1px solid var(--lightGray);
        -webkit-transition: var(--transition2);
        transition: var(--transition2);
        white-space: pre-line;
        cursor: pointer
    }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList:nth-last-of-type(1) {
            border-bottom: none
        }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList* {
            background-color: rgba(0,0,0,0);
            border: none;
            border-radius: 0;
            -webkit-box-shadow: none;
            box-shadow: none;
            -webkit-transition: var(--transition1);
            transition: var(--transition1);
            cursor: pointer
        }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList:hover input::after {
            opacity: 1
        }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList input {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0,0,0,0);
            border-radius: 0;
            border: none;
            border-left: 5px solid rgba(0,0,0,0);
            cursor: pointer
        }

            .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList input::after {
                content: "";
                position: absolute;
                top: 0;
                left: -5px;
                z-index: -1;
                width: 100%;
                height: 100%;
                background: -webkit-gradient(linear, left top, right top, from(var(--borderGray)), to(rgba(0, 42, 51, 0)));
                background: linear-gradient(90deg, var(--borderGray) 0%, rgba(0, 42, 51, 0) 100%);
                border-radius: 0;
                pointer-events: none;
                opacity: 0;
                -webkit-transform: none;
                transform: none
            }

            .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList input:focus {
                -webkit-box-shadow: none;
                box-shadow: none
            }

            .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList input:checked {
                border-left: 5px solid var(--inputColor5);
                background: -webkit-gradient(linear, left top, right top, from(var(--inputColor1)), to(rgba(0, 42, 51, 0)));
                background: linear-gradient(90deg, var(--inputColor1) 0%, rgba(0, 42, 51, 0) 100%)
            }

                .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList input:checked::after {
                    opacity: 1
                }

                .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList input:checked + .title {
                    color: var(--inputColor5)
                }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList .title {
            margin: 0;
            display: block;
            font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
            font-weight: 500
        }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList p {
            font-weight: 500;
            margin-top: 5px;
            display: block;
            line-height: 1.3;
            opacity: .6
        }

            .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .subStatusList p:empty {
                display: none
            }

    .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .inputDiv {
        width: 100%;
        margin: 0;
        margin-top: .7075rem;
        padding-top: .7075rem;
        border-top: 1px solid var(--borderGray)
    }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .inputDiv input::-webkit-input-placeholder, .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .inputDiv textarea::-webkit-input-placeholder {
            opacity: .5
        }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .inputDiv input::-moz-placeholder, .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .inputDiv textarea::-moz-placeholder {
            opacity: .5
        }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .inputDiv input:-ms-input-placeholder, .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .inputDiv textarea:-ms-input-placeholder {
            opacity: .5
        }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .inputDiv input::-ms-input-placeholder, .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .inputDiv textarea::-ms-input-placeholder {
            opacity: .5
        }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .inputDiv input::placeholder, .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .reasonContainer .inputDiv textarea::placeholder {
            opacity: .5
        }

    .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .btnDiv {
        position: absolute;
        left: 0;
        bottom: 0;
        z-index: 2;
        width: 100%;
        margin: 0;
        padding-top: .7075rem;
        background-color: var(--white)
    }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .btnDiv a.button {
            margin: 0
        }

        .changeStatusPopup .popupWindow .changeStatusModule .secondaryStatusReasons .btnDiv .backBtn i {
            top: 1px;
            margin: 0;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%)
        }

.changeStatusPopup .popupWindow .formDiv {
    overflow: unset
}

.popupShow {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-transform: none !important;
    transform: none !important;
    opacity: 1 !important
}

    .popupShow .popupCloseBg {
        width: 100% !important;
        opacity: 1 !important;
        pointer-events: all !important;
        cursor: pointer !important
    }

.mobilePopupIntro, .popupIntro {
    right: 0 !important
}

    .mobilePopupIntro .popupWindow, .popupIntro .popupWindow {
        -webkit-transform: none !important;
        transform: none !important;
        -webkit-box-shadow: 0px 8px 10px -5px rgba(0,0,0,.2),0px 16px 24px 2px rgba(0,0,0,.14),0px 6px 30px 5px rgba(0,0,0,.12) !important;
        box-shadow: 0px 8px 10px -5px rgba(0,0,0,.2),0px 16px 24px 2px rgba(0,0,0,.14),0px 6px 30px 5px rgba(0,0,0,.12) !important;
        -webkit-transition: .3s cubic-bezier(0.25, 0.8, 0.25, 1);
        transition: .3s cubic-bezier(0.25, 0.8, 0.25, 1)
    }

        .mobilePopupIntro .popupWindow::after, .popupIntro .popupWindow::after {
            opacity: .85 !important
        }

    .mobilePopupIntro .popupWindowClose, .mobilePopupIntro .popupCloseBg, .popupIntro .popupWindowClose, .popupIntro .popupCloseBg {
        display: block;
        background-color: rgba(0,0,0,.72) !important;
        -webkit-transition: opacity .4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
        transition: opacity .4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
        -webkit-transition-delay: .375ms !important;
        transition-delay: .375ms !important;
        pointer-events: all !important
    }

* {
    margin: 0;
    padding: 0;
    border: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    outline-style: none;
    -webkit-text-size-adjust: 100%;
    cursor: context-menu
}

    *:before, * :after {
        font-family: inherit
    }

html:has(#dark:checked) {
    color-scheme: dark
}

@media(prefers-color-scheme: dark) {
    html:has(#dark:checked) .dashboardMainContainer .dashboardSection::before {
        color-scheme: dark;
        --bgShadeMobile: var(--bgShadeMobileDark) !important;
        background: var(--bgShadewebDark) !important
    }
}

html {
    color-scheme: light;
    width: 100vw;
    max-width: 100%;
    display: block;
    color: var(--text-color);
    background: var(--bg-color);
    scroll-behavior: smooth;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0,0,0,0)
}

html {
    font-size: 16px
}

@media screen and (min-width: 300px) {
    html {
        font-size: calc(0.0588235294vw + 15.8235294118px)
    }
}

@media screen and (min-width: 2000px) {
    html {
        font-size: 17px
    }
}

.bodyIntro {
    height: 100vh !important;
    overflow: hidden !important
}

body {
    width: 100%;
    height: 100%;
    min-height: 100vh;
    padding: 0;
    margin: 0;
    color: inherit;
    background: inherit;
    font-family: var(--font-family);
    line-height: 1.3;
    text-rendering: optimizeSpeed;
    -webkit-font-smoothing: antialiased;
    scroll-behavior: smooth;
    overscroll-behavior-y: none;
    scrollbar-width: thin;
    scrollbar-color: var(--shade-3) var(--bg-color);
    overflow-y: auto
}

.bodyIntro {
    height: 100vh;
    overflow: hidden
}

.scrollTopIntro {
    top: -100% !important;
    -webkit-transition: all 575ms ease-out !important;
    transition: all 575ms ease-out !important
}

.scrollBottomIntro {
    bottom: -100% !important;
    -webkit-transition: all 575ms ease-in !important;
    transition: all 575ms ease-in !important
}

.m0 {
    margin: 0 !important
}

.p0 {
    padding: 0 !important
}

img {
    width: 100%;
    display: block;
    height: intrinsic;
    image-rendering: -webkit-optimize-contrast
}

.bgCover {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover
}

a {
    text-decoration: none;
    font-family: inherit;
    color: inherit;
    cursor: pointer;
    text-underline-offset: .1em !important;
    text-decoration-thickness: .07em !important;
    -webkit-appearance: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0)
}

.bText {
    font-weight: 500
}

.nText {
    font-weight: 400
}

.lText {
    font-weight: 300
}

i {
    line-height: .6
}

button:focus, [type=button]:focus {
    outline: 0
}

li {
    list-style-type: none
}

:is(h1,h2) {
    line-height: 1.2
}

p {
    margin-top: 1rem;
    font-size: 1rem;
    font-weight: 300;
    line-height: 1.6
}

h1, h2, h3, h4, h5 {
    font-weight: 500
}

h1 {
    font-size: clamp(28.8325195313px,21.9075063306px + 0.0144271108*100vw,50.761728px)
}

h2 {
    font-size: clamp(25.62890625px,20.3638955921px + 0.0109687722*100vw,42.30144px)
}

h3 {
    font-size: clamp(22.78125px,18.8433710526px + 0.0082039145*100vw,35.2512px);
    line-height: 1.3
}

h4 {
    font-size: clamp(20.25px,17.3681052632px + 0.0060039474*100vw,29.376px);
    line-height: 1.35
}

h5 {
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    line-height: 1.3
}

.errorPage {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    text-align: center
}

    .errorPage .innerSection {
        min-height: 100vh;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        justify-self: center
    }

        .errorPage .innerSection dotlottie-player {
            max-width: 500px
        }

        .errorPage .innerSection .content {
            z-index: 1;
            margin: auto
        }

        .errorPage .innerSection .code {
            position: absolute;
            top: -20vh;
            left: 50%;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
            font-size: 30vh;
            font-weight: 900;
            background: var(--borderGray);
            background: -webkit-gradient(linear, left top, left bottom, from(var(--borderGray)), to(rgba(255, 255, 255, 0)));
            background: linear-gradient(to bottom, var(--borderGray), rgba(255, 255, 255, 0));
            -webkit-background-clip: text;
            background-clip: text;
            color: rgba(0,0,0,0)
        }

            .errorPage .innerSection .code:empty {
                display: none
            }

        .errorPage .innerSection .title {
            font-size: clamp(18px,5vh,60px) !important;
            line-height: 1.1
        }

        .errorPage .innerSection p {
            margin: 0 auto;
            margin-top: 1rem;
            max-width: 600px;
            font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
            line-height: 1.3
        }

        .errorPage .innerSection .btnDiv {
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center
        }

.errorLogSection {
    list-style: none;
    padding: 0;
    margin: 0
}

    .errorLogSection ul {
        padding: 5.65rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 30px 50px;
        counter-increment: titleCounter 1;
        border-bottom: 1px solid var(--borderGray)
    }

        .errorLogSection ul:nth-child(even) {
            background-color: var(--lightGray)
        }

        .errorLogSection ul::before {
            padding: 5.65rem 0;
            content: counter(titleCounter) ". ";
            position: absolute;
            top: -2px;
            left: 1rem;
            color: var(--black);
            font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
        }

        .errorLogSection ul li {
            -webkit-box-ordinal-group: 11;
            -ms-flex-order: 10;
            order: 10;
            width: 100%
        }

            .errorLogSection ul li:nth-child(1) {
                -webkit-box-ordinal-group: 2;
                -ms-flex-order: 1;
                order: 1;
                width: auto
            }

            .errorLogSection ul li:nth-child(2) {
                -webkit-box-ordinal-group: 3;
                -ms-flex-order: 2;
                order: 2;
                width: auto
            }

                .errorLogSection ul li:nth-child(2) p {
                    color: #3b5fff
                }

            .errorLogSection ul li:nth-child(3) {
                -webkit-box-ordinal-group: 7;
                -ms-flex-order: 6;
                order: 6
            }

                .errorLogSection ul li:nth-child(3) p {
                    display: inline-block;
                    color: #ff3b58
                }

            .errorLogSection ul li:nth-child(5) {
                -webkit-box-ordinal-group: 5;
                -ms-flex-order: 4;
                order: 4;
                width: auto
            }

            .errorLogSection ul li:nth-child(9) {
                -webkit-box-ordinal-group: 6;
                -ms-flex-order: 5;
                order: 5;
                width: auto
            }

            .errorLogSection ul li:nth-child(10) {
                -webkit-box-ordinal-group: 6;
                -ms-flex-order: 5;
                order: 5;
                width: auto
            }

            .errorLogSection ul li .label, .errorLogSection ul li h5 {
                margin: 0;
                color: var(--gray);
                font-size: .878rem;
                font-weight: 500;
                text-transform: uppercase;
                letter-spacing: 1px;
                margin-bottom: 5px
            }

            .errorLogSection ul li p {
                color: var(--black);
                font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
                font-weight: 500;
                margin: 0;
                white-space: pre-line;
                line-height: 1.4
            }

.bannerContainer {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y)
}

    .bannerContainer .heading {
        margin: 0 !important
    }

    .bannerContainer .achievementsIcon {
        margin: 0 auto !important
    }

#wallContainer {
    padding-top: 150px
}

#awardsContainer {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y)
}

.serviceContainer .dropBoxIcon {
    width: 20px
}

#clientSection .slider .slide-track .slide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.sectionContainer:has(#featuredCardWrapper) {
    overflow: hidden
}

#featuredCardWrapper {
    overflow: unset
}

.bannerContentContainer .mainContent ul .bText {
    display: inline !important
}

#blogContainer .blogTitle {
    color: var(--color1);
    font-weight: 500
}

#blogContainer p {
    text-align: justify
}

#awardsContainer #awardsDiv .awards {
    min-width: 100px
}

    #awardsContainer #awardsDiv .awards::before {
        white-space: nowrap
    }

#clientSection .titleDiv {
    margin-top: 60px
}

    #clientSection .titleDiv .pageTitle {
        margin-bottom: .7075rem
    }

#clientSection .slider .slide-track {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 20px 6%
}

    #clientSection .slider .slide-track .slide {
        padding: 10px
    }

        #clientSection .slider .slide-track .slide img {
            width: 100%;
            max-width: 125px;
            height: auto;
            max-height: 90px
        }

        #clientSection .slider .slide-track .slide p {
            margin-top: 10px;
            color: var(--gray);
            font-size: .733rem;
            text-transform: uppercase;
            letter-spacing: 1px
        }

@media(min-width: 1024px) {
    .listViewContainer .featuredCard .cardImage {
        min-width: 350px !important
    }
}

#blogContainer .blogMainDiv .blogTitleDiv .newsHeadTitle {
    font-size: 15px;
    color: var(--color1);
    font-family: var(--font-family1);
    background: #f4ffed;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding: 5px 10px;
    border: 1px solid #b2dab2;
    border-radius: 1rem;
    margin-bottom: 10px
}

#blogContainer .blogMainDiv .blogTitleDiv .newsHeadTitle {
    font-family: var(--font-family1);
    font-size: clamp(28.8325195313px,21.9075063306px + 0.0144271108*100vw,50.761728px);
    padding-bottom: .7075rem;
    margin-bottom: .7075rem;
    border-bottom: 1px solid var(--borderGray)
}

.breadcrumb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 10px
}

    .breadcrumb a {
        color: var(--textGray);
        display: inline-block;
        font-size: 14px;
        padding-right: 10px;
        margin-right: 10px;
        text-transform: capitalize;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .breadcrumb a.activeBreadcrumb {
            color: var(--color1)
        }

        .breadcrumb a:nth-last-child(1) {
            margin-right: 0;
            padding-right: 0
        }

            .breadcrumb a:nth-last-child(1)::before {
                display: none
            }

        .breadcrumb a:empty {
            display: none
        }

        .breadcrumb a:hover {
            color: var(--color1)
        }

        .breadcrumb a::before {
            content: "";
            position: absolute;
            top: 30%;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
            right: -5px;
            width: 2px;
            height: 50%;
            background: var(--textGray);
            -webkit-transform: rotate(10deg);
            transform: rotate(10deg);
            opacity: .58
        }

.mainLabel {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 3px;
    color: var(--black);
    font-size: .937rem;
    font-weight: 500;
    margin-top: 1rem
}

@media(min-width: 568px) {
    .mainLabel {
        gap: 5px;
        font-size: 1rem
    }
}

.mainLabel::before, .mainLabel::after {
    content: "";
    width: 10px;
    height: 10px;
    max-height: 10px;
    border-radius: var(--radius)
}

.mainLabel::before {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    background: var(--color2)
}

.mainLabel::after {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    background: var(--color1);
    margin-right: 3px
}

h1, h2, h3, h4 {
    font-weight: 500
}

.heroSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-top: 30px;
    overflow: unset
}

    .heroSection .banner {
        width: 100%;
        padding-top: 100%;
        background: var(--color1);
        border-radius: var(--radius);
        overflow: hidden
    }

@media(min-width: 568px) {
    .heroSection .banner {
        padding-top: 56.25%
    }
}

@media(min-width: 768px) {
    .heroSection .banner {
        padding-top: 31.25%
    }
}

.heroSection .banner::before, .heroSection .banner::after {
    position: absolute;
    bottom: 0;
    width: 20vh;
    height: 20vh;
    border-radius: 100%;
    border: 5vh solid var(--color1);
    opacity: 1;
    z-index: 20
}

@media(min-width: 1024px) {
    .heroSection .banner::before, .heroSection .banner::after {
        width: 30vh;
        height: 30vh;
        border: 10vh solid var(--color1)
    }
}

.heroSection .banner::before {
    left: 0;
    -webkit-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%)
}

.heroSection .banner::after {
    right: 0;
    -webkit-transform: translate(50%, 50%);
    transform: translate(50%, 50%)
}

.heroSection .banner .content:has(.title:empty)::before {
    display: none
}

.heroSection .banner .content {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    text-align: center;
    color: var(--white)
}

    .heroSection .banner .content::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #000;
        background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 17, 7, 0.3882352941)), to(rgba(0, 0, 0, 0.137254902)));
        background: linear-gradient(0deg, rgba(0, 17, 7, 0.3882352941) 0%, rgba(0, 0, 0, 0.137254902) 100%);
        opacity: 1
    }

    .heroSection .banner .content .title {
        max-width: 500px;
        line-height: 1
    }

@media(min-width: 1024px) {
    .heroSection .banner .content .title {
        font-size: clamp(32.4365844727px,23.4436931693px + 0.0187351902*100vw,60.9140736px)
    }
}

.heroSection .banner .content form {
    -webkit-transform: none;
    transform: none;
    margin-top: 1.413rem
}

.heroSection .banner .media {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

    .heroSection .banner .media img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center
    }

.heroSection form, .heroSection .form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: unset;
    -ms-flex-align: unset;
    align-items: unset;
    margin: 0 auto;
    width: 100%;
    max-width: 650px;
    background: var(--white);
    border: 1px solid var(--lightGray);
    border-radius: var(--btnRadius);
    border-radius: calc(var(--btnRadius) - 15px);
    gap: 0 3px;
    padding: 2px;
    -webkit-box-shadow: rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    box-shadow: rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    -webkit-transform: translateY(-1.413rem);
    transform: translateY(-1.413rem);
    z-index: 10
}

@media(min-width: 568px) {
    .heroSection form, .heroSection .form {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        border-radius: var(--btnRadius)
    }
}

.heroSection form .inputDiv, .heroSection .form .inputDiv {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0
}

    .heroSection form .inputDiv label, .heroSection .form .inputDiv label {
        position: absolute;
        top: .5rem;
        left: 25px;
        z-index: 1;
        font-size: .733rem;
        text-transform: uppercase;
        letter-spacing: 1px
    }

    .heroSection form .inputDiv select, .heroSection form .inputDiv input, .heroSection .form .inputDiv select, .heroSection .form .inputDiv input {
        padding: 1.413rem;
        padding-bottom: .7075rem;
        background: var(--white);
        border-radius: var(--btnRadius)
    }

.heroSection form button, .heroSection .form button {
    min-width: 150px;
    color: var(--white);
    font-weight: 500;
    -webkit-filter: brightness(100%);
    filter: brightness(100%);
    background-color: var(--color1);
    border: 1px solid var(--color1);
    -webkit-box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
    box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
    gap: 0 10px;
    padding: 1rem;
    font-size: 1rem;
    font-weight: 400;
    color: var(--white);
    background: var(--color1)
}

    .heroSection form button:hover, .heroSection .form button:hover {
        color: var(--white);
        -webkit-filter: brightness(110%);
        filter: brightness(110%);
        border: 1px solid rgba(0,0,0,0);
        -webkit-box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
        box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
        -webkit-transition: background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-filter .5s ease-in,-webkit-box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-filter .5s ease-in,-webkit-box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: filter .5s ease-in,background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: filter .5s ease-in,background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-filter .5s ease-in,-webkit-box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1)
    }

    .heroSection form button:active, .heroSection .form button:active {
        -webkit-filter: brightness(105%);
        filter: brightness(105%)
    }

    .heroSection form button:visited, .heroSection .form button:visited {
        -webkit-filter: brightness(90%);
        filter: brightness(90%)
    }

    .heroSection form button.secondary, .heroSection .form button.secondary {
        background-color: var(--color2);
        border: 1px solid var(--color2)
    }

    .heroSection form button.tertiary, .heroSection .form button.tertiary {
        background-color: var(--color3);
        border: 1px solid var(--color3)
    }

    .heroSection form button.black, .heroSection .form button.black {
        color: var(--white);
        background-color: var(--black);
        border: 1px solid var(--darkGray)
    }

    .heroSection form button.white, .heroSection .form button.white {
        color: var(--black);
        background-color: var(--white);
        border: 1px solid var(--borderGray)
    }

    .heroSection form button.red, .heroSection .form button.red {
        color: var(--white);
        background-color: var(--red);
        border: 1px solid var(--red)
    }

    .heroSection form button.green, .heroSection .form button.green {
        color: var(--white);
        background-color: var(--green);
        border: 1px solid var(--green)
    }

    .heroSection form button.blue, .heroSection .form button.blue {
        color: var(--white);
        background-color: var(--blue);
        border: 1px solid var(--blue)
    }

    .heroSection form button.elevated, .heroSection .form button.elevated {
        -webkit-box-shadow: 0 4px 4px rgba(8,8,8,.08),0 1px 2px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.048),inset 0 1px 1px hsla(0,0%,100%,.2) !important;
        box-shadow: 0 4px 4px rgba(8,8,8,.08),0 1px 2px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.048),inset 0 1px 1px hsla(0,0%,100%,.2) !important
    }

        .heroSection form button.elevated:hover, .heroSection .form button.elevated:hover {
            -webkit-box-shadow: 0 1px 1px rgba(8,8,8,.08),0 1px 1px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.12),inset 0 1px 1px hsla(0,0%,100%,.2) !important;
            box-shadow: 0 1px 1px rgba(8,8,8,.08),0 1px 1px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.12),inset 0 1px 1px hsla(0,0%,100%,.2) !important
        }

    .heroSection form button .loader::before, .heroSection .form button .loader::before {
        border: 2px solid var(--white)
    }

    .heroSection form button i, .heroSection .form button i {
        font-size: .878rem
    }

.aboutHeroSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-top: 30px;
    overflow: unset
}

    .aboutHeroSection .banner {
        width: 100%;
        padding-top: 100%;
        background: var(--color3);
        border-radius: var(--radius);
        overflow: hidden;
        background-position: left
    }

@media(min-width: 568px) {
    .aboutHeroSection .banner {
        padding-top: 56.25%
    }
}

@media(min-width: 768px) {
    .aboutHeroSection .banner {
        padding-top: 31.25%
    }
}

.aboutHeroSection .banner::before, .aboutHeroSection .banner::after {
    position: absolute;
    bottom: 0;
    width: 20vh;
    height: 20vh;
    border-radius: 100%;
    border: 5vh solid var(--white);
    opacity: .2;
    z-index: 20
}

@media(min-width: 1024px) {
    .aboutHeroSection .banner::before, .aboutHeroSection .banner::after {
        width: 30vh;
        height: 30vh;
        border: 10vh solid var(--white)
    }
}

.aboutHeroSection .banner::before {
    left: 0;
    -webkit-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%)
}

.aboutHeroSection .banner::after {
    right: 0;
    -webkit-transform: translate(50%, 50%);
    transform: translate(50%, 50%)
}

.aboutHeroSection .banner .content:has(.title:empty)::before {
    display: none
}

.aboutHeroSection .banner .content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    text-align: center;
    color: var(--white);
    padding: 1.413rem
}

    .aboutHeroSection .banner .content::before {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #000;
        background: -webkit-gradient(linear, left bottom, left top, from(rgba(4, 19, 0, 0.8235294118)), to(rgba(0, 0, 0, 0.5764705882)));
        background: linear-gradient(0deg, rgba(4, 19, 0, 0.8235294118) 0%, rgba(0, 0, 0, 0.5764705882) 100%);
        opacity: .7
    }

    .aboutHeroSection .banner .content .title {
        max-width: 500px;
        line-height: 1;
        color: var(--white)
    }

@media(min-width: 1024px) {
    .aboutHeroSection .banner .content .title {
        font-size: clamp(32.4365844727px,23.4436931693px + 0.0187351902*100vw,60.9140736px)
    }
}

.aboutHeroSection .banner .content form {
    -webkit-transform: none;
    transform: none;
    margin-top: 1.413rem
}

.aboutHeroSection .banner .media {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

    .aboutHeroSection .banner .media img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center
    }

    .aboutHeroSection .banner .media svg {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1
    }

.aboutHeroSection form, .aboutHeroSection .form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: unset;
    -ms-flex-align: unset;
    align-items: unset;
    margin: 0 auto;
    width: 100%;
    max-width: 650px;
    background: var(--white);
    border: 1px solid var(--lightGray);
    border-radius: var(--btnRadius);
    border-radius: calc(var(--btnRadius) - 15px);
    gap: 0 3px;
    padding: 2px;
    -webkit-box-shadow: rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    box-shadow: rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    -webkit-transform: translateY(-1.413rem);
    transform: translateY(-1.413rem);
    z-index: 100
}

@media(min-width: 568px) {
    .aboutHeroSection form, .aboutHeroSection .form {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        border-radius: var(--btnRadius);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

.aboutHeroSection form .inputDiv, .aboutHeroSection .form .inputDiv {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0
}

    .aboutHeroSection form .inputDiv label, .aboutHeroSection .form .inputDiv label {
        position: absolute;
        top: .5rem;
        left: 25px;
        z-index: 1;
        font-size: .733rem;
        text-transform: uppercase;
        letter-spacing: 1px
    }

    .aboutHeroSection form .inputDiv select, .aboutHeroSection form .inputDiv input, .aboutHeroSection .form .inputDiv select, .aboutHeroSection .form .inputDiv input {
        padding: 1.413rem;
        padding-bottom: .7075rem;
        background: var(--white);
        border-radius: var(--btnRadius)
    }

.aboutHeroSection form button, .aboutHeroSection .form button {
    min-width: 150px;
    color: var(--white);
    font-weight: 500;
    -webkit-filter: brightness(100%);
    filter: brightness(100%);
    background-color: var(--color1);
    border: 1px solid var(--color1);
    -webkit-box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
    box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
    gap: 0 10px;
    padding: 1rem;
    font-size: 1rem;
    font-weight: 400;
    color: var(--visibleGray);
    background: linear-gradient(57deg, rgb(24, 24, 24) 0%, rgb(70, 70, 70) 100%) !important
}

    .aboutHeroSection form button:hover, .aboutHeroSection .form button:hover {
        color: var(--white);
        -webkit-filter: brightness(110%);
        filter: brightness(110%);
        border: 1px solid rgba(0,0,0,0);
        -webkit-box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
        box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
        -webkit-transition: background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-filter .5s ease-in,-webkit-box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-filter .5s ease-in,-webkit-box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: filter .5s ease-in,background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: filter .5s ease-in,background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-filter .5s ease-in,-webkit-box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1)
    }

    .aboutHeroSection form button:active, .aboutHeroSection .form button:active {
        -webkit-filter: brightness(105%);
        filter: brightness(105%)
    }

    .aboutHeroSection form button:visited, .aboutHeroSection .form button:visited {
        -webkit-filter: brightness(90%);
        filter: brightness(90%)
    }

    .aboutHeroSection form button.secondary, .aboutHeroSection .form button.secondary {
        background-color: var(--color2);
        border: 1px solid var(--color2)
    }

    .aboutHeroSection form button.tertiary, .aboutHeroSection .form button.tertiary {
        background-color: var(--color3);
        border: 1px solid var(--color3)
    }

    .aboutHeroSection form button.black, .aboutHeroSection .form button.black {
        color: var(--white);
        background-color: var(--black);
        border: 1px solid var(--darkGray)
    }

    .aboutHeroSection form button.white, .aboutHeroSection .form button.white {
        color: var(--black);
        background-color: var(--white);
        border: 1px solid var(--borderGray)
    }

    .aboutHeroSection form button.red, .aboutHeroSection .form button.red {
        color: var(--white);
        background-color: var(--red);
        border: 1px solid var(--red)
    }

    .aboutHeroSection form button.green, .aboutHeroSection .form button.green {
        color: var(--white);
        background-color: var(--green);
        border: 1px solid var(--green)
    }

    .aboutHeroSection form button.blue, .aboutHeroSection .form button.blue {
        color: var(--white);
        background-color: var(--blue);
        border: 1px solid var(--blue)
    }

    .aboutHeroSection form button.elevated, .aboutHeroSection .form button.elevated {
        -webkit-box-shadow: 0 4px 4px rgba(8,8,8,.08),0 1px 2px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.048),inset 0 1px 1px hsla(0,0%,100%,.2) !important;
        box-shadow: 0 4px 4px rgba(8,8,8,.08),0 1px 2px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.048),inset 0 1px 1px hsla(0,0%,100%,.2) !important
    }

        .aboutHeroSection form button.elevated:hover, .aboutHeroSection .form button.elevated:hover {
            -webkit-box-shadow: 0 1px 1px rgba(8,8,8,.08),0 1px 1px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.12),inset 0 1px 1px hsla(0,0%,100%,.2) !important;
            box-shadow: 0 1px 1px rgba(8,8,8,.08),0 1px 1px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.12),inset 0 1px 1px hsla(0,0%,100%,.2) !important
        }

    .aboutHeroSection form button .loader::before, .aboutHeroSection .form button .loader::before {
        border: 2px solid var(--white)
    }

    .aboutHeroSection form button i, .aboutHeroSection .form button i {
        font-size: .878rem
    }

.wideHreoBannerSection {
    overflow: unset
}

    .wideHreoBannerSection .banner {
        width: 100%;
        padding-top: 100%;
        overflow: hidden
    }

@media(min-width: 568px) {
    .wideHreoBannerSection .banner {
        padding-top: 56.25%
    }
}

@media(min-width: 768px) {
    .wideHreoBannerSection .banner {
        padding-top: 31.25%
    }
}

.wideHreoBannerSection .banner .content:has(.title:empty)::before {
    display: none
}

.wideHreoBannerSection .banner .content {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    text-align: center;
    color: var(--white)
}

    .wideHreoBannerSection .banner .content::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #000;
        background: -webkit-gradient(linear, left bottom, left top, from(#55472a), to(rgba(0, 0, 0, 0.137254902)));
        background: linear-gradient(0deg, #55472a 0%, rgba(0, 0, 0, 0.137254902) 100%);
        opacity: .7
    }

    .wideHreoBannerSection .banner .content .title {
        max-width: 800px;
        line-height: 1
    }

.wideHreoBannerSection .banner .media {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

    .wideHreoBannerSection .banner .media img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: bottom;
        object-position: bottom
    }

.wideHreoBannerSection form, .wideHreoBannerSection .form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: unset;
    -ms-flex-align: unset;
    align-items: unset;
    margin: 0 auto;
    width: 100%;
    max-width: 600px;
    background: var(--white);
    border: 1px solid var(--lightGray);
    border-radius: var(--btnRadius);
    border-radius: calc(var(--btnRadius) - 15px);
    gap: 0 3px;
    padding: 2px;
    -webkit-box-shadow: rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    box-shadow: rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    -webkit-transform: translateY(-1.413rem);
    transform: translateY(-1.413rem)
}

@media(min-width: 568px) {
    .wideHreoBannerSection form, .wideHreoBannerSection .form {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        border-radius: var(--btnRadius);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

.wideHreoBannerSection form .inputDiv, .wideHreoBannerSection .form .inputDiv {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0
}

    .wideHreoBannerSection form .inputDiv label, .wideHreoBannerSection .form .inputDiv label {
        position: absolute;
        top: .5rem;
        left: 25px;
        z-index: 1;
        font-size: .733rem;
        text-transform: uppercase;
        letter-spacing: 1px
    }

    .wideHreoBannerSection form .inputDiv select, .wideHreoBannerSection form .inputDiv input, .wideHreoBannerSection .form .inputDiv select, .wideHreoBannerSection .form .inputDiv input {
        padding: 1.413rem;
        padding-bottom: .7075rem;
        border-radius: var(--btnRadius)
    }

.wideHreoBannerSection form button, .wideHreoBannerSection .form button {
    color: var(--white);
    font-weight: 500;
    -webkit-filter: brightness(100%);
    filter: brightness(100%);
    background-color: var(--color1);
    border: 1px solid var(--color1);
    -webkit-box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
    box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
    padding: 1rem
}

    .wideHreoBannerSection form button:hover, .wideHreoBannerSection .form button:hover {
        color: var(--white);
        -webkit-filter: brightness(110%);
        filter: brightness(110%);
        border: 1px solid rgba(0,0,0,0);
        -webkit-box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
        box-shadow: inset 0 1px 1px hsla(0,0%,100%,.2);
        -webkit-transition: background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-filter .5s ease-in,-webkit-box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-filter .5s ease-in,-webkit-box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: filter .5s ease-in,background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: filter .5s ease-in,background-color .3s cubic-bezier(0.165, 0.84, 0.44, 1),box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-filter .5s ease-in,-webkit-box-shadow .3s cubic-bezier(0.165, 0.84, 0.44, 1)
    }

    .wideHreoBannerSection form button:active, .wideHreoBannerSection .form button:active {
        -webkit-filter: brightness(105%);
        filter: brightness(105%)
    }

    .wideHreoBannerSection form button:visited, .wideHreoBannerSection .form button:visited {
        -webkit-filter: brightness(90%);
        filter: brightness(90%)
    }

    .wideHreoBannerSection form button.secondary, .wideHreoBannerSection .form button.secondary {
        background-color: var(--color2);
        border: 1px solid var(--color2)
    }

    .wideHreoBannerSection form button.tertiary, .wideHreoBannerSection .form button.tertiary {
        background-color: var(--color3);
        border: 1px solid var(--color3)
    }

    .wideHreoBannerSection form button.black, .wideHreoBannerSection .form button.black {
        color: var(--white);
        background-color: var(--black);
        border: 1px solid var(--darkGray)
    }

    .wideHreoBannerSection form button.white, .wideHreoBannerSection .form button.white {
        color: var(--black);
        background-color: var(--white);
        border: 1px solid var(--borderGray)
    }

    .wideHreoBannerSection form button.red, .wideHreoBannerSection .form button.red {
        color: var(--white);
        background-color: var(--red);
        border: 1px solid var(--red)
    }

    .wideHreoBannerSection form button.green, .wideHreoBannerSection .form button.green {
        color: var(--white);
        background-color: var(--green);
        border: 1px solid var(--green)
    }

    .wideHreoBannerSection form button.blue, .wideHreoBannerSection .form button.blue {
        color: var(--white);
        background-color: var(--blue);
        border: 1px solid var(--blue)
    }

    .wideHreoBannerSection form button.elevated, .wideHreoBannerSection .form button.elevated {
        -webkit-box-shadow: 0 4px 4px rgba(8,8,8,.08),0 1px 2px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.048),inset 0 1px 1px hsla(0,0%,100%,.2) !important;
        box-shadow: 0 4px 4px rgba(8,8,8,.08),0 1px 2px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.048),inset 0 1px 1px hsla(0,0%,100%,.2) !important
    }

        .wideHreoBannerSection form button.elevated:hover, .wideHreoBannerSection .form button.elevated:hover {
            -webkit-box-shadow: 0 1px 1px rgba(8,8,8,.08),0 1px 1px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.12),inset 0 1px 1px hsla(0,0%,100%,.2) !important;
            box-shadow: 0 1px 1px rgba(8,8,8,.08),0 1px 1px rgba(8,8,8,.2),inset 0 6px 12px hsla(0,0%,100%,.12),inset 0 1px 1px hsla(0,0%,100%,.2) !important
        }

    .wideHreoBannerSection form button .loader::before, .wideHreoBannerSection .form button .loader::before {
        border: 2px solid var(--white)
    }

.serviceBannerSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 10px 1.2%;
    overflow: unset
}

    .serviceBannerSection.teamPage {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

@media(min-width: 1024px) {
    .serviceBannerSection.teamPage .bannerCard {
        width: 32%;
        max-width: 300px
    }
}

.serviceBannerSection .titleDiv {
    width: 100%;
    text-align: center;
    margin-bottom: 2rem
}

    .serviceBannerSection .titleDiv .title {
        font-weight: 600
    }

.serviceBannerSection .bannerCard {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    border-radius: var(--radius);
    background: rgba(54,109,17,.0745098039);
    cursor: pointer;
    overflow: hidden
}

@media(min-width: 568px) {
    .serviceBannerSection .bannerCard {
        width: 49%
    }
}

@media(min-width: 1024px) {
    .serviceBannerSection .bannerCard {
        width: 24%
    }
}

.serviceBannerSection .bannerCard:hover {
    -webkit-box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px;
    box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px;
    -webkit-transform: scale(1.025) translateY(-5px);
    transform: scale(1.025) translateY(-5px)
}

    .serviceBannerSection .bannerCard:hover .media::before {
        opacity: .8
    }

    .serviceBannerSection .bannerCard:hover .media .object {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }

    .serviceBannerSection .bannerCard:hover .media .arrow {
        color: var(--white);
        background-color: var(--color1);
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }

        .serviceBannerSection .bannerCard:hover .media .arrow::before {
            opacity: 0
        }

    .serviceBannerSection .bannerCard:hover .content {
        bottom: 0
    }

        .serviceBannerSection .bannerCard:hover .content .textBtn {
            opacity: 1
        }

.serviceBannerSection .bannerCard * {
    cursor: inherit;
    -webkit-transition: inherit;
    transition: inherit
}

.serviceBannerSection .bannerCard .media {
    width: 100%;
    padding-top: 37.5%;
    border-radius: inherit;
    overflow: hidden
}

@media(min-width: 568px) {
    .serviceBannerSection .bannerCard .media {
        padding-top: 100%
    }
}

.serviceBannerSection .bannerCard .media::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 70%;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(13%, rgba(255, 255, 255, 0.205)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.205) 13%, rgba(255, 255, 255, 0) 100%);
    opacity: .7;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.serviceBannerSection .bannerCard .media .bg {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    -webkit-transform: translate(32%, 20%);
    transform: translate(32%, 20%);
    -o-object-fit: contain;
    object-fit: contain;
    opacity: .1
}

.serviceBannerSection .bannerCard .media .object {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 2;
    width: auto;
    max-width: 200px;
    height: 90%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: bottom right;
    object-position: bottom right;
    -webkit-transition: var(--transition2);
    transition: var(--transition2)
}

@media(min-width: 568px) {
    .serviceBannerSection .bannerCard .media .object {
        height: 70%
    }
}

.serviceBannerSection .bannerCard .media .arrow {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    z-index: 3;
    width: 40px;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--color1);
    background: var(--white);
    border-radius: 100%;
    will-change: transform;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

    .serviceBannerSection .bannerCard .media .arrow::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: -1;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 100%;
        height: 100%;
        backdrop-filter: blur(30px);
        background-color: hsla(0,0%,100%,.0509803922);
        border: 1px solid hsla(0,0%,100%,.0509803922);
        border-top: 1px solid rgba(241,246,255,.2392156863);
        border-bottom: 1px solid rgba(252,253,255,.0901960784);
        -webkit-box-shadow: inset 0 3px 25px -0.5px rgba(246,250,255,.0588235294);
        box-shadow: inset 0 3px 25px -0.5px rgba(246,250,255,.0588235294);
        border-radius: 100%;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

    .serviceBannerSection .bannerCard .media .arrow i {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin: auto;
        color: inherit;
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
    }

.serviceBannerSection .bannerCard .content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 1.413rem;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    z-index: 1
}

    .serviceBannerSection .bannerCard .content .title {
        margin: 0;
        font-size: clamp(25.62890625px,20.3638955921px + 0.0109687722*100vw,42.30144px);
        color: var(--color1);
        font-weight: 500;
        line-height: 1;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

@media(min-width: 568px) {
    .serviceBannerSection .bannerCard .content .title {
        font-size: clamp(20.25px,17.3681052632px + 0.0060039474*100vw,29.376px)
    }
}

.serviceBannerSection .bannerCard .content .textBtn {
    opacity: 0
}

.boxCardBannerSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden
}

    .boxCardBannerSection .bg {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        min-height: 75%;
        overflow: hidden
    }

        .boxCardBannerSection .bg::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,.96);
            opacity: .75
        }

        .boxCardBannerSection .bg img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
            object-fit: cover
        }

    .boxCardBannerSection .innerSection {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        z-index: 1;
        gap: 20px 2%;
        max-width: 900px
    }

    .boxCardBannerSection .content {
        padding-bottom: var(--section-space-y);
        width: 100%;
        color: var(--white);
        text-align: center
    }

        .boxCardBannerSection .content .mainLabel {
            color: var(--white)
        }

        .boxCardBannerSection .content .title {
            margin: 0 auto;
            max-width: 650px
        }

@media(min-width: 1024px) {
    .boxCardBannerSection .content p {
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
    }
}

.boxCardBannerSection .content .filledBtn {
    background: rgba(0,0,0,.137254902);
    border: 2px solid var(--color1);
    backdrop-filter: blur(5px)
}

.boxCardBannerSection .boxCard {
    width: 100%;
    background-color: var(--white);
    border-radius: var(--radius);
    padding: 1.413rem
}

@media(min-width: 1024px) {
    .boxCardBannerSection .boxCard {
        width: 48%;
        padding: 2rem
    }
}

.boxCardBannerSection .boxCard::before {
    content: "";
    position: absolute;
    top: -10px;
    left: 10px;
    z-index: -1;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0);
    backdrop-filter: blur(20px);
    opacity: .75;
    border-radius: inherit
}

.boxCardBannerSection .boxCard:nth-of-type(2)::before {
    background: #ffd7c7
}

.boxCardBannerSection .boxCard:nth-of-type(2) .label {
    color: var(--color1)
}

.boxCardBannerSection .boxCard:nth-of-type(3)::before {
    background: #d4dffc
}

.boxCardBannerSection .boxCard:nth-of-type(3) .label {
    color: #4343bf
}

.boxCardBannerSection .boxCard p span {
    font-weight: 500
}

.specialitiesSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    background: var(--color3);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 10px 2%
}

@media(min-width: 768px) {
    .specialitiesSection {
        gap: 30px 1%
    }
}

@media(min-width: 568px) {
    .specialitiesSection.lgCard .card {
        width: 49%
    }
}

@media(min-width: 1024px) {
    .specialitiesSection.lgCard .card {
        width: 32%
    }
}

.specialitiesSection .bg {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-image: var(--gradient2)
}

.specialitiesSection .titleDiv {
    width: 100%;
    text-align: center
}

.specialitiesSection .mainLabel {
    margin: 0;
    color: var(--color1);
    font-weight: 500
}

.specialitiesSection .title {
    margin: 0;
    width: 100%;
    color: var(--black);
    margin-bottom: .7075rem
}

.specialitiesSection .card {
    margin: 0;
    width: 100%;
    min-width: auto;
    max-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-radius: var(--radius);
    border: 1px solid var(--white);
    color: var(--black);
    background: var(--white);
    overflow: hidden
}

@media(min-width: 568px) {
    .specialitiesSection .card {
        width: 49%
    }
}

@media(min-width: 1024px) {
    .specialitiesSection .card {
        width: 24%
    }
}

.specialitiesSection .card:hover .arrowBtn {
    color: var(--white)
}

    .specialitiesSection .card:hover .arrowBtn::before {
        content: "ï…‹";
        text-indent: 15px;
        width: 100%;
        color: var(--color2);
        background-color: var(--color1);
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }

.specialitiesSection .card .content {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 1.413rem;
    text-align: center
}

    .specialitiesSection .card .content .icon {
        width: 70px;
        margin-bottom: .7075rem
    }

    .specialitiesSection .card .content span {
        color: var(--color3);
        font-size: .878rem;
        font-weight: 600;
        margin-bottom: 10px;
        text-transform: uppercase;
        letter-spacing: 1px
    }

    .specialitiesSection .card .content .cardTitle {
        font-family: var(--font-family1);
        font-weight: 500;
        line-height: 1.1;
        padding-bottom: .7075rem;
        border-bottom: 1px solid var(--borderGray);
        text-transform: uppercase
    }

    .specialitiesSection .card .content p {
        line-height: 1.5;
        font-weight: 400;
        opacity: .8
    }

    .specialitiesSection .card .content .btnDiv {
        width: 100%;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin-top: auto;
        padding-top: 1rem;
        border-top: 1px solid var(--borderGray)
    }

@media(min-width: 1024px) {
    .specialitiesSection .card .content .btnDiv {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

.specialitiesSection .card .content .btnDiv .arrowBtn {
    font-size: .878rem
}

.specialitiesSection .card .media {
    display: none;
    width: 100%;
    min-height: 200px;
    border-radius: 0 30% 0 0;
    overflow: hidden
}

    .specialitiesSection .card .media img {
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        -o-object-fit: cover;
        object-fit: cover
    }

.featureCardSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    background: var(--lightGray);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: unset
}

    .featureCardSection .bg {
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-image: var(--gradient2)
    }

    .featureCardSection .titleDiv {
        width: 100%;
        height: 100%;
        text-align: center
    }

@media(min-width: 1024px) {
    .featureCardSection .titleDiv {
        position: sticky;
        top: 15vh;
        left: 0;
        text-align: left;
        width: 50%;
        padding-right: var(--section-space-x)
    }
}

.featureCardSection .titleDiv .mainLabel {
    margin: 0;
    color: var(--color1);
    font-weight: 500
}

.featureCardSection .titleDiv .title {
    margin: 0 auto;
    max-width: 300px;
    font-family: var(--font-family1);
    text-transform: uppercase
}

@media(min-width: 1024px) {
    .featureCardSection .titleDiv .title {
        margin: 0
    }
}

.featureCardSection .titleDiv p {
    max-width: 350px;
    font-weight: 400;
    color: var(--gray)
}

    .featureCardSection .titleDiv p span {
        color: var(--black);
        font-weight: 800
    }

.featureCardSection .cardDiv {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background: var(--white);
    border-radius: var(--radius);
    padding: .7075rem;
    margin-top: .7075rem
}

@media(min-width: 1024px) {
    .featureCardSection .cardDiv {
        margin: 0;
        width: 50%
    }
}

.featureCardSection .cardDiv .itemCard {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    color: var(--black);
    overflow: hidden
}

    .featureCardSection .cardDiv .itemCard:nth-last-child(1) {
        padding-bottom: 0
    }

        .featureCardSection .cardDiv .itemCard:nth-last-child(1)::before {
            display: none
        }

    .featureCardSection .cardDiv .itemCard::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 1px;
        background: #fff;
        background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(32%, rgba(0, 0, 0, 0.089)), to(rgba(0, 0, 0, 0)));
        background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.089) 32%, rgba(0, 0, 0, 0) 100%)
    }

    .featureCardSection .cardDiv .itemCard .content {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 1.413rem 0
    }

        .featureCardSection .cardDiv .itemCard .content span {
            color: var(--color3);
            font-size: .878rem;
            font-weight: 600;
            margin-bottom: 10px;
            text-transform: uppercase;
            letter-spacing: 1px
        }

        .featureCardSection .cardDiv .itemCard .content .cardTitle {
            font-family: var(--font-family1);
            font-weight: 500;
            line-height: 1.1
        }

        .featureCardSection .cardDiv .itemCard .content p {
            max-width: 350px;
            margin-top: 10px;
            line-height: 1.5;
            font-weight: 400;
            opacity: .8
        }

        .featureCardSection .cardDiv .itemCard .content .btnDiv {
            width: 100%;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            margin-top: auto;
            padding-top: 1rem;
            border-top: 1px solid var(--borderGray)
        }

@media(min-width: 1024px) {
    .featureCardSection .cardDiv .itemCard .content .btnDiv {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

.featureCardSection .cardDiv .itemCard .content .btnDiv .arrowBtn {
    font-size: .878rem
}

.featureCardSection .cardDiv .itemCard .media {
    width: 60px;
    border-radius: var(--btnRadius);
    overflow: hidden;
    margin-top: 1.413rem;
    margin-right: .7075rem;
    border: 1px solid var(--visibleGray);
    padding: 10px
}

@media(min-width: 1024px) {
    .featureCardSection .cardDiv .itemCard .media {
        width: 80px;
        margin-right: 1.413rem
    }
}

.cardDropdownSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    background: var(--lightGray);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: unset
}

    .cardDropdownSection .bg {
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-image: var(--gradient2)
    }

    .cardDropdownSection .media {
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        width: 100%;
        height: 100%;
        text-align: center
    }

@media(min-width: 1024px) {
    .cardDropdownSection .media {
        position: sticky;
        top: 15vh;
        left: 0;
        text-align: left;
        width: 50%;
        padding-right: var(--section-space-x)
    }
}

.cardDropdownSection .media img {
    border-radius: var(--radius)
}

.cardDropdownSection .dropDownDiv {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 10px
}

@media(min-width: 1024px) {
    .cardDropdownSection .dropDownDiv {
        width: 50%
    }
}

.cardDropdownSection .dropDownDiv .dropList {
    width: 100%;
    background: var(--white);
    border-radius: var(--radius);
    -webkit-box-shadow: rgba(0,0,0,.0196078431) 0px 5px 15px 0px;
    box-shadow: rgba(0,0,0,.0196078431) 0px 5px 15px 0px
}

    .cardDropdownSection .dropDownDiv .dropList .dropBox {
        padding: 1.413rem
    }

        .cardDropdownSection .dropDownDiv .dropList .dropBox .title {
            margin: 0
        }

        .cardDropdownSection .dropDownDiv .dropList .dropBox .dropIcon {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            width: 30px;
            max-width: 30px;
            height: 30px;
            border-radius: var(--radius);
            background: var(--borderGray)
        }

            .cardDropdownSection .dropDownDiv .dropList .dropBox .dropIcon i {
                margin: auto
            }

                .cardDropdownSection .dropDownDiv .dropList .dropBox .dropIcon i:nth-of-type(1) {
                    top: 2px
                }

    .cardDropdownSection .dropDownDiv .dropList .dropContent {
        padding: 1.413rem;
        padding-top: 0
    }

        .cardDropdownSection .dropDownDiv .dropList .dropContent p {
            color: var(--darkGray);
            line-height: 1.1
        }

        .cardDropdownSection .dropDownDiv .dropList .dropContent ul {
            margin-top: .7075rem;
            padding-left: .7075rem;
            list-style-position: outside
        }

            .cardDropdownSection .dropDownDiv .dropList .dropContent ul li {
                list-style-type: disc
            }

                .cardDropdownSection .dropDownDiv .dropList .dropContent ul li::marker {
                    color: var(--color1)
                }

.highlightSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    background: var(--lightGray)
}

    .highlightSection .highlights {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        color: var(--white);
        background: var(--black);
        border-radius: var(--radius)
    }

        .highlightSection .highlights li {
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            padding: 1.413rem;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center
        }

            .highlightSection .highlights li::before {
                content: "";
                position: absolute;
                bottom: 0;
                right: 0;
                width: 100%;
                height: 1px;
                background: #fff;
                background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(32%, rgba(0, 0, 0, 0.089)), to(rgba(0, 0, 0, 0)));
                background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.089) 32%, rgba(0, 0, 0, 0) 100%)
            }

@media(min-width: 568px) {
    .highlightSection .highlights li::before {
        width: 1px;
        height: 100%;
        background: #fff;
        background: -webkit-gradient(linear, left bottom, left top, from(rgba(255, 255, 255, 0)), color-stop(37%, rgba(255, 255, 255, 0.2357317927)), to(rgba(0, 0, 0, 0)));
        background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.2357317927) 37%, rgba(0, 0, 0, 0) 100%)
    }
}

.highlightSection .highlights li .value {
    font-family: var(--font-family1);
    font-size: clamp(28.8325195313px,21.9075063306px + 0.0144271108*100vw,50.761728px);
    font-weight: 500;
    line-height: 1;
    -webkit-text-fill-color: rgba(0,0,0,0);
    background-image: linear-gradient(138deg, rgba(185, 185, 185, 0.0274509804), var(--white) 30%, var(--gray) 72%, rgba(177, 177, 177, 0) 90%);
    -webkit-background-clip: text;
    background-clip: text
}

@media(min-width: 1024px) {
    .highlightSection .highlights li .value {
        font-size: clamp(36.4911575317px,24.9314530723px + 0.0240827176*100vw,73.09688832px)
    }
}

.highlightSection .highlights li .label {
    margin: 0;
    opacity: .5
}

.faqSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y)
}

    .faqSection .titleDiv .title {
        text-align: center
    }

    .faqSection .dropDownDiv {
        margin: 0 auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        gap: 20px 0;
        margin-top: 1.413rem;
        text-align: left
    }

        .faqSection .dropDownDiv .dropList {
            width: 100%;
            min-height: 60px;
            background: var(--lightGray);
            border: 1px solid var(--borderGray);
            border-radius: var(--btnRadius);
            overflow: hidden
        }

@media(min-width: 1024px) {
    .faqSection .dropDownDiv .dropList {
        width: 49%
    }
}

.faqSection .dropDownDiv .dropList:hover .dropBox .dropIcon i {
    color: var(--darkGray)
}

.faqSection .dropDownDiv .dropList .dropBox {
    padding: .5rem 1.413rem
}

    .faqSection .dropDownDiv .dropList .dropBox .title {
        font-size: 1rem;
        font-weight: 500
    }

    .faqSection .dropDownDiv .dropList .dropBox .dropIcon {
        padding: 5px 10px;
        border-radius: var(--radius);
        background-color: var(--lightGray)
    }

.faqSection .dropDownDiv .dropList .dropContent {
    padding: .7075rem 1.413rem
}

    .faqSection .dropDownDiv .dropList .dropContent p {
        font-weight: 400
    }

        .faqSection .dropDownDiv .dropList .dropContent p:nth-child(1) {
            margin-top: 0
        }

.serviceMainSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 10px;
    overflow: hidden
}

    .serviceMainSection .titleDiv {
        padding-bottom: var(--section-space-y);
        text-align: center
    }

    .serviceMainSection .serviceCard {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        background: #f2ece2;
        border-radius: var(--btnRadius)
    }

@media(min-width: 1024px) {
    .serviceMainSection .serviceCard:nth-child(odd) .content {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        padding-left: var(--section-space-x)
    }
}

@media(min-width: 1024px) {
    .serviceMainSection .serviceCard:nth-child(odd) .media {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }
}

@media(min-width: 1024px) {
    .serviceMainSection .serviceCard:nth-child(even) .content {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        padding-right: var(--section-space-x)
    }
}

@media(min-width: 1024px) {
    .serviceMainSection .serviceCard:nth-child(even) .media {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }
}

.serviceMainSection .content {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    margin: 0;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    border-radius: inherit
}

@media(min-width: 1024px) {
    .serviceMainSection .content {
        width: calc(100% - 300px)
    }
}

@media(min-width: 1280px) {
    .serviceMainSection .content {
        width: calc(100% - 400px)
    }
}

.serviceMainSection .content .title {
    margin: 0 !important;
    font-weight: 500;
    line-height: 1
}

.serviceMainSection .content .subTitle {
    font-family: var(--font-family1);
    margin-top: .7075rem;
    line-height: 1.1
}

.serviceMainSection .content .list {
    padding-left: .7075rem;
    margin-top: .5rem
}

    .serviceMainSection .content .list li {
        list-style-type: disc;
        list-style-position: outside
    }

        .serviceMainSection .content .list li::marker {
            color: var(--color1)
        }

.serviceMainSection .content .dropDownDiv .dropList .dropBox {
    padding: .5rem 0;
    border-bottom: 1px solid rgba(114,101,81,.0549019608)
}

    .serviceMainSection .content .dropDownDiv .dropList .dropBox:nth-last-child(1) {
        border-bottom: none
    }

    .serviceMainSection .content .dropDownDiv .dropList .dropBox .title {
        font-weight: 300
    }

.serviceMainSection .content .note {
    font-size: .878rem;
    border-top: 1px solid hsla(0,0%,100%,.5411764706);
    padding-top: 10px;
    margin-top: .7075rem
}

.serviceMainSection .media {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: 100%;
    min-height: 200px;
    border-radius: inherit;
    overflow: hidden
}

@media(min-width: 1024px) {
    .serviceMainSection .media {
        width: 300px
    }
}

@media(min-width: 1280px) {
    .serviceMainSection .media {
        width: 400px
    }
}

.serviceMainSection .media img {
    aspect-ratio: 1/1;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

@media(min-width: 568px) {
    .serviceMainSection .media img {
        aspect-ratio: 16/9
    }
}

.serviceCardBoxSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: .7075rem
}

    .serviceCardBoxSection .titleDiv {
        padding-bottom: var(--section-space-y);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        text-align: left
    }

@media(min-width: 1024px) {
    .serviceCardBoxSection .titleDiv div {
        width: 50%;
        padding-right: var(--section-space-x)
    }
}

.serviceCardBoxSection .titleDiv div p {
    width: auto !important
}

@media(min-width: 1024px) {
    .serviceCardBoxSection .titleDiv p {
        width: 50%
    }
}

.serviceCardBoxSection.teamContentCard {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

    .serviceCardBoxSection.teamContentCard .itemCard .content {
        width: 100% !important
    }

    .serviceCardBoxSection.teamContentCard .itemCard:nth-child(1) {
        width: 100%
    }

    .serviceCardBoxSection.teamContentCard .itemCard:nth-child(2) {
        width: 100%
    }

@media(min-width: 1024px) {
    .serviceCardBoxSection.teamContentCard .itemCard:nth-child(2) {
        width: 48%
    }
}

.serviceCardBoxSection.teamContentCard .itemCard:nth-child(3) {
    width: 100%
}

@media(min-width: 1024px) {
    .serviceCardBoxSection.teamContentCard .itemCard:nth-child(3) {
        width: 48%
    }
}

.serviceCardBoxSection .innerSection {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: .7075rem
}

.serviceCardBoxSection .itemCard {
    border-radius: var(--btnRadius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: hidden
}

@media(min-width: 1024px) {
    .serviceCardBoxSection .itemCard {
        gap: 10px
    }
}

.serviceCardBoxSection .itemCard.orange .content {
    background: #f5f2f0;
    border: 1px solid #ffe7df
}

    .serviceCardBoxSection .itemCard.orange .content .title, .serviceCardBoxSection .itemCard.orange .content ul li::marker {
        color: #b84c05
    }

.serviceCardBoxSection .itemCard.green .content {
    background: #eaf0e8;
    border: 1px solid #dfffe3
}

    .serviceCardBoxSection .itemCard.green .content .title, .serviceCardBoxSection .itemCard.green .content ul li::marker {
        color: #1b681b
    }

@media(min-width: 1024px) {
    .serviceCardBoxSection .itemCard:nth-child(odd) .content {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }
}

@media(min-width: 1024px) {
    .serviceCardBoxSection .itemCard:nth-child(odd) .media {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }
}

@media(min-width: 1024px) {
    .serviceCardBoxSection .itemCard:nth-child(even) .content {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }
}

@media(min-width: 1024px) {
    .serviceCardBoxSection .itemCard:nth-child(even) .media {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }
}

.serviceCardBoxSection .itemCard:nth-child(2) .content {
    background: #edf3ff;
    border: 1px solid #dff0ff
}

    .serviceCardBoxSection .itemCard:nth-child(2) .content .title, .serviceCardBoxSection .itemCard:nth-child(2) .content ul li::marker {
        color: #1b3468
    }

.serviceCardBoxSection .itemCard:nth-child(3) .content {
    background: #fffaf4;
    border: 1px solid #ffefdf
}

    .serviceCardBoxSection .itemCard:nth-child(3) .content .title, .serviceCardBoxSection .itemCard:nth-child(3) .content ul li::marker {
        color: var(--color2)
    }

.serviceCardBoxSection .itemCard .content {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    border-radius: inherit
}

@media(min-width: 1024px) {
    .serviceCardBoxSection .itemCard .content {
        width: calc(100% - 410px)
    }
}

.serviceCardBoxSection .itemCard .content .title {
    margin: 0;
    font-weight: 500;
    line-height: 1
}

.serviceCardBoxSection .itemCard .content .subTitle {
    margin-top: .7075rem
}

.serviceCardBoxSection .itemCard .content .listDiv {
    padding-left: .7075rem;
    margin-top: 1rem
}

    .serviceCardBoxSection .itemCard .content .listDiv li {
        list-style-type: disc;
        list-style-position: outside;
        padding: 5px 0
    }

        .serviceCardBoxSection .itemCard .content .listDiv li::marker {
            color: var(--color1)
        }

.serviceCardBoxSection .itemCard .content p span {
    font-weight: 500
}

.serviceCardBoxSection .itemCard .content .dropDownDiv {
    margin-top: .5rem
}

    .serviceCardBoxSection .itemCard .content .dropDownDiv .dropList .dropBox {
        padding-top: .5rem;
        padding-bottom: .5rem
    }

        .serviceCardBoxSection .itemCard .content .dropDownDiv .dropList .dropBox .title {
            color: var(--black)
        }

.serviceCardBoxSection .itemCard .content .note {
    font-size: .878rem;
    border-top: 1px solid hsla(0,0%,100%,.5411764706);
    padding-top: 10px;
    margin-top: .7075rem
}

.serviceCardBoxSection .itemCard .media {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: 100%;
    min-height: 200px;
    border-radius: inherit;
    overflow: hidden
}

@media(min-width: 1024px) {
    .serviceCardBoxSection .itemCard .media {
        width: 400px
    }
}

.serviceCardBoxSection .itemCard .media img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    aspect-ratio: 16/9
}

.serciceCardSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: unset;
    -ms-flex-align: unset;
    align-items: unset;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: .7075rem
}

    .serciceCardSection .innerSection {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: .7075rem
    }

    .serciceCardSection .card {
        width: 100%;
        border-radius: var(--btnRadius);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        overflow: hidden
    }

@media(min-width: 1024px) {
    .serciceCardSection .card {
        width: 48%
    }
}

.serciceCardSection .card:nth-child(1) .content {
    background: #f1f5f0;
    border: 1px solid #e4ffdf
}

    .serciceCardSection .card:nth-child(1) .content .title {
        color: rgba(48,94,39,.3764705882)
    }

        .serciceCardSection .card:nth-child(1) .content .title span, .serciceCardSection .card:nth-child(1) .content ul li::marker {
            color: var(--color1)
        }

.serciceCardSection .card:nth-child(2) .content {
    background: #edf3ff;
    border: 1px solid #dff0ff
}

    .serciceCardSection .card:nth-child(2) .content .title, .serciceCardSection .card:nth-child(2) .content ul li::marker {
        color: #1b3468
    }

.serciceCardSection .card:nth-child(3) .content {
    background: #eaf0e8;
    border: 1px solid #dfffe3
}

    .serciceCardSection .card:nth-child(3) .content .title, .serciceCardSection .card:nth-child(3) .content ul li::marker {
        color: #1b681b
    }

.serciceCardSection .card .content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 5px;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    border-radius: inherit
}

    .serciceCardSection .card .content .titleDiv {
        padding-top: var(--section-space-y);
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden
    }

    .serciceCardSection .card .content .title {
        font-family: var(--font-family1);
        font-weight: 600;
        line-height: 1.2
    }

    .serciceCardSection .card .content .subTitle {
        margin-top: .7075rem;
        font-family: var(--font-family1);
        text-transform: uppercase
    }

    .serciceCardSection .card .content ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 5px;
        padding-left: .7075rem;
        margin-top: .5rem
    }

        .serciceCardSection .card .content ul li {
            list-style-type: disc;
            list-style-position: outside
        }

            .serciceCardSection .card .content ul li::marker {
                color: var(--color1)
            }

    .serciceCardSection .card .content .listDiv {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y)
    }

    .serciceCardSection .card .content .box {
        padding: .7075rem;
        width: 100%;
        background: var(--white);
        border-radius: var(--radius)
    }

@media(min-width: 568px) {
    .serciceCardSection .card .content .box {
        width: 49.5%
    }
}

.serciceCardSection .card .content .note {
    font-size: .878rem;
    border-top: 1px solid hsla(0,0%,100%,.5411764706);
    padding-top: 10px;
    margin-top: .7075rem
}

.serciceCardSection .card .media {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: 100%;
    min-height: 200px;
    border-radius: inherit;
    overflow: hidden
}

    .serciceCardSection .card .media img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        aspect-ratio: 16/9
    }

.serviceVerticalCardSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: .7075rem 2%
}

    .serviceVerticalCardSection .innerSection {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: .7075rem 2%
    }

    .serviceVerticalCardSection .imageCard {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }

        .serviceVerticalCardSection .imageCard .media {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%
        }

            .serviceVerticalCardSection .imageCard .media::before {
                content: "";
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 90%;
                z-index: 1;
                opacity: .8;
                background: #000;
                background: -webkit-gradient(linear, left top, left bottom, from(rgb(17, 9, 0)), to(rgba(0, 0, 0, 0)));
                background: linear-gradient(180deg, rgb(17, 9, 0) 0%, rgba(0, 0, 0, 0) 100%)
            }

        .serviceVerticalCardSection .imageCard .content {
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            min-height: 350px;
            z-index: 2;
            color: var(--white);
            border: none;
            background: rgba(0,0,0,0) !important
        }

            .serviceVerticalCardSection .imageCard .content .title {
                font-weight: 400 !important
            }

            .serviceVerticalCardSection .imageCard .content .tagList {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                gap: 5px;
                -ms-flex-wrap: wrap;
                flex-wrap: wrap;
                padding: 0
            }

                .serviceVerticalCardSection .imageCard .content .tagList li {
                    font-size: .937rem;
                    list-style-position: inside;
                    padding: 5px 10px;
                    border-radius: var(--radius);
                    background: rgba(214,131,35,.1176470588);
                    border: 1px solid hsla(0,0%,100%,.0941176471);
                    list-style-type: none;
                    backdrop-filter: blur(5px)
                }

            .serviceVerticalCardSection .imageCard .content ul {
                margin-top: .5rem !important
            }

                .serviceVerticalCardSection .imageCard .content ul li {
                    font-weight: 300
                }

    .serviceVerticalCardSection .itemCard {
        width: 100%;
        border-radius: var(--btnRadius);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        overflow: hidden
    }

@media(min-width: 768px) {
    .serviceVerticalCardSection .itemCard {
        width: 48%
    }
}

.serviceVerticalCardSection .itemCard.orange .content {
    background: #f5f2f0;
    border: 1px solid #ffe7df
}

    .serviceVerticalCardSection .itemCard.orange .content .title, .serviceVerticalCardSection .itemCard.orange .content ul li::marker {
        color: #b84c05
    }

.serviceVerticalCardSection .itemCard.green .content {
    background: #eaf0e8;
    border: 1px solid #dfffe3
}

    .serviceVerticalCardSection .itemCard.green .content .title, .serviceVerticalCardSection .itemCard.green .content ul li::marker {
        color: #1b681b
    }

.serviceVerticalCardSection .itemCard .content {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    border-radius: inherit
}

    .serviceVerticalCardSection .itemCard .content .title {
        margin: 0;
        font-family: var(--font-family1);
        font-weight: 600;
        line-height: 1
    }

    .serviceVerticalCardSection .itemCard .content .subTitle {
        margin-top: .7075rem
    }

    .serviceVerticalCardSection .itemCard .content ul {
        padding-left: .7075rem;
        margin-top: 1.413rem
    }

        .serviceVerticalCardSection .itemCard .content ul li {
            list-style-type: disc;
            list-style-position: outside;
            padding: 5px 0
        }

            .serviceVerticalCardSection .itemCard .content ul li::marker {
                color: var(--color1)
            }

    .serviceVerticalCardSection .itemCard .content .note {
        font-size: .878rem;
        border-top: 1px solid hsla(0,0%,100%,.5411764706);
        padding-top: 10px;
        margin-top: .7075rem
    }

.serviceVerticalCardSection .itemCard .media {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: 100%;
    min-height: 200px;
    border-radius: inherit;
    overflow: hidden
}

    .serviceVerticalCardSection .itemCard .media img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        aspect-ratio: 16/9
    }

.cardBoxSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1.413rem;
    background: #fcf8f1
}

    .cardBoxSection .titleDiv {
        text-align: center;
        margin-bottom: 1.413rem
    }

        .cardBoxSection .titleDiv .title {
            color: #a55e44
        }

    .cardBoxSection .itemCard {
        margin: 0 auto;
        max-width: 800px;
        border-radius: var(--btnRadius);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        overflow: hidden
    }

@media(min-width: 1024px) {
    .cardBoxSection .itemCard {
        gap: 10px;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
    }
}

@media(min-width: 1024px) {
    .cardBoxSection .itemCard:nth-child(odd) .content {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }
}

@media(min-width: 1024px) {
    .cardBoxSection .itemCard:nth-child(odd) .media {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }
}

@media(min-width: 1024px) {
    .cardBoxSection .itemCard:nth-child(even) .content {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }
}

@media(min-width: 1024px) {
    .cardBoxSection .itemCard:nth-child(even) .media {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }
}

.cardBoxSection .itemCard .content {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    background: var(--white);
    border-radius: 0 0 var(--btnRadius) var(--btnRadius);
    border: 1px solid #f8eedc
}

@media(min-width: 1024px) {
    .cardBoxSection .itemCard .content {
        border-radius: var(--btnRadius);
        width: calc(100% - 250px)
    }
}

.cardBoxSection .itemCard .content .title {
    font-family: var(--font-family1);
    font-weight: 500;
    line-height: 1.1;
    padding-bottom: .7075rem;
    margin-bottom: .7075rem;
    border-bottom: 1px solid var(--borderGray)
}

.cardBoxSection .itemCard .content .subTitle {
    margin-top: .7075rem
}

.cardBoxSection .itemCard .content ul {
    padding-left: .7075rem;
    margin-top: .5rem
}

    .cardBoxSection .itemCard .content ul li {
        list-style-type: disc;
        list-style-position: outside
    }

        .cardBoxSection .itemCard .content ul li::marker {
            color: var(--color2)
        }

.cardBoxSection .itemCard .content .note {
    font-size: .878rem;
    border-top: 1px solid hsla(0,0%,100%,.5411764706);
    padding-top: 10px;
    margin-top: .7075rem
}

.cardBoxSection .itemCard .media {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: 100%;
    min-height: 200px;
    overflow: hidden;
    border-radius: var(--btnRadius) var(--btnRadius) 0 0
}

@media(min-width: 1024px) {
    .cardBoxSection .itemCard .media {
        width: 250px;
        border-radius: var(--btnRadius)
    }
}

.cardBoxSection .itemCard .media img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    aspect-ratio: 16/9
}

.contentCenterSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    text-align: center
}

    .contentCenterSection .content p {
        color: var(--gray)
    }

@media(min-width: 1024px) {
    .contentCenterSection .content p {
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
    }
}

.contentCenterSection .content p span {
    color: var(--darkGray);
    font-weight: 500
}

.contentCenterSection .btnDiv {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.textSlider {
    --textSlide--colour: #ffffff7a;
    --textSlide--bg: var(--color1);
    --textSlide--repeat-count: 15;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 5vw;
    overflow: hidden;
    background: var(--textSlide--bg)
}

    .textSlider .bg {
        mix-blend-mode: screen;
        background: var(--textSlide--colour)
    }

    .textSlider .textSliderWrapper {
        padding-top: .7075rem;
        padding-bottom: .7075rem;
        overflow: hidden;
        width: 110%;
        margin-left: -5%;
        color: var(--textSlide--colour);
        --textSlide--direction: -1;
        background: var(--textSlide--bg)
    }

        .textSlider .textSliderWrapper div {
            margin: 0;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            gap: .5em;
            font-family: var(--font-family1);
            font-size: clamp(1.5rem,3vw,1.5rem);
            font-weight: 400;
            line-height: 1.1
        }

            .textSlider .textSliderWrapper div::after {
                content: "*";
                color: var(--color2);
                -webkit-transform: translateY(0.175em);
                transform: translateY(0.175em);
                opacity: 1
            }

            .textSlider .textSliderWrapper div::before {
                content: ""
            }

    .textSlider .textDiv {
        --textSlide--base-duration: 1s;
        --textSlide--repeat-size: calc(100% / var(--textSlide--repeat-count));
        --textSlide--double-size: calc(var(--textSlide--repeat-size) * 2);
        --textSlide--duration: calc(var(--textSlide--base-duration) * var(--text-slider-speed, 20));
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        will-change: transform
    }

@media(prefers-reduced-motion: no-preference) {
    .textSlider .textDiv {
        -webkit-animation: textSlide var(--textSlide--duration) infinite linear,reduce-textSlide var(--textSlide--duration) infinite linear paused;
        animation: textSlide var(--textSlide--duration) infinite linear,reduce-textSlide var(--textSlide--duration) infinite linear paused;
        animation-composition: add
    }

        .textSlider .textDiv:hover {
            -webkit-animation-play-state: running;
            animation-play-state: running
        }
}

@-webkit-keyframes textSlide {
    from {
        -webkit-transform: translateX(calc(-1 * var(--textSlide--double-size) - var(--textSlide--double-size) * var(--textSlide--direction, 1)));
        transform: translateX(calc(-1 * var(--textSlide--double-size) - var(--textSlide--double-size) * var(--textSlide--direction, 1)))
    }

    to {
        -webkit-transform: translateX(calc(var(--textSlide--double-size) * -1));
        transform: translateX(calc(var(--textSlide--double-size) * -1))
    }
}

@keyframes textSlide {
    from {
        -webkit-transform: translateX(calc(-1 * var(--textSlide--double-size) - var(--textSlide--double-size) * var(--textSlide--direction, 1)));
        transform: translateX(calc(-1 * var(--textSlide--double-size) - var(--textSlide--double-size) * var(--textSlide--direction, 1)))
    }

    to {
        -webkit-transform: translateX(calc(var(--textSlide--double-size) * -1));
        transform: translateX(calc(var(--textSlide--double-size) * -1))
    }
}

@-webkit-keyframes reduce-textSlide {
    from {
        -webkit-transform: translateX(calc(var(--textSlide--repeat-size) * var(--textSlide--direction, 1)));
        transform: translateX(calc(var(--textSlide--repeat-size) * var(--textSlide--direction, 1)))
    }

    to {
        transfrom: translateX(calc(var(--textSlide--double-size) * -1))
    }
}

@keyframes reduce-textSlide {
    from {
        -webkit-transform: translateX(calc(var(--textSlide--repeat-size) * var(--textSlide--direction, 1)));
        transform: translateX(calc(var(--textSlide--repeat-size) * var(--textSlide--direction, 1)))
    }

    to {
        transfrom: translateX(calc(var(--textSlide--double-size) * -1))
    }
}

.contentSection {
    padding-top: var(--section-space-y);
    background-color: #f2efeb;
    background-size: contain;
    background-position: center top;
    background-repeat: no-repeat
}

    .contentSection::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 50px;
        z-index: 1;
        background-size: cover;
        background-position: center bottom;
        background-repeat: no-repeat;
        background-image: url("/assets/images/home/icon/demo-travel-agency-slider-07.webp")
    }

@media(min-width: 1024px) {
    .contentSection {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y)
    }
}

.contentSection .innerSection {
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat
}

@media(min-width: 1024px) {
    .contentSection .innerSection {
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y)
    }
}

.contentSection .content {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    width: 100%;
    padding-left: .7075rem;
    padding-left: 50px
}

@media(min-width: 1024px) {
    .contentSection .content {
        padding: 0;
        clear: both;
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-left: 70px;
        width: 60%
    }
}

.contentSection .content .label {
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-writing-mode: vertical-lr;
    -ms-writing-mode: tb-lr;
    writing-mode: vertical-lr;
    white-space: nowrap;
    width: 50px;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    color: var(--textGray);
    font-family: var(--font-family1);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 10px;
    opacity: .6
}

@media(min-width: 1024px) {
    .contentSection .content .label {
        width: 70px
    }
}

.contentSection .content .title {
    max-width: 550px;
    font-family: var(--font-family1);
    font-weight: 500;
    line-height: 1
}

.contentSection .content p {
    color: var(--gray);
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: .5px
}

.contentSection .content .milestones {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-top: 1rem
}

    .contentSection .content .milestones li {
        padding: 0 8px;
        border-right: 1px solid #e6e6e6
    }

@media(min-width: 568px) {
    .contentSection .content .milestones li {
        padding: 0 .7075rem
    }
}

@media(min-width: 1024px) {
    .contentSection .content .milestones li {
        padding: 0 2rem
    }
}

.contentSection .content .milestones li:nth-child(1) {
    padding-left: 0
}

.contentSection .content .milestones li:nth-last-child(1) {
    border: none
}

.contentSection .content .milestones li .label {
    margin: 0;
    margin-bottom: 5px;
    font-size: .667rem;
    font-weight: 500;
    color: var(--textGray);
    text-transform: uppercase;
    letter-spacing: 3px
}

@media(min-width: 568px) {
    .contentSection .content .milestones li .label {
        font-size: .733rem
    }
}

.contentSection .content .milestones li .value {
    margin: 0;
    color: var(--black);
    font-family: var(--font-family1);
    font-size: clamp(20.25px,17.3681052632px + 0.0060039474*100vw,29.376px);
    line-height: 1;
    letter-spacing: -1px
}

@media(min-width: 1024px) {
    .contentSection .content .milestones li .value {
        font-size: clamp(22.78125px,18.8433710526px + 0.0082039145*100vw,35.2512px)
    }
}

.contentSection .content .milestones li .text {
    max-width: 150px;
    margin-top: 5px;
    color: var(--gray);
    font-family: var(--font-family1);
    font-size: .878rem;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: 1px;
    text-transform: uppercase
}

.contentSection .content .btnDiv {
    margin-top: 2rem
}

.contentSection .media {
    width: 100%;
    padding-top: 56.25%;
    overflow: hidden;
    border: 1px solid var(--lightGray)
}

@media(min-width: 1024px) {
    .contentSection .media {
        margin: 0 auto;
        width: 400px;
        padding-top: 400px;
        border-radius: var(--radius);
        -webkit-box-shadow: rgba(0,0,0,.1) 0px 10px 15px -3px,rgba(0,0,0,.05) 0px 4px 6px -2px;
        box-shadow: rgba(0,0,0,.1) 0px 10px 15px -3px,rgba(0,0,0,.05) 0px 4px 6px -2px
    }
}

.contentSection .media .label {
    position: absolute;
    top: -2px;
    left: -2px;
    color: var(--color1);
    font-family: var(--font-family1);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 2px;
    background-color: var(--white);
    padding: .7075rem 2rem;
    z-index: 1;
    border-radius: 0 0 2rem 0;
    -webkit-box-shadow: rgba(0,0,0,.04) 0px 3px 5px;
    box-shadow: rgba(0,0,0,.04) 0px 3px 5px
}

.contentSection .media img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: top center;
    object-position: top center
}

.contentMediaSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    background-size: contain;
    background-position: center top;
    background-repeat: no-repeat;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: unset
}

    .contentMediaSection::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 50px;
        z-index: 1;
        background-size: cover;
        background-position: center bottom;
        background-repeat: no-repeat;
        background-image: url("/assets/images/home/icon/demo-travel-agency-slider-07.webp")
    }

    .contentMediaSection .innerSection {
        padding-top: var(--section-space-y);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat
    }

@media(min-width: 1024px) {
    .contentMediaSection .innerSection {
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y)
    }
}

.contentMediaSection .content {
    padding-bottom: var(--section-space-y);
    width: 100%
}

@media(min-width: 1024px) {
    .contentMediaSection .content {
        width: calc(100% - 400px);
        padding-right: var(--section-space-x)
    }
}

.contentMediaSection .content .label {
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-writing-mode: vertical-lr;
    -ms-writing-mode: tb-lr;
    writing-mode: vertical-lr;
    white-space: nowrap;
    width: 50px;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    color: var(--textGray);
    font-family: var(--font-family1);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 10px;
    opacity: .6
}

@media(min-width: 1024px) {
    .contentMediaSection .content .label {
        width: 70px
    }
}

.contentMediaSection .content .title {
    max-width: 550px;
    font-family: var(--font-family1);
    font-weight: 500;
    line-height: 1
}

.contentMediaSection .content p {
    color: var(--gray);
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: .5px
}

.contentMediaSection .content .listDiv {
    margin-top: 1.413rem;
    padding-left: 1.413rem
}

    .contentMediaSection .content .listDiv li {
        color: var(--darkGray);
        font-weight: 400;
        list-style-position: outside;
        list-style-type: disc;
        padding: 5px 0;
        line-height: 1.5
    }

        .contentMediaSection .content .listDiv li strong {
            color: var(--color1);
            font-weight: 500
        }

        .contentMediaSection .content .listDiv li::marker {
            color: var(--color1)
        }

.contentMediaSection .content .milestones {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-top: 1rem
}

    .contentMediaSection .content .milestones li {
        padding: 0 8px;
        border-right: 1px solid #e6e6e6
    }

@media(min-width: 568px) {
    .contentMediaSection .content .milestones li {
        padding: 0 .7075rem
    }
}

@media(min-width: 1024px) {
    .contentMediaSection .content .milestones li {
        padding: 0 2rem
    }
}

.contentMediaSection .content .milestones li:nth-child(1) {
    padding-left: 0
}

.contentMediaSection .content .milestones li:nth-last-child(1) {
    border: none
}

.contentMediaSection .content .milestones li .label {
    margin: 0;
    margin-bottom: 5px;
    font-size: .667rem;
    font-weight: 500;
    color: var(--textGray);
    text-transform: uppercase;
    letter-spacing: 3px
}

@media(min-width: 568px) {
    .contentMediaSection .content .milestones li .label {
        font-size: .733rem
    }
}

.contentMediaSection .content .milestones li .value {
    margin: 0;
    color: var(--black);
    font-family: var(--font-family1);
    font-size: clamp(20.25px,17.3681052632px + 0.0060039474*100vw,29.376px);
    line-height: 1;
    letter-spacing: -1px
}

@media(min-width: 1024px) {
    .contentMediaSection .content .milestones li .value {
        font-size: clamp(22.78125px,18.8433710526px + 0.0082039145*100vw,35.2512px)
    }
}

.contentMediaSection .content .milestones li .text {
    max-width: 150px;
    margin-top: 5px;
    color: var(--gray);
    font-family: var(--font-family1);
    font-size: .878rem;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: 1px;
    text-transform: uppercase
}

.contentMediaSection .content .btnDiv {
    margin-top: 2rem
}

.contentMediaSection .media {
    width: 100%
}

@media(min-width: 1024px) {
    .contentMediaSection .media {
        margin: 0 auto;
        width: 400px;
        border-radius: var(--radius)
    }
}

.contentMediaSection .media::before, .contentMediaSection .media::after {
    content: "";
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    border-radius: var(--radius);
    opacity: .5
}

.contentMediaSection .media::before {
    top: 20px;
    left: -20px;
    border: 2px solid var(--color1)
}

.contentMediaSection .media::after {
    top: -20px;
    left: 20px;
    border: 2px solid var(--color2)
}

.contentMediaSection .media .label {
    position: absolute;
    top: -2px;
    left: -2px;
    color: var(--color1);
    font-family: var(--font-family1);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 2px;
    background-color: var(--white);
    padding: .7075rem 2rem;
    z-index: 1;
    border-radius: 0 0 2rem 0;
    -webkit-box-shadow: rgba(0,0,0,.04) 0px 3px 5px;
    box-shadow: rgba(0,0,0,.04) 0px 3px 5px
}

.contentMediaSection .media img {
    width: 100%;
    height: 100%;
    border-radius: var(--radius);
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: top center;
    object-position: top center
}

.reviewCarouselSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    overflow: hidden;
    background: var(--white);
    color: var(--black)
}

    .reviewCarouselSection::before, .reviewCarouselSection::after {
        content: "";
        position: absolute;
        top: 0;
        z-index: 4;
        width: 50px;
        height: 100%;
        background: inherit
    }

@media(min-width: 1024px) {
    .reviewCarouselSection::before, .reviewCarouselSection::after {
        width: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%)
    }
}

.reviewCarouselSection::before {
    left: 0;
    background: -webkit-gradient(linear, left top, right top, from(var(--lightGray)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(90deg, var(--lightGray) 0%, rgba(255, 255, 255, 0) 100%)
}

@media(min-width: 1024px) {
    .reviewCarouselSection::before {
        background: -webkit-gradient(linear, left top, right top, color-stop(5%, var(--lightGray)), to(rgba(255, 255, 255, 0)));
        background: linear-gradient(90deg, var(--lightGray) 5%, rgba(255, 255, 255, 0) 100%)
    }
}

.reviewCarouselSection::after {
    content: "";
    right: 0;
    background: -webkit-gradient(linear, right top, left top, color-stop(5%, var(--lightGray)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(-90deg, var(--lightGray) 5%, rgba(255, 255, 255, 0) 100%)
}

.reviewCarouselSection .bgText {
    position: absolute;
    left: 50%;
    top: 0;
    z-index: 1;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    line-height: 1;
    margin: 0 auto;
    padding: 0 .75vw;
    color: inherit;
    font-size: 10vw;
    font-style: italic;
    font-weight: 800;
    letter-spacing: -0.3vw;
    text-transform: uppercase;
    white-space: nowrap;
    opacity: .05
}

.reviewCarouselSection .titleDiv {
    color: inherit
}

    .reviewCarouselSection .titleDiv .title {
        color: var(--black)
    }

    .reviewCarouselSection .titleDiv p {
        margin-top: 5px;
        color: inherit;
        opacity: .8
    }

.reviewCarouselSection .reviewWrapper {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: inherit;
    margin-top: .7075rem
}

    .reviewCarouselSection .reviewWrapper .reviewSlide {
        background: inherit
    }

        .reviewCarouselSection .reviewWrapper .reviewSlide .review {
            z-index: 3;
            text-align: left;
            background: var(--lightGray);
            border: 1px solid var(--lightGray);
            border-radius: var(--radius);
            padding: 1.413rem;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review:hover {
                top: 0;
                -webkit-box-shadow: rgba(50,50,93,.11) 0px 50px 100px -20px,rgba(0,0,0,.089) 0px 30px 60px -30px;
                box-shadow: rgba(50,50,93,.11) 0px 50px 100px -20px,rgba(0,0,0,.089) 0px 30px 60px -30px
            }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review:nth-child(1) .profile .avatar::before {
                background-color: #ff4500
            }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review:nth-child(2) .profile .avatar::before {
                background-color: #435761
            }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review:nth-child(3) .profile .avatar::before {
                background-color: #bf360c
            }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review:nth-child(4) .profile .avatar::before {
                background-color: #3583c5
            }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review:nth-child(5) .profile .avatar::before {
                background-color: #9c40ec
            }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review:nth-child(6) .profile .avatar::before {
                background-color: purple
            }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review:nth-child(7) .profile .avatar::before {
                background-color: #3f9b28
            }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review:nth-child(8) .profile .avatar::before {
                background-color: #008577
            }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review:nth-child(9) .profile .avatar::before {
                background-color: #0d4638
            }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review .content {
                width: 100%;
                height: 100%;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -ms-flex-direction: column;
                flex-direction: column;
                padding: 0
            }

                .reviewCarouselSection .reviewWrapper .reviewSlide .review .content .caption {
                    margin: 0;
                    font-size: 18px;
                    font-weight: 500;
                    margin-bottom: 5px
                }

                .reviewCarouselSection .reviewWrapper .reviewSlide .review .content p {
                    font-size: .937rem;
                    font-weight: 400;
                    opacity: .85;
                    line-height: 1.5
                }

                    .reviewCarouselSection .reviewWrapper .reviewSlide .review .content p:nth-of-type(1) {
                        margin: 0
                    }

                    .reviewCarouselSection .reviewWrapper .reviewSlide .review .content p:nth-last-of-type(1) {
                        margin-bottom: .7075rem
                    }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review .profile {
                margin-top: auto;
                width: -webkit-max-content;
                width: -moz-max-content;
                width: max-content;
                justify-self: flex-end;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -ms-flex-direction: column;
                flex-direction: column;
                padding-left: 48px;
                text-align: left
            }

                .reviewCarouselSection .reviewWrapper .reviewSlide .review .profile .avatar {
                    position: absolute;
                    top: 0;
                    left: 0;
                    margin: 0 auto;
                    width: 40px;
                    height: 40px;
                    border: 3px solid rgba(129,129,129,.1215686275);
                    border-radius: 100%;
                    margin-bottom: 10px
                }

                    .reviewCarouselSection .reviewWrapper .reviewSlide .review .profile .avatar::before {
                        content: attr(data-avatar);
                        position: absolute;
                        top: 0;
                        left: 0;
                        width: 100%;
                        height: 100%;
                        display: none;
                        -webkit-box-align: center;
                        -ms-flex-align: center;
                        align-items: center;
                        -webkit-box-pack: center;
                        -ms-flex-pack: center;
                        justify-content: center;
                        font-weight: 500;
                        border-radius: inherit;
                        color: var(--white);
                        background-color: #ff4500
                    }

                    .reviewCarouselSection .reviewWrapper .reviewSlide .review .profile .avatar img[src=""] {
                        display: none
                    }

                    .reviewCarouselSection .reviewWrapper .reviewSlide .review .profile .avatar:has(img[src=""])::before {
                        display: -webkit-box;
                        display: -ms-flexbox;
                        display: flex
                    }

                .reviewCarouselSection .reviewWrapper .reviewSlide .review .profile .name {
                    margin: 0;
                    display: inline-block;
                    font-size: .937rem;
                    font-weight: 500
                }

                .reviewCarouselSection .reviewWrapper .reviewSlide .review .profile .subText {
                    margin-top: 3px;
                    margin-bottom: 0 !important;
                    display: inline-block;
                    font-size: .878rem;
                    opacity: .8;
                    line-height: 1
                }

            .reviewCarouselSection .reviewWrapper .reviewSlide .review .rating {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                margin-top: 7px;
                font-size: .878rem;
                font-weight: 500
            }

                .reviewCarouselSection .reviewWrapper .reviewSlide .review .rating img {
                    width: 70px;
                    margin-right: 10px
                }

                .reviewCarouselSection .reviewWrapper .reviewSlide .review .rating span {
                    opacity: .5
                }

.reviewCarouselSection .reviewSlide {
    width: calc(100% + 100px);
    height: calc(300px + var(--section-space-y));
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden
}

    .reviewCarouselSection .reviewSlide:hover .review {
        -webkit-animation-play-state: paused !important;
        animation-play-state: paused !important
    }

@-webkit-keyframes loop1 {
    0% {
        -webkit-transform: translateX(3600px);
        transform: translateX(3600px)
    }

    100% {
        -webkit-transform: translateX(-360px);
        transform: translateX(-360px)
    }
}

@keyframes loop1 {
    0% {
        -webkit-transform: translateX(3600px);
        transform: translateX(3600px)
    }

    100% {
        -webkit-transform: translateX(-360px);
        transform: translateX(-360px)
    }
}

.reviewCarouselSection .reviewSlide .review {
    position: absolute;
    top: 5px;
    left: 0;
    width: 360px;
    height: 300px;
    margin-right: 0
}

    .reviewCarouselSection .reviewSlide .review:nth-of-type(1) {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
        -webkit-animation: loop1 100s -990s linear infinite;
        animation: loop1 100s -990s linear infinite
    }

@keyframes loop1 {
    0% {
        -webkit-transform: translateX(3600px);
        transform: translateX(3600px)
    }

    100% {
        -webkit-transform: translateX(-360px);
        transform: translateX(-360px)
    }
}

.reviewCarouselSection .reviewSlide .review {
    position: absolute;
    top: 5px;
    left: 0;
    width: 360px;
    height: 300px;
    margin-right: 0
}

    .reviewCarouselSection .reviewSlide .review:nth-of-type(2) {
        -webkit-transform: translateX(360px);
        transform: translateX(360px);
        -webkit-animation: loop1 100s -980s linear infinite;
        animation: loop1 100s -980s linear infinite
    }

@keyframes loop1 {
    0% {
        -webkit-transform: translateX(3600px);
        transform: translateX(3600px)
    }

    100% {
        -webkit-transform: translateX(-360px);
        transform: translateX(-360px)
    }
}

.reviewCarouselSection .reviewSlide .review {
    position: absolute;
    top: 5px;
    left: 0;
    width: 360px;
    height: 300px;
    margin-right: 0
}

    .reviewCarouselSection .reviewSlide .review:nth-of-type(3) {
        -webkit-transform: translateX(720px);
        transform: translateX(720px);
        -webkit-animation: loop1 100s -970s linear infinite;
        animation: loop1 100s -970s linear infinite
    }

@keyframes loop1 {
    0% {
        -webkit-transform: translateX(3600px);
        transform: translateX(3600px)
    }

    100% {
        -webkit-transform: translateX(-360px);
        transform: translateX(-360px)
    }
}

.reviewCarouselSection .reviewSlide .review {
    position: absolute;
    top: 5px;
    left: 0;
    width: 360px;
    height: 300px;
    margin-right: 0
}

    .reviewCarouselSection .reviewSlide .review:nth-of-type(4) {
        -webkit-transform: translateX(1080px);
        transform: translateX(1080px);
        -webkit-animation: loop1 100s -960s linear infinite;
        animation: loop1 100s -960s linear infinite
    }

@keyframes loop1 {
    0% {
        -webkit-transform: translateX(3600px);
        transform: translateX(3600px)
    }

    100% {
        -webkit-transform: translateX(-360px);
        transform: translateX(-360px)
    }
}

.reviewCarouselSection .reviewSlide .review {
    position: absolute;
    top: 5px;
    left: 0;
    width: 360px;
    height: 300px;
    margin-right: 0
}

    .reviewCarouselSection .reviewSlide .review:nth-of-type(5) {
        -webkit-transform: translateX(1440px);
        transform: translateX(1440px);
        -webkit-animation: loop1 100s -950s linear infinite;
        animation: loop1 100s -950s linear infinite
    }

@keyframes loop1 {
    0% {
        -webkit-transform: translateX(3600px);
        transform: translateX(3600px)
    }

    100% {
        -webkit-transform: translateX(-360px);
        transform: translateX(-360px)
    }
}

.reviewCarouselSection .reviewSlide .review {
    position: absolute;
    top: 5px;
    left: 0;
    width: 360px;
    height: 300px;
    margin-right: 0
}

    .reviewCarouselSection .reviewSlide .review:nth-of-type(6) {
        -webkit-transform: translateX(1800px);
        transform: translateX(1800px);
        -webkit-animation: loop1 100s -940s linear infinite;
        animation: loop1 100s -940s linear infinite
    }

@keyframes loop1 {
    0% {
        -webkit-transform: translateX(3600px);
        transform: translateX(3600px)
    }

    100% {
        -webkit-transform: translateX(-360px);
        transform: translateX(-360px)
    }
}

.reviewCarouselSection .reviewSlide .review {
    position: absolute;
    top: 5px;
    left: 0;
    width: 360px;
    height: 300px;
    margin-right: 0
}

    .reviewCarouselSection .reviewSlide .review:nth-of-type(7) {
        -webkit-transform: translateX(2160px);
        transform: translateX(2160px);
        -webkit-animation: loop1 100s -930s linear infinite;
        animation: loop1 100s -930s linear infinite
    }

@keyframes loop1 {
    0% {
        -webkit-transform: translateX(3600px);
        transform: translateX(3600px)
    }

    100% {
        -webkit-transform: translateX(-360px);
        transform: translateX(-360px)
    }
}

.reviewCarouselSection .reviewSlide .review {
    position: absolute;
    top: 5px;
    left: 0;
    width: 360px;
    height: 300px;
    margin-right: 0
}

    .reviewCarouselSection .reviewSlide .review:nth-of-type(8) {
        -webkit-transform: translateX(2520px);
        transform: translateX(2520px);
        -webkit-animation: loop1 100s -920s linear infinite;
        animation: loop1 100s -920s linear infinite
    }

@keyframes loop1 {
    0% {
        -webkit-transform: translateX(3600px);
        transform: translateX(3600px)
    }

    100% {
        -webkit-transform: translateX(-360px);
        transform: translateX(-360px)
    }
}

.reviewCarouselSection .reviewSlide .review {
    position: absolute;
    top: 5px;
    left: 0;
    width: 360px;
    height: 300px;
    margin-right: 0
}

    .reviewCarouselSection .reviewSlide .review:nth-of-type(9) {
        -webkit-transform: translateX(2880px);
        transform: translateX(2880px);
        -webkit-animation: loop1 100s -910s linear infinite;
        animation: loop1 100s -910s linear infinite
    }

@keyframes loop1 {
    0% {
        -webkit-transform: translateX(3600px);
        transform: translateX(3600px)
    }

    100% {
        -webkit-transform: translateX(-360px);
        transform: translateX(-360px)
    }
}

.reviewCarouselSection .reviewSlide .review {
    position: absolute;
    top: 5px;
    left: 0;
    width: 360px;
    height: 300px;
    margin-right: 0
}

    .reviewCarouselSection .reviewSlide .review:nth-of-type(10) {
        -webkit-transform: translateX(3240px);
        transform: translateX(3240px);
        -webkit-animation: loop1 100s -900s linear infinite;
        animation: loop1 100s -900s linear infinite
    }

.reviewSliderSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    overflow: unset;
    color: var(--black);
    background: var(--lightGray);
    overflow: hidden
}

    .reviewSliderSection::before, .reviewSliderSection::after {
        content: "";
        position: absolute;
        top: 0;
        z-index: 4;
        width: 50px;
        height: 100%;
        background: inherit;
        pointer-events: none
    }

@media(min-width: 1024px) {
    .reviewSliderSection::before, .reviewSliderSection::after {
        width: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%)
    }
}

.reviewSliderSection::before {
    left: 0;
    background: -webkit-gradient(linear, left top, right top, from(var(--lightGray)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(90deg, var(--lightGray) 0%, rgba(255, 255, 255, 0) 100%)
}

@media(min-width: 1024px) {
    .reviewSliderSection::before {
        background: -webkit-gradient(linear, left top, right top, color-stop(5%, var(--lightGray)), to(rgba(255, 255, 255, 0)));
        background: linear-gradient(90deg, var(--lightGray) 5%, rgba(255, 255, 255, 0) 100%)
    }
}

.reviewSliderSection::after {
    content: "";
    right: 0;
    background: -webkit-gradient(linear, right top, left top, color-stop(5%, var(--lightGray)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(-90deg, var(--lightGray) 5%, rgba(255, 255, 255, 0) 100%)
}

.reviewSliderSection .bgText {
    position: absolute;
    left: 50%;
    top: 0;
    z-index: 1;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    line-height: 1;
    margin: 0 auto;
    padding: 0 .75vw;
    color: inherit;
    font-family: var(--font-family1);
    font-size: 10vw;
    font-weight: 800;
    letter-spacing: -0.3vw;
    text-transform: uppercase;
    white-space: nowrap;
    opacity: .045
}

.reviewSliderSection .heading {
    color: var(--white);
    font-family: var(--font-family1);
    font-weight: 200
}

.reviewSliderSection .titleDiv {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    color: inherit;
    padding-bottom: 1.413rem
}

    .reviewSliderSection .titleDiv .title {
        margin: 0;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 10px;
        color: inherit;
        color: var(--black);
        font-family: var(--font-family1)
    }

        .reviewSliderSection .titleDiv .title::after {
            content: "";
            height: 1px;
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            background: var(--borderGray)
        }

    .reviewSliderSection .titleDiv p {
        margin: 0;
        color: inherit;
        opacity: .8
    }

@media(min-width: 1024px) {
    .reviewSliderSection .titleDiv p {
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
    }
}

.reviewSliderSection .reviewWrapper {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: .7075rem;
    background: inherit
}

    .reviewSliderSection .reviewWrapper .reviewSlide {
        width: 100%;
        padding-right: clamp(0px,(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(0px,(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        margin: 0 auto;
        z-index: 4;
        padding-bottom: var(--section-space-y);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 0 20px
    }

        .reviewSliderSection .reviewWrapper .reviewSlide .review {
            width: 100%;
            min-width: 100%;
            text-align: left;
            background: var(--white);
            border: 1px solid rgba(129,129,129,.1215686275);
            border-radius: var(--radius);
            padding: 1rem;
            -webkit-transition: var(--transition1);
            transition: var(--transition1);
            -webkit-box-shadow: rgba(0,0,0,.055) 0px 4px 12px;
            box-shadow: rgba(0,0,0,.055) 0px 4px 12px
        }

@media(min-width: 1024px) {
    .reviewSliderSection .reviewWrapper .reviewSlide .review {
        width: 350px;
        min-width: 350px;
        padding: 1.413rem
    }
}

.reviewSliderSection .reviewWrapper .reviewSlide .review:hover {
    top: 0;
    -webkit-box-shadow: rgba(50,50,93,.11) 0px 50px 100px -20px,rgba(0,0,0,.089) 0px 30px 60px -30px;
    box-shadow: rgba(50,50,93,.11) 0px 50px 100px -20px,rgba(0,0,0,.089) 0px 30px 60px -30px
}

.reviewSliderSection .reviewWrapper .reviewSlide .review:nth-child(1) .profile .avatar::before {
    background-color: #ff4500
}

.reviewSliderSection .reviewWrapper .reviewSlide .review:nth-child(2) .profile .avatar::before {
    background-color: #435761
}

.reviewSliderSection .reviewWrapper .reviewSlide .review:nth-child(3) .profile .avatar::before {
    background-color: #bf360c
}

.reviewSliderSection .reviewWrapper .reviewSlide .review:nth-child(4) .profile .avatar::before {
    background-color: #3583c5
}

.reviewSliderSection .reviewWrapper .reviewSlide .review:nth-child(5) .profile .avatar::before {
    background-color: #9c40ec
}

.reviewSliderSection .reviewWrapper .reviewSlide .review:nth-child(6) .profile .avatar::before {
    background-color: purple
}

.reviewSliderSection .reviewWrapper .reviewSlide .review:nth-child(7) .profile .avatar::before {
    background-color: #3f9b28
}

.reviewSliderSection .reviewWrapper .reviewSlide .review:nth-child(8) .profile .avatar::before {
    background-color: #008577
}

.reviewSliderSection .reviewWrapper .reviewSlide .review:nth-child(9) .profile .avatar::before {
    background-color: #0d4638
}

.reviewSliderSection .reviewWrapper .reviewSlide .review .content {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0
}

    .reviewSliderSection .reviewWrapper .reviewSlide .review .content .caption {
        margin: 0;
        font-size: 18px;
        font-weight: 700;
        margin-bottom: 5px
    }

    .reviewSliderSection .reviewWrapper .reviewSlide .review .content p {
        font-size: .937rem;
        font-weight: 500;
        opacity: .85;
        line-height: 1.5
    }

        .reviewSliderSection .reviewWrapper .reviewSlide .review .content p:nth-of-type(1) {
            margin: 0
        }

        .reviewSliderSection .reviewWrapper .reviewSlide .review .content p:nth-last-of-type(1) {
            margin-bottom: .7075rem
        }

.reviewSliderSection .reviewWrapper .reviewSlide .review .profile {
    margin-top: auto;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    justify-self: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 48px;
    text-align: left
}

    .reviewSliderSection .reviewWrapper .reviewSlide .review .profile .avatar {
        position: absolute;
        top: 0;
        left: 0;
        margin: 0 auto;
        width: 40px;
        height: 40px;
        border: 3px solid rgba(129,129,129,.1215686275);
        border-radius: 100%;
        margin-bottom: 10px
    }

        .reviewSliderSection .reviewWrapper .reviewSlide .review .profile .avatar::before {
            content: attr(data-avatar);
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: none;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            font-weight: 500;
            border-radius: inherit;
            color: var(--white);
            background-color: #ff4500
        }

        .reviewSliderSection .reviewWrapper .reviewSlide .review .profile .avatar img[src=""] {
            display: none
        }

        .reviewSliderSection .reviewWrapper .reviewSlide .review .profile .avatar:has(img[src=""])::before {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex
        }

    .reviewSliderSection .reviewWrapper .reviewSlide .review .profile .name {
        margin: 0;
        display: inline-block;
        font-size: .937rem;
        font-weight: 600
    }

    .reviewSliderSection .reviewWrapper .reviewSlide .review .profile .subText {
        margin-top: 3px;
        margin-bottom: 0 !important;
        display: inline-block;
        font-size: .878rem;
        opacity: .8;
        line-height: 1
    }

.reviewSliderSection .reviewWrapper .reviewSlide .review .rating {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 7px;
    font-size: .878rem;
    font-weight: 500
}

    .reviewSliderSection .reviewWrapper .reviewSlide .review .rating img {
        width: 70px;
        margin-right: 10px
    }

    .reviewSliderSection .reviewWrapper .reviewSlide .review .rating span {
        opacity: .5
    }

.reviewSliderSection .arrowDiv {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px
}

.reviewSliderSection .arrow {
    margin: 0;
    width: 40px;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--black);
    border-radius: 100%;
    border: 1px solid var(--white);
    background-color: var(--white);
    cursor: pointer;
    -webkit-transition: var(--transition2);
    transition: var(--transition2)
}

@media(min-width: 768px) {
    .reviewSliderSection .arrow {
        width: 50px;
        height: 50px
    }
}

.reviewSliderSection .arrow:hover {
    background-color: var(--color2);
    border: 1px solid var(--color2);
    -webkit-box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px;
    box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px
}

    .reviewSliderSection .arrow:hover i {
        color: var(--white)
    }

.reviewSliderSection .arrow i {
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    margin: auto;
    cursor: pointer;
    -webkit-transition: var(--transition2);
    transition: var(--transition2)
}

.wallSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    background-color: var(--white);
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    z-index: 2;
    gap: 20px 0
}

    .wallSection::before {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-image: radial-gradient(at 98.6% 68.3%, rgba(0, 26, 73, 0.1019607843) 0px, transparent 50%),radial-gradient(at 4.8% 63.1%, rgba(2, 41, 119, 0.4745098039) 0px, transparent 50%),radial-gradient(at 7.8% 85.1%, rgba(0, 31, 92, 0.3294117647) 0px, transparent 50%),radial-gradient(at 21% 80.7%, rgba(0, 81, 180, 0.3215686275) 0px, transparent 50%),radial-gradient(at 64.3% 80.3%, rgba(0, 124, 114, 0.5764705882) 0px, transparent 50%);
        opacity: .5
    }

    .wallSection .titleDiv {
        width: 100%
    }

@media(min-width: 1024px) {
    .wallSection .titleDiv {
        width: 50%
    }
}

.wallSection .titleDiv .breadcrumb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 10px
}

    .wallSection .titleDiv .breadcrumb a {
        color: var(--textGray);
        display: inline-block;
        font-size: 14px;
        padding-right: 10px;
        margin-right: 10px;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .wallSection .titleDiv .breadcrumb a.activeBreadcrumb {
            color: var(--black)
        }

        .wallSection .titleDiv .breadcrumb a:nth-last-child(1) {
            margin-right: 0;
            padding-right: 0
        }

            .wallSection .titleDiv .breadcrumb a:nth-last-child(1)::before {
                display: none
            }

        .wallSection .titleDiv .breadcrumb a:empty {
            display: none
        }

        .wallSection .titleDiv .breadcrumb a:hover {
            color: var(--color1)
        }

        .wallSection .titleDiv .breadcrumb a::before {
            content: "";
            position: absolute;
            top: 0;
            right: 0;
            width: 2px;
            height: 100%;
            background: var(--borderGray);
            -webkit-transform: rotate(10deg);
            transform: rotate(10deg)
        }

.wallSection .titleDiv .title {
    margin: 0 auto;
    font-family: var(--font-family1);
    font-weight: 500;
    color: var(--color1);
    line-height: 1
}

    .wallSection .titleDiv .title br {
        display: none
    }

@media(min-width: 568px) {
    .wallSection .titleDiv .title br {
        display: block
    }
}

.wallSection .ctaDiv {
    margin: auto 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px
}

@media(min-width: 1024px) {
    .wallSection .ctaDiv {
        clear: both;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        width: 50%
    }
}

.wallSection .ctaDiv a {
    margin: 0
}

.wallSection .ctaDiv .outlinedBtn {
    color: var(--black);
    border: 1px solid var(--black)
}

.wallSection .content {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

@media(min-width: 1024px) {
    .wallSection .content {
        clear: both;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        width: 50%
    }
}

.wallSection .content p {
    margin: 0;
    font-size: .878rem;
    font-weight: 200;
    line-height: 1.8
}

.wallSection .content .ctaBanner {
    margin-top: .7075rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background: var(--color3);
    border: 1px solid rgba(0,128,0,.0666666667);
    padding: .7075rem;
    border-radius: var(--radius);
    overflow: hidden
}

@media(min-width: 1024px) {
    .wallSection .content .ctaBanner {
        padding: 1.413rem
    }
}

.wallSection .content .ctaBanner .ctaContent {
    z-index: 1
}

    .wallSection .content .ctaBanner .ctaContent .title {
        font-weight: 600;
        line-height: 1.1
    }

    .wallSection .content .ctaBanner .ctaContent p {
        margin-top: 5px;
        opacity: .7;
        font-size: 13px;
        font-weight: 600;
        line-height: 1.2
    }

    .wallSection .content .ctaBanner .ctaContent ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 5px;
        margin-top: .7075rem
    }

        .wallSection .content .ctaBanner .ctaContent ul li {
            font-size: 14px;
            font-weight: 400
        }

            .wallSection .content .ctaBanner .ctaContent ul li::before {
                content: "✓";
                color: var(--color1);
                margin-right: 8px;
                font-weight: 800
            }

.wallSection .content .ctaBanner .ctaMedia {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

    .wallSection .content .ctaBanner .ctaMedia img {
        height: 110%;
        width: auto;
        -o-object-fit: contain;
        object-fit: contain;
        -o-object-position: bottom right;
        object-position: bottom right
    }

.wallSection .media {
    width: 100%;
    border-radius: var(--radius);
    overflow: hidden
}

@media(min-width: 1024px) {
    .wallSection .media {
        width: 50%
    }
}

.wallSection .media img {
    width: 100%;
    height: 100%;
    aspect-ratio: 16/9;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center
}

.locationDetailsSection {
    background-color: var(--color3);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

    .locationDetailsSection .map {
        width: 100%;
        overflow: hidden;
        min-height: 400px
    }

@media(min-width: 1024px) {
    .locationDetailsSection .map {
        width: 40%
    }
}

.locationDetailsSection .map iframe {
    width: 100%;
    height: 100%
}

.locationDetailsSection .content {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%
}

@media(min-width: 1024px) {
    .locationDetailsSection .content {
        width: 60%;
        padding-left: var(--section-space-x)
    }
}

.locationDetailsSection .content .title {
    font-weight: 400
}

.locationDetailsSection .content .dropDownDiv .dropList {
    border-bottom: 1px solid rgba(0,0,0,.1725490196)
}

    .locationDetailsSection .content .dropDownDiv .dropList:nth-last-child(1) {
        border-bottom: none
    }

    .locationDetailsSection .content .dropDownDiv .dropList .dropBox .title {
        font-weight: 400
    }

    .locationDetailsSection .content .dropDownDiv .dropList .dropContent p {
        margin: 0
    }

.serviceCTASection {
    padding-bottom: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden
}

    .serviceCTASection .innerSection {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        background: #deffe4;
        background: linear-gradient(33deg, rgb(246, 255, 248) 0%, rgb(250, 250, 250) 73%);
        border-radius: var(--btnRadius);
        border: 1px solid var(--lightGray)
    }

@media(min-width: 1024px) {
    .serviceCTASection .innerSection {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }
}

.serviceCTASection .innerSection .content {
    padding: var(--section-space-x);
    width: 100%;
    z-index: 2;
    text-align: center
}

@media(min-width: 1024px) {
    .serviceCTASection .innerSection .content {
        width: calc(100% - 350px);
        text-align: left
    }
}

.serviceCTASection .innerSection .content .mainLabel {
    margin-bottom: 10px;
    color: var(--black)
}

.serviceCTASection .innerSection .content .title {
    font-weight: 400;
    color: var(--black);
    line-height: 1.3
}

    .serviceCTASection .innerSection .content .title span {
        font-weight: 500
    }

.serviceCTASection .innerSection .content p {
    max-width: 700px
}

.serviceCTASection .innerSection .content ul {
    margin: 0 auto;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 5px 0;
    text-align: left;
    margin-top: .7075rem;
    padding-left: 0
}

@media(min-width: 1024px) {
    .serviceCTASection .innerSection .content ul {
        margin: 0;
        margin-top: .7075rem
    }
}

.serviceCTASection .innerSection .content ul li {
    font-weight: 400
}

    .serviceCTASection .innerSection .content ul li::before {
        content: "✓";
        color: var(--color1);
        margin-right: 8px;
        font-weight: 800
    }

.serviceCTASection .innerSection .content .btnDiv {
    margin-top: 1.413rem;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media(min-width: 1024px) {
    .serviceCTASection .innerSection .content .btnDiv {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

.serviceCTASection .innerSection .content .btnDiv .outlinedBtn {
    color: var(--black)
}

.serviceCTASection .innerSection .media {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media(min-width: 1024px) {
    .serviceCTASection .innerSection .media {
        width: 350px
    }
}

.serviceCTASection .innerSection .media::after {
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 1;
    width: 100%;
    height: 80%;
    background: #40b657;
    background: radial-gradient(circle, #40b657 0%, #fafafa 78%)
}

.serviceCTASection .innerSection .media::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 75vh;
    height: 75vh;
    border-radius: 100%;
    background: #40b657;
    background: radial-gradient(circle, #40b657 0%, #fafafa 50%);
    opacity: .35
}

.serviceCTASection .innerSection .media img {
    margin: auto;
    margin-top: auto;
    -o-object-fit: contain;
    object-fit: contain
}

.loactionMainDetailsSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y)
}

    .loactionMainDetailsSection .innerSection {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .loactionMainDetailsSection .navListDiv {
        position: sticky;
        top: 60px;
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        z-index: 100;
        background: var(--white);
        margin-bottom: 1rem
    }

@media(min-width: 1024px) {
    .loactionMainDetailsSection .navListDiv {
        top: 67px
    }
}

.loactionMainDetailsSection .navListDiv .navList {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    width: 100%;
    padding-right: clamp(0px,(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(0px,(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    margin: 0 auto;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 5px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    padding-top: 1rem;
    padding-bottom: 1rem;
    overflow: auto
}

.loactionMainDetailsSection .navListDiv a {
    color: var(--gray);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .5px;
    padding: 10px 15px;
    background: var(--lightGray);
    border: 1px solid var(--lightGray);
    border-radius: var(--radius);
    white-space: noWrap;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

@media(min-width: 1280px) {
    .loactionMainDetailsSection .navListDiv a {
        font-size: .878rem
    }
}

.loactionMainDetailsSection .navListDiv a:hover {
    color: var(--black);
    background: var(--color3);
    border: 1px solid var(--color1)
}

.loactionMainDetailsSection .navListDiv .activeMenu {
    color: var(--white);
    background: var(--black)
}

    .loactionMainDetailsSection .navListDiv .activeMenu:hover {
        color: var(--white);
        background: var(--color1)
    }

.loactionMainDetailsSection .locationDetailsWrapper {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    display: none;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: unset
}

    .loactionMainDetailsSection .locationDetailsWrapper:nth-of-type(1) {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

.loactionMainDetailsSection aside {
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: -webkit-max-content;
    height: -moz-max-content;
    height: max-content;
    background-color: var(--lightGray);
    border: 8px solid var(--white);
    border-radius: var(--radius);
    padding: 10px 0;
    -webkit-box-shadow: rgba(50,93,59,.11) 0px 50px 100px -20px,rgba(0,0,0,.103) 0px 30px 60px -30px;
    box-shadow: rgba(50,93,59,.11) 0px 50px 100px -20px,rgba(0,0,0,.103) 0px 30px 60px -30px;
    z-index: 1
}

@media(min-width: 1024px) {
    .loactionMainDetailsSection aside {
        width: 350px;
        min-width: 350px;
        position: sticky;
        top: 160px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

.loactionMainDetailsSection aside .scrollLink {
    font-size: .937rem;
    font-weight: 500;
    padding: 10px .7075rem;
    padding-left: 1.413rem;
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

    .loactionMainDetailsSection aside .scrollLink.activeScroll {
        color: var(--color1)
    }

    .loactionMainDetailsSection aside .scrollLink:nth-last-child(1) {
        border: none
    }

    .loactionMainDetailsSection aside .scrollLink::before {
        position: absolute;
        top: 20px;
        left: 15px;
        width: 5px;
        height: 5px;
        background-color: var(--color1);
        border-radius: var(--radius)
    }

    .loactionMainDetailsSection aside .scrollLink:hover {
        color: var(--color1)
    }

.loactionMainDetailsSection main {
    width: 100%;
    color: var(--black);
    background: var(--white)
}

@media(min-width: 1024px) {
    .loactionMainDetailsSection main {
        clear: both;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        width: calc(100% - 350px)
    }
}

.loactionMainDetailsSection main article {
    z-index: 1;
    border-bottom: 1px solid var(--borderGray);
    padding-bottom: 2rem;
    margin-bottom: 2rem
}

    .loactionMainDetailsSection main article .title {
        margin: 0;
        width: 100%;
        color: var(--color1);
        font-weight: 400
    }

    .loactionMainDetailsSection main article h3 {
        color: var(--darkGray);
        font-weight: 400;
        margin-top: 1.413rem;
        margin-bottom: 5px;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        gap: 5px
    }

        .loactionMainDetailsSection main article h3::before, .loactionMainDetailsSection main article h3::after {
            content: "";
            width: 10px;
            height: 10px;
            max-height: 10px;
            margin-top: 17px;
            max-height: 10px;
            border-radius: var(--radius)
        }

        .loactionMainDetailsSection main article h3::before {
            -webkit-box-ordinal-group: 3;
            -ms-flex-order: 2;
            order: 2;
            background: var(--color2)
        }

        .loactionMainDetailsSection main article h3::after {
            -webkit-box-ordinal-group: 2;
            -ms-flex-order: 1;
            order: 1;
            background: var(--color1);
            margin-right: 3px
        }

    .loactionMainDetailsSection main article p {
        opacity: .9;
        font-size: 14px;
        line-height: 1.8
    }

        .loactionMainDetailsSection main article p span {
            font-weight: 500
        }

    .loactionMainDetailsSection main article strong {
        font-weight: 600
    }

    .loactionMainDetailsSection main article ul {
        margin: .7075rem 0;
        padding-left: .7075rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 10px
    }

        .loactionMainDetailsSection main article ul li {
            font-size: 14px;
            list-style-type: disc;
            font-weight: 300;
            line-height: 1.8
        }

            .loactionMainDetailsSection main article ul li strong {
                font-size: 16px;
                font-weight: 500
            }

            .loactionMainDetailsSection main article ul li::marker {
                color: var(--gray)
            }

            .loactionMainDetailsSection main article ul li ul {
                margin: 0;
                margin-top: 10px
            }

                .loactionMainDetailsSection main article ul li ul li {
                    font-size: 14px;
                    font-weight: 400
                }

                    .loactionMainDetailsSection main article ul li ul li::marker {
                        color: var(--gray)
                    }

.loactionMainDetailsSection main .locationCardSlider {
    width: 100%;
    min-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: .7075rem 0
}

    .loactionMainDetailsSection main .locationCardSlider .slideControler {
        position: absolute;
        top: 150px;
        width: 100%;
        padding: .7075rem 0
    }

@media(min-width: 1024px) {
    .loactionMainDetailsSection main .locationCardSlider .slideControler {
        top: 280px
    }
}

.loactionMainDetailsSection main .locationCardSlider .slideControler div {
    position: sticky;
    top: 80vh;
    width: 60px;
    height: 60px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    border-radius: 0 var(--btnRadius) var(--btnRadius) 0;
    color: var(--white);
    background: var(--black);
    border: 2px solid var(--color1);
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

    .loactionMainDetailsSection main .locationCardSlider .slideControler div:nth-child(1) {
        border-left: none
    }

    .loactionMainDetailsSection main .locationCardSlider .slideControler div:nth-child(2) {
        float: right;
        border-right: none;
        border-radius: var(--btnRadius) 0 0 var(--btnRadius)
    }

    .loactionMainDetailsSection main .locationCardSlider .slideControler div:hover {
        background-color: var(--color1)
    }

    .loactionMainDetailsSection main .locationCardSlider .slideControler div i {
        margin: auto;
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
    }

.loactionMainDetailsSection main .locationCardSlider .slideContainer {
    overflow: hidden
}

.loactionMainDetailsSection main .locationCardSlider .slideWrapper {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media(min-width: 1280px) {
    .loactionMainDetailsSection main .locationCardSlider .slideWrapper {
        padding: 0
    }
}

.loactionMainDetailsSection main .locationCardSlider .locationCard {
    width: 100%;
    min-width: 100%;
    padding: 5px;
    border-radius: var(--radius);
    background: var(--color3)
}

    .loactionMainDetailsSection main .locationCardSlider .locationCard .media {
        border-radius: calc(var(--radius) - 5px);
        overflow: hidden
    }

        .loactionMainDetailsSection main .locationCardSlider .locationCard .media::before {
            content: "";
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 50%;
            z-index: 2;
            background: #010101;
            background: -webkit-gradient(linear, left bottom, left top, from(rgb(1, 1, 1)), to(rgba(255, 255, 255, 0)));
            background: linear-gradient(0deg, rgb(1, 1, 1) 0%, rgba(255, 255, 255, 0) 100%);
            pointer-events: none;
            opacity: .8
        }

    .loactionMainDetailsSection main .locationCardSlider .locationCard img {
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center;
        aspect-ratio: 16/9
    }

    .loactionMainDetailsSection main .locationCardSlider .locationCard .content {
        padding: 1rem;
        padding-top: 0
    }

        .loactionMainDetailsSection main .locationCardSlider .locationCard .content .cardTitle {
            position: absolute;
            top: 0;
            -webkit-transform: translateY(-150%);
            transform: translateY(-150%);
            z-index: 2;
            color: var(--white);
            margin: 0;
            border: none
        }

        .loactionMainDetailsSection main .locationCardSlider .locationCard .content p {
            margin: 0;
            font-weight: 500
        }

        .loactionMainDetailsSection main .locationCardSlider .locationCard .content .dropDownDiv {
            margin: 0;
            margin-top: .7075rem;
            padding: 0;
            gap: 0
        }

            .loactionMainDetailsSection main .locationCardSlider .locationCard .content .dropDownDiv .dropList {
                border-bottom: 1px solid rgba(0,0,0,.0823529412)
            }

                .loactionMainDetailsSection main .locationCardSlider .locationCard .content .dropDownDiv .dropList:nth-last-child(1) {
                    border-bottom: none
                }

                .loactionMainDetailsSection main .locationCardSlider .locationCard .content .dropDownDiv .dropList .dropBox {
                    padding: 10px 0
                }

                    .loactionMainDetailsSection main .locationCardSlider .locationCard .content .dropDownDiv .dropList .dropBox .title {
                        color: var(--black)
                    }

                .loactionMainDetailsSection main .locationCardSlider .locationCard .content .dropDownDiv .dropList .dropContent {
                    background-color: rgba(14,14,14,.0745098039);
                    padding: 1rem;
                    border-radius: calc(var(--radius) - 1rem)
                }

                    .loactionMainDetailsSection main .locationCardSlider .locationCard .content .dropDownDiv .dropList .dropContent p {
                        margin: 0;
                        font-size: 14px;
                        line-height: 1.5
                    }

.conclusionSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    background: var(--color3)
}

    .conclusionSection .innerSection {
        text-align: center;
        max-width: 800px
    }

        .conclusionSection .innerSection .title {
            width: 100%;
            color: var(--color1);
            text-align: center;
            margin-bottom: .7075rem
        }

        .conclusionSection .innerSection .cardTitle {
            width: 100%;
            margin-top: 1.413rem;
            font-weight: 400
        }

        .conclusionSection .innerSection p {
            line-height: 1.5
        }

        .conclusionSection .innerSection .card {
            width: 100%;
            padding: .7075rem;
            border-radius: var(--radius);
            background-color: var(--white);
            border: 1px solid var(--color1)
        }

@media(min-width: 768px) {
    .conclusionSection .innerSection .card {
        width: 49%;
        padding: 1.413rem
    }
}

.conclusionSection .innerSection .card .cardTitle {
    font-weight: 400
}

.otherZonesSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    background: var(--lightGray)
}

    .otherZonesSection .innerSection .title {
        width: 100%;
        text-align: center
    }

    .otherZonesSection .innerSection menu {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: .7075rem;
        border-bottom: 1px solid var(--borderGray)
    }

        .otherZonesSection .innerSection menu:nth-last-child(1) {
            border: none;
            padding-bottom: 0
        }

        .otherZonesSection .innerSection menu .menuTitle {
            margin: 0;
            width: 100%;
            margin-bottom: .35375rem;
            padding-left: 10px;
            line-height: 1;
            border-left: 3px solid var(--color1)
        }

        .otherZonesSection .innerSection menu a {
            width: 100%;
            font-size: 12px;
            font-weight: 500;
            display: inline-block;
            padding: 5px 0;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

@media(min-width: 360px) {
    .otherZonesSection .innerSection menu a {
        width: 50%
    }
}

@media(min-width: 568px) {
    .otherZonesSection .innerSection menu a {
        width: 33.33%
    }
}

@media(min-width: 768px) {
    .otherZonesSection .innerSection menu a {
        width: 25%
    }
}

@media(min-width: 1024px) {
    .otherZonesSection .innerSection menu a {
        width: 20%
    }
}

@media(min-width: 1280px) {
    .otherZonesSection .innerSection menu a {
        width: 12%
    }
}

.otherZonesSection .innerSection menu a:hover {
    color: var(--color1)
}

.newsSetion {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    margin-top: 100px
}

    .newsSetion h1, .newsSetion .blogTitle {
        color: var(--color1);
        padding-bottom: 1.413rem;
        margin-bottom: 1.413rem;
        border-bottom: 1px solid var(--borderGray)
    }

#form1 {
    width: 100%;
    display: block !important
}

.contentCardSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 20px 0;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

    .contentCardSection .card {
        margin: 0;
        width: 100%;
        max-width: 100%;
        min-width: auto;
        background: var(--lightGray);
        border-radius: var(--radius)
    }

@media(min-width: 768px) {
    .contentCardSection .card {
        width: 49%
    }
}

.contentCardSection .card:hover {
    -webkit-box-shadow: none;
    box-shadow: none
}

.contentCardSection .card .content {
    padding: 1.413rem
}

    .contentCardSection .card .content .title {
        color: var(--color1);
        font-family: var(--font-family1);
        border-bottom: 1px solid var(--borderGray);
        padding-bottom: .5rem;
        margin-bottom: .5rem
    }

.packageSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    background: var(--color3);
    overflow: unset
}

@media(min-width: 1024px) {
    .packageSection.packageSectionIntro .cardDiv .card .titleDiv {
        background: var(--white);
        -webkit-box-shadow: rgba(0,0,0,.048) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px;
        box-shadow: rgba(0,0,0,.048) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px
    }
}

.packageSection .titleDiv {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

@media(min-width: 768px) {
    .packageSection .titleDiv {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }
}

.packageSection .titleDiv .title {
    max-width: 450px;
    font-family: var(--font-family1)
}

.packageSection .titleDiv p {
    max-width: 450px
}

@media(min-width: 768px) {
    .packageSection .titleDiv p {
        padding-left: 1.413rem;
        margin-left: 1.413rem;
        border-left: 1px solid var(--color1)
    }
}

.packageSection .cardDiv {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 20px 2%
}

@media(min-width: 1024px) {
    .packageSection .cardDiv {
        gap: 0;
        -webkit-box-align: unset;
        -ms-flex-align: unset;
        align-items: unset;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        background: var(--white);
        border-radius: var(--radius)
    }
}

.packageSection .cardDiv .card {
    margin: 0;
    min-width: unset;
    width: 100%;
    max-width: unset;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background: var(--white);
    border-radius: var(--radius);
    padding: 2px 0;
    text-align: center
}

@media(min-width: 568px) {
    .packageSection .cardDiv .card {
        width: 49%
    }
}

@media(min-width: 768px) {
    .packageSection .cardDiv .card {
        width: 31%
    }
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card {
        width: 24%;
        border-radius: 0;
        border-left: 1px solid var(--borderGray)
    }
}

.packageSection .cardDiv .card:nth-child(1) {
    border: none
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card:nth-child(1) {
        width: 30%;
        border-radius: var(--radius) 0 0 var(--radius)
    }
}

.packageSection .cardDiv .card:nth-child(1) .details {
    text-align: center
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card:nth-child(1) .details {
        text-align: left
    }
}

.packageSection .cardDiv .card:nth-child(1) .details .title {
    color: var(--color1)
}

.packageSection .cardDiv .card:nth-child(1) .details .description {
    margin-top: 10px;
    color: var(--darkGray);
    font-weight: 500
}

.packageSection .cardDiv .card:nth-child(1) .dropDownDiv {
    display: none
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card:nth-child(1) .dropDownDiv {
        display: block
    }
}

.packageSection .cardDiv .card:nth-child(1) .dropDownDiv .dropList .dropContent {
    text-align: left
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card:nth-child(1) .dropDownDiv .dropList .dropContent .listTitle {
        color: var(--color1);
        font-weight: 500
    }
}

.packageSection .cardDiv .card:nth-child(1) .dropDownDiv .dropList .dropContent ul li {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

    .packageSection .cardDiv .card:nth-child(1) .dropDownDiv .dropList .dropContent ul li .text {
        display: block;
        font-weight: 500
    }

.packageSection .cardDiv .card:hover {
    -webkit-box-shadow: none;
    box-shadow: none
}

.packageSection .cardDiv .card.highlight {
    padding: 2px
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card.highlight {
        border: none !important;
        border-radius: var(--radius)
    }
}

.packageSection .cardDiv .card.highlight::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 0;
    background-image: linear-gradient(45deg, #6dc036 40%, #b5f08e 60%);
    height: 100%;
    width: 100%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transform-origin: center;
    transform-origin: center;
    border-radius: var(--radius)
}

@-webkit-keyframes cardspin {
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes cardspin {
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

.packageSection .cardDiv .card .titleDiv {
    padding: .7075rem;
    padding-bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card .titleDiv {
        padding: 1.413rem;
        position: sticky;
        top: 67px;
        z-index: 10
    }
}

.packageSection .cardDiv .card .titleDiv .labelText {
    margin: 0;
    display: inline-block;
    color: var(--black);
    font-weight: 600;
    background: var(--white);
    color: var(--color1)
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card .titleDiv .labelText {
        position: absolute;
        top: 0;
        left: 50%;
        text-align: center;
        -webkit-transform: translate(-50%, -100%);
        transform: translate(-50%, -100%);
        font-weight: 300;
        background: var(--color1);
        color: var(--white);
        padding: 5px 15px;
        border-radius: 10px 10px 0 0
    }
}

.packageSection .cardDiv .card .titleDiv .title {
    line-height: 1;
    font-size: clamp(22.78125px,18.8433710526px + 0.0082039145*100vw,35.2512px)
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card .titleDiv .title {
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
    }
}

.packageSection .cardDiv .card .content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background: var(--white);
    border-radius: inherit
}

.packageSection .cardDiv .card .details {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    border-radius: calc(var(--radius) - 3px) calc(var(--radius) - 3px) 0 0;
    padding-top: 0 !important
}

.packageSection .cardDiv .card .dropDownDiv {
    margin-top: auto;
    border-radius: 0 0 calc(var(--radius) - 3px) calc(var(--radius) - 3px)
}

.packageSection .cardDiv .card .details, .packageSection .cardDiv .card .dropBox, .packageSection .cardDiv .card .dropContent ul li, .packageSection .cardDiv .card .dropContent .listTitle {
    padding: .7075rem
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card .details, .packageSection .cardDiv .card .dropBox, .packageSection .cardDiv .card .dropContent ul li, .packageSection .cardDiv .card .dropContent .listTitle {
        padding: 1.413rem
    }
}

.packageSection .cardDiv .card .description {
    min-height: 46px;
    color: var(--gray);
    margin-top: 0;
    font-weight: 400;
    line-height: 1.4;
    margin-bottom: 10px;
    margin-top: 10px
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card .description {
        margin-top: 0
    }
}

.packageSection .cardDiv .card .description span {
    color: var(--black);
    font-style: italic;
    font-weight: 500
}

.packageSection .cardDiv .card .priceDiv {
    margin-bottom: 1.413rem
}

.packageSection .cardDiv .card .priceList {
    margin: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    text-align: left;
    border-bottom: 1px solid var(--borderGray);
    padding: 5px 0
}

    .packageSection .cardDiv .card .priceList .label {
        margin: 0;
        color: var(--gray);
        font-size: .733rem;
        font-weight: 400;
        padding-right: 10px
    }

        .packageSection .cardDiv .card .priceList .label span {
            color: var(--darkGray);
            display: block;
            font-size: .667rem
        }

    .packageSection .cardDiv .card .priceList .valueDiv {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

        .packageSection .cardDiv .card .priceList .valueDiv div {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column
        }

            .packageSection .cardDiv .card .priceList .valueDiv div span {
                white-space: nowrap
            }

                .packageSection .cardDiv .card .priceList .valueDiv div span:nth-child(1) {
                    color: var(--color1);
                    font-size: .733rem
                }

                .packageSection .cardDiv .card .priceList .valueDiv div span:nth-child(2) {
                    font-weight: 500
                }

    .packageSection .cardDiv .card .priceList .price::before {
        content: "₹";
        margin-right: 2px
    }

    .packageSection .cardDiv .card .priceList .value {
        margin: 0;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        white-space: noWrap;
        font-family: var(--font-family1);
        font-weight: 500
    }

        .packageSection .cardDiv .card .priceList .value span {
            display: block
        }

.packageSection .cardDiv .card .btnDiv {
    margin-top: auto
}

    .packageSection .cardDiv .card .btnDiv a {
        width: 100%
    }

.packageSection .cardDiv .card .dropDownDiv .dropList .dropBox {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 10px
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card .dropDownDiv .dropList .dropBox {
        display: none
    }
}

.packageSection .cardDiv .card .dropDownDiv .dropList .dropBox .title {
    font-size: .937rem;
    color: var(--gray)
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card .dropDownDiv .dropList .dropContent {
        display: block
    }
}

.packageSection .cardDiv .card .dropDownDiv .dropList .dropContent .listTitle {
    color: var(--black);
    font-size: .878rem;
    text-transform: uppercase;
    font-weight: 400;
    letter-spacing: .5px;
    padding-top: .7075rem;
    padding-bottom: .7075rem;
    background: var(--color3);
    white-space: nowrap
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card .dropDownDiv .dropList .dropContent .listTitle {
        color: rgba(0,0,0,0)
    }
}

.packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
    height: 66px;
    border-bottom: 1px solid var(--borderGray)
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li:nth-child(even) {
    background: var(--lightGray)
}

.packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li:nth-last-child(1) {
    border-bottom: none
}

.packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li .text {
    font-size: .878rem;
    text-align: left
}

@media(min-width: 1024px) {
    .packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li .text {
        display: none;
        font-size: 1rem
    }
}

.packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li .green::before, .packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li .red::before, .packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li .na::before, .packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li .aa::before {
    font-family: var(--icon-style) !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    min-width: 20px;
    min-height: 20px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: 5px;
    border-radius: 100%;
    font-size: .667rem
}

.packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li .green::before {
    content: "";
    color: var(--color1);
    background: rgba(0,128,0,.1450980392)
}

.packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li .red::before {
    content: "";
    color: var(--red);
    background: rgba(128,0,21,.1450980392)
}

.packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li .na {
    font-size: .733rem;
    color: var(--gray)
}

.packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li .cost {
    background: #f4f0ec;
    color: #d26e2c;
    font-size: .733rem;
    padding: 3px 10px;
    border-radius: var(--radius)
}

.packageSection .cardDiv .card .dropDownDiv .dropList .dropContent ul li .value {
    min-width: 70px;
    margin: 0;
    font-weight: 500
}

.aboutGridSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: var(--section-space-y) 0
}

    .aboutGridSection.cityaboutGrid .content {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        text-align: center;
        background: #eaf0e8
    }

@media(min-width: 1024px) {
    .aboutGridSection.cityaboutGrid .content {
        width: 100%
    }
}

.aboutGridSection.cityaboutGrid .content .btnDiv {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media(min-width: 1024px) {
    .aboutGridSection.cityaboutGrid .cardDiv {
        width: 100%
    }
}

.aboutGridSection.cityaboutGrid .cardDiv .card {
    aspect-ratio: 3/2
}

@media(min-width: 568px) {
    .aboutGridSection.cityaboutGrid .cardDiv .card {
        width: 25%;
        min-width: 25%
    }
}

@media(min-width: 1280px) {
    .aboutGridSection.cityaboutGrid .cardDiv .card {
        width: 12.5%;
        min-width: 12.5%;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

.aboutGridSection .content {
    background: var(--color3);
    border-radius: var(--radius);
    text-align: center
}

@media(min-width: 1024px) {
    .aboutGridSection .content {
        width: 58%;
        text-align: left;
        padding-right: var(--section-space-x)
    }
}

.aboutGridSection .content .btnDiv {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media(min-width: 1024px) {
    .aboutGridSection .content .btnDiv {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
}

.aboutGridSection .cardDiv {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

@media(min-width: 1024px) {
    .aboutGridSection .cardDiv {
        width: 40%
    }
}

.aboutGridSection .cardDiv .card {
    width: 50%;
    min-width: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    aspect-ratio: 1/1;
    background: var(--white);
    outline: 1px solid var(--color3);
    border-radius: var(--radius);
    margin: 0;
    padding: .7075rem
}

@media(min-width: 568px) {
    .aboutGridSection .cardDiv .card {
        width: 25%;
        min-width: 25%
    }
}

@media(min-width: 1024px) {
    .aboutGridSection .cardDiv .card {
        width: 50%;
        min-width: 50%
    }
}

.aboutGridSection .cardDiv .card img {
    width: 60px
}

.aboutGridSection .cardDiv .card .title {
    margin-top: .7075rem;
    color: var(--color1)
}

.aboutGridSection .cardDiv .card p {
    color: var(--gray);
    margin-top: 0
}

.logoSlideSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-top: .7075rem;
    padding-bottom: 2rem;
    overflow: hidden;
    background: var(--white)
}

    .logoSlideSection:hover .logo img {
        opacity: 1 !important;
        -webkit-filter: none !important;
        filter: none !important
    }

    .logoSlideSection .innerSection {
        overflow: hidden
    }

    .logoSlideSection .title {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        color: var(--color1);
        font-family: var(--font-family1);
        font-size: .733rem;
        font-weight: 500;
        margin-bottom: 1rem;
        letter-spacing: 2px;
        text-transform: uppercase;
        text-align: center
    }

        .logoSlideSection .title::before, .logoSlideSection .title:after {
            content: "";
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            height: 1px;
            background-color: var(--borderGray);
            margin: 0 1rem
        }

    .logoSlideSection .logoSlider {
        width: 100%;
        height: 80px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        overflow: hidden
    }

        .logoSlideSection .logoSlider::before, .logoSlideSection .logoSlider::after {
            position: absolute;
            top: 0;
            z-index: 5;
            width: 100px;
            height: 100%
        }

@media(min-width: 768px) {
    .logoSlideSection .logoSlider::before, .logoSlideSection .logoSlider::after {
        width: 200px
    }
}

.logoSlideSection .logoSlider::before {
    left: 0;
    background: #fff;
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0.9836309524)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9836309524) 0%, rgba(255, 255, 255, 0) 100%)
}

.logoSlideSection .logoSlider::after {
    right: 0;
    background: #fff;
    background: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0.9836309524)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(-90deg, rgba(255, 255, 255, 0.9836309524) 0%, rgba(255, 255, 255, 0) 100%)
}

.logoSlideSection .logoSlider .logo {
    position: absolute;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 200px;
    height: 80px;
    margin-right: 0;
    will-change: transform
}

    .logoSlideSection .logoSlider .logo:hover::before {
        opacity: 1;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

    .logoSlideSection .logoSlider .logo::before {
        content: "Read More";
        position: absolute;
        top: 0;
        left: 0;
        z-index: 10;
        width: 100%;
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        color: var(--gray);
        font-size: .878rem;
        text-transform: uppercase;
        letter-spacing: 1px;
        background: hsla(0,0%,100%,.3098039216);
        backdrop-filter: blur(10px);
        border-radius: 100px;
        border: 1px solid var(--borderGray);
        opacity: 0;
        -webkit-transform: scale(1.01);
        transform: scale(1.01);
        cursor: pointer;
        -webkit-transition: var(--transition3);
        transition: var(--transition3)
    }

    .logoSlideSection .logoSlider .logo img {
        margin: auto;
        max-width: 200px;
        max-height: 60px;
        -o-object-fit: contain;
        object-fit: contain;
        will-change: transform;
        -webkit-transition: var(--transition2);
        transition: var(--transition2)
    }

@-webkit-keyframes loop {
    0% {
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(-200px);
        transform: translateX(-200px)
    }
}

@keyframes loop {
    0% {
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(-200px);
        transform: translateX(-200px)
    }
}

.logoSlideSection .logoSlider .logo:nth-of-type(1) {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-animation: loop 70s -483s linear infinite;
    animation: loop 70s -483s linear infinite
}

@keyframes loop {
    0% {
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(-200px);
        transform: translateX(-200px)
    }
}

.logoSlideSection .logoSlider .logo:nth-of-type(2) {
    -webkit-transform: translateX(200px);
    transform: translateX(200px);
    -webkit-animation: loop 70s -476s linear infinite;
    animation: loop 70s -476s linear infinite
}

@keyframes loop {
    0% {
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(-200px);
        transform: translateX(-200px)
    }
}

.logoSlideSection .logoSlider .logo:nth-of-type(3) {
    -webkit-transform: translateX(400px);
    transform: translateX(400px);
    -webkit-animation: loop 70s -469s linear infinite;
    animation: loop 70s -469s linear infinite
}

@keyframes loop {
    0% {
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(-200px);
        transform: translateX(-200px)
    }
}

.logoSlideSection .logoSlider .logo:nth-of-type(4) {
    -webkit-transform: translateX(600px);
    transform: translateX(600px);
    -webkit-animation: loop 70s -462s linear infinite;
    animation: loop 70s -462s linear infinite
}

@keyframes loop {
    0% {
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(-200px);
        transform: translateX(-200px)
    }
}

.logoSlideSection .logoSlider .logo:nth-of-type(5) {
    -webkit-transform: translateX(800px);
    transform: translateX(800px);
    -webkit-animation: loop 70s -455s linear infinite;
    animation: loop 70s -455s linear infinite
}

@keyframes loop {
    0% {
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(-200px);
        transform: translateX(-200px)
    }
}

.logoSlideSection .logoSlider .logo:nth-of-type(6) {
    -webkit-transform: translateX(1000px);
    transform: translateX(1000px);
    -webkit-animation: loop 70s -448s linear infinite;
    animation: loop 70s -448s linear infinite
}

@keyframes loop {
    0% {
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(-200px);
        transform: translateX(-200px)
    }
}

.logoSlideSection .logoSlider .logo:nth-of-type(7) {
    -webkit-transform: translateX(1200px);
    transform: translateX(1200px);
    -webkit-animation: loop 70s -441s linear infinite;
    animation: loop 70s -441s linear infinite
}

@keyframes loop {
    0% {
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(-200px);
        transform: translateX(-200px)
    }
}

.logoSlideSection .logoSlider .logo:nth-of-type(8) {
    -webkit-transform: translateX(1400px);
    transform: translateX(1400px);
    -webkit-animation: loop 70s -434s linear infinite;
    animation: loop 70s -434s linear infinite
}

@keyframes loop {
    0% {
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(-200px);
        transform: translateX(-200px)
    }
}

.logoSlideSection .logoSlider .logo:nth-of-type(9) {
    -webkit-transform: translateX(1600px);
    transform: translateX(1600px);
    -webkit-animation: loop 70s -427s linear infinite;
    animation: loop 70s -427s linear infinite
}

@keyframes loop {
    0% {
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(-200px);
        transform: translateX(-200px)
    }
}

.logoSlideSection .logoSlider .logo:nth-of-type(10) {
    -webkit-transform: translateX(1800px);
    transform: translateX(1800px);
    -webkit-animation: loop 70s -420s linear infinite;
    animation: loop 70s -420s linear infinite
}

.journeySliderSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: hidden;
    color: var(--white);
    background: var(--color1)
}

@media(min-width: 1024px) {
    .journeySliderSection {
        padding-left: 0;
        padding-right: 0
    }
}

.journeySliderSection::before, .journeySliderSection::after {
    content: "";
    position: absolute;
    top: 0;
    z-index: 4;
    width: 50px;
    height: 100%;
    background: inherit
}

@media(min-width: 1024px) {
    .journeySliderSection::before, .journeySliderSection::after {
        width: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%)
    }
}

.journeySliderSection::before {
    left: 0;
    background: -webkit-gradient(linear, left top, right top, from(var(--color1)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(90deg, var(--color1) 0%, rgba(255, 255, 255, 0) 100%)
}

@media(min-width: 1024px) {
    .journeySliderSection::before {
        background: -webkit-gradient(linear, left top, right top, color-stop(5%, var(--color1)), to(rgba(255, 255, 255, 0)));
        background: linear-gradient(90deg, var(--color1) 5%, rgba(255, 255, 255, 0) 100%)
    }
}

.journeySliderSection::after {
    content: "";
    right: 0;
    background: -webkit-gradient(linear, right top, left top, color-stop(5%, var(--color1)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(-90deg, var(--color1) 5%, rgba(255, 255, 255, 0) 100%)
}

.journeySliderSection .bgText {
    position: absolute;
    left: 50%;
    top: 0;
    z-index: 1;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    line-height: 1;
    margin: 0 auto;
    padding: 0 .75vw;
    color: inherit;
    font-family: var(--font-family1);
    font-size: 10vw;
    font-weight: 800;
    letter-spacing: -0.3vw;
    text-transform: uppercase;
    white-space: nowrap;
    opacity: .045
}

.journeySliderSection .heading {
    color: var(--white);
    font-family: var(--font-family1);
    font-weight: 200
}

.journeySliderSection .titleDiv {
    color: inherit;
    margin-bottom: 1.413rem
}

@media(min-width: 1024px) {
    .journeySliderSection .titleDiv {
        width: 40%;
        clear: both;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%)
    }
}

.journeySliderSection .titleDiv .title {
    color: hsla(0,0%,100%,.5568627451)
}

    .journeySliderSection .titleDiv .title span {
        display: block;
        color: var(--white)
    }

.journeySliderSection .titleDiv p {
    color: inherit;
    opacity: .8
}

.journeySliderSection .cardWrapper {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: .7075rem;
    background: inherit;
    padding-left: 5px;
    overflow: hidden
}

@media(min-width: 1024px) {
    .journeySliderSection .cardWrapper {
        width: 60%;
        clear: both;
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%)
    }
}

.journeySliderSection .cardWrapper .cardSlider {
    width: 100%;
    z-index: 4;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0
}

    .journeySliderSection .cardWrapper .cardSlider .journeyCard {
        min-width: 100%;
        padding: 0;
        background: rgba(0,0,0,0);
        margin: 0;
        border: none
    }

        .journeySliderSection .cardWrapper .cardSlider .journeyCard:hover {
            -webkit-box-shadow: none;
            box-shadow: none
        }

        .journeySliderSection .cardWrapper .cardSlider .journeyCard svg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%
        }

            .journeySliderSection .cardWrapper .cardSlider .journeyCard svg circle {
                fill: var(--color1)
            }

        .journeySliderSection .cardWrapper .cardSlider .journeyCard .content {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            text-align: center
        }

            .journeySliderSection .cardWrapper .cardSlider .journeyCard .content .yearDiv, .journeySliderSection .cardWrapper .cardSlider .journeyCard .content .details {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                -ms-flex-direction: column;
                flex-direction: column;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-flex: 1;
                -ms-flex: 1;
                flex: 1;
                padding: .7075rem 1.413rem
            }

            .journeySliderSection .cardWrapper .cardSlider .journeyCard .content .yearDiv {
                border-bottom: 2px solid hsla(0,0%,100%,.2039215686)
            }

                .journeySliderSection .cardWrapper .cardSlider .journeyCard .content .yearDiv .year {
                    font-family: var(--font-family1)
                }

                .journeySliderSection .cardWrapper .cardSlider .journeyCard .content .yearDiv p {
                    margin-top: 0;
                    color: var(--borderGray);
                    font-weight: 500;
                    text-transform: uppercase;
                    letter-spacing: 2px
                }

            .journeySliderSection .cardWrapper .cardSlider .journeyCard .content .details .title {
                color: var(--white);
                font-family: var(--font-family1);
                font-weight: 400
            }

            .journeySliderSection .cardWrapper .cardSlider .journeyCard .content .details p {
                font-weight: 400
            }

.journeySliderSection .arrowDiv {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px
}

@media(min-width: 1024px) {
    .journeySliderSection .arrowDiv {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.journeySliderSection .arrow {
    z-index: 10;
    width: 50px;
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--black);
    border-radius: 100%;
    border: 1px solid var(--borderGray);
    background-color: var(--lightGray);
    cursor: pointer;
    -webkit-transition: var(--transition2);
    transition: var(--transition2)
}

@media(min-width: 768px) {
    .journeySliderSection .arrow {
        width: 65px;
        height: 65px
    }
}

.journeySliderSection .arrow:hover {
    background-color: var(--color2);
    border: 1px solid var(--color2);
    -webkit-box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px;
    box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px
}

    .journeySliderSection .arrow:hover i {
        color: var(--white)
    }

.journeySliderSection .arrow i {
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    margin: auto;
    cursor: pointer;
    -webkit-transition: var(--transition2);
    transition: var(--transition2)
}

.profileSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y)
}

    .profileSection .innerSection {
        color: var(--white);
        background: var(--black);
        border-radius: var(--radius);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center
    }

@media(min-width: 1024px) {
    .profileSection .innerSection {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
    }
}

.profileSection .content {
    width: 100%;
    padding: 1.413rem
}

@media(min-width: 1024px) {
    .profileSection .content {
        width: calc(100% - 300px)
    }
}

.profileSection .content .label {
    margin: 0;
    color: var(--color2)
}

.profileSection .content .title {
    font-weight: 300
}

.profileSection .content .quote {
    margin-top: 1rem;
    color: var(--borderGray);
    font-family: var(--font-family2);
    font-weight: 200
}

.profileSection .content .text {
    margin-top: 5px;
    color: var(--borderGray)
}

.profileSection .content p {
    color: var(--textGray)
}

.profileSection .media {
    width: 100%;
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media(min-width: 768px) {
    .profileSection .media {
        width: auto;
        padding-right: var(--section-space-x)
    }
}

.profileSection .media img {
    margin: auto;
    width: 300px;
    height: 300px;
    border-radius: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border: 10px solid var(--darkGray)
}

.cardSliderSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    overflow: hidden;
    color: var(--black);
    background: var(--lightGray)
}

    .cardSliderSection::before, .cardSliderSection::after {
        content: "";
        position: absolute;
        top: 0;
        z-index: 4;
        width: 50px;
        height: 100%;
        background: inherit
    }

@media(min-width: 1024px) {
    .cardSliderSection::before, .cardSliderSection::after {
        width: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%)
    }
}

.cardSliderSection::before {
    left: 0;
    background: -webkit-gradient(linear, left top, right top, from(var(--lightGray)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(90deg, var(--lightGray) 0%, rgba(255, 255, 255, 0) 100%)
}

@media(min-width: 1024px) {
    .cardSliderSection::before {
        background: -webkit-gradient(linear, left top, right top, color-stop(5%, var(--lightGray)), to(rgba(255, 255, 255, 0)));
        background: linear-gradient(90deg, var(--lightGray) 5%, rgba(255, 255, 255, 0) 100%)
    }
}

.cardSliderSection::after {
    content: "";
    right: 0;
    background: -webkit-gradient(linear, right top, left top, color-stop(5%, var(--lightGray)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(-90deg, var(--lightGray) 5%, rgba(255, 255, 255, 0) 100%)
}

.cardSliderSection .bgText {
    position: absolute;
    left: 50%;
    top: 0;
    z-index: 1;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    line-height: 1;
    margin: 0 auto;
    padding: 0 .75vw;
    color: inherit;
    font-family: var(--font-family1);
    font-size: 10vw;
    font-weight: 800;
    letter-spacing: -0.3vw;
    text-transform: uppercase;
    white-space: nowrap;
    opacity: .045
}

.cardSliderSection .heading {
    color: var(--white);
    font-family: var(--font-family1);
    font-weight: 200
}

.cardSliderSection .titleDiv {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    color: inherit;
    margin-bottom: 1.413rem
}

    .cardSliderSection .titleDiv .title {
        margin: 0;
        color: inherit;
        font-family: var(--font-family1)
    }

    .cardSliderSection .titleDiv p {
        margin: 0;
        color: inherit;
        opacity: .8
    }

@media(min-width: 1024px) {
    .cardSliderSection .titleDiv p {
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
    }
}

.cardSliderSection .cardWrapper {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: .7075rem;
    background: inherit;
    padding-bottom: 0;
    overflow: unset
}

    .cardSliderSection .cardWrapper .cardSlider {
        width: 100%;
        z-index: 4;
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: 1.413rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 0;
        overflow: unset
    }

        .cardSliderSection .cardWrapper .cardSlider .propertyCard, .cardSliderSection .cardWrapper .cardSlider .videoCard {
            min-width: 100%;
            margin: 0 8px
        }

@media(min-width: 768px) {
    .cardSliderSection .cardWrapper .cardSlider .propertyCard, .cardSliderSection .cardWrapper .cardSlider .videoCard {
        min-width: 50%
    }
}

@media(min-width: 1024px) {
    .cardSliderSection .cardWrapper .cardSlider .propertyCard, .cardSliderSection .cardWrapper .cardSlider .videoCard {
        min-width: 26%
    }
}

.cardSliderSection .arrow {
    position: absolute;
    bottom: 50%;
    z-index: 10;
    width: 50px;
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--white);
    border-radius: 100%;
    border: 5px solid var(--white);
    background-color: var(--color1);
    cursor: pointer;
    -webkit-transition: var(--transition2);
    transition: var(--transition2);
    -webkit-box-shadow: rgba(0,0,0,.1) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px;
    box-shadow: rgba(0,0,0,.1) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px
}

@media(min-width: 768px) {
    .cardSliderSection .arrow {
        width: 65px;
        height: 65px
    }
}

.cardSliderSection .arrow:nth-of-type(1) {
    left: var(--section-space-x);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.cardSliderSection .arrow:nth-of-type(2) {
    right: var(--section-space-x);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.cardSliderSection .arrow:hover {
    background-color: var(--color2);
    border: 1px solid var(--color2);
    -webkit-box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px;
    box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px
}

    .cardSliderSection .arrow:hover i {
        color: var(--white)
    }

.cardSliderSection .arrow i {
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    margin: auto;
    cursor: pointer;
    -webkit-transition: var(--transition2);
    transition: var(--transition2)
}

@media(min-width: 768px) {
    .listViewContainer .propertyCard {
        max-width: 100%;
        min-width: 500px !important;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }

        .listViewContainer .propertyCard .media {
            width: 50%
        }

            .listViewContainer .propertyCard .media img {
                width: 100%;
                height: 100%;
                aspect-ratio: unset
            }

        .listViewContainer .propertyCard .content {
            width: 50%
        }
}

.propertyCard {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    max-width: 300px;
    background: var(--white);
    border-radius: var(--radius);
    padding: 5px;
    border: 1px solid var(--lightGray);
    cursor: pointer;
    -webkit-transition: var(--transition3);
    transition: var(--transition3)
}

    .propertyCard:hover {
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px);
        -webkit-box-shadow: rgba(73,93,50,.096) 0px 30px 60px -12px,rgba(0,17,1,.041) 0px 18px 36px -18px;
        box-shadow: rgba(73,93,50,.096) 0px 30px 60px -12px,rgba(0,17,1,.041) 0px 18px 36px -18px;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

    .propertyCard .media {
        border-radius: calc(var(--radius) - 5px);
        overflow: hidden
    }

        .propertyCard .media img {
            aspect-ratio: 3/2;
            -o-object-fit: cover;
            object-fit: cover;
            -o-object-position: center;
            object-position: center;
            overflow: hidden
        }

    .propertyCard .content {
        padding: 1.413rem .5rem;
        text-align: center
    }

        .propertyCard .content .label {
            margin: 0;
            margin-bottom: 5px;
            color: var(--color1);
            font-size: .733rem;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 1px
        }

        .propertyCard .content .title {
            line-height: 1;
            font-family: var(--font-family1);
            font-weight: 400;
            margin-bottom: .7075rem;
            padding-bottom: .7075rem
        }

            .propertyCard .content .title::before {
                content: "₹";
                position: absolute;
                bottom: 0;
                left: 0;
                width: 100%;
                height: 1px;
                background: #fff;
                background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(50%, rgb(0, 0, 0)), to(rgba(255, 255, 255, 0)));
                background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgb(0, 0, 0) 50%, rgba(255, 255, 255, 0) 100%);
                opacity: .1
            }

        .propertyCard .content .price {
            margin: 0 auto;
            display: inline-block;
            margin-top: auto
        }

            .propertyCard .content .price::before {
                content: "₹";
                margin-right: 5px
            }

        .propertyCard .content .location {
            margin: 0;
            color: var(--gray);
            font-size: .878rem;
            font-weight: 500
        }

        .propertyCard .content .listDiv {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            gap: 5px
        }

            .propertyCard .content .listDiv li {
                font-size: .733rem;
                font-weight: 500;
                padding: 2px 10px;
                background: var(--lightGray);
                border-radius: var(--radius)
            }

.contactPageSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: var(--section-space-y) 0;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

    .contactPageSection .content {
        width: 100%;
        background: var(--color3);
        border-radius: var(--radius);
        padding: var(--section-space-x);
        background: radial-gradient(at 98.6% 68.3%, #dbffd4 0px, transparent 50%),radial-gradient(at 4.8% 63.1%, #f6fff2 0px, transparent 50%),radial-gradient(at 7.8% 85.1%, #f3f8f2 0px, transparent 50%),radial-gradient(at 21% 80.7%, #f6f8f3 0px, transparent 50%),radial-gradient(at 64.3% 80.3%, #eaffe6 0px, transparent 50%);
        overflow: hidden;
        border: 1px solid rgba(0,128,0,.041)
    }

@media(min-width: 768px) {
    .contactPageSection .content {
        width: 50%
    }
}

.contactPageSection .content::before, .contactPageSection .content::after {
    content: "";
    position: absolute;
    width: 400px;
    height: 400px;
    border-radius: 100%
}

.contactPageSection .content::before {
    bottom: -20%;
    left: -30%;
    border: 20px solid green;
    -webkit-filter: blur(50px);
    filter: blur(50px)
}

.contactPageSection .content::after {
    bottom: -50%;
    right: -30%;
    border: 20px solid green;
    -webkit-filter: blur(40px);
    filter: blur(40px)
}

.contactPageSection .content .title {
    color: var(--color1);
    font-weight: 500;
    margin-bottom: .7075rem;
    letter-spacing: -0.1vw
}

.contactPageSection .content .label {
    margin-top: 1.413rem;
    color: var(--color1);
    font-weight: 500;
    margin-bottom: 5px;
    text-transform: uppercase;
    letter-spacing: 1px
}

.contactPageSection .content p {
    margin: 0;
    font-weight: 400
}

.contactPageSection .content a {
    display: block;
    padding: 5px 0
}

.contactPageSection .content .chatBtn {
    margin-top: 1.413rem;
    background: var(--white);
    border-radius: var(--btnRadius);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: 5px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 5px 20px;
    padding-left: 60px;
    -webkit-box-shadow: rgba(0,0,0,.048) 0px 10px 15px -3px,rgba(0,0,0,.05) 0px 4px 6px -2px;
    box-shadow: rgba(0,0,0,.048) 0px 10px 15px -3px,rgba(0,0,0,.05) 0px 4px 6px -2px
}

    .contactPageSection .content .chatBtn img {
        width: 40px;
        position: absolute;
        top: 50%;
        left: 5px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    .contactPageSection .content .chatBtn div {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 5px
    }

    .contactPageSection .content .chatBtn .text {
        color: var(--gray)
    }

    .contactPageSection .content .chatBtn .note {
        color: var(--gray);
        font-size: .733rem
    }

    .contactPageSection .content .chatBtn .number {
        font-weight: 600
    }

.contactPageSection .content .smLink {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 1.413rem;
    padding-top: 1.413rem;
    border-top: 1px solid var(--white)
}

    .contactPageSection .content .smLink a {
        width: 35px;
        height: 35px;
        display: inline-block;
        margin-left: .5rem;
        padding: 8px;
        border-radius: 100%;
        background: var(--white);
        border: 1px solid rgba(0,0,0,0);
        -webkit-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
        cursor: pointer
    }

@media(min-width: 1024px) {
    .contactPageSection .content .smLink a {
        width: 40px;
        height: 40px
    }
}

.contactPageSection .content .smLink a:hover {
    border: 1px solid var(--color1)
}

.contactPageSection .content .smLink a img {
    cursor: pointer
}

.contactPageSection .formDiv {
    margin: 0 auto;
    width: 100%;
    max-width: 500px;
    background: var(--white);
    border-radius: var(--radius)
}

@media(min-width: 768px) {
    .contactPageSection .formDiv {
        width: 50%;
        padding-left: var(--section-space-x)
    }
}

.contactPageSection .formDiv .title {
    margin-bottom: 1.413rem
}

.contactPageSection .formDiv .inputDiv:has(input:focus) i, .contactPageSection .formDiv .inputDiv:has(textarea:focus) i {
    color: var(--white);
    background: var(--color1)
}

.contactPageSection .formDiv .inputDiv:has(input:focus) label, .contactPageSection .formDiv .inputDiv:has(textarea:focus) label {
    color: var(--color1)
}

.contactPageSection .formDiv .inputDiv i {
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 2;
    width: 40px;
    height: 40px;
    border-radius: var(--btnRadius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--color1);
    background: var(--lightGray);
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.contactPageSection .formDiv .inputDiv label {
    display: block;
    margin: 0;
    left: 60px;
    white-space: wrap
}

    .contactPageSection .formDiv .inputDiv label span {
        margin-left: 10px;
        color: var(--color1)
    }

.contactPageSection .formDiv .inputDiv input:not([type=radio]):not([type=checkbox]), .contactPageSection .formDiv .inputDiv textarea {
    background: rgba(0,0,0,0);
    border-radius: 0;
    border-top: none;
    border-left: none;
    border-right: none;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    padding: .75rem 0;
    padding-left: 60px
}

    .contactPageSection .formDiv .inputDiv input:not([type=radio]):not([type=checkbox])::-webkit-input-placeholder, .contactPageSection .formDiv .inputDiv textarea::-webkit-input-placeholder {
        color: var(--textGray)
    }

    .contactPageSection .formDiv .inputDiv input:not([type=radio]):not([type=checkbox])::-moz-placeholder, .contactPageSection .formDiv .inputDiv textarea::-moz-placeholder {
        color: var(--textGray)
    }

    .contactPageSection .formDiv .inputDiv input:not([type=radio]):not([type=checkbox]):-ms-input-placeholder, .contactPageSection .formDiv .inputDiv textarea:-ms-input-placeholder {
        color: var(--textGray)
    }

    .contactPageSection .formDiv .inputDiv input:not([type=radio]):not([type=checkbox])::-ms-input-placeholder, .contactPageSection .formDiv .inputDiv textarea::-ms-input-placeholder {
        color: var(--textGray)
    }

    .contactPageSection .formDiv .inputDiv input:not([type=radio]):not([type=checkbox])::placeholder, .contactPageSection .formDiv .inputDiv textarea::placeholder {
        color: var(--textGray)
    }

.contactPageSection .formDiv .inputDiv input[type=checkbox], .contactPageSection .formDiv .inputDiv input[type=radio] {
    border-radius: 5px
}

.contactPageSection .formDiv [type=submit], .contactPageSection .formDiv .mainFillButton {
    font-family: var(--font-family);
    letter-spacing: 0;
    font-size: 1rem;
    text-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: var(--btnRadius)
}

.contactPageSection iframe {
    overflow: hidden;
    border-radius: var(--radius)
}

#verificationPopup .inputDiv:has(input:focus) i, #verificationPopup .inputDiv:has(textarea:focus) i {
    color: var(--white);
    background: var(--color1)
}

#verificationPopup .inputDiv:has(input:focus) label, #verificationPopup .inputDiv:has(textarea:focus) label {
    color: var(--color1)
}

#verificationPopup .inputDiv i {
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 2;
    width: 40px;
    height: 40px;
    border-radius: var(--btnRadius);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--color1);
    background: var(--lightGray);
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

#verificationPopup .inputDiv label {
    margin: 0;
    left: 60px
}

    #verificationPopup .inputDiv label span {
        font-weight: 600
    }

#verificationPopup .inputDiv input:not([type=radio]):not([type=checkbox]), #verificationPopup .inputDiv textarea {
    background: rgba(0,0,0,0);
    border-radius: 0;
    border-top: none;
    border-left: none;
    border-right: none;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    padding: .75rem 0;
    padding-left: 60px
}

    #verificationPopup .inputDiv input:not([type=radio]):not([type=checkbox])::-webkit-input-placeholder, #verificationPopup .inputDiv textarea::-webkit-input-placeholder {
        color: var(--textGray)
    }

    #verificationPopup .inputDiv input:not([type=radio]):not([type=checkbox])::-moz-placeholder, #verificationPopup .inputDiv textarea::-moz-placeholder {
        color: var(--textGray)
    }

    #verificationPopup .inputDiv input:not([type=radio]):not([type=checkbox]):-ms-input-placeholder, #verificationPopup .inputDiv textarea:-ms-input-placeholder {
        color: var(--textGray)
    }

    #verificationPopup .inputDiv input:not([type=radio]):not([type=checkbox])::-ms-input-placeholder, #verificationPopup .inputDiv textarea::-ms-input-placeholder {
        color: var(--textGray)
    }

    #verificationPopup .inputDiv input:not([type=radio]):not([type=checkbox])::placeholder, #verificationPopup .inputDiv textarea::placeholder {
        color: var(--textGray)
    }

#verificationPopup .inputDiv input[type=checkbox], #verificationPopup .inputDiv input[type=radio] {
    border-radius: 5px
}

#verificationPopup .inputDiv .messageBox {
    padding-left: 60px
}

#verificationPopup .btnDiv {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

    #verificationPopup .btnDiv input, #verificationPopup .btnDiv a, #verificationPopup .btnDiv button {
        margin: 0;
        width: 48%;
        border-radius: var(--btnRadius)
    }

.teamSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    margin: 0 auto;
    overflow: hidden
}

    .teamSection .titleDiv {
        padding-bottom: 2rem;
        text-align: center
    }

@media(min-width: 1024px) {
    .teamSection .titleDiv {
        padding-left: 0;
        padding-right: 0
    }
}

.teamSection .titleDiv p {
    margin: 0 auto;
    margin-top: 10px;
    max-width: 800px
}

.teamSection .titleDiv h5 {
    margin-top: 15px;
    color: var(--color1);
    font-family: var(--font-family2)
}

.teamSection .mediaContainer {
    width: 100%
}

.teamSection .mediaWrapper {
    width: 100%;
    padding-right: clamp(0px,(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(0px,(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    margin: 0 auto;
    width: 100%;
    display: grid;
    grid-template-columns: 50% auto auto;
    gap: 10px;
    padding: 0
}

    .teamSection .mediaWrapper .mediaFile {
        width: 100%;
        min-width: 100%;
        padding-top: 100%;
        overflow: hidden;
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1);
        overflow: hidden
    }

@media(min-width: 1024px) {
    .teamSection .mediaWrapper .mediaFile {
        min-width: auto;
        margin: 0
    }
}

.teamSection .mediaWrapper .mediaFile:nth-child(1) {
    width: 100%;
    grid-row-start: 1;
    grid-row-end: 3;
    border-radius: var(--radius)
}

.teamSection .mediaWrapper .mediaFile:nth-child(2) {
    border-radius: var(--radius) var(--radius) 0 0
}

.teamSection .mediaWrapper .mediaFile:nth-child(3) {
    border-radius: var(--radius) var(--radius) var(--radius) 0
}

.teamSection .mediaWrapper .mediaFile:nth-child(4) {
    border-radius: 0 0 var(--radius) var(--radius)
}

.teamSection .mediaWrapper .mediaFile:nth-child(5) {
    border-radius: 0 var(--radius) var(--radius) var(--radius)
}

.teamSection .mediaWrapper .mediaFile:nth-child(n+6) {
    display: none
}

.teamSection .mediaWrapper .mediaFile:hover img {
    -webkit-transform: scale(1.015);
    transform: scale(1.015)
}

.teamSection .mediaWrapper .mediaFile img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    cursor: pointer;
    -webkit-transition: all 1s linear;
    transition: all 1s linear
}

.teamSection .arrowDiv {
    position: absolute;
    top: 50%;
    width: 100%;
    display: none;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    pointer-events: none;
    -webkit-transform: translateY(-25px);
    transform: translateY(-25px)
}

@media(min-width: 1024px) {
    .teamSection .arrowDiv {
        position: relative;
        top: unset;
        -webkit-transform: none;
        transform: none
    }
}

.teamSection .arrowDiv .leftArrow {
    left: 0;
    border-radius: 0 2.83rem 2.83rem 0
}

.teamSection .arrowDiv .rightArrow {
    right: 0;
    border-radius: 2.83rem 0 0 2.83rem
}

.teamSection .arrowDiv .arrow {
    width: 50px;
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: .5rem;
    color: var(--white);
    background-color: rgba(0,0,0,.3921568627);
    pointer-events: all;
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    margin: 0
}

@media(min-width: 1024px) {
    .teamSection .arrowDiv .arrow {
        position: fixed;
        bottom: 50%;
        z-index: 999;
        -webkit-transform: translateY(25px);
        transform: translateY(25px)
    }
}

.teamSection .arrowDiv .arrow:hover img, .teamSection .arrowDiv .arrow:hover i {
    opacity: 1;
    -webkit-transform: scale(1.3);
    transform: scale(1.3)
}

.teamSection .arrowDiv .arrow i {
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.teamSection .arrowDiv .arrow img {
    width: 20px;
    opacity: .1;
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.teamSection .popupClose {
    position: fixed;
    top: 1rem;
    right: 1rem;
    width: 50px;
    height: 50px;
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 100%;
    background-color: rgba(26,26,26,.356);
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

    .teamSection .popupClose:hover {
        background-color: hsla(0,0%,100%,.329)
    }

        .teamSection .popupClose:hover i {
            color: var(--color1)
        }

    .teamSection .popupClose i {
        top: 2px;
        color: var(--white);
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

.teamSection .mediaPoupIntro {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 998;
    width: 100%;
    max-width: 100%;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: var(--black);
    --section-max-width: 800px
}

    .teamSection .mediaPoupIntro .mediaWrapper {
        margin: auto;
        width: 100%;
        min-width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 0
    }

        .teamSection .mediaPoupIntro .mediaWrapper .mediaFile {
            display: block;
            width: 100%;
            min-width: 100%;
            padding: 0;
            -o-object-fit: contain;
            object-fit: contain;
            border-radius: 0;
            padding: .5rem
        }

            .teamSection .mediaPoupIntro .mediaWrapper .mediaFile img {
                max-height: 70vh;
                max-width: 100%;
                position: relative;
                -o-object-fit: contain;
                object-fit: contain;
                border-radius: 0;
                overflow: hidden
            }

    .teamSection .mediaPoupIntro .popupClose {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .teamSection .mediaPoupIntro .arrowDiv {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

.sideFormContainer {
    --form-width: 350px;
    margin: 0 auto;
    width: 100%;
    max-width: var(--container-max-width);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: row !important;
    flex-direction: row !important;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: hidden
}

@media(min-width: 1024px) {
    .sideFormContainer {
        overflow: unset
    }
}

.sideFormContainer .wallImage {
    position: fixed;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 100%;
    max-width: var(--container-max-width);
    height: 80vh;
    max-height: 700px;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    overflow: hidden
}

.sideFormContainer .border {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 80vh;
    max-height: 700px
}

    .sideFormContainer .border::after {
        content: "";
        position: absolute;
        bottom: -100%;
        left: 0;
        width: 100%;
        height: 100%;
        background: var(--white)
    }

    .sideFormContainer .border::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 1;
        width: 100%;
        height: 100%;
        background: #fff;
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(90%, rgb(0, 3, 8)));
        background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgb(0, 3, 8) 90%)
    }

    .sideFormContainer .border img {
        position: absolute;
        bottom: -1px;
        left: 0;
        z-index: 1;
        width: 100%
    }

.enquiryForm {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-left: auto;
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    background: var(--white)
}

@media(min-width: 1024px) {
    .enquiryForm {
        padding-left: 0;
        position: sticky;
        top: 8%;
        right: 0;
        z-index: 2;
        width: calc(var(--form-width) + var(--section-space-x));
        margin-left: auto;
        background: rgba(0,0,0,0)
    }
}

.enquiryForm form {
    margin: 0 auto;
    width: 100%;
    max-width: var(--form-width);
    background: var(--color3);
    padding: 2rem;
    border-radius: var(--radius);
    border: 1px solid var(--color1)
}

    .enquiryForm form .title {
        width: 100%;
        text-align: center;
        color: var(--white);
        font-weight: 400;
        font-family: var(--font-family1);
        text-transform: uppercase;
        margin-bottom: .7075rem
    }

    .enquiryForm form .iconInput i {
        color: var(--color1)
    }

    .enquiryForm form .iconInput label {
        color: var(--white);
        font-weight: 200;
        letter-spacing: 1px
    }

    .enquiryForm form .iconInput input, .enquiryForm form .iconInput textarea, .enquiryForm form .iconInput select {
        color: var(--white);
        background: hsla(0,0%,100%,.0392156863) !important;
        border-color: hsla(0,0%,100%,.0941176471)
    }

    .enquiryForm form .btnDiv {
        margin-top: 0
    }

.pageBannerSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    max-height: 650px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center
}

    .pageBannerSection .innerSection {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        text-align: center;
        color: var(--white);
        background: var(--color1);
        border-radius: var(--radius)
    }

    .pageBannerSection .title {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin: 0 auto;
        color: var(--white);
        font-family: var(--font-family1);
        font-weight: 700;
        text-transform: uppercase;
        line-height: 1;
        z-index: 1;
        border-top: 1px solid hsla(0,0%,100%,.2);
        border-bottom: 1px solid hsla(0,0%,100%,.2);
        padding: 10px 0;
        text-align: center;
        color: var(--white)
    }

        .pageBannerSection .title img {
            width: 60px;
            height: 60px;
            border-radius: 100%;
            margin-right: 10px
        }

.logoGridSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-top: var(--section-space-y)
}

    .logoGridSection .media {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

        .logoGridSection .media .logo {
            aspect-ratio: 1/1;
            width: 33.3333%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            text-align: center;
            outline: 1px solid var(--lightGray);
            padding: 10px
        }

@media(min-width: 768px) {
    .logoGridSection .media .logo {
        width: 16.5%
    }
}

@media(min-width: 568px) {
    .logoGridSection .media .logo:nth-last-child(1) {
        outline: none
    }
}

.logoGridSection .media .logo:nth-child(even) {
    background: var(--lightGray)
}

.logoGridSection .media .logo img {
    -o-object-fit: contain;
    object-fit: contain;
    max-width: 150px;
    max-height: 100px
}

.logoGridSection .media .logo p {
    margin-top: 15px;
    color: var(--gray);
    font-size: .878rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px
}

.detailsSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    background-color: var(--white);
    z-index: 1
}

@media(min-width: 1024px) {
    .detailsSection {
        padding-right: calc(var(--form-width) + var(--section-space-x) + var(--section-space-x))
    }
}

.detailsSection .titleDiv {
    text-align: center
}

    .detailsSection .titleDiv .title {
        font-weight: 700;
        font-family: var(--font-family1);
        text-transform: uppercase
    }

    .detailsSection .titleDiv .subTitle {
        color: var(--color3);
        font-weight: 400
    }

        .detailsSection .titleDiv .subTitle span {
            font-weight: 600
        }

.detailsSection .details {
    padding-bottom: var(--section-space-y)
}

    .detailsSection .details h2, .detailsSection .details h3, .detailsSection .details h4, .detailsSection .details h5 {
        margin-top: .7075rem;
        border-left: 3px solid var(--color1);
        padding-left: 10px;
        font-weight: 600;
        line-height: 1
    }

        .detailsSection .details h2 + p, .detailsSection .details h3 + p, .detailsSection .details h4 + p, .detailsSection .details h5 + p {
            margin-top: 10px
        }

    .detailsSection .details p {
        font-weight: 500;
        line-height: 1.5
    }

    .detailsSection .details ul {
        min-width: 300px;
        display: inline-block;
        margin-top: .7075rem;
        padding: .7075rem;
        padding-left: 2rem;
        border-radius: var(--radius);
        background: var(--lightGray);
        border: 1px solid var(--borderGray)
    }

        .detailsSection .details ul li {
            font-weight: 600;
            list-style-position: outside;
            list-style-type: disc
        }

            .detailsSection .details ul li::marker {
                color: var(--color1)
            }

.detailsSection .shortItinerary {
    margin-top: .7075rem;
    background: var(--color5);
    border-radius: var(--radius);
    border: 1px solid var(--color2)
}

    .detailsSection .shortItinerary li {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 1rem;
        padding: 10px 1rem;
        border-bottom: 1px dashed var(--color2)
    }

        .detailsSection .shortItinerary li:nth-last-child(1) {
            border-bottom: none
        }

        .detailsSection .shortItinerary li .date {
            margin: 0;
            color: var(--color1);
            font-family: var(--font-family1);
            font-weight: 400;
            text-transform: uppercase;
            letter-spacing: -0.5px;
            padding-right: 10px;
            border-right: 1px solid var(--color2);
            white-space: noWrap
        }

            .detailsSection .shortItinerary li .date span {
                color: var(--color3);
                font-size: clamp(20.25px,17.3681052632px + 0.0060039474*100vw,29.376px);
                font-weight: 800;
                display: block
            }

        .detailsSection .shortItinerary li .plan {
            margin: 0;
            font-weight: 500
        }

.detailsSection .tableDiv {
    width: 100%;
    margin-top: .7075rem;
    border-collapse: separate;
    overflow-x: auto
}

    .detailsSection .tableDiv table tr {
        border-bottom: 1px solid var(--borderGray)
    }

        .detailsSection .tableDiv table tr:nth-child(even) {
            background: var(--lightGray)
        }

        .detailsSection .tableDiv table tr:nth-last-child(1) {
            text-align: right !important
        }

        .detailsSection .tableDiv table tr th {
            font-family: var(--font-family1)
        }

        .detailsSection .tableDiv table tr td, .detailsSection .tableDiv table tr th {
            padding-top: 15px;
            padding-bottom: 15px;
            font-weight: 500
        }

            .detailsSection .tableDiv table tr td:nth-child(1), .detailsSection .tableDiv table tr th:nth-child(1) {
                clear: both;
                padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%)
            }

            .detailsSection .tableDiv table tr td:nth-last-child(1), .detailsSection .tableDiv table tr th:nth-last-child(1) {
                clear: both;
                padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%)
            }

.detailsSection .tourInclusionDiv .tabMenuNav .tabMenuDiv .tabMenu {
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    font-weight: 600
}

.detailsSection .tourInclusionDiv .tabMenu1 {
    margin: 0 auto;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 3px;
    overflow-x: auto
}

    .detailsSection .tourInclusionDiv .tabMenu1 .tabMenu {
        display: inline-block;
        font-weight: 600;
        padding: 12px 1rem;
        background-color: var(--lightGray);
        border-radius: var(--btnRadius);
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

    .detailsSection .tourInclusionDiv .tabMenu1 .activeTabMenu {
        color: var(--white);
        background: var(--black);
        font-weight: 300;
        -webkit-transition: var(--transition2);
        transition: var(--transition2)
    }

.detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide {
    height: 0;
    overflow: hidden;
    padding: .7075rem;
    background-color: var(--color5);
    border-radius: var(--radius);
    opacity: 0
}

    .detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide:nth-child(1) {
        height: auto;
        opacity: 1
    }

    .detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide p {
        font-size: .937rem;
        font-weight: 500;
        line-height: 1.5;
        opacity: .9
    }

        .detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide p:nth-child(1) {
            margin-top: 0
        }

    .detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide .list {
        padding-left: .7075rem
    }

        .detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide .list li {
            list-style-position: outside;
            list-style-type: circle;
            padding: 5px 0;
            font-weight: 500
        }

            .detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide .list li::marker {
                color: var(--color1)
            }

    .detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide .cardList {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 15px 2%
    }

@media(min-width: 568px) {
    .detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide .cardList {
        gap: 15px
    }
}

.detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide .cardList li {
    width: 48%;
    padding: 1rem;
    border-radius: var(--radius);
    background: var(--white);
    text-align: center
}

@media(min-width: 568px) {
    .detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide .cardList li {
        width: 160px
    }
}

.detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide .cardList li img {
    margin: 0 auto;
    margin-bottom: 1rem;
    width: 50px
}

.detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide .cardList li h5 {
    color: var(--color1);
    font-weight: 700;
    margin-bottom: 5px
}

.detailsSection .tourInclusionDiv .tabBarWrapper .tabBarSlide .cardList li p {
    margin: 0;
    font-weight: 600;
    line-height: 1.1
}

.detailsSection .ItinerarySection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    background-color: var(--white);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

    .detailsSection .ItinerarySection .heading {
        width: 100%;
        color: var(--black);
        font-family: var(--font-family1);
        font-weight: 400;
        text-align: center;
        margin-bottom: 2rem;
        line-height: 1;
        z-index: 1;
        text-align: center;
        letter-spacing: -0.05rem
    }

@media(min-width: 768px) {
    .detailsSection .ItinerarySection .heading {
        letter-spacing: -0.1rem
    }
}

.detailsSection .ItinerarySection .heading span {
    font-weight: 600
}

    .detailsSection .ItinerarySection .heading span img {
        position: absolute;
        bottom: -7px;
        left: 0;
        width: 100%;
        z-index: -1;
        -webkit-filter: hue-rotate(131deg);
        filter: hue-rotate(131deg)
    }

.detailsSection .ItinerarySection .listContainer {
    width: 100%;
    max-width: 700px
}

    .detailsSection .ItinerarySection .listContainer .dropList {
        width: 100%;
        border-bottom: 1px solid var(--borderGray)
    }

        .detailsSection .ItinerarySection .listContainer .dropList:hover .title {
            color: var(--color1)
        }

        .detailsSection .ItinerarySection .listContainer .dropList .dropBox {
            width: 100%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -ms-flex-pack: justify;
            justify-content: space-between;
            padding: .7075rem 0;
            cursor: pointer
        }

            .detailsSection .ItinerarySection .listContainer .dropList .dropBox * {
                cursor: pointer
            }

            .detailsSection .ItinerarySection .listContainer .dropList .dropBox .title {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                color: var(--color3);
                font-weight: 600;
                text-transform: uppercase
            }

                .detailsSection .ItinerarySection .listContainer .dropList .dropBox .title span {
                    color: var(--black);
                    font-weight: 800;
                    margin-left: 10px
                }

                .detailsSection .ItinerarySection .listContainer .dropList .dropBox .title img {
                    width: 25px;
                    margin-right: 10px
                }

            .detailsSection .ItinerarySection .listContainer .dropList .dropBox .dropIcon .dropRemove {
                display: none
            }

        .detailsSection .ItinerarySection .listContainer .dropList .dropContent {
            display: none;
            padding: 1rem;
            background-color: var(--lightGray);
            border-radius: var(--radius);
            margin-bottom: 1rem
        }

            .detailsSection .ItinerarySection .listContainer .dropList .dropContent p {
                font-weight: 500;
                opacity: .9;
                line-height: 1.5
            }

                .detailsSection .ItinerarySection .listContainer .dropList .dropContent p:nth-child(1) {
                    margin-top: 0
                }

            .detailsSection .ItinerarySection .listContainer .dropList .dropContent h5 {
                margin-top: 1rem
            }

.termsSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y)
}

    .termsSection .innerSection {
        padding-top: 100px
    }

@media(min-width: 1024px) {
    .termsSection .innerSection {
        padding: 0 .7075rem;
        padding-top: 100px
    }
}

.termsSection .innerSection h1 {
    color: var(--color1);
    font-weight: 300;
    padding: 2.83rem 0;
    border-bottom: 1px solid var(--borderGray)
}

.termsSection .innerSection p {
    font-size: .937rem
}

.termsSection .innerSection h4 {
    margin-top: .7075rem
}

.termsSection .innerSection h5 {
    border-left: 3px solid var(--color1);
    padding-left: 10px;
    margin-top: 2rem;
    margin-bottom: 1rem
}

.termsSection .innerSection ul {
    margin-top: 10px;
    padding-left: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 20px 0
}

    .termsSection .innerSection ul li {
        font-weight: 500;
        list-style-type: decimal;
        list-style-position: outside
    }

        .termsSection .innerSection ul li strong {
            font-weight: 500
        }

        .termsSection .innerSection ul li::marker {
            color: var(--textGray);
            font-weight: 400
        }

        .termsSection .innerSection ul li ul {
            margin: 10px 0;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            gap: 8px 0;
            padding-left: 1rem;
            list-style-position: outside
        }

            .termsSection .innerSection ul li ul li {
                margin: 0;
                font-weight: 300;
                list-style-type: disc;
                list-style-position: outside
            }

                .termsSection .innerSection ul li ul li::marker {
                    color: var(--textGray)
                }

.termsSection .innerSection address {
    font-style: normal;
    margin: 1rem 0;
    font-weight: 400
}

.boxContentSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y)
}

    .boxContentSection .innerSection {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 20px 2%
    }

        .boxContentSection .innerSection .content {
            width: 100%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            gap: 10px 0;
            padding: .7075rem;
            border-radius: var(--radius)
        }

@media(min-width: 1024px) {
    .boxContentSection .innerSection .content {
        width: 49%
    }
}

@media(min-width: 1800px) {
    .boxContentSection .innerSection .content {
        padding: 2rem
    }
}

.boxContentSection .innerSection .content:nth-child(1) {
    background-color: #fbf4ff
}

.boxContentSection .innerSection .content:nth-child(2) {
    background-color: var(--color3)
}

.boxContentSection .innerSection p {
    margin: 0
}

.boxContentSection .innerSection .title {
    line-height: 1
}

.boxContentSection .innerSection ul {
    padding-left: .7075rem
}

    .boxContentSection .innerSection ul li {
        list-style-type: disc;
        list-style-position: outside
    }

        .boxContentSection .innerSection ul li::marker {
            color: var(--color2)
        }

.faqPageSection {
    padding-top: var(--section-space-y);
    text-align: center;
    overflow: hidden
}

    .faqPageSection .searchSection {
        padding-top: 100px;
        background-size: cover;
        background-image: radial-gradient(at 98.6% 68.3%, #fff8e7 0px, transparent 50%),radial-gradient(at 4.8% 63.1%, #f8fafe 0px, transparent 50%),radial-gradient(at 7.8% 85.1%, #e7efff 0px, transparent 50%),radial-gradient(at 21% 80.7%, #ffe9ed 0px, transparent 50%),radial-gradient(at 64.3% 80.3%, #fceded 0px, transparent 50%)
    }

    .faqPageSection .content {
        z-index: 2;
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        color: var(--black)
    }

        .faqPageSection .content .label {
            margin: 0;
            color: var(--color1);
            font-size: .937rem;
            font-weight: 500;
            text-transform: uppercase;
            margin-bottom: 0
        }

        .faqPageSection .content .title {
            font-weight: 500;
            line-height: 1
        }

        .faqPageSection .content .text {
            margin-top: 5px;
            font-weight: 400
        }

    .faqPageSection .faqForm .formDiv {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 100;
        margin: 0 auto;
        margin-top: .7075rem;
        width: 100%;
        max-width: 760px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 0;
        border-radius: var(--btnRadius) var(--btnRadius) 0 0;
        -webkit-transform: translateY(150%);
        transform: translateY(150%);
        background: var(--white);
        -webkit-transition: var(--transition2);
        transition: var(--transition2);
        -webkit-box-shadow: rgba(50,50,93,.25) 0px 50px 100px 20px,rgba(0,0,0,.3) 0px 30px 60px 30px;
        box-shadow: rgba(50,50,93,.25) 0px 50px 100px 20px,rgba(0,0,0,.3) 0px 30px 60px 30px
    }

@media(min-width: 768px) {
    .faqPageSection .faqForm .formDiv {
        position: relative;
        bottom: unset;
        left: unset;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        padding: 0;
        border-radius: var(--btnRadius);
        -webkit-transform: none;
        transform: none;
        -webkit-box-shadow: rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
        box-shadow: rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px
    }
}

.faqPageSection .faqForm .formDiv::before {
    content: "";
    position: absolute;
    top: 7px;
    left: 50%;
    width: 50px;
    height: 5px;
    border-radius: var(--radius);
    background-color: var(--borderGray);
    z-index: 1;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    pointer-events: none
}

@media(min-width: 768px) {
    .faqPageSection .faqForm .formDiv::before {
        display: none
    }
}

.faqPageSection .faqForm .formDiv::after {
    content: "";
    position: absolute;
    top: -60px;
    left: 50%;
    width: 35px;
    height: 35px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--textGray);
    font-family: uicons-regular-rounded !important;
    font-style: normal;
    font-size: 25px;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    padding: 5px;
    border-radius: 100%;
    background-color: var(--black);
    border: 1px solid var(--black);
    border-top: 1px solid var(--darkGray);
    opacity: 0;
    z-index: 1;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    pointer-events: none;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    opacity: .7
}

@media(min-width: 768px) {
    .faqPageSection .faqForm .formDiv::after {
        display: none
    }
}

.faqPageSection .faqForm:has(.mainFilter input:focus) .formDiv {
    background: var(--visibleGray)
}

.faqPageSection .faqForm .item {
    width: 100%;
    border-bottom: 1px solid var(--borderGray)
}

@media(min-width: 768px) {
    .faqPageSection .faqForm .item {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        width: auto;
        border: none
    }
}

.faqPageSection .faqForm .item:hover::before, .faqPageSection .faqForm .item:hover:after {
    opacity: 0
}

@media(min-width: 768px) {
    .faqPageSection .faqForm .item:nth-child(2)::before, .faqPageSection .faqForm .item:nth-child(3)::before {
        content: "";
        position: absolute;
        top: 50%;
        right: 0;
        z-index: 2;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 1px;
        height: 100%;
        background: #fff;
        background: -webkit-gradient(linear, left bottom, left top, from(rgba(255, 255, 255, 0)), color-stop(50%, var(--borderGray)), to(rgba(255, 255, 255, 0)));
        background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, var(--borderGray) 50%, rgba(255, 255, 255, 0) 100%);
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }
}

.faqPageSection .faqForm .item:nth-child(2) {
    width: 50%
}

@media(min-width: 768px) {
    .faqPageSection .faqForm .item:nth-child(2) {
        max-width: 150px
    }
}

@media(min-width: 768px) {
    .faqPageSection .faqForm .item:nth-child(2)::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        z-index: 2;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 1px;
        height: 100%;
        background: #fff;
        background: -webkit-gradient(linear, left bottom, left top, from(rgba(255, 255, 255, 0)), color-stop(50%, var(--borderGray)), to(rgba(255, 255, 255, 0)));
        background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, var(--borderGray) 50%, rgba(255, 255, 255, 0) 100%);
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }
}

.faqPageSection .faqForm .item:nth-child(3) {
    max-width: 150px
}

.faqPageSection .faqForm .item .mainFilter {
    margin: 0
}

    .faqPageSection .faqForm .item .mainFilter label {
        position: absolute;
        top: 12px;
        left: 21px;
        z-index: 2;
        color: var(--black);
        font-size: 12px;
        font-weight: 500;
        pointer-events: none;
        opacity: 1
    }

    .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox]), .faqPageSection .faqForm .item .mainFilter textarea, .faqPageSection .faqForm .item .mainFilter select {
        padding: 28px 20px;
        padding-bottom: 13px
    }

    .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox]), .faqPageSection .faqForm .item .mainFilter textarea, .faqPageSection .faqForm .item .mainFilter select, .faqPageSection .faqForm .item .mainFilter datalist, .faqPageSection .faqForm .item .mainFilter selector selected, .faqPageSection .faqForm .item .mainFilter .dateRange {
        font-size: 14px;
        background: rgba(0,0,0,0);
        border-radius: var(--btnRadius);
        border-color: rgba(0,0,0,0);
        -webkit-transition: var(--transition1);
        transition: var(--transition1);
        -webkit-box-shadow: none;
        box-shadow: none
    }

        .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox])::-webkit-input-placeholder, .faqPageSection .faqForm .item .mainFilter textarea::-webkit-input-placeholder, .faqPageSection .faqForm .item .mainFilter select::-webkit-input-placeholder, .faqPageSection .faqForm .item .mainFilter datalist::-webkit-input-placeholder, .faqPageSection .faqForm .item .mainFilter selector selected::-webkit-input-placeholder, .faqPageSection .faqForm .item .mainFilter .dateRange::-webkit-input-placeholder {
            opacity: .5
        }

        .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox])::-moz-placeholder, .faqPageSection .faqForm .item .mainFilter textarea::-moz-placeholder, .faqPageSection .faqForm .item .mainFilter select::-moz-placeholder, .faqPageSection .faqForm .item .mainFilter datalist::-moz-placeholder, .faqPageSection .faqForm .item .mainFilter selector selected::-moz-placeholder, .faqPageSection .faqForm .item .mainFilter .dateRange::-moz-placeholder {
            opacity: .5
        }

        .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox]):-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter textarea:-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter select:-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter datalist:-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter selector selected:-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter .dateRange:-ms-input-placeholder {
            opacity: .5
        }

        .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox])::-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter textarea::-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter select::-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter datalist::-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter selector selected::-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter .dateRange::-ms-input-placeholder {
            opacity: .5
        }

        .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox])::placeholder, .faqPageSection .faqForm .item .mainFilter textarea::placeholder, .faqPageSection .faqForm .item .mainFilter select::placeholder, .faqPageSection .faqForm .item .mainFilter datalist::placeholder, .faqPageSection .faqForm .item .mainFilter selector selected::placeholder, .faqPageSection .faqForm .item .mainFilter .dateRange::placeholder {
            opacity: .5
        }

        .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox]):hover, .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox]):focus, .faqPageSection .faqForm .item .mainFilter textarea:hover, .faqPageSection .faqForm .item .mainFilter textarea:focus, .faqPageSection .faqForm .item .mainFilter select:hover, .faqPageSection .faqForm .item .mainFilter select:focus, .faqPageSection .faqForm .item .mainFilter datalist:hover, .faqPageSection .faqForm .item .mainFilter datalist:focus, .faqPageSection .faqForm .item .mainFilter selector selected:hover, .faqPageSection .faqForm .item .mainFilter selector selected:focus, .faqPageSection .faqForm .item .mainFilter .dateRange:hover, .faqPageSection .faqForm .item .mainFilter .dateRange:focus {
            z-index: 1
        }

        .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox]):hover, .faqPageSection .faqForm .item .mainFilter textarea:hover, .faqPageSection .faqForm .item .mainFilter select:hover, .faqPageSection .faqForm .item .mainFilter datalist:hover, .faqPageSection .faqForm .item .mainFilter selector selected:hover, .faqPageSection .faqForm .item .mainFilter .dateRange:hover {
            background: var(--borderGray)
        }

        .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox]):focus, .faqPageSection .faqForm .item .mainFilter textarea:focus, .faqPageSection .faqForm .item .mainFilter select:focus, .faqPageSection .faqForm .item .mainFilter datalist:focus, .faqPageSection .faqForm .item .mainFilter selector selected:focus, .faqPageSection .faqForm .item .mainFilter .dateRange:focus {
            border-color: var(--borderGray);
            background: var(--white);
            -webkit-box-shadow: 0 3px 12px 0 rgba(0,0,0,.15);
            box-shadow: 0 3px 12px 0 rgba(0,0,0,.15)
        }

            .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox]):focus::-webkit-input-placeholder, .faqPageSection .faqForm .item .mainFilter textarea:focus::-webkit-input-placeholder, .faqPageSection .faqForm .item .mainFilter select:focus::-webkit-input-placeholder, .faqPageSection .faqForm .item .mainFilter datalist:focus::-webkit-input-placeholder, .faqPageSection .faqForm .item .mainFilter selector selected:focus::-webkit-input-placeholder, .faqPageSection .faqForm .item .mainFilter .dateRange:focus::-webkit-input-placeholder {
                opacity: 1
            }

            .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox]):focus::-moz-placeholder, .faqPageSection .faqForm .item .mainFilter textarea:focus::-moz-placeholder, .faqPageSection .faqForm .item .mainFilter select:focus::-moz-placeholder, .faqPageSection .faqForm .item .mainFilter datalist:focus::-moz-placeholder, .faqPageSection .faqForm .item .mainFilter selector selected:focus::-moz-placeholder, .faqPageSection .faqForm .item .mainFilter .dateRange:focus::-moz-placeholder {
                opacity: 1
            }

            .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox]):focus:-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter textarea:focus:-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter select:focus:-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter datalist:focus:-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter selector selected:focus:-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter .dateRange:focus:-ms-input-placeholder {
                opacity: 1
            }

            .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox]):focus::-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter textarea:focus::-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter select:focus::-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter datalist:focus::-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter selector selected:focus::-ms-input-placeholder, .faqPageSection .faqForm .item .mainFilter .dateRange:focus::-ms-input-placeholder {
                opacity: 1
            }

            .faqPageSection .faqForm .item .mainFilter input:not([type=radio]):not([type=checkbox]):focus::placeholder, .faqPageSection .faqForm .item .mainFilter textarea:focus::placeholder, .faqPageSection .faqForm .item .mainFilter select:focus::placeholder, .faqPageSection .faqForm .item .mainFilter datalist:focus::placeholder, .faqPageSection .faqForm .item .mainFilter selector selected:focus::placeholder, .faqPageSection .faqForm .item .mainFilter .dateRange:focus::placeholder {
                opacity: 1
            }

.faqPageSection .faqForm .item .subFilter {
    position: absolute;
    bottom: 120%;
    left: 0;
    z-index: 10;
    width: 100%;
    min-width: -webkit-max-content;
    min-width: -moz-max-content;
    min-width: max-content;
    display: none
}

@media(min-width: 1024px) {
    .faqPageSection .faqForm .item .subFilter {
        bottom: unset;
        top: 120%
    }
}

.faqPageSection .faqForm .item .subFilter .subFilterClose {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--black);
    opacity: .3
}

@media(min-width: 768px) {
    .faqPageSection .faqForm .item .subFilter .subFilterClose {
        opacity: 0
    }
}

.faqPageSection .faqForm .item .subFilter .filterContent {
    z-index: 11;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: .7075rem;
    color: var(--black);
    background: var(--white);
    border-radius: var(--radius);
    border: 1px solid var(--borderGray);
    -webkit-box-shadow: rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    box-shadow: rgba(50,50,93,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px
}

@media(min-width: 1024px) {
    .faqPageSection .faqForm .item .subFilter .filterContent {
        padding: 1rem
    }
}

.faqPageSection .faqForm .item .subFilterIntro {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.faqPageSection .faqForm .item .guestCount {
    text-align: left
}

@media(min-width: 1024px) {
    .faqPageSection .faqForm .item .guestCount {
        min-width: 400px
    }
}

.faqPageSection .faqForm .item .guestCount li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 0 10px;
    border-bottom: 1px solid var(--borderGray);
    padding: 20px 0
}

    .faqPageSection .faqForm .item .guestCount li:nth-child(1) {
        padding-top: 0
    }

    .faqPageSection .faqForm .item .guestCount li:nth-last-child(1) {
        padding-bottom: 0;
        border: none
    }

    .faqPageSection .faqForm .item .guestCount li .textDiv .type {
        margin: 0;
        font-size: 16px;
        font-weight: 500
    }

    .faqPageSection .faqForm .item .guestCount li .textDiv .text {
        margin-top: 3px;
        font-size: 13px;
        opacity: .8
    }

    .faqPageSection .faqForm .item .guestCount li .inputDiv {
        width: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        margin: 0
    }

        .faqPageSection .faqForm .item .guestCount li .inputDiv input {
            width: 50px;
            text-align: center;
            background: rgba(0,0,0,0);
            border-color: rgba(0,0,0,0);
            font-weight: 500;
            pointer-events: none
        }

            .faqPageSection .faqForm .item .guestCount li .inputDiv input::-webkit-input-placeholder {
                color: var(--black);
                font-weight: inherit;
                opacity: 1
            }

            .faqPageSection .faqForm .item .guestCount li .inputDiv input::-moz-placeholder {
                color: var(--black);
                font-weight: inherit;
                opacity: 1
            }

            .faqPageSection .faqForm .item .guestCount li .inputDiv input:-ms-input-placeholder {
                color: var(--black);
                font-weight: inherit;
                opacity: 1
            }

            .faqPageSection .faqForm .item .guestCount li .inputDiv input::-ms-input-placeholder {
                color: var(--black);
                font-weight: inherit;
                opacity: 1
            }

            .faqPageSection .faqForm .item .guestCount li .inputDiv input::placeholder {
                color: var(--black);
                font-weight: inherit;
                opacity: 1
            }

        .faqPageSection .faqForm .item .guestCount li .inputDiv button {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            width: 30px;
            height: 30px;
            color: var(--textGray);
            border: 1px solid var(--borderGray);
            border-radius: var(--radius)
        }

            .faqPageSection .faqForm .item .guestCount li .inputDiv button i {
                font-size: 22px;
                margin: auto
            }

.faqPageSection .faqForm .searchBtn {
    width: 100%;
    min-height: 50px;
    font-size: 1rem;
    padding: 0 1rem;
    font-weight: 600;
    margin-top: .7075rem;
    z-index: 5
}

@media(min-width: 768px) {
    .faqPageSection .faqForm .searchBtn {
        margin: 0;
        width: 50px;
        position: absolute;
        top: 50%;
        right: 8px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        max-width: 50px;
        font-size: 25px
    }
}

@media(min-width: 768px) {
    .faqPageSection .faqForm .searchBtn span {
        display: none
    }
}

.faqPageSection .faqForm .tabMenu {
    margin-top: .7075rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 20px
}

    .faqPageSection .faqForm .tabMenu a {
        font-size: .878rem;
        font-weight: 500;
        padding: 7px 12px;
        border-radius: var(--radius);
        border: 1px solid var(--visibleGray);
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .faqPageSection .faqForm .tabMenu a:hover {
            color: var(--color1);
            background-color: var(--white);
            border: 1px solid var(--color1)
        }

.faqPageSection .faqListContainer {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y)
}

    .faqPageSection .faqListContainer .faqListDiv {
        width: 100%;
        margin: 0 auto;
        max-width: 1000px;
        text-align: left
    }

        .faqPageSection .faqListContainer .faqListDiv .dropList {
            display: block
        }

            .faqPageSection .faqListContainer .faqListDiv .dropList .dropBox {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                justify-content: space-between;
                padding: 1rem 0;
                -webkit-transition: var(--transition1);
                transition: var(--transition1);
                cursor: pointer
            }

                .faqPageSection .faqListContainer .faqListDiv .dropList .dropBox .moreBtn {
                    margin-left: auto;
                    padding: 1rem
                }

                .faqPageSection .faqListContainer .faqListDiv .dropList .dropBox div {
                    cursor: pointer;
                    -webkit-transition: var(--transition1);
                    transition: var(--transition1)
                }

                    .faqPageSection .faqListContainer .faqListDiv .dropList .dropBox div i {
                        color: inherit;
                        font-size: .878rem;
                        cursor: pointer;
                        -webkit-transition: var(--transition1);
                        transition: var(--transition1)
                    }

                    .faqPageSection .faqListContainer .faqListDiv .dropList .dropBox div .dropRemove {
                        display: none
                    }

            .faqPageSection .faqListContainer .faqListDiv .dropList .dropContent {
                display: none;
                width: 100%
            }

                .faqPageSection .faqListContainer .faqListDiv .dropList .dropContent p:nth-child(1) {
                    margin-top: 0
                }

        .faqPageSection .faqListContainer .faqListDiv .dropBox {
            padding: 0 .7075rem !important;
            background-color: var(--lightGray);
            border-radius: var(--btnRadius)
        }

            .faqPageSection .faqListContainer .faqListDiv .dropBox .title {
                margin: 0;
                font-weight: 500;
                padding: 1rem 0
            }

            .faqPageSection .faqListContainer .faqListDiv .dropBox .dropIcon {
                background-color: var(--white);
                border-radius: var(--btnRadius);
                min-width: 10px;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center
            }

        .faqPageSection .faqListContainer .faqListDiv .dropContent {
            background-color: var(--lightGray);
            border-radius: var(--radius);
            padding: 1rem .7075rem !important;
            margin-top: 1rem
        }

.beforeAfterSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

    .beforeAfterSection .innerSection {
        background: var(--color3);
        border-radius: var(--radius);
        padding: .7075rem;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        overflow: hidden
    }

    .beforeAfterSection .content {
        padding-bottom: var(--section-space-y);
        width: 100%;
        text-align: center;
        color: var(--black)
    }

        .beforeAfterSection .content .title {
            color: var(--color1);
            font-weight: 700;
            line-height: 1
        }

    .beforeAfterSection .slider {
        width: 100%;
        max-width: 500px;
        margin: 0 auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-line-pack: center;
        align-content: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        z-index: 2;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .beforeAfterSection .slider:hover {
            -webkit-transform: scale(1.025);
            transform: scale(1.025)
        }

        .beforeAfterSection .slider::after, .beforeAfterSection .slider::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border-radius: var(--btnRadius);
            z-index: -1
        }

        .beforeAfterSection .slider::after {
            -webkit-transform: rotate(-5deg);
            transform: rotate(-5deg);
            background: var(--color1)
        }

        .beforeAfterSection .slider::before {
            -webkit-transform: rotate(-10deg);
            transform: rotate(-10deg);
            background: var(--color1);
            opacity: .5
        }

        .beforeAfterSection .slider .sliderContainer {
            overflow: hidden;
            border-radius: var(--btnRadius)
        }

        .beforeAfterSection .slider .tabBarWrapper {
            width: 100%
        }

            .beforeAfterSection .slider .tabBarWrapper .tabBarSlide {
                --position: 50%;
                min-width: 100%;
                height: auto;
                margin: 0 auto;
                display: grid;
                place-content: center;
                position: relative;
                border-radius: var(--btnRadius);
                overflow: hidden;
                -webkit-transition: var(--transition2);
                transition: var(--transition2)
            }

                .beforeAfterSection .slider .tabBarWrapper .tabBarSlide img {
                    display: block;
                    max-width: 100%
                }

                .beforeAfterSection .slider .tabBarWrapper .tabBarSlide .image-container {
                    width: 100%
                }

                .beforeAfterSection .slider .tabBarWrapper .tabBarSlide .slider-image {
                    width: 100%;
                    height: 100%;
                    -o-object-fit: cover;
                    object-fit: cover;
                    -o-object-position: center;
                    object-position: center;
                    aspect-ratio: 1/1
                }

                .beforeAfterSection .slider .tabBarWrapper .tabBarSlide .image-after {
                    position: absolute;
                    inset: 0;
                    z-index: 1;
                    width: var(--position);
                    -o-object-position: left;
                    object-position: left
                }

                .beforeAfterSection .slider .tabBarWrapper .tabBarSlide .slider {
                    position: absolute;
                    inset: 0;
                    z-index: 2;
                    cursor: pointer;
                    opacity: 0;
                    width: 100%;
                    height: 100%
                }

                    .beforeAfterSection .slider .tabBarWrapper .tabBarSlide .slider:focus-visible ~ .slider-button {
                        outline: 5px solid var(--color1);
                        outline-offset: 3px
                    }

                .beforeAfterSection .slider .tabBarWrapper .tabBarSlide .slider-line {
                    position: absolute;
                    inset: 0;
                    width: 5px;
                    height: 100%;
                    background-color: #fff;
                    left: var(--position);
                    -webkit-transform: translateX(-50%);
                    transform: translateX(-50%);
                    pointer-events: none
                }

                .beforeAfterSection .slider .tabBarWrapper .tabBarSlide .slider-button {
                    width: 50px;
                    height: 50px;
                    position: absolute;
                    background-color: var(--color1);
                    border: 2px solid var(--white);
                    color: var(--white);
                    font-size: clamp(20.25px,17.3681052632px + 0.0060039474*100vw,29.376px);
                    padding: .5rem;
                    border-radius: var(--btnRadius);
                    display: grid;
                    place-items: center;
                    top: 50%;
                    left: var(--position);
                    z-index: 2;
                    -webkit-transform: translate(-50%, -50%);
                    transform: translate(-50%, -50%);
                    pointer-events: none;
                    z-index: 100;
                    -webkit-box-shadow: 1px 1px 1px hsla(0,45%,2%,.007);
                    box-shadow: 1px 1px 1px hsla(0,45%,2%,.007)
                }

        .beforeAfterSection .slider .arrow {
            width: 50px;
            position: absolute;
            top: 50%;
            z-index: 10;
            height: 50px;
            border-radius: var(--btnRadius);
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            font-size: clamp(20.25px,17.3681052632px + 0.0060039474*100vw,29.376px);
            color: var(--textGray);
            background: var(--white);
            -webkit-box-shadow: rgba(17,12,46,.15) 0px 48px 100px 0px;
            box-shadow: rgba(17,12,46,.15) 0px 48px 100px 0px;
            cursor: pointer;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

            .beforeAfterSection .slider .arrow:hover {
                color: var(--color1)
            }

            .beforeAfterSection .slider .arrow.right {
                right: 0
            }

@media(min-width: 1280px) {
    .beforeAfterSection .slider .arrow.right {
        -webkit-transform: translate(50%, -50%);
        transform: translate(50%, -50%)
    }
}

.beforeAfterSection .slider .arrow.left {
    left: 0
}

@media(min-width: 1280px) {
    .beforeAfterSection .slider .arrow.left {
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%)
    }
}

.beforeAfterSection .slider .arrow i {
    margin: auto
}

.beforeAfterSection .textBgSlider {
    --textSlide--colour: #dae8d1;
    --textSlide--bg: transparent;
    --textSlide--repeat-count: 6;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 5vw;
    overflow: hidden;
    background: var(--textSlide--bg);
    position: absolute;
    bottom: 30%;
    left: 0;
    z-index: 1
}

    .beforeAfterSection .textBgSlider .bg {
        mix-blend-mode: screen;
        background: var(--textSlide--colour)
    }

    .beforeAfterSection .textBgSlider .textSliderWrapper {
        padding-top: .7075rem;
        padding-bottom: .7075rem;
        width: 110%;
        margin-left: -5%;
        color: var(--textSlide--colour);
        --textSlide--direction: -1;
        background: rgba(0,0,0,0)
    }

        .beforeAfterSection .textBgSlider .textSliderWrapper div {
            margin: 0;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            gap: .5em;
            font-family: var(--font-family1);
            font-size: clamp(5rem,5vw,5rem);
            font-weight: 800;
            letter-spacing: -0.2vw;
            text-transform: uppercase;
            line-height: 1.1
        }

            .beforeAfterSection .textBgSlider .textSliderWrapper div::after {
                content: "*";
                color: var(--color1);
                -webkit-transform: translateY(0.175em);
                transform: translateY(0.175em);
                opacity: 1
            }

            .beforeAfterSection .textBgSlider .textSliderWrapper div::before {
                content: ""
            }

    .beforeAfterSection .textBgSlider .textDiv {
        --textSlide--base-duration: 1s;
        --textSlide--repeat-size: calc(100% / var(--textSlide--repeat-count));
        --textSlide--double-size: calc(var(--textSlide--repeat-size) * 2);
        --textSlide--duration: calc(var(--textSlide--base-duration) * var(--text-slider-speed, 20));
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

@media(prefers-reduced-motion: no-preference) {
    .beforeAfterSection .textBgSlider .textDiv {
        -webkit-animation: textSlide var(--textSlide--duration) infinite linear,reduce-textSlide var(--textSlide--duration) infinite linear paused;
        animation: textSlide var(--textSlide--duration) infinite linear,reduce-textSlide var(--textSlide--duration) infinite linear paused;
        animation-composition: add
    }

        .beforeAfterSection .textBgSlider .textDiv:hover {
            -webkit-animation-play-state: running;
            animation-play-state: running
        }
}

@keyframes textSlide {
    from {
        -webkit-transform: translateX(calc(-1 * var(--textSlide--double-size) - var(--textSlide--double-size) * var(--textSlide--direction, 1)));
        transform: translateX(calc(-1 * var(--textSlide--double-size) - var(--textSlide--double-size) * var(--textSlide--direction, 1)))
    }

    to {
        -webkit-transform: translateX(calc(var(--textSlide--double-size) * -1));
        transform: translateX(calc(var(--textSlide--double-size) * -1))
    }
}

@keyframes reduce-textSlide {
    from {
        -webkit-transform: translateX(calc(var(--textSlide--repeat-size) * var(--textSlide--direction, 1)));
        transform: translateX(calc(var(--textSlide--repeat-size) * var(--textSlide--direction, 1)))
    }

    to {
        transfrom: translateX(calc(var(--textSlide--double-size) * -1))
    }
}

.videoSliderSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    background: var(--black);
    overflow: hidden
}

    .videoSliderSection .cardSlide {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 0 20px;
        overflow: unset
    }

        .videoSliderSection .cardSlide .card {
            padding-top: 168.75px;
            min-width: 300px;
            border: 3px solid var(--darkGray);
            border-radius: var(--radius);
            overflow: hidden
        }

@media(min-width: 768px) {
    .videoSliderSection .cardSlide .card {
        padding-top: 225px;
        min-width: 400px
    }
}

.videoSliderSection .cardSlide .card iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.videoSliderSection .arrowDiv {
    padding: 0 3vw;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 10;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    pointer-events: none
}

.videoSliderSection .arrow {
    pointer-events: all;
    width: 40px;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--black);
    border-radius: 100%;
    border: 1px solid var(--borderGray);
    background-color: var(--white);
    cursor: pointer;
    -webkit-transition: var(--transition2);
    transition: var(--transition2);
    -webkit-box-shadow: rgba(0,0,0,.1) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px;
    box-shadow: rgba(0,0,0,.1) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px
}

@media(min-width: 768px) {
    .videoSliderSection .arrow {
        width: 50px;
        height: 50px
    }
}

@media(min-width: 1280px) {
    .videoSliderSection .arrow {
        width: 65px;
        height: 65px
    }
}

.videoSliderSection .arrow:hover {
    background-color: var(--color1);
    border: 1px solid var(--color1);
    -webkit-box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px;
    box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px
}

    .videoSliderSection .arrow:hover i {
        color: var(--white);
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }

.videoSliderSection .arrow i {
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    margin: auto;
    cursor: pointer;
    -webkit-transition: var(--transition2);
    transition: var(--transition2)
}

.contentCardSliderSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    background: var(--lightGray);
    overflow: hidden
}

    .contentCardSliderSection .titleDiv {
        padding-bottom: var(--section-space-y);
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

        .contentCardSliderSection .titleDiv .title {
            max-width: 550px
        }

        .contentCardSliderSection .titleDiv .arrowDiv {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            gap: 0 10px;
            width: auto;
            margin: 0
        }

            .contentCardSliderSection .titleDiv .arrowDiv .arrow {
                width: 50px;
                min-width: 50px;
                height: 50px;
                border-radius: var(--btnRadius);
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                font-size: clamp(20.25px,17.3681052632px + 0.0060039474*100vw,29.376px);
                color: var(--white);
                background: var(--black);
                cursor: pointer;
                -webkit-transition: var(--transition1);
                transition: var(--transition1)
            }

                .contentCardSliderSection .titleDiv .arrowDiv .arrow:hover {
                    color: var(--white)
                }

                .contentCardSliderSection .titleDiv .arrowDiv .arrow i {
                    margin: auto
                }

    .contentCardSliderSection .cardSlide {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 0 20px;
        overflow: unset
    }

        .contentCardSliderSection .cardSlide .itemCard {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-align: start;
            -ms-flex-align: start;
            align-items: flex-start;
            min-width: 300px;
            background: var(--white);
            border-radius: var(--radius);
            overflow: hidden;
            padding: 5px
        }

@media(min-width: 768px) {
    .contentCardSliderSection .cardSlide .itemCard {
        min-width: 50%
    }
}

.contentCardSliderSection .cardSlide .itemCard .media {
    border-radius: calc(var(--radius) - 5px);
    overflow: hidden
}

    .contentCardSliderSection .cardSlide .itemCard .media img {
        aspect-ratio: 3/2.5;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: top left;
        object-position: top left
    }

@media(min-width: 768px) {
    .contentCardSliderSection .cardSlide .itemCard .media img {
        aspect-ratio: 16/9
    }
}

.contentCardSliderSection .cardSlide .itemCard .content {
    padding: 1rem;
    padding-top: 0
}

@media(min-width: 768px) {
    .contentCardSliderSection .cardSlide .itemCard .content {
        padding: 1.413rem;
        padding-top: 0
    }
}

.contentCardSliderSection .cardSlide .itemCard .content .title {
    position: absolute;
    top: 1px;
    left: 0;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    font-weight: 500;
    background: var(--white);
    padding: 1rem 1rem;
    border-radius: 0 var(--radius) 0 0
}

@media(min-width: 768px) {
    .contentCardSliderSection .cardSlide .itemCard .content .title {
        padding: 1rem 1.413rem
    }
}

.contentCardSliderSection .cardSlide .itemCard .content .title::before, .contentCardSliderSection .cardSlide .itemCard .content .title::after {
    content: "";
    position: absolute;
    background: rgba(0,0,0,0);
    width: 1.2rem;
    height: 1.2rem
}

.contentCardSliderSection .cardSlide .itemCard .content .title::after {
    top: -1.188rem;
    left: 0;
    border-bottom-right-radius: 2rem;
    -webkit-box-shadow: .313rem .313rem 0px .313rem var(--white);
    box-shadow: .313rem .313rem 0px .313rem var(--white);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.contentCardSliderSection .cardSlide .itemCard .content .title::before {
    bottom: 1px;
    right: 0;
    border-bottom-right-radius: 1rem;
    -webkit-box-shadow: .313rem .313rem 0px .313rem var(--white);
    box-shadow: .313rem .313rem 0px .313rem var(--white);
    -webkit-transform: translateX(100%) rotate(90deg);
    transform: translateX(100%) rotate(90deg)
}

.contentCardSliderSection .cardSlide .itemCard .content .dropDownDiv {
    width: 100%
}

    .contentCardSliderSection .cardSlide .itemCard .content .dropDownDiv .dropList .dropBox {
        padding: .5rem 0;
        border-bottom: 1px solid var(--borderGray)
    }

        .contentCardSliderSection .cardSlide .itemCard .content .dropDownDiv .dropList .dropBox:nth-last-child(1) {
            border-bottom: none
        }

        .contentCardSliderSection .cardSlide .itemCard .content .dropDownDiv .dropList .dropBox .title {
            position: relative;
            top: unset;
            left: unset;
            -webkit-transform: none;
            transform: none;
            padding: 0
        }

            .contentCardSliderSection .cardSlide .itemCard .content .dropDownDiv .dropList .dropBox .title::before, .contentCardSliderSection .cardSlide .itemCard .content .dropDownDiv .dropList .dropBox .title::after {
                display: none
            }

    .contentCardSliderSection .cardSlide .itemCard .content .dropDownDiv .dropList .dropContent {
        padding: .7075rem 0
    }

.faqListSection {
    padding-bottom: var(--section-space-y);
    overflow: hidden
}

    .faqListSection .titleDiv {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        text-align: center;
        background: var(--color3)
    }

        .faqListSection .titleDiv .title {
            padding-top: 100px
        }

    .faqListSection .tabMenuSection {
        width: 100%;
        overflow: auto;
        margin: 0 auto
    }

@media(min-width: 768px) {
    .faqListSection .tabMenuSection {
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content
    }
}

.faqListSection .tabMenuSection .tabMneuDiv {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 5px;
    min-width: -webkit-max-content;
    min-width: -moz-max-content;
    min-width: max-content
}

    .faqListSection .tabMenuSection .tabMneuDiv .tabMenu {
        font-weight: 500;
        padding: .7075rem 1rem;
        border-radius: var(--radius);
        background: var(--white);
        border: 1px solid var(--borderGray);
        cursor: pointer
    }

        .faqListSection .tabMenuSection .tabMneuDiv .tabMenu.activeTabMenu {
            color: var(--borderGray);
            background: var(--black)
        }

.faqListSection .tabBarWrapper .tabBarSlide {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden
}

    .faqListSection .tabBarWrapper .tabBarSlide .dropDownDiv {
        margin: 0 auto;
        max-width: 750px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 20px 0;
        margin-top: .7075rem;
        text-align: left
    }

        .faqListSection .tabBarWrapper .tabBarSlide .dropDownDiv .dropList {
            background: var(--lightGray);
            border: 1px solid var(--lightGray);
            border-radius: var(--btnRadius);
            overflow: hidden
        }

            .faqListSection .tabBarWrapper .tabBarSlide .dropDownDiv .dropList:hover .dropBox .dropIcon i {
                color: var(--darkGray)
            }

            .faqListSection .tabBarWrapper .tabBarSlide .dropDownDiv .dropList .dropBox {
                padding: .5rem 1.413rem
            }

                .faqListSection .tabBarWrapper .tabBarSlide .dropDownDiv .dropList .dropBox .title {
                    font-size: 1rem;
                    font-weight: 500
                }

                .faqListSection .tabBarWrapper .tabBarSlide .dropDownDiv .dropList .dropBox .dropIcon {
                    padding: 5px 10px;
                    border-radius: var(--radius);
                    background-color: var(--lightGray)
                }

            .faqListSection .tabBarWrapper .tabBarSlide .dropDownDiv .dropList .dropContent {
                padding: .7075rem 1.413rem
            }

                .faqListSection .tabBarWrapper .tabBarSlide .dropDownDiv .dropList .dropContent p {
                    font-weight: 400
                }

                    .faqListSection .tabBarWrapper .tabBarSlide .dropDownDiv .dropList .dropContent p:nth-child(1) {
                        margin-top: 0
                    }

.isoCertificateSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: var(--section-space-y) 0
}

    .isoCertificateSection .media {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

@media(min-width: 1024px) {
    .isoCertificateSection .media {
        width: 50%
    }
}

.isoCertificateSection .media img {
    margin: auto;
    max-width: 350px
}

.isoCertificateSection .content {
    width: 100%
}

@media(min-width: 1024px) {
    .isoCertificateSection .content {
        clear: both;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        width: 50%;
        border-left: 1px solid var(--borderGray)
    }
}

.isoCertificateSection .content .isoDetails {
    margin-top: 1.413rem;
    padding: 1.413rem;
    border-radius: var(--radius);
    background: var(--lightGray)
}

    .isoCertificateSection .content .isoDetails .title {
        color: var(--black)
    }

.isoCertificateSection .content ul {
    margin-top: .7075rem;
    padding-left: 1rem
}

    .isoCertificateSection .content ul li {
        list-style-position: outside;
        list-style-type: disc
    }

        .isoCertificateSection .content ul li::marker {
            color: var(--black)
        }

.isoCertificateSection .content .filledBtn {
    margin-top: .7075rem;
    font-weight: 300
}

.certificationBannerSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    max-height: 650px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center
}

    .certificationBannerSection .innerSection {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        text-align: center;
        color: var(--black);
        background: #d19e1d;
        background: -webkit-gradient(linear, left top, right top, from(#f1f1f1), color-stop(#ffffff), to(#f1f1f1));
        background: linear-gradient(to right, #f1f1f1, #ffffff, #f1f1f1);
        border-radius: var(--radius)
    }

    .certificationBannerSection .logo {
        margin: 0 auto;
        width: 100px;
        border-radius: 100%;
        margin-bottom: 1.413rem;
        border: 10px solid #f7f6f5
    }

    .certificationBannerSection .title {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin: 0 auto;
        color: var(--black);
        font-family: var(--font-family1);
        font-weight: 700;
        text-transform: uppercase;
        line-height: 1;
        z-index: 1;
        border-top: 1px solid hsla(0,0%,100%,.2);
        border-bottom: 1px solid hsla(0,0%,100%,.2);
        padding: 10px 0;
        text-align: center;
        -webkit-text-fill-color: rgba(0,0,0,0);
        background-image: linear-gradient(45deg, rgba(70, 145, 20, 0.6156862745), var(--color1) 50%, var(--color1) 72%, rgba(70, 145, 20, 0.7529411765) 90%);
        -webkit-background-clip: text;
        background-clip: text;
        padding-bottom: 5px;
        padding-right: 5px;
        margin-bottom: .5rem
    }

        .certificationBannerSection .title img {
            width: 60px;
            height: 60px;
            border-radius: 100%;
            margin-right: 10px
        }

    .certificationBannerSection .subTitle {
        margin-top: .7075rem
    }

    .certificationBannerSection .listTitle {
        margin: 0 auto;
        width: 100%;
        max-width: 800px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 20px;
        color: var(--black);
        font-family: var(--font-family1);
        font-size: .878rem;
        font-weight: 500;
        letter-spacing: 1px;
        text-transform: uppercase;
        margin-top: 1.413rem
    }

        .certificationBannerSection .listTitle img {
            position: absolute;
            top: 0;
            left: 50%;
            -webkit-transform: translate(-50%, -105%);
            transform: translate(-50%, -105%);
            width: 35px
        }

        .certificationBannerSection .listTitle::before, .certificationBannerSection .listTitle::after {
            content: "";
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            height: 1px;
            opacity: 1
        }

        .certificationBannerSection .listTitle::before {
            background: #000;
            background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(var(--borderGray)));
            background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, var(--borderGray) 100%)
        }

        .certificationBannerSection .listTitle::after {
            background: #fff;
            background: -webkit-gradient(linear, left top, right top, color-stop(1%, var(--borderGray)), to(rgba(255, 255, 255, 0)));
            background: linear-gradient(90deg, var(--borderGray) 1%, rgba(255, 255, 255, 0) 100%)
        }

        .certificationBannerSection .listTitle span {
            font-weight: 400
        }

    .certificationBannerSection .scope {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        gap: 10px;
        margin-top: .5rem
    }

        .certificationBannerSection .scope li {
            font-size: .878rem;
            font-weight: 400;
            border-radius: var(--radius);
            border: 1px solid var(--lightGray);
            background: var(--white);
            padding: 10px 15px
        }

.isoCardListSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 20px 2%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

    .isoCardListSection .titleDiv {
        width: 100%;
        margin-bottom: 1.413rem;
        text-align: center
    }

        .isoCardListSection .titleDiv .logo {
            margin: 0 auto;
            width: 150px
        }

        .isoCardListSection .titleDiv .title {
            margin-top: .7075rem
        }

        .isoCardListSection .titleDiv p {
            margin-top: 5px
        }

    .isoCardListSection .isoCard {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center;
        background: var(--lightGray);
        border: 1px solid rgba(0,0,0,0);
        border-radius: var(--radius);
        cursor: pointer;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .isoCardListSection .isoCard:hover {
            border: 1px solid var(--borderGray)
        }

            .isoCardListSection .isoCard:hover .content span {
                color: var(--white);
                background: var(--color1)
            }

@media(min-width: 568px) {
    .isoCardListSection .isoCard {
        width: 48%
    }
}

@media(min-width: 768px) {
    .isoCardListSection .isoCard {
        width: 32%
    }
}

.isoCardListSection .isoCard .media {
    padding: 1.413rem .5rem
}

    .isoCardListSection .isoCard .media img {
        margin: 0 auto;
        max-width: 120px;
        border-radius: 100%
    }

.isoCardListSection .isoCard .content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: .7075rem
}

    .isoCardListSection .isoCard .content .caption {
        font-family: var(--font-family1);
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
        padding-bottom: .5rem;
        margin-bottom: .5rem;
        border-bottom: 1px dashed var(--borderGray)
    }

    .isoCardListSection .isoCard .content p {
        margin-bottom: 1.413rem
    }

    .isoCardListSection .isoCard .content span {
        margin-top: auto;
        border: none;
        font-weight: 500;
        -webkit-box-shadow: rgba(0,0,0,.1) 0px 10px 15px -3px,rgba(0,0,0,.05) 0px 4px 6px -2px;
        box-shadow: rgba(0,0,0,.1) 0px 10px 15px -3px,rgba(0,0,0,.05) 0px 4px 6px -2px
    }

        .isoCardListSection .isoCard .content span:hover {
            color: var(--white)
        }

.scopeSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden
}

    .scopeSection .content {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        border-radius: var(--radius);
        background-color: var(--lightGray);
        background: radial-gradient(at 98.6% 68.3%, rgba(212, 255, 212, 0.3294117647) 0px, transparent 50%),radial-gradient(at 4.8% 63.1%, rgba(255, 247, 242, 0.6862745098) 0px, transparent 50%),radial-gradient(at 7.8% 85.1%, rgba(219, 255, 189, 0.5568627451) 0px, transparent 50%),radial-gradient(at 21% 80.7%, rgba(255, 238, 201, 0.662745098) 0px, transparent 50%),radial-gradient(at 64.3% 80.3%, #f0ffe6 0px, transparent 50%)
    }

    .scopeSection .title {
        font-weight: 500
    }

    .scopeSection ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 20px 2%;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin-top: 1.413rem
    }

        .scopeSection ul li {
            width: 100%;
            background: var(--white);
            border-radius: var(--radius);
            padding: 1.413rem
        }

@media(min-width: 568px) {
    .scopeSection ul li {
        width: 48%
    }
}

@media(min-width: 768px) {
    .scopeSection ul li {
        width: 32%
    }
}

.scopeSection ul li strong {
    display: block;
    color: var(--color1);
    font-weight: 500;
    margin-bottom: 10px
}

.isoLogoListSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    text-align: center;
    margin-top: 1.413rem
}

    .isoLogoListSection .title {
        margin: 0 auto;
        width: 100%;
        max-width: 800px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 20px;
        color: var(--black);
        margin-top: 10px;
        font-family: var(--font-family1);
        font-size: .878rem;
        font-weight: 500;
        letter-spacing: 1px;
        text-transform: uppercase;
        margin-bottom: 1.413rem
    }

        .isoLogoListSection .title.main {
            font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
            font-weight: 600
        }

        .isoLogoListSection .title img {
            position: absolute;
            top: 0;
            left: 50%;
            -webkit-transform: translate(-50%, -105%);
            transform: translate(-50%, -105%);
            width: 35px
        }

        .isoLogoListSection .title::before, .isoLogoListSection .title::after {
            content: "";
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            height: 1px;
            opacity: 1
        }

        .isoLogoListSection .title::before {
            background: #000;
            background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(var(--color2)));
            background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, var(--color2) 100%)
        }

        .isoLogoListSection .title::after {
            background: #fff;
            background: -webkit-gradient(linear, left top, right top, color-stop(1%, var(--color2)), to(rgba(255, 255, 255, 0)));
            background: linear-gradient(90deg, var(--color2) 1%, rgba(255, 255, 255, 0) 100%)
        }

        .isoLogoListSection .title span {
            font-weight: 400
        }

    .isoLogoListSection .logDiv {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        gap: 20px
    }

@media(min-width: 768px) {
    .isoLogoListSection .logDiv {
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
    }
}

@media(min-width: 1024px) {
    .isoLogoListSection .logDiv {
        gap: 20px 40px
    }
}

.isoLogoListSection .isoLogo {
    width: 100%;
    max-width: 23%
}

@media(min-width: 568px) {
    .isoLogoListSection .isoLogo {
        max-width: 100px
    }
}

.searchWallSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    background: #fff;
    text-align: center
}

    .searchWallSection.news .content .title {
        background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.26), var(--color1) 50%, var(--color1) 72%, rgba(7, 7, 7, 0.651) 90%)
    }

    .searchWallSection.blog .content {
        background: #fff4e2;
        border: 1px solid #ffedd1
    }

        .searchWallSection.blog .content::before, .searchWallSection.blog .content::after {
            border: 5vh solid #ffaf26
        }

@media(min-width: 1024px) {
    .searchWallSection.blog .content::before, .searchWallSection.blog .content::after {
        border: 10vh solid #ffaf26
    }
}

.searchWallSection .content {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    background: var(--color3);
    border: 1px solid rgba(72,204,72,.253);
    border-radius: var(--radius);
    overflow: hidden
}

    .searchWallSection .content::before, .searchWallSection .content::after {
        content: "";
        position: absolute;
        bottom: 0;
        width: 20vh;
        height: 20vh;
        border-radius: 100%;
        border: 5vh solid var(--color1);
        opacity: .1
    }

@media(min-width: 1024px) {
    .searchWallSection .content::before, .searchWallSection .content::after {
        width: 30vh;
        height: 30vh;
        border: 10vh solid var(--color1)
    }
}

.searchWallSection .content::before {
    left: 0;
    -webkit-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%)
}

.searchWallSection .content::after {
    right: 0;
    -webkit-transform: translate(50%, 50%);
    transform: translate(50%, 50%)
}

.searchWallSection .title {
    margin: 0;
    color: var(--black);
    -webkit-text-fill-color: rgba(0,0,0,0);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.26), var(--black) 50%, var(--black) 72%, rgba(7, 7, 7, 0.651) 90%);
    -webkit-background-clip: text;
    background-clip: text;
    padding-bottom: 5px;
    padding-right: 5px;
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: -0.5px;
    padding-bottom: 15px
}

.searchWallSection .subTitle {
    color: var(--gray);
    font-weight: 300;
    opacity: .7
}

.searchWallSection form, .searchWallSection #searchForm {
    width: 100%;
    max-width: 700px;
    margin: 0 auto;
    margin-top: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    overflow: hidden;
    border-radius: 2rem;
    background-color: var(--white);
    gap: 5px;
    padding: 5px;
    -webkit-box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px;
    box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px
}

@media(min-width: 768px) {
    .searchWallSection form, .searchWallSection #searchForm {
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        border-radius: 7.99rem
    }
}

.searchWallSection form input, .searchWallSection form select, .searchWallSection #searchForm input, .searchWallSection #searchForm select {
    color: var(--black);
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    font-weight: 500;
    padding: 1rem 1rem;
    border: 1px solid #fff;
    background: var(--white);
    text-align: center;
    border-radius: 50px;
    margin-bottom: 5px
}

@media(min-width: 768px) {
    .searchWallSection form input, .searchWallSection form select, .searchWallSection #searchForm input, .searchWallSection #searchForm select {
        margin: 0;
        text-align: left
    }
}

.searchWallSection form input::-webkit-input-placeholder, .searchWallSection form select::-webkit-input-placeholder, .searchWallSection #searchForm input::-webkit-input-placeholder, .searchWallSection #searchForm select::-webkit-input-placeholder {
    font-size: 1rem;
    color: var(--textGray);
    font-weight: 500;
    -webkit-transition: all .3s;
    transition: all .3s
}

.searchWallSection form input::-moz-placeholder, .searchWallSection form select::-moz-placeholder, .searchWallSection #searchForm input::-moz-placeholder, .searchWallSection #searchForm select::-moz-placeholder {
    font-size: 1rem;
    color: var(--textGray);
    font-weight: 500;
    -moz-transition: all .3s;
    transition: all .3s
}

.searchWallSection form input:-ms-input-placeholder, .searchWallSection form select:-ms-input-placeholder, .searchWallSection #searchForm input:-ms-input-placeholder, .searchWallSection #searchForm select:-ms-input-placeholder {
    font-size: 1rem;
    color: var(--textGray);
    font-weight: 500;
    -ms-transition: all .3s;
    transition: all .3s
}

.searchWallSection form input::-ms-input-placeholder, .searchWallSection form select::-ms-input-placeholder, .searchWallSection #searchForm input::-ms-input-placeholder, .searchWallSection #searchForm select::-ms-input-placeholder {
    font-size: 1rem;
    color: var(--textGray);
    font-weight: 500;
    -ms-transition: all .3s;
    transition: all .3s
}

.searchWallSection form input::placeholder, .searchWallSection form select::placeholder, .searchWallSection #searchForm input::placeholder, .searchWallSection #searchForm select::placeholder {
    font-size: 1rem;
    color: var(--textGray);
    font-weight: 500;
    -webkit-transition: all .3s;
    transition: all .3s
}

.searchWallSection form input:hover, .searchWallSection form select:hover, .searchWallSection #searchForm input:hover, .searchWallSection #searchForm select:hover {
    background-color: var(--lightGray);
    border: 1px solid var(--borderGray);
    color: var(--gray)
}

    .searchWallSection form input:hover::-webkit-input-placeholder, .searchWallSection form select:hover::-webkit-input-placeholder, .searchWallSection #searchForm input:hover::-webkit-input-placeholder, .searchWallSection #searchForm select:hover::-webkit-input-placeholder {
        color: var(--gray) !important
    }

    .searchWallSection form input:hover::-moz-placeholder, .searchWallSection form select:hover::-moz-placeholder, .searchWallSection #searchForm input:hover::-moz-placeholder, .searchWallSection #searchForm select:hover::-moz-placeholder {
        color: var(--gray) !important
    }

    .searchWallSection form input:hover:-ms-input-placeholder, .searchWallSection form select:hover:-ms-input-placeholder, .searchWallSection #searchForm input:hover:-ms-input-placeholder, .searchWallSection #searchForm select:hover:-ms-input-placeholder {
        color: var(--gray) !important
    }

    .searchWallSection form input:hover::-ms-input-placeholder, .searchWallSection form select:hover::-ms-input-placeholder, .searchWallSection #searchForm input:hover::-ms-input-placeholder, .searchWallSection #searchForm select:hover::-ms-input-placeholder {
        color: var(--gray) !important
    }

    .searchWallSection form input:hover::placeholder, .searchWallSection form select:hover::placeholder, .searchWallSection #searchForm input:hover::placeholder, .searchWallSection #searchForm select:hover::placeholder {
        color: var(--gray) !important
    }

.searchWallSection form input:focus, .searchWallSection form input:active, .searchWallSection form select:focus, .searchWallSection form select:active, .searchWallSection #searchForm input:focus, .searchWallSection #searchForm input:active, .searchWallSection #searchForm select:focus, .searchWallSection #searchForm select:active {
    background: var(--lightGray);
    border: 1px solid var(--borderGray);
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.searchWallSection form button, .searchWallSection form a, .searchWallSection form #searchSubmitBtn, .searchWallSection #searchForm button, .searchWallSection #searchForm a, .searchWallSection #searchForm #searchSubmitBtn {
    width: 100%;
    font-size: 1rem;
    padding: 1rem;
    color: var(--white);
    background: var(--color1);
    border-radius: calc(var(--btnRadius) - 5px);
    -webkit-box-shadow: rgba(0,0,0,.05) 0px 1px 2px 0px;
    box-shadow: rgba(0,0,0,.05) 0px 1px 2px 0px;
    will-change: transform
}

@media(min-width: 768px) {
    .searchWallSection form button, .searchWallSection form a, .searchWallSection form #searchSubmitBtn, .searchWallSection #searchForm button, .searchWallSection #searchForm a, .searchWallSection #searchForm #searchSubmitBtn {
        margin: 0;
        height: 60px;
        width: 60px;
        min-width: 60px;
        padding: 0;
        border-radius: var(--btnRadius)
    }

        .searchWallSection form button i, .searchWallSection form a i, .searchWallSection form #searchSubmitBtn i, .searchWallSection #searchForm button i, .searchWallSection #searchForm a i, .searchWallSection #searchForm #searchSubmitBtn i {
            font-size: inherit
        }
}

.searchWallSection form button:hover, .searchWallSection form a:hover, .searchWallSection form #searchSubmitBtn:hover, .searchWallSection #searchForm button:hover, .searchWallSection #searchForm a:hover, .searchWallSection #searchForm #searchSubmitBtn:hover {
    -webkit-transform: scale(1.005);
    transform: scale(1.005);
    -webkit-box-shadow: rgba(0,0,0,.1) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px;
    box-shadow: rgba(0,0,0,.1) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px
}

@media(min-width: 768px) {
    .searchWallSection form button:hover, .searchWallSection form a:hover, .searchWallSection form #searchSubmitBtn:hover, .searchWallSection #searchForm button:hover, .searchWallSection #searchForm a:hover, .searchWallSection #searchForm #searchSubmitBtn:hover {
        -webkit-transform: scale(1.15);
        transform: scale(1.15)
    }
}

@media(min-width: 768px) {
    .searchWallSection form button span, .searchWallSection form a span, .searchWallSection form #searchSubmitBtn span, .searchWallSection #searchForm button span, .searchWallSection #searchForm a span, .searchWallSection #searchForm #searchSubmitBtn span {
        display: none
    }
}

.searchWallSection .quickLinksDiv {
    margin: 0 auto;
    margin-top: 1.413rem
}

    .searchWallSection .quickLinksDiv .title {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin-bottom: .7075rem;
        color: var(--color1);
        font-size: .733rem;
        font-weight: 400;
        text-transform: uppercase;
        line-height: 1;
        letter-spacing: 3px;
        background-image: none;
        -webkit-text-fill-color: unset
    }

        .searchWallSection .quickLinksDiv .title::before {
            content: "";
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            height: 1px;
            background-color: var(--white);
            margin-right: 1rem
        }

        .searchWallSection .quickLinksDiv .title::after {
            content: "";
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            height: 1px;
            background-color: var(--white);
            margin-left: 1rem
        }

    .searchWallSection .quickLinksDiv .quickLinks {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        justify-content: center;
        overflow: auto
    }

        .searchWallSection .quickLinksDiv .quickLinks a {
            min-width: 100px;
            margin: 0 .25rem;
            margin-bottom: .5rem;
            padding: .45rem .7075rem;
            font-size: .878rem;
            white-space: nowrap;
            font-weight: 400;
            white-space: nowrap;
            color: var(--black);
            background-color: var(--white);
            border: 1px solid var(--color3);
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

            .searchWallSection .quickLinksDiv .quickLinks a.active {
                color: var(--white);
                border: 1px solid var(--black);
                background-color: var(--black);
                -webkit-box-shadow: rgba(0,0,0,.1) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px;
                box-shadow: rgba(0,0,0,.1) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px
            }

            .searchWallSection .quickLinksDiv .quickLinks a:hover {
                color: var(--white);
                border: 1px solid var(--black);
                background-color: var(--black);
                -webkit-box-shadow: rgba(0,0,0,.1) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px;
                box-shadow: rgba(0,0,0,.1) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px
            }

.divSearchDtls, #DgvPopUpDiv {
    display: block;
    position: absolute;
    left: 611.5px;
    top: 434.453px;
    width: 609.094px;
    z-index: 10;
    background: var(--white);
    border-radius: var(--radius);
    border: 1px solid var(--borderGray);
    -webkit-box-shadow: rgba(50,50,93,.103) 0px 13px 27px -5px,rgba(0,0,0,.075) 0px 8px 16px -8px;
    box-shadow: rgba(50,50,93,.103) 0px 13px 27px -5px,rgba(0,0,0,.075) 0px 8px 16px -8px;
    overflow: hidden
}

    .divSearchDtls i, #DgvPopUpDiv i {
        position: absolute;
        top: -20px;
        right: 0px;
        cursor: pointer;
        font-size: 22px
    }

    .divSearchDtls .PopUpTable, .divSearchDtls #dgvPopupGrid, #DgvPopUpDiv .PopUpTable, #DgvPopUpDiv #dgvPopupGrid {
        padding: 10px 0;
        overflow: auto;
        max-height: 400px
    }

        .divSearchDtls .PopUpTable li, .divSearchDtls #dgvPopupGrid li, #DgvPopUpDiv .PopUpTable li, #DgvPopUpDiv #dgvPopupGrid li {
            border-bottom: 1px solid var(--borderGray)
        }

            .divSearchDtls .PopUpTable li:nth-last-child(1), .divSearchDtls #dgvPopupGrid li:nth-last-child(1), #DgvPopUpDiv .PopUpTable li:nth-last-child(1), #DgvPopUpDiv #dgvPopupGrid li:nth-last-child(1) {
                border-bottom: none
            }

            .divSearchDtls .PopUpTable li a, .divSearchDtls #dgvPopupGrid li a, #DgvPopUpDiv .PopUpTable li a, #DgvPopUpDiv #dgvPopupGrid li a {
                width: 100%;
                font-size: .878rem;
                padding: 10px 20px;
                text-transform: capitalize;
                cursor: pointer;
                -webkit-transition: var(--transition1);
                transition: var(--transition1);
                border-radius: 20px
            }

                .divSearchDtls .PopUpTable li a:hover, .divSearchDtls #dgvPopupGrid li a:hover, #DgvPopUpDiv .PopUpTable li a:hover, #DgvPopUpDiv #dgvPopupGrid li a:hover {
                    color: var(--black);
                    background: var(--borderGray)
                }

.videoHubSection {
    background: var(--white);
    border-top: 1px solid var(--borderGray)
}

    .videoHubSection .tabNavigation {
        margin: 0;
        padding-top: var(--section-space-y);
        padding-bottom: .7075rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        overflow: auto
    }

        .videoHubSection .tabNavigation .tabDiv {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            gap: 10px
        }

            .videoHubSection .tabNavigation .tabDiv a {
                padding: .5rem 1.413rem;
                background: var(--borderGray);
                border-radius: var(--radius);
                white-space: nowrap;
                cursor: pointer;
                -webkit-transition: var(--transition1);
                transition: var(--transition1)
            }

                .videoHubSection .tabNavigation .tabDiv a.active {
                    color: var(--white);
                    background: var(--black)
                }

    .videoHubSection .videos {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 20px 2%
    }

        .videoHubSection .videos iframe {
            width: 100%;
            border: 5px solid var(--white);
            border-radius: var(--radius);
            aspect-ratio: 16/9
        }

@media(min-width: 1024px) {
    .videoHubSection .videos iframe {
        width: 48%
    }
}

@media(min-width: 1280px) {
    .videoHubSection .videos iframe {
        width: 32%
    }
}

.videoCard {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: hidden;
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

@media(min-width: 1024px) {
    .videoCard {
        width: 48%
    }
}

@media(min-width: 1280px) {
    .videoCard {
        width: 32%
    }
}

.videoCard:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
    -webkit-box-shadow: rgba(33,35,38,.1) 0px 10px 10px -10px;
    box-shadow: rgba(33,35,38,.1) 0px 10px 10px -10px
}

.videoCard .media {
    overflow: hidden;
    border-radius: var(--radius)
}

    .videoCard .media img {
        aspect-ratio: 16/9;
        -o-object-fit: cover;
        object-fit: cover
    }

.videoCard .content {
    padding: .7075rem 0
}

    .videoCard .content .cardTitle {
        font-size: 1rem
    }

    .videoCard .content p {
        margin-top: 5px;
        font-size: .878rem;
        opacity: .7
    }

.articleShowcase {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden
}

    .articleShowcase .titleDiv .label {
        color: var(--color1);
        font-weight: 500
    }

    .articleShowcase .titleDiv .title {
        font-weight: 600
    }

    .articleShowcase .articleCardDIv {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: .7075rem 2%;
        margin-top: 1.413rem
    }

@media(min-width: 1024px) {
    .articleShowcase .articleCardDIv {
        -ms-flex-wrap: unset;
        flex-wrap: unset;
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        grid-template-rows: repeat(2, 1fr);
        grid-column-gap: 15px;
        grid-row-gap: 15px
    }
}

.articleShowcase .articleCardDIv .articleCard, .articleShowcase .articleCardDIv .card {
    margin: 0;
    width: 100%;
    border-radius: var(--radius);
    overflow: hidden
}

@media(min-width: 768px) {
    .articleShowcase .articleCardDIv .articleCard, .articleShowcase .articleCardDIv .card {
        width: 48%
    }
}

@media(min-width: 1024px) {
    .articleShowcase .articleCardDIv .articleCard, .articleShowcase .articleCardDIv .card {
        width: 100%
    }
}

.articleShowcase .articleCardDIv .articleCard:hover .content::before, .articleShowcase .articleCardDIv .card:hover .content::before {
    opacity: .9
}

@media(min-width: 1024px) {
    .articleShowcase .articleCardDIv .articleCard:nth-child(1), .articleShowcase .articleCardDIv .card:nth-child(1) {
        grid-area: 1/1/3/4
    }
}

@media(min-width: 1024px) {
    .articleShowcase .articleCardDIv .articleCard:nth-child(1) .profile p, .articleShowcase .articleCardDIv .card:nth-child(1) .profile p {
        font-size: 20px !important
    }
}

@media(min-width: 1024px) {
    .articleShowcase .articleCardDIv .articleCard:nth-child(1) .title, .articleShowcase .articleCardDIv .card:nth-child(1) .title {
        font-size: clamp(22.78125px,18.8433710526px + 0.0082039145*100vw,35.2512px)
    }
}

@media(min-width: 1024px) {
    .articleShowcase .articleCardDIv .articleCard:nth-child(1) .tags span, .articleShowcase .articleCardDIv .articleCard:nth-child(1) .tags div, .articleShowcase .articleCardDIv .card:nth-child(1) .tags span, .articleShowcase .articleCardDIv .card:nth-child(1) .tags div {
        font-size: 20px !important
    }
}

.articleShowcase .articleCardDIv .articleCard:nth-child(1) .filledBtn, .articleShowcase .articleCardDIv .card:nth-child(1) .filledBtn {
    display: none
}

@media(min-width: 1024px) {
    .articleShowcase .articleCardDIv .articleCard:nth-child(1) .filledBtn, .articleShowcase .articleCardDIv .card:nth-child(1) .filledBtn {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex
    }
}

@media(min-width: 1024px) {
    .articleShowcase .articleCardDIv .articleCard:nth-child(2), .articleShowcase .articleCardDIv .card:nth-child(2) {
        grid-area: 2/4/3/6
    }
}

@media(min-width: 1024px) {
    .articleShowcase .articleCardDIv .articleCard:nth-child(3), .articleShowcase .articleCardDIv .card:nth-child(3) {
        grid-area: 1/4/2/6
    }
}

.articleShowcase .articleCardDIv .articleCard .imageDiv, .articleShowcase .articleCardDIv .card .imageDiv {
    width: 100%;
    padding-top: 56.25%
}

    .articleShowcase .articleCardDIv .articleCard .imageDiv img, .articleShowcase .articleCardDIv .card .imageDiv img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center
    }

.articleShowcase .articleCardDIv .articleCard .content, .articleShowcase .articleCardDIv .card .content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: .7075rem;
    color: var(--white)
}

@media(min-width: 1024px) {
    .articleShowcase .articleCardDIv .articleCard .content, .articleShowcase .articleCardDIv .card .content {
        padding: 1.413rem
    }
}

.articleShowcase .articleCardDIv .articleCard .content::before, .articleShowcase .articleCardDIv .card .content::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #010101;
    background: -webkit-gradient(linear, left top, left bottom, from(rgb(1, 1, 1)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(180deg, rgb(1, 1, 1) 0%, rgba(255, 255, 255, 0) 100%);
    opacity: .8;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.articleShowcase .articleCardDIv .articleCard .content .profile, .articleShowcase .articleCardDIv .card .content .profile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    padding-left: .7075rem
}

    .articleShowcase .articleCardDIv .articleCard .content .profile::before, .articleShowcase .articleCardDIv .card .content .profile::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 2px;
        height: 100%;
        background-color: hsla(0,0%,100%,.6235294118);
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg)
    }

    .articleShowcase .articleCardDIv .articleCard .content .profile .avatar, .articleShowcase .articleCardDIv .card .content .profile .avatar {
        width: 40px;
        height: 40px;
        border-radius: 100%;
        -o-object-fit: cover;
        object-fit: cover
    }

    .articleShowcase .articleCardDIv .articleCard .content .profile p, .articleShowcase .articleCardDIv .card .content .profile p {
        margin: 0;
        font-size: .878rem
    }

        .articleShowcase .articleCardDIv .articleCard .content .profile p span, .articleShowcase .articleCardDIv .card .content .profile p span {
            font-weight: 500;
            margin-left: 5px
        }

.articleShowcase .articleCardDIv .articleCard .content .title, .articleShowcase .articleCardDIv .card .content .title {
    text-align: left
}

.articleShowcase .articleCardDIv .articleCard .content .tags, .articleShowcase .articleCardDIv .card .content .tags {
    margin-top: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 5px 10px
}

    .articleShowcase .articleCardDIv .articleCard .content .tags span, .articleShowcase .articleCardDIv .articleCard .content .tags div, .articleShowcase .articleCardDIv .card .content .tags span, .articleShowcase .articleCardDIv .card .content .tags div {
        font-size: .667rem;
        font-weight: 500;
        background-color: hsla(0,0%,100%,.0901960784);
        padding: 5px 10px;
        border-radius: 5px;
        backdrop-filter: blur(20px);
        text-transform: uppercase
    }

.articleShowcase .articleCardDIv .articleCard .content .filledBtn, .articleShowcase .articleCardDIv .card .content .filledBtn {
    margin-top: .7075rem;
    width: auto
}

.articleSection {
    padding-bottom: var(--section-space-y);
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    color: var(--black)
}

@media(min-width: 1280px) {
    .articleSection {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        overflow: unset
    }
}

.articleSection .content {
    padding-bottom: var(--section-space-y);
    background: var(--white);
    border-radius: var(--radius)
}

.articleSection .articleBanner {
    aspect-ratio: 16/6;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: top;
    object-position: top;
    border-radius: 0
}

@media(min-width: 1280px) {
    .articleSection .articleBanner {
        border-radius: var(--radius)
    }
}

.articleSection .titleDiv {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    text-align: left;
    color: var(--black)
}

@media(min-width: 1280px) {
    .articleSection .titleDiv {
        padding-left: 0;
        padding-right: 0
    }
}

.articleSection .titleDiv img {
    margin-bottom: 3rem
}

.articleSection .titleDiv .link {
    margin-top: 1rem;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 1rem;
    border: 2px solid var(--borderGray);
    border-radius: var(--btnRadius);
    white-space: nowrap;
    padding-right: .7075rem;
    overflow: hidden;
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

@media(min-width: 1280px) {
    .articleSection .titleDiv .link {
        padding-right: 1.413rem
    }
}

.articleSection .titleDiv .link:hover {
    border: 2px solid var(--color2)
}

    .articleSection .titleDiv .link:hover i {
        color: var(--color2)
    }

.articleSection .titleDiv .link img {
    max-width: 380px;
    max-height: 100px;
    -o-object-fit: contain;
    object-fit: contain;
    margin: 0;
    border-radius: 0;
    border-right: 1px dashed var(--borderGray);
    margin-right: 1.413rem;
    padding: .5rem 1.413rem;
    border-radius: 5px
}

@media(min-width: 1024px) {
    .articleSection .titleDiv .link img {
        max-height: 150px
    }
}

@media(min-width: 1280px) {
    .articleSection .titleDiv .link img {
        max-height: 180px;
        padding-right: 3.9975rem;
        margin-right: 3.9975rem
    }
}

.articleSection .titleDiv .link i {
    margin-left: 10px
}

.articleSection .titleDiv .label {
    display: inline-block;
    margin: 0;
    margin-bottom: 1rem;
    color: var(--gray);
    font-size: .6rem;
    font-weight: 300;
    text-align: left
}

    .articleSection .titleDiv .label a {
        font-size: .733rem;
        font-weight: 400;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .articleSection .titleDiv .label a:hover {
            color: var(--color1)
        }

    .articleSection .titleDiv .label span {
        color: var(--color2);
        margin: 0 5px
    }

.articleSection .titleDiv .articleTitle {
    max-width: 1000px;
    color: var(--black);
    font-family: var(--fontFamily1);
    font-weight: 600;
    text-align: left;
    letter-spacing: -0.1vw
}

.articleSection .titleDiv .description {
    margin-top: 1rem;
    max-width: 1000px;
    line-height: 1.4;
    text-align: left
}

@media(min-width: 1024px) {
    .articleSection .titleDiv .description {
        font-size: 20px
    }
}

.articleSection .titleDiv .profile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

    .articleSection .titleDiv .profile .avatar {
        margin: 0;
        width: 50px;
        height: 50px;
        border-radius: 100%;
        border: 5px solid var(--lightGray);
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center
    }

    .articleSection .titleDiv .profile .name {
        margin: 0;
        font-size: .937rem;
        font-weight: 600;
        padding-left: .7075rem;
        margin-left: .7075rem;
        border-left: 1px solid var(--borderGray)
    }

.articleSection .titleDiv .date {
    color: var(--textGray);
    font-size: .878rem
}

.articleSection img {
    overflow: hidden;
    border-radius: var(--radius);
    margin-bottom: .7075rem
}

.articleSection .content {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

@media(min-width: 1280px) {
    .articleSection .content {
        padding: 0;
        width: calc(100% - 400px)
    }
}

.articleSection .content .content {
    width: 100% !important;
    border-radius: var(--radius) !important
}

.articleSection .content p:nth-child(1) {
    margin: 0
}

.articleSection .content h2 {
    margin-top: 1.413rem !important
}

    .articleSection .content h2:nth-child(1) {
        margin-top: 0;
        padding-top: 0;
        border: none
    }

.articleSection .content a {
    text-decoration: underline;
    text-decoration-thickness: 10%;
    text-decoration-color: var(--color2);
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    cursor: pointer
}

    .articleSection .content a:hover {
        color: var(--color2)
    }

.articleSection .content ul, .articleSection .content ol {
    padding-left: 1.413rem
}

    .articleSection .content ul li, .articleSection .content ol li {
        list-style-position: outside;
        list-style-type: disc
    }

        .articleSection .content ul li::marker, .articleSection .content ol li::marker {
            color: var(--textGray)
        }

    .articleSection .content ol li {
        list-style-type: decimal
    }

.articleSection .content .ctaCard {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: .7075rem;
    border-radius: var(--radius);
    color: var(--black);
    background-color: var(--white);
    border: 1px solid var(--color2);
    text-decoration: none
}

    .articleSection .content .ctaCard:hover {
        color: var(--color1);
        border-color: var(--color1)
    }

    .articleSection .content .ctaCard .ctaTitle {
        color: var(--color1);
        font-weight: 500;
        line-height: 1.3
    }

    .articleSection .content .ctaCard ul {
        margin-top: 10px;
        padding-left: .7075rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 15px 0
    }

        .articleSection .content .ctaCard ul li {
            font-weight: 500;
            list-style-type: disc;
            list-style-position: outside;
            line-height: 1.2
        }

            .articleSection .content .ctaCard ul li::marker {
                color: var(--color2)
            }

    .articleSection .content .ctaCard p {
        font-size: .937rem;
        margin-top: 10px;
        color: inherit;
        line-height: 1.3
    }

    .articleSection .content .ctaCard .filledBtn {
        margin-top: .7075rem
    }

.articleSection :is(h1,h2,h3,h4,h5) {
    color: var(--color1);
    font-weight: 400;
    letter-spacing: 0;
    margin-bottom: 10px
}

.articleSection h1 {
    font-size: clamp(34px,3vw,46px)
}

.articleSection h2 {
    font-family: var(--fontFamily1);
    font-size: clamp(26px,2.5vw,36px)
}

.articleSection h3 {
    font-size: clamp(24px,2vw,32px)
}

.articleSection h4 {
    font-size: clamp(18px,1.5vw,26px)
}

.articleSection h5 {
    font-size: clamp(14px,1.25vw,20px)
}

.articleSection p, .articleSection li, .articleSection a {
    text-align: justify;
    word-break: auto-phrase;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.8
}

.articleSection p {
    margin-top: 1rem !important
}

.articleSection table {
    margin: 10px 0
}

    .articleSection table tr th {
        background-color: var(--lightGray)
    }

    .articleSection table tr td, .articleSection table tr th {
        font-size: .878rem;
        border: 1px solid var(--borderGray);
        white-space: normal
    }

        .articleSection table tr td *, .articleSection table tr th * {
            text-align: left
        }

.articleSection .tagListDiv {
    margin-top: 2.83rem;
    padding: 1rem 0;
    background-color: var(--lightGray);
    border: 1px solid var(--lightGray);
    border-radius: var(--radius);
    overflow-y: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

    .articleSection .tagListDiv .tagList {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: 10px .7075rem;
        gap: 5px;
        border-bottom: 1px solid var(--borderGray)
    }

    .articleSection .tagListDiv .tagTitle {
        color: var(--black);
        font-size: .937rem;
        font-weight: 500;
        width: 100%;
        margin-bottom: 5px
    }

    .articleSection .tagListDiv a {
        color: var(--color1);
        font-size: .733rem;
        padding: 6px 8px;
        border-radius: var(--radius);
        border: 1px solid var(--white);
        background-color: var(--white);
        -webkit-transition: var(--transition1);
        transition: var(--transition1);
        line-height: 1;
        -webkit-text-decoration: auto;
        text-decoration: auto
    }

        .articleSection .tagListDiv a:hover {
            color: var(--white);
            background-color: var(--color1);
            border: 1px solid var(--color1)
        }

.articleSection .topicNav, .articleSection .serviceNav {
    width: 100%
}

@media(min-width: 1280px) {
    .articleSection .topicNav, .articleSection .serviceNav {
        max-height: 90vh;
        position: sticky;
        top: 6rem;
        width: 400px;
        display: inline-block
    }
}

.articleSection .topicNav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1rem 0;
    margin-top: 2.83rem
}

@media(min-width: 1280px) {
    .articleSection .topicNav {
        margin: 0;
        padding-left: 2rem
    }
}

.articleSection .topicNav .menu {
    height: 80vh;
    padding: 1rem 0;
    background: var(--lightGray);
    border: 1px solid var(--lightGray);
    border-radius: var(--radius);
    overflow-y: auto
}

    .articleSection .topicNav .menu .title {
        margin: 0;
        color: var(--gray);
        font-weight: 400;
        padding: 10px 1rem
    }

    .articleSection .topicNav .menu .newsList {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        border-bottom: 1px solid var(--borderGray);
        border-left: 5px solid rgba(0,0,0,0) !important;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        .articleSection .topicNav .menu .newsList:hover {
            border-left: 5px solid var(--color2) !important;
            background: var(--white);
            color: var(--black)
        }

        .articleSection .topicNav .menu .newsList .logo {
            margin-right: auto;
            width: auto;
            max-width: 200px;
            height: 50px;
            margin-bottom: 5px;
            -o-object-fit: contain;
            object-fit: contain
        }

        .articleSection .topicNav .menu .newsList .label {
            margin: 0 !important;
            color: var(--color1);
            font-size: .733rem;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 1px
        }

        .articleSection .topicNav .menu .newsList .newsTitle {
            margin: 0 !important;
            text-align: left !important
        }

    .articleSection .topicNav .menu a {
        width: 100%;
        color: var(--black);
        font-weight: 500;
        line-height: 1.3;
        padding: 10px 1rem;
        padding-left: 1.413rem;
        border-bottom: 1px solid var(--lightGray);
        line-height: 1.3;
        text-align: left;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

@media(min-width: 1280px) {
    .articleSection .topicNav .menu a {
        font-size: .937rem
    }
}

.articleSection .topicNav .menu a:nth-last-child(1) {
    border: none
}

.articleSection .topicNav .menu a::before {
    content: "";
    position: absolute;
    top: 18px;
    left: 10px;
    width: 5px;
    height: 5px;
    background-color: var(--borderGray);
    border-radius: var(--radius)
}

.articleSection .topicNav .menu a:hover {
    color: var(--color1);
    background-color: var(--borderGray)
}

.articleSection .topicNav .dropDownDiv .dropList {
    padding: 0;
    border-bottom: 1px solid var(--borderGray)
}

    .articleSection .topicNav .dropDownDiv .dropList:nth-last-child(1) {
        border-bottom: none
    }

    .articleSection .topicNav .dropDownDiv .dropList .dropBox {
        font-weight: 500;
        padding: 8px 1rem;
        border-bottom: 1px solid var(--lightGray)
    }

@media(min-width: 1280px) {
    .articleSection .topicNav .dropDownDiv .dropList .dropBox {
        font-size: .878rem
    }
}

.articleSection .topicNav .dropDownDiv .dropList .dropContent {
    padding: 10px 0;
    background-color: var(--white)
}

    .articleSection .topicNav .dropDownDiv .dropList .dropContent a {
        width: 100%;
        font-weight: 500
    }

.articleSection .serviceNav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1rem 0
}

@media(min-width: 1280px) {
    .articleSection .serviceNav {
        padding-left: 2rem
    }
}

.articleSection .serviceNav .serviceCard {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1rem 0;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 1rem;
    color: var(--black);
    background-color: var(--color3);
    border-radius: var(--radius);
    overflow: hidden
}

    .articleSection .serviceNav .serviceCard:hover .arrow {
        background-color: var(--color2);
        -webkit-transform: scale(1.3);
        transform: scale(1.3)
    }

        .articleSection .serviceNav .serviceCard:hover .arrow::before {
            opacity: 0
        }

    .articleSection .serviceNav .serviceCard:has(img) {
        min-height: 300px;
        color: var(--white);
        background-color: var(--lightGray)
    }

        .articleSection .serviceNav .serviceCard:has(img)::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
            width: 100%;
            height: 100%;
            border-radius: inherit;
            background: #000;
            background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.8015581232)), to(rgba(255, 255, 255, 0)));
            background: linear-gradient(0deg, rgba(0, 0, 0, 0.8015581232) 0%, rgba(255, 255, 255, 0) 100%)
        }

        .articleSection .serviceNav .serviceCard:has(img) .arrow {
            color: var(--white)
        }

    .articleSection .serviceNav .serviceCard .arrow {
        z-index: 1;
        width: 40px;
        height: 40px;
        margin-bottom: auto;
        margin-left: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        color: var(--color1);
        border-radius: 100%;
        will-change: transform;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }

        .articleSection .serviceNav .serviceCard .arrow::before {
            content: "";
            position: absolute;
            top: 50%;
            left: 50%;
            z-index: -1;
            -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
            width: 100%;
            height: 100%;
            backdrop-filter: blur(30px);
            background-color: hsla(0,0%,100%,.0509803922);
            border: 1px solid hsla(0,0%,100%,.0509803922);
            border-top: 1px solid rgba(241,246,255,.2392156863);
            border-bottom: 1px solid rgba(252,253,255,.0901960784);
            -webkit-box-shadow: inset 0 3px 25px -0.5px rgba(246,250,255,.0588235294);
            box-shadow: inset 0 3px 25px -0.5px rgba(246,250,255,.0588235294);
            border-radius: 100%;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

        .articleSection .serviceNav .serviceCard .arrow i {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            margin: auto;
            color: inherit;
            font-size: .7075rem
        }

    .articleSection .serviceNav .serviceCard img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center
    }

    .articleSection .serviceNav .serviceCard .title {
        color: inherit;
        font-weight: 500;
        text-align: left;
        line-height: 1.1;
        z-index: 2
    }

    .articleSection .serviceNav .serviceCard .arrowBtn {
        color: inherit
    }

.articleSliderSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y)
}

    .articleSliderSection .titleDiv {
        padding-bottom: var(--section-space-y);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 0 20px;
        color: var(--black)
    }

        .articleSliderSection .titleDiv .label {
            margin: 0;
            color: var(--color1);
            font-size: .937rem;
            font-weight: 600;
            text-transform: uppercase
        }

        .articleSliderSection .titleDiv .slideControler {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            gap: 20px;
            margin-left: auto
        }

            .articleSliderSection .titleDiv .slideControler div {
                width: clamp(50px,4vw,70px);
                height: clamp(50px,4vw,70px);
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center;
                color: var(--white);
                background: var(--black);
                border-radius: var(--btnRadius);
                border: 1px solid var(--black);
                cursor: pointer;
                -webkit-transition: var(--transition2);
                transition: var(--transition2)
            }

                .articleSliderSection .titleDiv .slideControler div i {
                    pointer-events: none
                }

                .articleSliderSection .titleDiv .slideControler div:hover {
                    color: var(--white);
                    background: var(--color1);
                    border: 1px solid var(--color1);
                    -webkit-transform: scale(1.05);
                    transform: scale(1.05);
                    -webkit-transition: var(--transition1);
                    transition: var(--transition1)
                }

    .articleSliderSection .sliderWrapper {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 0 20px
    }

        .articleSliderSection .sliderWrapper .articleCard {
            min-width: 90%
        }

@media(min-width: 568px) {
    .articleSliderSection .sliderWrapper .articleCard {
        min-width: 48%
    }
}

@media(min-width: 1024px) {
    .articleSliderSection .sliderWrapper .articleCard {
        min-width: 32.3%
    }
}

.articleListSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    background: var(--lightGray)
}

    .articleListSection .titleDiv {
        text-align: center
    }

        .articleListSection .titleDiv .label {
            margin: 0;
            color: var(--color1);
            font-weight: 500
        }

        .articleListSection .titleDiv .title {
            font-weight: 600
        }

        .articleListSection .titleDiv .tabNavigation {
            width: 100%;
            height: auto;
            clear: both;
            margin: 0 auto;
            padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
            padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
            overflow: hidden;
            margin-top: 1.413rem;
            padding-bottom: .7075rem;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            overflow: auto
        }

            .articleListSection .titleDiv .tabNavigation .tabDiv {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                gap: 10px
            }

                .articleListSection .titleDiv .tabNavigation .tabDiv a {
                    padding: .5rem 1.413rem;
                    background: var(--borderGray);
                    border-radius: var(--radius);
                    white-space: nowrap;
                    cursor: pointer;
                    -webkit-transition: var(--transition1);
                    transition: var(--transition1)
                }

                    .articleListSection .titleDiv .tabNavigation .tabDiv a.active {
                        color: var(--white);
                        background: var(--black)
                    }

    .articleListSection .articleCardDIv {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: .7075rem 2%;
        margin-top: 1.413rem
    }

        .articleListSection .articleCardDIv .card, .articleListSection .articleCardDIv .articleCard {
            width: 100%;
            min-width: auto;
            max-width: 100%
        }

@media(min-width: 768px) {
    .articleListSection .articleCardDIv .card, .articleListSection .articleCardDIv .articleCard {
        width: 48%
    }
}

@media(min-width: 1024px) {
    .articleListSection .articleCardDIv .card, .articleListSection .articleCardDIv .articleCard {
        width: 32%
    }
}

.newsListSection {
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden
}

    .newsListSection .titleDiv {
        text-align: center;
        margin-bottom: 1.413rem
    }

        .newsListSection .titleDiv .label {
            margin: 0;
            color: var(--color1);
            font-weight: 500
        }

        .newsListSection .titleDiv .title {
            font-weight: 500
        }

        .newsListSection .titleDiv .tabNavigation {
            width: 100%;
            height: auto;
            clear: both;
            margin: 0 auto;
            padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
            padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
            overflow: hidden;
            margin-top: 1.413rem;
            padding-bottom: .7075rem;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            overflow: auto
        }

            .newsListSection .titleDiv .tabNavigation .tabDiv {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                gap: 10px
            }

                .newsListSection .titleDiv .tabNavigation .tabDiv a {
                    padding: .5rem 1.413rem;
                    background: var(--borderGray);
                    border-radius: var(--radius);
                    white-space: nowrap;
                    cursor: pointer;
                    -webkit-transition: var(--transition1);
                    transition: var(--transition1)
                }

                    .newsListSection .titleDiv .tabNavigation .tabDiv a.active {
                        color: var(--white);
                        background: var(--black)
                    }

    .newsListSection .cardDiv {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 1.413rem 2%;
        margin-top: 1.413rem
    }

        .newsListSection .cardDiv .card, .newsListSection .cardDiv .newsCard {
            width: 100%;
            min-width: auto;
            max-width: 100%
        }

#videoPopup .centerPopupDiv {
    padding: 5px !important;
    min-height: auto;
    max-width: 1200px
}

    #videoPopup .centerPopupDiv .popupCloseIcon {
        background: rgba(0,0,0,.4901960784);
        border: none;
        color: #fff
    }

        #videoPopup .centerPopupDiv .popupCloseIcon i {
            color: #fff;
            font-size: 20px
        }

    #videoPopup .centerPopupDiv iframe {
        display: block;
        width: 100%;
        height: auto;
        -o-object-fit: cover;
        object-fit: cover;
        aspect-ratio: 16/9;
        border-radius: inherit
    }

#videoPopup .popupCloseBg {
    background: rgba(0,0,0,.7411764706);
    backdrop-filter: blur(3px)
}

.articleCard {
    width: 100%;
    min-width: 200px;
    max-width: 300px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    border-radius: var(--radius);
    cursor: pointer;
    overflow: hidden
}

    .articleCard:hover {
        -webkit-transform: scale(1.025) translateY(-5px);
        transform: scale(1.025) translateY(-5px)
    }

        .articleCard:hover .media::before {
            opacity: .8
        }

        .articleCard:hover .media img {
            -webkit-transform: scale(1.1);
            transform: scale(1.1)
        }

        .articleCard:hover .arrow {
            opacity: 1;
            background-color: var(--color1)
        }

            .articleCard:hover .arrow::before {
                opacity: 0
            }

        .articleCard:hover .content {
            bottom: 0
        }

            .articleCard:hover .content .textBtn {
                opacity: 1
            }

    .articleCard * {
        cursor: inherit;
        -webkit-transition: inherit;
        transition: inherit
    }

    .articleCard .media {
        width: 100%;
        padding-top: 56.25%;
        border-radius: inherit;
        overflow: hidden
    }

        .articleCard .media::before {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
            width: 100%;
            height: 100%;
            background: -webkit-gradient(linear, left top, left bottom, color-stop(13%, rgb(0, 0, 0)), to(rgba(255, 255, 255, 0)));
            background: linear-gradient(180deg, rgb(0, 0, 0) 13%, rgba(255, 255, 255, 0) 100%);
            opacity: .7;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

        .articleCard .media img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
            object-fit: cover;
            -o-object-position: center;
            object-position: center;
            will-change: transform;
            -webkit-transition: var(--transition2);
            transition: var(--transition2)
        }

    .articleCard .arrow {
        position: absolute;
        top: 0;
        right: 1rem;
        z-index: 1;
        width: 50px;
        height: 50px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        color: var(--white);
        border-radius: 100%;
        will-change: transform;
        -webkit-transform: translateY(-120%) rotate(-45deg);
        transform: translateY(-120%) rotate(-45deg);
        opacity: 0
    }

@media(min-width: 1024px) {
    .articleCard .arrow {
        width: 60px;
        height: 60px
    }
}

.articleCard .arrow::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    backdrop-filter: blur(30px);
    background-color: hsla(0,0%,100%,.0509803922);
    border: 1px solid hsla(0,0%,100%,.0509803922);
    border-top: 1px solid rgba(241,246,255,.2392156863);
    border-bottom: 1px solid rgba(252,253,255,.0901960784);
    -webkit-box-shadow: inset 0 3px 25px -0.5px rgba(246,250,255,.0588235294);
    box-shadow: inset 0 3px 25px -0.5px rgba(246,250,255,.0588235294);
    border-radius: 100%;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.articleCard .arrow i {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: auto;
    color: inherit;
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
}

.articleCard .content {
    width: 100%;
    height: 100%;
    padding: 1.413rem 5px;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    z-index: 2
}

    .articleCard .content .label {
        margin: 0;
        margin-bottom: 5px;
        color: var(--color1);
        font-weight: 600
    }

    .articleCard .content .title {
        margin: 0;
        font-family: var(--fontFamily1);
        color: var(--black);
        font-size: 20px;
        font-weight: 400 !important;
        line-height: 1.2;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

    .articleCard .content .textBtn {
        opacity: 0
    }

.newsCard {
    width: 100%;
    min-width: 200px;
    max-width: 300px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    background: var(--white);
    border: 1px solid var(--borderGray);
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    border-radius: var(--radius);
    cursor: pointer;
    overflow: hidden;
    -webkit-box-shadow: rgba(0,0,0,.05) 0px 1px 2px 0px;
    box-shadow: rgba(0,0,0,.05) 0px 1px 2px 0px
}

@media(min-width: 568px) {
    .newsCard {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }
}

.newsCard:hover {
    -webkit-transform: scale(1.025) translateY(-5px);
    transform: scale(1.025) translateY(-5px);
    -webkit-box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px;
    box-shadow: rgba(0,0,0,.1) 0px 20px 25px -5px,rgba(0,0,0,.04) 0px 10px 10px -5px
}

    .newsCard:hover .media::before {
        opacity: .8
    }

    .newsCard:hover .media img {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }

    .newsCard:hover .arrow {
        background-color: var(--color1)
    }

        .newsCard:hover .arrow::before {
            opacity: 0
        }

    .newsCard:hover .content {
        bottom: 0
    }

        .newsCard:hover .content .textBtn {
            opacity: 1
        }

.newsCard * {
    cursor: inherit;
    -webkit-transition: inherit;
    transition: inherit
}

.newsCard .media {
    width: 100%;
    overflow: hidden
}

@media(min-width: 568px) {
    .newsCard .media {
        width: 50%
    }
}

.newsCard .media::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(13%, rgb(0, 0, 0)), to(rgba(255, 255, 255, 0)));
    background: linear-gradient(180deg, rgb(0, 0, 0) 13%, rgba(255, 255, 255, 0) 100%);
    opacity: .7;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.newsCard .media img {
    aspect-ratio: 16/9;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    will-change: transform;
    -webkit-transition: var(--transition2);
    transition: var(--transition2)
}

.newsCard .arrow {
    position: absolute;
    top: 1rem;
    right: 1rem;
    z-index: 1;
    width: 50px;
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--white);
    border-radius: 100%;
    will-change: transform;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

@media(min-width: 1024px) {
    .newsCard .arrow {
        width: 60px;
        height: 60px
    }
}

.newsCard .arrow::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    backdrop-filter: blur(30px);
    background-color: hsla(0,0%,100%,.0509803922);
    border: 1px solid hsla(0,0%,100%,.0509803922);
    border-top: 1px solid rgba(241,246,255,.2392156863);
    border-bottom: 1px solid rgba(252,253,255,.0901960784);
    -webkit-box-shadow: inset 0 3px 25px -0.5px rgba(246,250,255,.0588235294);
    box-shadow: inset 0 3px 25px -0.5px rgba(246,250,255,.0588235294);
    border-radius: 100%;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.newsCard .arrow i {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: auto;
    color: inherit;
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px)
}

.newsCard .content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 1.413rem;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    z-index: 2
}

@media(min-width: 568px) {
    .newsCard .content {
        width: 50%
    }
}

.newsCard .content .logo {
    width: 200px;
    -o-object-fit: contain;
    object-fit: contain;
    margin-bottom: auto
}

@media(min-width: 1024px) {
    .newsCard .content .logo {
        max-height: 80px;
        width: 280px
    }
}

.newsCard .content .label {
    margin: 0;
    margin-bottom: 5px;
    color: var(--color1);
    font-weight: 600
}

.newsCard .content .title {
    margin: 0;
    font-family: var(--fontFamily1);
    color: var(--black);
    font-weight: 500;
    line-height: 1.2;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.newsCard .content .textBtn {
    opacity: 0
}

.newsCard .content .date {
    color: var(--gray);
    font-weight: 400;
    font-size: .878rem;
    text-transform: uppercase
}

    .newsCard .content .date span {
        font-weight: 500
    }

.cityHeroSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden
}

    .cityHeroSection .innerSection {
        height: 80vh;
        border-radius: var(--radius);
        overflow: hidden
    }

    .cityHeroSection .content {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding-bottom: var(--section-space-y);
        padding-top: var(--section-space-y);
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        width: 100%;
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        color: var(--white);
        text-align: center
    }

        .cityHeroSection .content .title {
            max-width: 700px;
            color: var(--color2);
            font-family: var(--font-family1);
            font-weight: 500
        }

        .cityHeroSection .content .subTitle {
            max-width: 700px;
            font-weight: 300
        }

            .cityHeroSection .content .subTitle span {
                font-weight: 500
            }

    .cityHeroSection .media {
        width: 100%;
        height: 100%
    }

        .cityHeroSection .media::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
            width: 100%;
            height: 100%;
            background: #000;
            background: -webkit-gradient(linear, left bottom, left top, color-stop(30%, rgb(0, 0, 0)), to(rgba(0, 0, 0, 0)));
            background: linear-gradient(0deg, rgb(0, 0, 0) 30%, rgba(0, 0, 0, 0) 100%);
            opacity: .8
        }

        .cityHeroSection .media img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
            object-fit: cover;
            -o-object-position: bottom;
            object-position: bottom
        }

.cityOwnerPlansSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 1.413rem 0
}

    .cityOwnerPlansSection .content {
        width: 100%;
        text-align: center
    }

@media(min-width: 1280px) {
    .cityOwnerPlansSection .content {
        width: 40%;
        padding-right: var(--section-space-x);
        text-align: left
    }
}

.cityOwnerPlansSection .planListDiv {
    width: 100%
}

@media(min-width: 1280px) {
    .cityOwnerPlansSection .planListDiv {
        width: 60%
    }
}

.cityOwnerPlansSection .planListDiv .planList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border: 2px solid var(--black);
    border-radius: var(--radius);
    -webkit-box-shadow: rgba(17,17,26,.05) 0px 4px 16px,rgba(17,17,26,.05) 0px 8px 32px;
    box-shadow: rgba(17,17,26,.05) 0px 4px 16px,rgba(17,17,26,.05) 0px 8px 32px;
    overflow: hidden
}

    .cityOwnerPlansSection .planListDiv .planList::before {
        bottom: -20%;
        left: -30%;
        border: 20px solid green;
        -webkit-filter: blur(50px);
        filter: blur(50px)
    }

    .cityOwnerPlansSection .planListDiv .planList::after {
        bottom: -50%;
        right: -30%;
        border: 20px solid green;
        -webkit-filter: blur(90px);
        filter: blur(90px)
    }

    .cityOwnerPlansSection .planListDiv .planList::before, .cityOwnerPlansSection .planListDiv .planList::after {
        content: "";
        position: absolute;
        width: 400px;
        height: 400px;
        border-radius: 100%
    }

    .cityOwnerPlansSection .planListDiv .planList li {
        width: 100%;
        padding: 1.413rem;
        border-right: 1px solid var(--borderGray);
        border-bottom: 1px solid var(--borderGray);
        text-align: center
    }

@media(min-width: 568px) {
    .cityOwnerPlansSection .planListDiv .planList li {
        width: 50%
    }
}

@media(min-width: 768px) {
    .cityOwnerPlansSection .planListDiv .planList li {
        width: 33.33%;
        border-bottom: none
    }
}

.cityOwnerPlansSection .planListDiv .planList li:nth-last-child(1) {
    border: none
}

.cityOwnerPlansSection .planListDiv .planList li h5 {
    font-family: var(--font-family1);
    color: var(--black);
    font-weight: 600;
    text-transform: uppercase
}

.cityOwnerPlansSection .planListDiv .planList li p {
    font-weight: 500
}

.cityOwnerPlansSection .planListDiv .note {
    font-size: .878rem;
    font-weight: 500;
    gap: 5px
}

    .cityOwnerPlansSection .planListDiv .note span {
        font-weight: 800
    }

.cityTransparencySection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    color: var(--white);
    text-align: center;
    overflow: unset
}

    .cityTransparencySection::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 80%;
        background: var(--color1)
    }

    .cityTransparencySection .listDiv {
        margin: 0 auto;
        max-width: 1000px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        gap: 15px 1%;
        margin-top: 1.413rem
    }

        .cityTransparencySection .listDiv li {
            width: 100%;
            padding: 1.413rem;
            border-radius: var(--radius);
            background: hsla(0,0%,100%,.0745098039);
            border: 1px dashed hsla(0,0%,100%,.3215686275)
        }

@media(min-width: 568px) {
    .cityTransparencySection .listDiv li {
        width: 48%
    }
}

@media(min-width: 1024px) {
    .cityTransparencySection .listDiv li {
        width: 24%
    }
}

.cityTransparencySection .text {
    margin: 0 auto;
    margin-top: .7075rem;
    max-width: 750px
}

.cityTransparencySection .cityProofSection {
    margin: 0 auto;
    max-width: 800px;
    color: var(--black);
    background: var(--white);
    border-radius: var(--radius);
    border: 5px solid #b2dba6;
    -webkit-box-shadow: rgba(62,93,50,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    box-shadow: rgba(62,93,50,.25) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    margin-top: 1.413rem;
    overflow: hidden;
    padding: 1.413rem
}

    .cityTransparencySection .cityProofSection .content .title {
        font-weight: 300
    }

        .cityTransparencySection .cityProofSection .content .title span {
            display: block;
            font-weight: 500
        }

.comparisonSection {
    padding-top: var(--section-space-y);
    overflow: hidden
}

    .comparisonSection .titleDiv {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        text-align: center
    }

        .comparisonSection .titleDiv .subTitle {
            color: var(--color1)
        }

    .comparisonSection .arrowContainer {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 100px;
        height: 50px;
        position: absolute;
        top: 50%;
        right: var(--section-space-x);
        z-index: 10;
        -webkit-transform: translateY(-50%) rotate(270deg);
        transform: translateY(-50%) rotate(270deg);
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

@media(min-width: 1024px) {
    .comparisonSection .arrowContainer {
        display: none
    }
}

.comparisonSection .arrowContainer .chevron {
    position: absolute;
    width: 1.5rem;
    height: .3rem;
    opacity: 0;
    -webkit-transform: scale(0.3);
    transform: scale(0.3);
    -webkit-animation: move-chevron 3s ease-out infinite;
    animation: move-chevron 3s ease-out infinite
}

    .comparisonSection .arrowContainer .chevron:first-child {
        -webkit-animation: move-chevron 3s ease-out 1s infinite;
        animation: move-chevron 3s ease-out 1s infinite
    }

    .comparisonSection .arrowContainer .chevron:nth-child(2) {
        -webkit-animation: move-chevron 3s ease-out 2s infinite;
        animation: move-chevron 3s ease-out 2s infinite
    }

    .comparisonSection .arrowContainer .chevron:before, .comparisonSection .arrowContainer .chevron:after {
        content: "";
        position: absolute;
        top: 0;
        height: 100%;
        width: 50%;
        background: var(--color1)
    }

    .comparisonSection .arrowContainer .chevron:before {
        left: 0;
        -webkit-transform: skewY(30deg);
        transform: skewY(30deg)
    }

    .comparisonSection .arrowContainer .chevron:after {
        right: 0;
        width: 50%;
        -webkit-transform: skewY(-30deg);
        transform: skewY(-30deg)
    }

@-webkit-keyframes move-chevron {
    25% {
        opacity: 1
    }

    33.3% {
        opacity: 1;
        -webkit-transform: translateY(2.28rem);
        transform: translateY(2.28rem)
    }

    66.6% {
        opacity: 1;
        -webkit-transform: translateY(3.12rem);
        transform: translateY(3.12rem)
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(4.8rem) scale(0.5);
        transform: translateY(4.8rem) scale(0.5)
    }
}

@keyframes move-chevron {
    25% {
        opacity: 1
    }

    33.3% {
        opacity: 1;
        -webkit-transform: translateY(2.28rem);
        transform: translateY(2.28rem)
    }

    66.6% {
        opacity: 1;
        -webkit-transform: translateY(3.12rem);
        transform: translateY(3.12rem)
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(4.8rem) scale(0.5);
        transform: translateY(4.8rem) scale(0.5)
    }
}

@media(hover: hover) {
    .comparisonSection .tableContainer:hover::before {
        opacity: 0
    }

    .comparisonSection .tableContainer:hover .arrowContainer {
        opacity: 0
    }
}

@media(min-width: 1024px) {
    .comparisonSection .tableContainer {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden
    }
}

.comparisonSection .tableContainer:hover::before {
    opacity: 0
}

.comparisonSection .tableContainer:hover .arrowContainer {
    opacity: 0
}

.comparisonSection .tableContainer::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100px;
    height: 100%;
    z-index: 1;
    background: #fff;
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.76)));
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.76) 100%);
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

@media(min-width: 1024px) {
    .comparisonSection .tableContainer::before {
        display: none
    }
}

.comparisonSection .tableWrapper {
    margin-top: 1.413rem;
    overflow: auto;
    border-top: 2px solid var(--color1);
    border-bottom: 2px solid var(--color1)
}

@media(min-width: 1024px) {
    .comparisonSection .tableWrapper {
        border-radius: var(--radius);
        border: 2px solid var(--color1)
    }
}

.comparisonSection .tableWrapper .comparisonTable thead tr {
    background: #dcf3dc
}

.comparisonSection .tableWrapper .comparisonTable tr td, .comparisonSection .tableWrapper .comparisonTable tr th {
    padding: .7075rem
}

    .comparisonSection .tableWrapper .comparisonTable tr td:nth-child(1), .comparisonSection .tableWrapper .comparisonTable tr th:nth-child(1) {
        font-weight: 600;
        padding-left: var(--section-space-x)
    }

@media(min-width: 1024px) {
    .comparisonSection .tableWrapper .comparisonTable tr td:nth-child(1), .comparisonSection .tableWrapper .comparisonTable tr th:nth-child(1) {
        padding-left: .7075rem
    }
}

.comparisonSection .tableWrapper .comparisonTable tr td:nth-last-child(1), .comparisonSection .tableWrapper .comparisonTable tr th:nth-last-child(1) {
    padding-right: var(--section-space-x)
}

@media(min-width: 1024px) {
    .comparisonSection .tableWrapper .comparisonTable tr td:nth-last-child(1), .comparisonSection .tableWrapper .comparisonTable tr th:nth-last-child(1) {
        padding-right: .7075rem
    }
}

.comparisonSection .tableWrapper .comparisonTable tr th {
    border-bottom: 1px solid #c9dac3
}

    .comparisonSection .tableWrapper .comparisonTable tr th:nth-child(2) {
        color: var(--color1);
        border-left: 2px solid var(--color1);
        border-right: 2px solid var(--color1)
    }

.comparisonSection .tableWrapper .comparisonTable tr td {
    border-bottom: 1px solid var(--borderGray)
}

    .comparisonSection .tableWrapper .comparisonTable tr td:nth-child(2) {
        color: var(--black);
        background: #dcf3dc;
        border-bottom: 1px solid #c7d8c0;
        border-left: 2px solid var(--color1);
        border-right: 2px solid var(--color1)
    }

.comparisonSection .box {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-top: var(--section-space-y)
}

@media(min-width: 1024px) {
    .comparisonSection .box {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: var(--section-space-x)
    }
}

.comparisonSection .box div {
    color: var(--white);
    background: var(--color1);
    border-radius: var(--radius);
    padding: 1.413rem;
    margin-top: 1.413rem
}

@media(min-width: 1024px) {
    .comparisonSection .box div {
        margin: 0;
        min-width: 50%
    }
}

body #mainContainer {
    --headeHeight: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    max-width: var(--container-max-width);
    min-height: 100vh;
    padding-top: 60px;
    margin: 0 auto;
    background: inherit;
    overflow: unset !important
}

@media(min-width: 1024px) {
    body #mainContainer {
        padding: 0;
        padding-top: 105px
    }
}

body #mainContainer .headerSection {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 100;
    width: 100%;
    max-width: var(--container-max-width);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-transition: .3s all cubic-bezier(0.135, 0.9, 0.15, 1);
    transition: .3s all cubic-bezier(0.135, 0.9, 0.15, 1)
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection {
        left: calc(50% - 1px);
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}

body #mainContainer .headerSection.headerIntro .navigation {
    background: var(--white);
    will-change: transforrm
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection.headerIntro .navigation {
        padding-top: 0
    }
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection.headerIntro .subMenu {
        opacity: 0;
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

body #mainContainer .headerSection .navigation {
    clear: both;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    margin: 0 auto;
    width: inherit;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-bottom: 1px solid hsla(0,0%,100%,.1019607843);
    -webkit-transition: .9s all cubic-bezier(0.135, 0.9, 0.15, 1);
    transition: .9s all cubic-bezier(0.135, 0.9, 0.15, 1);
    color: var(--black);
    background: var(--white)
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navigation {
        clear: both;
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-top: 35px
    }
}

body #mainContainer .headerSection .logo {
    z-index: 1;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    padding: 8px 0
}

    body #mainContainer .headerSection .logo img {
        width: 100%;
        max-width: 140px;
        max-height: 90px;
        -o-object-fit: contain;
        object-fit: contain;
        cursor: pointer
    }

body #mainContainer .headerSection .navSection {
    padding-top: 100px;
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 102;
    width: clamp(200px,90%,500px);
    height: 100vh;
    max-height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    color: var(--white);
    background: var(--color1);
    overflow: auto;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    will-change: transform;
    -webkit-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
    transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);
    scroll-behavior: auto;
    -webkit-transition-delay: .3s;
    transition-delay: .3s
}

@media(min-width: 768px) {
    body #mainContainer .headerSection .navSection {
        right: -8px;
        border-radius: 0;
        height: 100vh;
        -webkit-transform: none;
        transform: none;
        -webkit-transform: translateX(120%);
        transform: translateX(120%);
        -webkit-box-shadow: none;
        box-shadow: none
    }
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection {
        position: relative;
        top: unset;
        left: unset;
        width: auto;
        max-width: -webkit-fit-content;
        max-width: -moz-fit-content;
        max-width: fit-content;
        height: auto;
        max-height: auto;
        margin-right: auto;
        -webkit-box-align: unset;
        -ms-flex-align: unset;
        align-items: unset;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding: 0;
        padding-left: .7075rem;
        color: var(--black);
        background-color: rgba(0,0,0,0);
        overflow: unset;
        -webkit-transform: none;
        transform: none;
        will-change: auto;
        overflow: hidden
    }
}

body #mainContainer .headerSection .navSection.navSectionIntro {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition-delay: 0ms;
    transition-delay: 0ms;
    border-left: 1px solid var(--color1);
    -webkit-box-shadow: 0px 0px 100vw 300px rgba(0,0,0,.208);
    box-shadow: 0px 0px 100vw 300px rgba(0,0,0,.208)
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection.navSectionIntro {
        -webkit-transform: none;
        transform: none;
        border: none;
        -webkit-box-shadow: none;
        box-shadow: none
    }
}

body #mainContainer .headerSection .navSection.navSectionIntro .navContainer {
    opacity: 1
}

body #mainContainer .headerSection .navSection .navContainer {
    width: 100%;
    height: 100%;
    max-height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    z-index: 1;
    opacity: 0;
    will-change: opacity;
    -webkit-transition: all .4s ease-in;
    transition: all .4s ease-in;
    -webkit-transition-delay: .6s;
    transition-delay: .6s
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer {
        width: auto;
        height: auto;
        overflow: unset;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        opacity: 1
    }
}

body #mainContainer .headerSection .navSection .navContainer .navMenu {
    width: 100%;
    min-height: 60px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow: hidden
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .navMenu {
        width: auto;
        min-height: auto;
        overflow: unset;
        border: none
    }
}

body #mainContainer .headerSection .navSection .navContainer .navMenu .mainMenu {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    width: 100%;
    min-height: inherit;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    gap: 3px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: clamp(25.62890625px,20.3638955921px + 0.0109687722*100vw,42.30144px);
    font-weight: 400;
    padding-top: 10px;
    padding-bottom: 10px;
    white-space: noWrap;
    text-align: right;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    cursor: pointer;
    overflow: hidden
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .navMenu .mainMenu {
        font-size: .937rem;
        font-weight: 500;
        padding: 1.413rem 8px;
        border: none;
        text-align: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

body #mainContainer .headerSection .navSection .navContainer .navMenu .mainMenu i {
    top: 3px;
    opacity: .5
}

body #mainContainer .headerSection .navSection .navContainer .navMenu .mainMenu:hover {
    color: var(--color1)
}

body #mainContainer .headerSection .navSection .navContainer .navMenu .activeMenu {
    opacity: 1;
    color: var(--color1)
}

body #mainContainer .headerSection .navSection .navContainer:hover .activeMenu {
    color: var(--header-menu-text-mob)
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer:hover .activeMenu {
        color: var(--header-menu-text-web)
    }
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer {
    width: calc(100% + 8px);
    max-height: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--header-submenu-bg-mob);
    overflow: clip;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer {
        position: fixed;
        top: 100%;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        z-index: 100;
        height: 0;
        max-height: -webkit-max-content;
        max-height: -moz-max-content;
        max-height: max-content;
        width: 100%;
        min-width: 100%;
        margin: auto;
        background: var(--header-submenu-bg-web);
        opacity: 0;
        overflow: hidden;
        -webkit-box-shadow: 0px 500px 0px 500px rgba(0,0,0,.3764705882);
        box-shadow: 0px 500px 0px 500px rgba(0,0,0,.3764705882)
    }
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: -1;
    background: var(--header-menu-bg-mob);
    opacity: 0;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    pointer-events: none;
    -webkit-transition: opacity .5s;
    transition: opacity .5s
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer::before {
        display: none
    }
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer.subMenuContainerIntro {
    max-height: clamp(200px,60vh,100vh);
    overflow: auto
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .subMenu {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color: var(--header-submenu-text-mob);
    background: var(--header-submenu-bg-mob);
    gap: 0 .5rem;
    padding: 8px
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .subMenu {
        height: auto;
        width: 100%;
        color: var(--header-submenu-text-web);
        background: var(--header-submenu-bg-web);
        -webkit-transform: translateY(-30px);
        transform: translateY(-30px);
        opacity: 0;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .subMenu a {
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .grid a {
    display: block;
    min-width: 250px;
    width: 250px;
    padding: 10px 1rem;
    margin-bottom: .5rem;
    font-size: 1rem;
    font-weight: 500;
    border-radius: var(--btnRadius);
    background-color: var(--lightGray);
    border: 1px solid var(--lightGray)
}

@media(min-width: 568px) {
    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .grid a {
        margin: 0;
        width: 50%;
        padding: 1rem
    }
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .grid a {
        width: 25%;
        font-size: 1rem;
        font-weight: 500
    }

        body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .grid a:nth-child(4n) {
            border-right: none
        }
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .grid a:hover {
    background-color: var(--white);
    color: var(--color1)
}

    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .grid a:hover::after {
        background-color: var(--color1);
        -webkit-transform: scale(1.2) translateY(-50%);
        transform: scale(1.2) translateY(-50%)
    }

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .grid a::after {
    content: "ï„™";
    position: absolute;
    top: 50%;
    right: 1rem;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    color: var(--white);
    font-family: uicons-regular-rounded !important;
    font-size: .733rem;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    padding: 10px;
    border-radius: 100%;
    background-color: #0e2756;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .list a {
        display: block;
        width: 100%;
        min-width: 200px;
        padding: 1rem;
        font-size: clamp(20.25px,17.3681052632px + 0.0060039474*100vw,29.376px);
        font-weight: 400;
        background-color: var(--lightGray);
        border-bottom: 1px solid var(--borderGray);
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .list a {
        font-size: 1rem;
        font-weight: 500;
        padding: 10px 1rem;
        border-bottom: 1px solid rgba(0,0,0,0)
    }
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .list a:nth-child(1) {
    padding-top: .7075rem;
    border-radius: calc(var(--btnRadius) - .5rem) calc(var(--btnRadius) - .5rem) 0 0
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .list a:nth-last-child(1) {
    border-radius: 0 0 calc(var(--btnRadius) - .5rem) calc(var(--btnRadius) - .5rem);
    padding-bottom: .7075rem
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .list a:hover {
    background-color: var(--white);
    color: var(--color1)
}

    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .list a:hover::after {
        opacity: 1;
        color: var(--color2);
        -webkit-transform: scale(1) translateY(-50%);
        transform: scale(1) translateY(-50%)
    }

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .list a::after {
    content: "ï„™";
    position: absolute;
    top: 50%;
    right: 1rem;
    -webkit-transform: translateY(-50%) scale(0.9);
    transform: translateY(-50%) scale(0.9);
    color: var(--gray);
    font-family: uicons-regular-rounded !important;
    font-size: .733rem;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    padding: 10px;
    border-radius: 100%;
    background-color: rgba(0,0,0,0);
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    opacity: 0
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card {
    width: 100%;
    text-align: left
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card {
        width: auto;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
    }
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card {
    width: 250px;
    min-width: 250px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    margin-bottom: .5rem;
    cursor: pointer
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card {
        margin: 0;
        width: 300px
    }
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card:hover .image::before {
    opacity: .8
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card:hover .image img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1)
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card:hover .image .arrow {
    background-color: var(--color1);
    -webkit-transform: scale(1.3);
    transform: scale(1.3)
}

    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card:hover .image .arrow::before {
        opacity: 0
    }

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card * {
    cursor: inherit;
    -webkit-transition: inherit;
    transition: inherit
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card .image {
    width: 100%;
    padding-top: 100%;
    border-radius: calc(var(--btnRadius) - .5rem);
    overflow: hidden
}

    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card .image::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 1;
        width: 100%;
        height: 70%;
        background: -webkit-gradient(linear, left bottom, left top, color-stop(13%, rgb(0, 10, 28)), to(rgba(255, 255, 255, 0)));
        background: linear-gradient(0deg, rgb(0, 10, 28) 13%, rgba(255, 255, 255, 0) 100%);
        opacity: .7;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card .image img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center;
        will-change: transform;
        -webkit-transition: var(--transition2);
        transition: var(--transition2)
    }

    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card .image .arrow {
        position: absolute;
        top: 1rem;
        right: 1rem;
        z-index: 1;
        width: 40px;
        height: 40px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        color: var(--white);
        border-radius: 100%;
        will-change: transform;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }

        body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card .image .arrow::before {
            content: "";
            position: absolute;
            top: 50%;
            left: 50%;
            z-index: -1;
            -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
            width: 100%;
            height: 100%;
            backdrop-filter: blur(30px);
            background-color: hsla(0,0%,100%,.0509803922);
            border: 1px solid hsla(0,0%,100%,.0509803922);
            border-top: 1px solid rgba(241,246,255,.2392156863);
            border-bottom: 1px solid rgba(252,253,255,.0901960784);
            -webkit-box-shadow: inset 0 3px 25px -0.5px rgba(246,250,255,.0588235294);
            box-shadow: inset 0 3px 25px -0.5px rgba(246,250,255,.0588235294);
            border-radius: 100%;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

        body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card .image .arrow i {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            margin: auto;
            color: inherit;
            font-size: .7075rem
        }

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card .details {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: .7075rem;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    z-index: 1
}

    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .card .card .details .title {
        color: var(--white);
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .box {
    width: 100%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    text-align: left;
    gap: 0;
    padding: 0;
    border-left: 1px solid var(--borderGray)
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .box {
        width: auto
    }
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .box a {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    width: 100%;
    min-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    padding-top: .7075rem;
    padding-bottom: .7075rem;
    border-bottom: 1px solid var(--borderGray);
    border-right: 1px solid var(--borderGray);
    cursor: pointer;
    transition: var(--transition1)
}

    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .box a:hover {
        background: var(--lightGray)
    }

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .box a {
        width: 25%;
        min-width: 25%;
        padding: 2rem
    }
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .box a * {
    cursor: inherit;
    -webkit-transition: inherit;
    transition: inherit
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .box a i {
    width: 40px;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-items: center;
    border-radius: var(--btnRadius);
    color: var(--color1);
    font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
    margin-bottom: .7075rem
}

    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .box a i::before {
        margin: auto
    }

    body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .box a i::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: inherit;
        background-color: var(--color1);
        opacity: .05
    }

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .box a .title {
    font-size: 20px;
    line-height: 1.1
}

body #mainContainer .headerSection .navSection .navContainer .subMenuContainer .box a p {
    margin: 0;
    margin-top: 10px;
    font-size: .733rem;
    font-weight: 400;
    opacity: .6
}

body #mainContainer .headerSection .navSection .navContainer .navMenu:hover .activeMenu {
    color: var(--black)
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .navMenu:hover .subMenuContainer {
        height: auto;
        opacity: 1;
        background-color: var(--header-submenu-bg-web)
    }
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .navMenu:hover .subMenuContainer::before {
        opacity: .3;
        -webkit-transform: none;
        transform: none
    }
}

body #mainContainer .headerSection .navSection .navContainer .navMenu:hover .subMenuContainer .subMenu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .navContainer .navMenu:hover .subMenuContainer .subMenu {
        -webkit-transform: none;
        transform: none;
        opacity: 1;
        -webkit-transition: opacity 1s cubic-bezier(0.135, 0.9, 0.15, 1),-webkit-transform .35s;
        transition: opacity 1s cubic-bezier(0.135, 0.9, 0.15, 1),-webkit-transform .35s;
        transition: transform .35s,opacity 1s cubic-bezier(0.135, 0.9, 0.15, 1);
        transition: transform .35s,opacity 1s cubic-bezier(0.135, 0.9, 0.15, 1),-webkit-transform .35s
    }
}

body #mainContainer .headerSection .navSection .subMenu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    color: var(--black);
    background: var(--lightGray);
    padding-top: 1rem;
    margin-top: 1.413rem;
    -webkit-transition: var(--transition2);
    transition: var(--transition2)
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .subMenu {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        color: var(--black);
        background: var(--lightGray);
        background: #d8f5c9;
        background: var(--lightGray);
        padding-top: 0;
        margin: 0
    }
}

body #mainContainer .headerSection .navSection .subMenu a {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-top: 8px;
    padding-bottom: 8px;
    font-size: clamp(22.78125px,18.8433710526px + 0.0082039145*100vw,35.2512px)
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navSection .subMenu a {
        margin: 0;
        width: auto;
        font-size: .733rem;
        font-weight: 500;
        padding: .5rem 1rem;
        padding-right: 0
    }
}

body #mainContainer .headerSection .navbar {
    margin: 0;
    position: fixed;
    bottom: .7075rem;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 99;
    width: 100%;
    max-width: 350px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 5px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--bg-color);
    border: 1px solid var(--);
    border-radius: var(--btnRadius);
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    margin-left: auto;
    padding: 5px;
    -webkit-box-shadow: rgba(50,50,93,.424) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px;
    box-shadow: rgba(50,50,93,.424) 0px 50px 100px -20px,rgba(0,0,0,.3) 0px 30px 60px -30px
}

@media(min-width: 768px) {
    body #mainContainer .headerSection .navbar {
        position: relative;
        top: unset;
        left: unset;
        bottom: unset;
        z-index: 1;
        width: auto;
        max-width: 100%;
        padding-top: 0;
        padding-bottom: 0;
        padding-left: 0;
        padding-right: 0;
        border: none;
        background: rgba(0,0,0,0);
        -webkit-transform: none;
        transform: none;
        -webkit-box-shadow: none;
        box-shadow: none
    }
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navbar {
        margin: 0
    }
}

body #mainContainer .headerSection .navbar:hover {
    -webkit-box-shadow: hsla(0,0%,100%,.148) 0px 1px 1px 0px inset,rgba(50,50,93,.147) 0px 50px 100px -20px,rgba(0,0,0,.166) 0px 30px 60px -30px;
    box-shadow: hsla(0,0%,100%,.148) 0px 1px 1px 0px inset,rgba(50,50,93,.147) 0px 50px 100px -20px,rgba(0,0,0,.166) 0px 30px 60px -30px
}

@media(min-width: 768px) {
    body #mainContainer .headerSection .navbar:hover {
        -webkit-box-shadow: none;
        box-shadow: none
    }
}

body #mainContainer .headerSection .navbar a, body #mainContainer .headerSection .navbar div {
    height: 60px;
    margin-top: 0;
    font-size: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    white-space: noWrap;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    overflow: hidden
}

@media(min-width: 768px) {
    body #mainContainer .headerSection .navbar a, body #mainContainer .headerSection .navbar div {
        -webkit-box-flex: unset;
        -ms-flex: unset;
        flex: unset;
        height: 40px;
        font-size: .878rem;
        font-weight: 600
    }
}

body #mainContainer .headerSection .navbar .chatBtn {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 5px;
    gap: 5px 0;
    padding-right: 10px;
    padding-left: 60px;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    background: var(--lightGray)
}

@media(min-width: 768px) {
    body #mainContainer .headerSection .navbar .chatBtn {
        padding-left: 45px
    }
}

body #mainContainer .headerSection .navbar .chatBtn img {
    position: absolute;
    top: 50%;
    left: 5px;
    width: 50px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

@media(min-width: 768px) {
    body #mainContainer .headerSection .navbar .chatBtn img {
        width: 30px
    }
}

body #mainContainer .headerSection .navbar .chatBtn .text {
    color: var(--gray);
    font-size: .733rem;
    font-weight: 600
}

body #mainContainer .headerSection .navbar .chatBtn .number {
    color: var(--black);
    font-family: var(--font-family1);
    font-weight: 600;
    letter-spacing: -0.25px
}

body #mainContainer .headerSection .navbar .filledBtn, body #mainContainer .headerSection .navbar .outlinedBtn {
    color: var(--black);
    padding-right: 1rem;
    padding-left: 5px;
    background: var(--lightGray);
    border-color: var(--lightGray);
    gap: 12px
}

    body #mainContainer .headerSection .navbar .filledBtn i, body #mainContainer .headerSection .navbar .outlinedBtn i {
        width: 50px;
        height: 50px;
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
        background: var(--white);
        border-radius: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

@media(min-width: 768px) {
    body #mainContainer .headerSection .navbar .filledBtn i, body #mainContainer .headerSection .navbar .outlinedBtn i {
        width: 30px;
        height: 30px;
        font-size: 1rem
    }
}

@media(min-width: 768px) {
    body #mainContainer .headerSection .navbar .searchBtn {
        display: none
    }
}

body #mainContainer .headerSection .navbar .profileHeader {
    height: 100%;
    padding-left: 0;
    padding-right: 0;
    overflow: unset
}

    body #mainContainer .headerSection .navbar .profileHeader:hover .profileMenu {
        opacity: 1;
        height: auto;
        padding: 1rem 0;
        border: 1px solid var(--borderGray)
    }

    body #mainContainer .headerSection .navbar .profileHeader .profileDetails {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 0 10px;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: 18px 5px;
        padding-right: 1rem;
        overflow: unset;
        background: var(--lightGray);
        border-radius: var(--btnRadius)
    }

        body #mainContainer .headerSection .navbar .profileHeader .profileDetails .avatar {
            width: 50px;
            min-width: 50px;
            height: 50px;
            font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            border-radius: 100%;
            background: var(--white);
            -o-object-fit: cover;
            object-fit: cover;
            -o-object-position: top;
            object-position: top;
            overflow: hidden
        }

@media(min-width: 768px) {
    body #mainContainer .headerSection .navbar .profileHeader .profileDetails .avatar {
        width: 30px;
        min-width: 30px;
        height: 30px;
        -webkit-box-flex: 1rem;
        -ms-flex: 1rem;
        flex: 1rem
    }
}

body #mainContainer .headerSection .navbar .profileHeader .profileDetails .name {
    display: inline-block;
    margin: 0;
    color: var(--black);
    font-size: .878rem;
    font-weight: 600
}

body #mainContainer .headerSection .navbar .profileHeader .profileMenu {
    position: absolute;
    bottom: 100%;
    left: 0;
    z-index: 111;
    height: 0;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    min-width: 200px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    opacity: 0;
    padding: 0;
    background-color: var(--white);
    border-radius: var(--inputRadius);
    border: 1px solid rgba(0,0,0,0);
    -webkit-box-shadow: rgba(17,12,46,.15) 0px 48px 100px 0px;
    box-shadow: rgba(17,12,46,.15) 0px 48px 100px 0px;
    overflow: hidden;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

@media(min-width: 768px) {
    body #mainContainer .headerSection .navbar .profileHeader .profileMenu {
        bottom: unset;
        left: unset;
        right: 0;
        top: 100%
    }
}

body #mainContainer .headerSection .navbar .profileHeader .profileMenu .title {
    width: 100%;
    padding: 5px;
    margin: 0;
    text-align: center;
    color: var(--color1);
    font-size: .937rem;
    font-weight: 500;
    font-family: var(--font-family1);
    text-transform: uppercase
}

body #mainContainer .headerSection .navbar .profileHeader .profileMenu .text {
    color: var(--gray);
    width: 100%;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 0 10px;
    padding: 5px 10px;
    font-size: .878rem
}

    body #mainContainer .headerSection .navbar .profileHeader .profileMenu .text i {
        color: var(--color1)
    }

body #mainContainer .headerSection .navbar .profileHeader .profileMenu a {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 10px;
    color: var(--black);
    font-size: .937rem;
    font-weight: 600;
    padding: 10px .7075rem;
    border-radius: 0;
    border-top: 1px solid var(--borderGray);
    overflow: unset;
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

    body #mainContainer .headerSection .navbar .profileHeader .profileMenu a:hover {
        color: var(--color1);
        background-color: var(--lightGray)
    }

    body #mainContainer .headerSection .navbar .profileHeader .profileMenu a:nth-child(1) {
        margin-top: .7075rem
    }

    body #mainContainer .headerSection .navbar .profileHeader .profileMenu a i {
        font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
        opacity: .5
    }

body #mainContainer .headerSection .wishlistBtn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: auto 0;
    margin-left: auto;
    width: 40px;
    min-width: 40px;
    height: 40px;
    background: var(--lightGray);
    border: 1px solid rgba(0,0,0,0);
    overflow: unset
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .wishlistBtn {
        margin: auto 0
    }
}

body #mainContainer .headerSection .wishlistBtn span {
    position: absolute;
    top: -5px;
    right: -5px;
    z-index: 1;
    width: 20px;
    height: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: .6rem;
    color: var(--white);
    background: var(--black);
    border-radius: 100%;
    border: 1px solid var(--white)
}

body #mainContainer .headerSection .wishlistBtn:hover {
    background: var(--white);
    border: 1px solid var(--color1)
}

body #mainContainer .headerSection .navIcon {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    cursor: pointer;
    z-index: 999
}

@media(min-width: 1024px) {
    body #mainContainer .headerSection .navIcon {
        display: none
    }
}

body #mainContainer .headerSection .navIcon.navIconIntro svg {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    fill: var(--white);
    stroke: var(--white)
}

    body #mainContainer .headerSection .navIcon.navIconIntro svg path:nth-child(1) {
        -webkit-transform: translateX(9px) translateY(1px) rotate(45deg);
        transform: translateX(9px) translateY(1px) rotate(45deg)
    }

    body #mainContainer .headerSection .navIcon.navIconIntro svg path:nth-child(2) {
        opacity: 0
    }

    body #mainContainer .headerSection .navIcon.navIconIntro svg path:nth-child(3) {
        -webkit-transform: translateX(9px) translateY(1px) rotate(-45deg);
        transform: translateX(9px) translateY(1px) rotate(-45deg)
    }

    body #mainContainer .headerSection .navIcon.navIconIntro svg path:nth-child(4) {
        opacity: 0
    }

    body #mainContainer .headerSection .navIcon.navIconIntro svg path:nth-child(5) {
        -webkit-transform: translateX(9px) translateY(1px) rotate(-45deg);
        transform: translateX(9px) translateY(1px) rotate(-45deg)
    }

    body #mainContainer .headerSection .navIcon.navIconIntro svg path:nth-child(6) {
        -webkit-transform: translateX(9px) translateY(1px) rotate(45deg);
        transform: translateX(9px) translateY(1px) rotate(45deg)
    }

body #mainContainer .headerSection .navIcon svg {
    width: 80px;
    height: 60px;
    pointer-events: none;
    margin: auto;
    fill: var(--black);
    stroke: var(--black);
    -webkit-transition: -webkit-transform 500ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: -webkit-transform 500ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 500ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: transform 500ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 500ms cubic-bezier(0.4, 0, 0.2, 1)
}

    body #mainContainer .headerSection .navIcon svg g {
        stroke-width: 6.5;
        stroke-linecap: round
    }

    body #mainContainer .headerSection .navIcon svg path {
        -webkit-transition: stroke-dasharray 500ms cubic-bezier(0.4, 0, 0.2, 1),stroke-dashoffset 500ms cubic-bezier(0.4, 0, 0.2, 1),-webkit-transform 500ms cubic-bezier(0.4, 0, 0.2, 1);
        transition: stroke-dasharray 500ms cubic-bezier(0.4, 0, 0.2, 1),stroke-dashoffset 500ms cubic-bezier(0.4, 0, 0.2, 1),-webkit-transform 500ms cubic-bezier(0.4, 0, 0.2, 1);
        transition: transform 500ms cubic-bezier(0.4, 0, 0.2, 1),stroke-dasharray 500ms cubic-bezier(0.4, 0, 0.2, 1),stroke-dashoffset 500ms cubic-bezier(0.4, 0, 0.2, 1);
        transition: transform 500ms cubic-bezier(0.4, 0, 0.2, 1),stroke-dasharray 500ms cubic-bezier(0.4, 0, 0.2, 1),stroke-dashoffset 500ms cubic-bezier(0.4, 0, 0.2, 1),-webkit-transform 500ms cubic-bezier(0.4, 0, 0.2, 1)
    }

        body #mainContainer .headerSection .navIcon svg path:nth-child(1) {
            -webkit-transform-origin: 36% 40%;
            transform-origin: 36% 40%;
            fill-rule: evenodd
        }

        body #mainContainer .headerSection .navIcon svg path:nth-child(2) {
            fill: rgba(0,0,0,0);
            stroke-dasharray: 29 299
        }

        body #mainContainer .headerSection .navIcon svg path:nth-child(3) {
            -webkit-transform-origin: 35% 63%;
            transform-origin: 35% 63%;
            fill-rule: evenodd
        }

        body #mainContainer .headerSection .navIcon svg path:nth-child(4) {
            stroke-dasharray: 29 299;
            fill: none
        }

        body #mainContainer .headerSection .navIcon svg path:nth-child(5) {
            -webkit-transform-origin: 61% 52%;
            transform-origin: 61% 52%;
            fill-rule: evenodd
        }

        body #mainContainer .headerSection .navIcon svg path:nth-child(6) {
            -webkit-transform-origin: 62% 52%;
            transform-origin: 62% 52%;
            fill-rule: evenodd
        }

body #mainContainer #chatDiv {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: fixed;
    bottom: 2rem;
    right: 2.5%;
    width: 3rem;
    height: 3rem;
    z-index: 999;
    border-radius: 100%;
    -webkit-box-shadow: 0px 12px 24px 1px rgba(0,0,0,.25);
    box-shadow: 0px 12px 24px 1px rgba(0,0,0,.25);
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-transform: translate(none);
    transform: translate(none);
    -webkit-animation-name: chatDiv;
    animation-name: chatDiv;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out
}

    body #mainContainer #chatDiv #chat {
        width: 100%;
        margin: auto
    }

body #mainContainer #chatDivOnScroll {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: fixed;
    bottom: 2rem;
    right: 2.5%;
    width: 3rem;
    height: 3rem;
    z-index: 999;
    border-radius: 100%;
    -webkit-box-shadow: 0px 12px 24px 1px rgba(0,0,0,.25);
    box-shadow: 0px 12px 24px 1px rgba(0,0,0,.25);
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-transform: translate(none);
    transform: translate(none);
    -webkit-animation-name: chatDiv;
    animation-name: chatDiv;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out
}

    body #mainContainer #chatDivOnScroll #chatScroll {
        width: 100%;
        margin: auto
    }

@-webkit-keyframes chatDiv {
    0% {
        -webkit-transform: none;
        transform: none
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }

    100% {
        -webkit-transform: none;
        transform: none
    }
}

@keyframes chatDiv {
    0% {
        -webkit-transform: none;
        transform: none
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }

    100% {
        -webkit-transform: none;
        transform: none
    }
}

body #mainContainer .footerSection {
    margin-top: auto
}

@media(min-width: 1024px) {
    body #mainContainer .footerSection {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden
    }
}

body #mainContainer .footerSection .footerLinkDiv {
    width: 100%;
    width: 100%;
    padding-right: clamp(0px,(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(0px,(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    margin: 0 auto;
    text-align: center
}

    body #mainContainer .footerSection .footerLinkDiv a {
        color: var(--borderGray);
        font-family: var(--font-family1);
        font-size: .937rem;
        font-weight: 400;
        text-transform: uppercase;
        padding: 1rem;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }

        body #mainContainer .footerSection .footerLinkDiv a:hover {
            color: var(--color1)
        }

body #mainContainer .footerSection .footerMain {
    width: 100%;
    padding-top: var(--section-space-y);
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-top: 1px solid hsla(0,0%,100%,.082);
    background-color: var(--color1);
    border-radius: var(--btnRadius) var(--btnRadius) 0 0
}

@media(min-width: 1024px) {
    body #mainContainer .footerSection .footerMain {
        gap: 20px
    }
}

body #mainContainer .footerSection .footerMain .heading {
    font-weight: 400;
    color: var(--white)
}

body #mainContainer .footerSection .footerMain .addressDiv {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media(min-width: 1024px) {
    body #mainContainer .footerSection .footerMain .addressDiv {
        width: 300px;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }
}

body #mainContainer .footerSection .footerMain .addressDiv .logo {
    width: 200px;
    margin-bottom: 1rem
}

body #mainContainer .footerSection .footerMain .addressDiv .titleDiv, body #mainContainer .footerSection .footerMain .addressDiv .address {
    min-width: 350px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid rgba(245,222,179,.1215686275);
    text-align: center
}

@media(min-width: 1024px) {
    body #mainContainer .footerSection .footerMain .addressDiv .titleDiv, body #mainContainer .footerSection .footerMain .addressDiv .address {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        text-align: left;
        padding: 0;
        padding-right: .7075rem;
        margin: 0;
        margin-right: .7075rem;
        border: none
    }
}

body #mainContainer .footerSection .footerMain .addressDiv .address {
    width: 100%;
    color: var(--borderGray)
}

    body #mainContainer .footerSection .footerMain .addressDiv .address .label {
        margin: 0;
        color: var(--white);
        font-size: .937rem;
        font-weight: 600;
        letter-spacing: 2px;
        text-transform: uppercase
    }

    body #mainContainer .footerSection .footerMain .addressDiv .address p {
        max-width: 300px;
        margin-top: 5px;
        font-size: .937rem;
        font-weight: 300;
        margin-bottom: .7075rem;
        letter-spacing: .5px
    }

    body #mainContainer .footerSection .footerMain .addressDiv .address a {
        font-size: .937rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        gap: 10px;
        margin-bottom: 10px;
        font-weight: 400;
        letter-spacing: 1px
    }

        body #mainContainer .footerSection .footerMain .addressDiv .address a p {
            margin: 0;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-align: start;
            -ms-flex-align: start;
            align-items: flex-start;
            line-height: .8;
            font-weight: 400
        }

        body #mainContainer .footerSection .footerMain .addressDiv .address a span {
            margin-top: 6px;
            display: -webkit-inline-box;
            display: -ms-inline-flexbox;
            display: inline-flex;
            font-size: .6rem;
            font-weight: 400;
            letter-spacing: 1px;
            background: hsla(0,0%,100%,.1019607843);
            color: var(--white);
            padding: 5px 10px;
            border-radius: var(--radius)
        }

        body #mainContainer .footerSection .footerMain .addressDiv .address a img {
            width: 17px
        }

body #mainContainer .footerSection .footerMain .footerMenu {
    width: 50%;
    padding: 1.413rem 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    color: var(--borderGray);
    border-right: 1px solid hsla(0,0%,100%,.1450980392);
    border-bottom: 1px solid hsla(0,0%,100%,.1450980392)
}

@media(min-width: 568px) {
    body #mainContainer .footerSection .footerMain .footerMenu {
        width: 25%;
        border-bottom: none
    }
}

@media(min-width: 1024px) {
    body #mainContainer .footerSection .footerMain .footerMenu {
        width: auto;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        border: none
    }
}

@media(min-width: 568px) {
    body #mainContainer .footerSection .footerMain .footerMenu:nth-of-type(3), body #mainContainer .footerSection .footerMain .footerMenu:nth-of-type(5) {
        border-right: 1px solid hsla(0,0%,100%,.1450980392)
    }
}

@media(min-width: 1024px) {
    body #mainContainer .footerSection .footerMain .footerMenu:nth-of-type(3), body #mainContainer .footerSection .footerMain .footerMenu:nth-of-type(5) {
        border-right: none
    }
}

body #mainContainer .footerSection .footerMain .footerMenu:nth-last-of-type(2) {
    border-right: none
}

body #mainContainer .footerSection .footerMain .footerMenu .label {
    margin: 0;
    color: var(--white);
    font-size: .878rem;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 10px
}

body #mainContainer .footerSection .footerMain .footerMenu a {
    font-size: .878rem;
    font-weight: 300;
    padding: 5px 0;
    -webkit-transition: var(--transition1);
    transition: var(--transition1);
    cursor: pointer
}

    body #mainContainer .footerSection .footerMain .footerMenu a:hover {
        color: var(--white)
    }

body #mainContainer .footerSection .footerIsoLogoListSection {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-top: 1.413rem;
    padding-bottom: 1.413rem;
    text-align: center
}

    body #mainContainer .footerSection .footerIsoLogoListSection .title {
        margin: 0 auto;
        width: 100%;
        max-width: 800px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 20px;
        color: var(--white);
        font-family: var(--font-family1);
        font-size: .878rem;
        font-weight: 400;
        letter-spacing: 1px;
        text-transform: uppercase;
        margin-bottom: 1.413rem
    }

        body #mainContainer .footerSection .footerIsoLogoListSection .title::before, body #mainContainer .footerSection .footerIsoLogoListSection .title::after {
            content: "";
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            height: 1px;
            opacity: 1
        }

        body #mainContainer .footerSection .footerIsoLogoListSection .title::before {
            background: #000;
            background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(var(--color2)));
            background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, var(--color2) 100%)
        }

        body #mainContainer .footerSection .footerIsoLogoListSection .title::after {
            background: #fff;
            background: -webkit-gradient(linear, left top, right top, color-stop(1%, var(--color2)), to(rgba(255, 255, 255, 0)));
            background: linear-gradient(90deg, var(--color2) 1%, rgba(255, 255, 255, 0) 100%)
        }

        body #mainContainer .footerSection .footerIsoLogoListSection .title span {
            font-weight: 400
        }

    body #mainContainer .footerSection .footerIsoLogoListSection .logDiv {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        gap: 20px
    }

@media(min-width: 1024px) {
    body #mainContainer .footerSection .footerIsoLogoListSection .logDiv {
        gap: 20px 40px
    }
}

body #mainContainer .footerSection .footerIsoLogoListSection .isoLogo {
    width: 100px
}

body #mainContainer .footerSection .footerBottom {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 1rem;
    border-top: 1px solid hsla(0,0%,100%,.1568627451);
    background-color: var(--color1);
    padding-bottom: 1rem;
    text-align: center;
    padding-bottom: 100px
}

@media(min-width: 568px) {
    body #mainContainer .footerSection .footerBottom {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

@media(min-width: 1024px) {
    body #mainContainer .footerSection .footerBottom {
        padding-bottom: 1rem
    }
}

body #mainContainer .footerSection .footerBottom p, body #mainContainer .footerSection .footerBottom a {
    margin: 0;
    color: var(--borderGray);
    font-size: .733rem;
    font-weight: 400;
    letter-spacing: 1px
}

body #mainContainer .footerSection .footerBottom a {
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

    body #mainContainer .footerSection .footerBottom a:hover {
        color: var(--color2)
    }

body #mainContainer .footerSection .footerBottom .smLink {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

    body #mainContainer .footerSection .footerBottom .smLink a {
        width: 35px;
        height: 35px;
        display: inline-block;
        margin-left: .5rem;
        padding: 8px;
        border-radius: 100%;
        border: 1px solid rgba(0,0,0,0);
        -webkit-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
        cursor: pointer
    }

        body #mainContainer .footerSection .footerBottom .smLink a:hover {
            border: 1px solid var(--color1)
        }

        body #mainContainer .footerSection .footerBottom .smLink a img {
            cursor: pointer
        }

.enquiryForm {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    z-index: 999;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    will-change: transform;
    -webkit-transition: -webkit-transform .7s cubic-bezier(0.77, 0, 0.175, 1);
    transition: -webkit-transform .7s cubic-bezier(0.77, 0, 0.175, 1);
    transition: transform .7s cubic-bezier(0.77, 0, 0.175, 1);
    transition: transform .7s cubic-bezier(0.77, 0, 0.175, 1), -webkit-transform .7s cubic-bezier(0.77, 0, 0.175, 1);
    scroll-behavior: auto;
    -webkit-transition-delay: .3s;
    transition-delay: .3s
}

    .enquiryForm.enquiryFormIntro {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-transition-delay: 0ms;
        transition-delay: 0ms
    }

    .enquiryForm.enquiryFormCloseIntro {
        -webkit-transition: var(--transition2);
        transition: var(--transition2)
    }

    .enquiryForm .enquiryFormClose {
        position: absolute;
        top: .7075rem;
        right: .7075rem;
        z-index: 10;
        width: 50px;
        height: 50px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        border: 1px solid rgba(0,0,0,0);
        border-radius: var(--btnRadius);
        -webkit-transition: var(--transition1);
        transition: var(--transition1);
        cursor: pointer
    }

        .enquiryForm .enquiryFormClose i {
            color: inherit;
            margin: auto;
            cursor: pointer
        }

    .enquiryForm .logo {
        margin: 0 auto;
        margin-bottom: .7075rem
    }

    .enquiryForm .formDiv {
        margin: auto;
        height: auto;
        width: 100%;
        max-width: 700px;
        overflow: hidden
    }

        .enquiryForm .formDiv .tabBarWrapper {
            width: 100%;
            gap: 0;
            border-radius: inherit;
            color: inherit
        }

            .enquiryForm .formDiv .tabBarWrapper .tabBarSlide {
                width: 100%;
                min-width: 100%;
                height: 0;
                border-radius: inherit;
                opacity: 0;
                color: inherit
            }

                .enquiryForm .formDiv .tabBarWrapper .tabBarSlide:nth-child(1) {
                    height: auto;
                    opacity: 1
                }

                .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .title {
                    margin-top: 0;
                    color: inherit
                }

                .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=checkbox]), .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=radio]) {
                    width: 100%;
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-orient: horizontal;
                    -webkit-box-direction: normal;
                    -ms-flex-direction: row;
                    flex-direction: row;
                    -webkit-box-align: unset;
                    -ms-flex-align: unset;
                    align-items: unset;
                    -ms-flex-wrap: wrap;
                    flex-wrap: wrap;
                    overflow: auto;
                    margin: 0;
                    color: inherit
                }

                    .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=checkbox]) label, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=radio]) label {
                        margin: 0;
                        color: inherit
                    }

                    .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=checkbox]) input, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=radio]) input {
                        color: inherit
                    }

                .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .btnDiv {
                    width: 100%
                }

        .enquiryForm .formDiv input[type=date] {
            text-transform: lowercase !important
        }

.enquiryForm {
    width: 100%;
    height: auto;
    clear: both;
    margin: 0 auto;
    padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
    overflow: hidden;
    padding-bottom: var(--section-space-y);
    padding-top: var(--section-space-y);
    position: fixed;
    top: 0;
    right: 0;
    z-index: 101;
    width: 100%;
    height: 100vh;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    background: var(--white)
}

@media(min-width: 1024px) {
    .enquiryForm::before {
        background: #fff;
        background: -webkit-gradient(linear, left bottom, left top, from(rgba(255, 255, 255, 0)), color-stop(49%, var(--darkGray)), to(rgba(255, 253, 229, 0)));
        background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, var(--darkGray) 49%, rgba(255, 253, 229, 0) 100%)
    }
}

.enquiryForm.enquiryFormIntro {
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

.enquiryForm .enquiryFormClose {
    color: inherit;
    background-color: rgba(63,63,63,.0549019608)
}

    .enquiryForm .enquiryFormClose:hover {
        border: 1px solid var(--color1)
    }

.enquiryForm.enquiryFormCloseIntro {
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
}

.enquiryForm .logo {
    max-width: 150px
}

.enquiryForm .formDiv {
    padding: 0;
    color: var(--black);
    background: rgba(0,0,0,0);
    border-radius: var(--radius);
    padding: 2rem
}

    .enquiryForm .formDiv .tabBarWrapper .tabBarSlide {
        width: 100%;
        height: auto;
        clear: both;
        margin: 0 auto;
        padding-left: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        padding-right: clamp(var(--section-space-x),(clamp(100%,100%,var(--container-max-width)) - var(--section-max-width))/2,100%);
        overflow: hidden;
        padding: 1rem;
        border-radius: inherit
    }

@media(min-width: 360px) {
    .enquiryForm .formDiv .tabBarWrapper .tabBarSlide {
        padding: .7075rem
    }
}

.enquiryForm .formDiv .tabBarWrapper .tabBarSlide .title {
    display: block;
    width: 100%;
    text-align: center;
    margin-bottom: .7075rem;
    font-weight: 400
}

.enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=checkbox]:checked) + .btnDiv .nextBtn, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=radio]:checked) + .btnDiv .nextBtn {
    pointer-events: all;
    opacity: 1;
    -webkit-filter: none;
    filter: none
}

.enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=checkbox]), .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=radio]) {
    max-height: 325px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 20px
}

    .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=checkbox]) label, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=radio]) label {
        letter-spacing: 0 !important;
        text-transform: capitalize !important;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        font-weight: 600;
        padding: .7075rem;
        background-color: var(--white);
        border-radius: var(--radius);
        border: 1px solid var(--borderGray)
    }

@media(min-width: 1280px) {
    .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=checkbox]) label, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=radio]) label {
        font-size: 18px
    }
}

.enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=checkbox]) label:has(input:checked), .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=radio]) label:has(input:checked) {
    background: var(--lightGray)
}

.enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=checkbox]) label:hover, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=radio]) label:hover {
    background: var(--inputColor1)
}

.enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=checkbox]) label input, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=radio]) label input {
    border-color: var(--black);
    -webkit-transform: scale(1.2);
    transform: scale(1.2)
}

    .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=checkbox]) label input:checked, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .inputDiv:has([type=radio]) label input:checked {
        border-color: var(--inputColor4)
    }

.enquiryForm .formDiv .tabBarWrapper .tabBarSlide .note {
    background: var(--lightGray);
    font-size: .733rem;
    font-weight: 400;
    border-radius: var(--radius);
    padding: 20px;
    border-radius: calc(var(--radius) - 1rem)
}

@media(min-width: 360px) {
    .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .note {
        border-radius: calc(var(--radius) - .7075rem)
    }
}

.enquiryForm .formDiv .tabBarWrapper .tabBarSlide .note span {
    font-weight: 600
}

.enquiryForm .formDiv .tabBarWrapper .tabBarSlide .btnDiv {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

    .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .btnDiv .nextBtn {
        font-weight: 700;
        pointer-events: none;
        -webkit-filter: saturate(0);
        filter: saturate(0);
        opacity: .3
    }

    .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .btnDiv .nextBtn, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .btnDiv .backBtn, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .btnDiv .filledBtn {
        margin: 0
    }

@media(min-width: 768px) {
    .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .btnDiv .nextBtn, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .btnDiv .backBtn, .enquiryForm .formDiv .tabBarWrapper .tabBarSlide .btnDiv .filledBtn {
        padding: 1rem;
        min-width: 150px
    }
}

.enquiryForm .formDiv .tabBarWrapper .tabBarSlide .btnDiv .backBtn {
    color: var(--black);
    font-weight: 600;
    background: var(--white);
    border: 1px solid var(--borderGray)
}

.enquiryForm .formDiv .heading {
    margin: 0;
    margin-bottom: 2rem;
    width: 100%;
    color: inherit;
    text-transform: uppercase;
    font-weight: 300;
    text-align: center;
    line-height: 1.2
}

    .enquiryForm .formDiv .heading span {
        font-weight: 600
    }

.enquiryForm .formDiv .subText {
    color: inherit;
    max-width: 350px;
    margin: 0 auto;
    margin-top: 10px;
    text-align: center;
    font-size: .937rem;
    font-weight: 500;
    opacity: .6
}

.enquiryForm .formDiv label {
    text-transform: uppercase;
    font-size: .733rem;
    font-weight: 500
}

.enquiryForm .formDiv input:not([type=radio]):not([type=checkbox]), .enquiryForm .formDiv textarea, .enquiryForm .formDiv select, .enquiryForm .formDiv datalist, .enquiryForm .formDiv selector selected, .enquiryForm .formDiv select {
    color: inherit;
    font-weight: 300;
    background-color: var(--white)
}

.enquiryForm .formDiv #mobile .countryCode {
    position: absolute;
    top: 7px;
    left: 50px;
    z-index: 2;
    color: inherit;
    font-weight: 500;
    opacity: .5
}

.enquiryForm .formDiv #mobile input {
    padding-left: 85px
}

.enquiryForm .formDiv .iconInput {
    color: inherit
}

    .enquiryForm .formDiv .iconInput i {
        color: var(--gray)
    }

.enquiryForm .formDiv .checkboxListDiv {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-top: 25px
}

    .enquiryForm .formDiv .checkboxListDiv label {
        position: relative;
        text-transform: capitalize;
        font-weight: 600 !important;
        letter-spacing: 0;
        cursor: pointer;
        margin-bottom: 3px
    }

        .enquiryForm .formDiv .checkboxListDiv label:nth-child(odd) {
            width: 30%
        }

        .enquiryForm .formDiv .checkboxListDiv label:nth-child(even) {
            width: 70%
        }

        .enquiryForm .formDiv .checkboxListDiv label input {
            border-radius: 5px
        }

.enquiryForm .formDiv .btnDiv a, .enquiryForm .formDiv .btnDiv button {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

    .enquiryForm .formDiv .btnDiv a input, .enquiryForm .formDiv .btnDiv button input {
        background: rgba(0,0,0,0);
        color: inherit;
        border: none;
        font-weight: inherit;
        padding: 0
    }

.enquiryForm .formDiv .btnDiv #formsubmit {
    font-weight: 500;
    background: var(--color1)
}

.authenticationPopup {
    position: fixed;
    bottom: 0;
    right: 100%;
    z-index: 999;
    width: 100%;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0;
    background: rgba(0,0,0,0)
}

    .authenticationPopup.popupIntro .popupWindow {
        -webkit-transform: translateZ(0) !important;
        transform: translateZ(0) !important;
        -webkit-transition-delay: .3s;
        transition-delay: .3s;
        -webkit-transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
        transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1) !important
    }

    .authenticationPopup .popupWindow {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        max-height: 75vh;
        padding: var(--btnRadius) var(--btnRadius) 0 0;
        background-color: var(--white);
        border-top: 1px solid var(--borderGray);
        border-radius: 1rem 1rem 0 0;
        -webkit-box-shadow: rgba(50,50,93,0) 0px -50px 100px -20px,rgba(0,0,0,0) 0px -30px 60px -30px;
        box-shadow: rgba(50,50,93,0) 0px -50px 100px -20px,rgba(0,0,0,0) 0px -30px 60px -30px;
        z-index: 2;
        -webkit-transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1);
        transition: all .6s cubic-bezier(0.25, 0.8, 0.25, 1);
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        will-change: transform;
        scroll-behavior: auto;
        -webkit-transition-delay: 0ms;
        transition-delay: 0ms
    }

        .authenticationPopup .popupWindow::before {
            content: "";
            position: absolute;
            top: 7px;
            left: 50%;
            width: 50px;
            height: 5px;
            border-radius: var(--radius);
            background-color: var(--borderGray);
            z-index: 1;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
            pointer-events: none
        }

@media(min-width: 1024px) {
    .authenticationPopup .popupWindow::before {
        display: none
    }
}

.authenticationPopup .popupWindow::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 35px;
    height: 35px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--textGray);
    font-family: var(--icon-style) !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    padding: 5px;
    border-radius: 100%;
    background-color: var(--black);
    border: 1px solid var(--black);
    border-top: 1px solid var(--darkGray);
    opacity: 0;
    z-index: 1;
    -webkit-transform: translate(-50%, -150%);
    transform: translate(-50%, -150%);
    pointer-events: none;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

@media(min-width: 1024px) {
    .authenticationPopup .popupWindow::after {
        display: none
    }
}

.authenticationPopup .popupWindowClose, .authenticationPopup .popupCloseBg {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    pointer-events: none;
    background-color: rgba(0,0,0,0);
    -webkit-transition: all 375ms ease-out;
    transition: all 375ms ease-out
}

@media(min-width: 1024px) {
    .authenticationPopup {
        position: fixed;
        bottom: 0;
        right: 100%;
        z-index: 380;
        width: 100%;
        height: 100vh;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        margin: 0;
        overflow: hidden
    }

        .authenticationPopup .popupWindow {
            position: relative;
            bottom: unset;
            left: unset;
            width: 100%;
            max-width: 450px;
            min-height: 350px;
            max-height: 650px;
            padding: 2rem;
            background-color: var(--white);
            border-radius: var(--radius);
            -webkit-box-shadow: rgba(50,50,93,0) 0px -50px 100px -20px,rgba(0,0,0,0) 0px -30px 60px -30px;
            box-shadow: rgba(50,50,93,0) 0px -50px 100px -20px,rgba(0,0,0,0) 0px -30px 60px -30px;
            z-index: 2;
            -webkit-transition: all 375ms ease-out;
            transition: all 375ms ease-out;
            -webkit-transform: translateY(110%) scale(0.95);
            transform: translateY(110%) scale(0.95)
        }

            .authenticationPopup .popupWindow::before {
                content: "";
                position: absolute;
                top: 7px;
                left: 50%;
                width: 50px;
                height: 5px;
                border-radius: var(--radius);
                background-color: var(--borderGray);
                z-index: 1;
                -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
                pointer-events: none
            }
}

@media(min-width: 1024px)and (min-width: 1024px) {
    .authenticationPopup .popupWindow::before {
        display: none
    }
}

@media(min-width: 1024px) {
    .authenticationPopup .popupWindow::after {
        content: "";
        position: absolute;
        top: -50px;
        left: 50%;
        width: 25px;
        height: 25px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        color: var(--borderGray);
        font-family: var(--icon-style) !important;
        font-style: normal;
        font-weight: normal !important;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        padding: 5px;
        border-radius: 100%;
        background-color: var(--black);
        border: 1px solid var(--gray);
        opacity: 0;
        z-index: 1;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        pointer-events: none;
        -webkit-transition: var(--transition1);
        transition: var(--transition1)
    }
}

@media(min-width: 1024px)and (min-width: 1024px) {
    .authenticationPopup .popupWindow::after {
        display: none
    }
}

@media(min-width: 1024px) {
    .authenticationPopup .popupWindowClose {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1;
        width: 100%;
        height: 100%;
        pointer-events: none;
        background-color: rgba(0,0,0,0);
        -webkit-transition: all 375ms ease-out;
        transition: all 375ms ease-out;
        cursor: pointer
    }
}

.authenticationPopup .popupWindow {
    padding-top: 2rem
}

    .authenticationPopup .popupWindow .heading {
        margin: 0;
        margin-bottom: .7075rem;
        width: 100%;
        text-align: center
    }

    .authenticationPopup .popupWindow .popupCloseIcon {
        display: none;
        position: absolute;
        top: .7075rem;
        right: .7075rem;
        z-index: 1;
        width: 30px;
        height: 30px;
        padding: 5px;
        background-color: var(--lightGray);
        border-radius: var(--radius);
        cursor: pointer
    }

@media(min-width: 1024px) {
    .authenticationPopup .popupWindow .popupCloseIcon {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

.authenticationPopup .popupWindow .popupCloseIcon i {
    margin: auto;
    cursor: pointer
}

.authenticationPopup .popupWindow .btnDiv {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 1rem
}

    .authenticationPopup .popupWindow .btnDiv a, .authenticationPopup .popupWindow .btnDiv button {
        margin: 0;
        width: 48%
    }

.authenticationPopup.popupIntro {
    -webkit-transform: none;
    transform: none;
    opacity: 1
}

.authenticationPopup .popupWindow {
    padding: 0;
    margin-top: 60px;
    border-radius: 1rem 1rem 0 0
}

@media(min-width: 1024px) {
    .authenticationPopup .popupWindow {
        border-radius: 1rem
    }
}

.authenticationPopup .popupWindow::before, .authenticationPopup .popupWindow::after {
    display: none
}

.authenticationPopup .popupWindow .popupCloseIcon {
    top: -60px;
    left: 53%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 50px;
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--white);
    border-color: rgba(156,156,156,.4431372549);
    background-color: rgba(0,0,0,.301)
}

    .authenticationPopup .popupWindow .popupCloseIcon i {
        color: inherit
    }

.authenticationPopup .popupWindow .authenticationDiv {
    width: 100%;
    height: 100%;
    padding-top: 1.413rem;
    overflow: hidden;
    border-radius: 1rem;
    background: radial-gradient(at 98.6% 68.3%, #d4ffe1 0px, transparent 50%),radial-gradient(at 4.8% 63.1%, #f2f5ff 0px, transparent 50%),radial-gradient(at 7.8% 85.1%, #bdd4ff 0px, transparent 50%),radial-gradient(at 21% 80.7%, #c9dcff 0px, transparent 50%),radial-gradient(at 64.3% 80.3%, #e6fff0 0px, transparent 50%)
}

.authenticationPopup .popupWindow .heading {
    margin-bottom: 2rem
}

.authenticationPopup .popupWindow .slideNavTab {
    --tab-highlight-color: var(--black);
    width: 90%;
    max-width: 700px;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: center;
    margin-bottom: 2.83rem
}

    .authenticationPopup .popupWindow .slideNavTab::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: calc(100% + 9px);
        height: calc(100% + 7px);
        background-color: var(--lightGray);
        border-radius: 17.98rem;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        -webkit-box-shadow: rgba(0,0,0,.05) 0px 1px 2px 0px;
        box-shadow: rgba(0,0,0,.05) 0px 1px 2px 0px
    }

    .authenticationPopup .popupWindow .slideNavTab:hover .tabMenu {
        color: var(--black)
    }

        .authenticationPopup .popupWindow .slideNavTab:hover .tabMenu::before {
            background-color: rgba(0,0,0,0)
        }

    .authenticationPopup .popupWindow .slideNavTab:hover .activeTabMenu {
        color: var(--white)
    }

@media(min-width: 768px) {
    .authenticationPopup .popupWindow .slideNavTab:hover .activeTabMenu {
        color: var(--black)
    }
}

.authenticationPopup .popupWindow .slideNavTab:hover .activeTabMenu::before {
    background: var(--white)
}

.authenticationPopup .popupWindow .slideNavTab:hover .tabMenuBorder {
    opacity: 1;
    background-color: var(--white)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu {
    width: var(--tab-width-mobile);
    min-width: var(--tab-width-mobile);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--black);
    font-size: 1rem;
    font-weight: 500;
    white-space: nowrap;
    padding: 13px 5px;
    border-radius: .7075rem;
    z-index: 1;
    cursor: pointer;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

@media(min-width: 768px) {
    .authenticationPopup .popupWindow .slideNavTab .tabMenu {
        font-size: 1rem
    }
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 94%;
    border-radius: 17.98rem;
    letter-spacing: 1px;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border: 1px solid rgba(0,0,0,0);
    z-index: -1;
    -webkit-transition: var(--transition1);
    transition: var(--transition1)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:hover {
    color: var(--color1)
}

    .authenticationPopup .popupWindow .slideNavTab .tabMenu:hover ~ .tabMenuBorder {
        opacity: 1;
        background-color: var(--white)
    }

.authenticationPopup .popupWindow .slideNavTab .tabMenu:active ~ .tabMenuBorder {
    background-color: var(--white);
    opacity: 1;
    -webkit-transition: all 250ms ease-out;
    transition: all 250ms ease-out
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu img {
    width: 25px
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu i {
    top: 1px;
    font-size: .878rem
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu i, .authenticationPopup .popupWindow .slideNavTab .tabMenu img {
    margin-right: 10px
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(1).active ~ .tabMenuBorder {
    -webkit-transform: translateX(0%);
    transform: translateX(0%)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(1):hover ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(1):hover ~ .active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(1):focus ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(1):focus ~ .active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(1):active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(1):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(0%);
    transform: translateX(0%)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(2).active ~ .tabMenuBorder {
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(2):hover ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(2):hover ~ .active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(2):focus ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(2):focus ~ .active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(2):active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(2):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(3).active ~ .tabMenuBorder {
    -webkit-transform: translateX(200%);
    transform: translateX(200%)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(3):hover ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(3):hover ~ .active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(3):focus ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(3):focus ~ .active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(3):active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(3):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(200%);
    transform: translateX(200%)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(4).active ~ .tabMenuBorder {
    -webkit-transform: translateX(300%);
    transform: translateX(300%)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(4):hover ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(4):hover ~ .active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(4):focus ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(4):focus ~ .active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(4):active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(4):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(300%);
    transform: translateX(300%)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(5).active ~ .tabMenuBorder {
    -webkit-transform: translateX(400%);
    transform: translateX(400%)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(5):hover ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(5):hover ~ .active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(5):focus ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(5):focus ~ .active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(5):active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(5):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(400%);
    transform: translateX(400%)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(6).active ~ .tabMenuBorder {
    -webkit-transform: translateX(500%);
    transform: translateX(500%)
}

.authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(6):hover ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(6):hover ~ .active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(6):focus ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(6):focus ~ .active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(6):active ~ .tabMenuBorder, .authenticationPopup .popupWindow .slideNavTab .tabMenu:nth-child(6):active ~ .active ~ .tabMenuBorder {
    -webkit-transform: translateX(500%);
    transform: translateX(500%)
}

.authenticationPopup .popupWindow .slideNavTab .activeTabMenu {
    color: var(--black);
    font-weight: 500
}

    .authenticationPopup .popupWindow .slideNavTab .activeTabMenu::before {
        background-color: var(--white);
        -webkit-box-shadow: rgba(0,0,0,.041) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px;
        box-shadow: rgba(0,0,0,.041) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px
    }

    .authenticationPopup .popupWindow .slideNavTab .activeTabMenu:hover {
        color: var(--color1)
    }

.authenticationPopup .popupWindow .slideNavTab .tabMenuBorder {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 100%;
    width: var(--tab-width-mobile);
    min-width: var(--tab-width-mobile);
    border: 0;
    border-radius: 17.98rem;
    background-color: var(--white);
    border: 1px solid rgba(0,0,0,0);
    -webkit-transition: all 375ms ease-out;
    transition: all 375ms ease-out;
    will-change: transform,background;
    opacity: 0;
    -webkit-box-shadow: rgba(0,0,0,.1) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px;
    box-shadow: rgba(0,0,0,.1) 0px 4px 6px -1px,rgba(0,0,0,.06) 0px 2px 4px -1px
}

.authenticationPopup .popupWindow .tabBarWrapper {
    min-height: 300px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-transition: var(--transition2) !important;
    transition: var(--transition2) !important
}

    .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide {
        scrollbar-width: auto;
        scrollbar-color: var(--textGray) var(--white)
    }

        .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide::-webkit-scrollbar {
            width: 30px;
            height: 8px
        }

        .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide::-webkit-scrollbar-track {
            background: var(--borderGray)
        }

        .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide::-webkit-scrollbar-thumb {
            background-color: var(--borderGray);
            border-radius: 10px;
            border: 2px solid var(--white)
        }

    .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide {
        max-height: 500px !important;
        padding-left: 2rem;
        padding-right: 2rem;
        padding-bottom: 2rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        overflow: auto
    }

        .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide input, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide textarea, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide select {
            font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
            font-weight: 500;
            background: hsla(0,0%,100%,.4196078431)
        }

            .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide input::-webkit-input-placeholder, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide textarea::-webkit-input-placeholder, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide select::-webkit-input-placeholder {
                color: var(--darkGray);
                font-size: 1rem;
                font-weight: 500
            }

            .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide input::-moz-placeholder, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide textarea::-moz-placeholder, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide select::-moz-placeholder {
                color: var(--darkGray);
                font-size: 1rem;
                font-weight: 500
            }

            .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide input:-ms-input-placeholder, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide textarea:-ms-input-placeholder, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide select:-ms-input-placeholder {
                color: var(--darkGray);
                font-size: 1rem;
                font-weight: 500
            }

            .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide input::-ms-input-placeholder, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide textarea::-ms-input-placeholder, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide select::-ms-input-placeholder {
                color: var(--darkGray);
                font-size: 1rem;
                font-weight: 500
            }

            .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide input::placeholder, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide textarea::placeholder, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide select::placeholder {
                color: var(--darkGray);
                font-size: 1rem;
                font-weight: 500
            }

        .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide .forgotPass, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide .bottomLink {
            width: 100%;
            font-weight: 500;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            text-align: center;
            margin-bottom: 1.413rem;
            cursor: pointer;
            -webkit-transition: var(--transition1);
            transition: var(--transition1)
        }

            .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide .forgotPass:hover, .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide .bottomLink:hover {
                opacity: .8
            }

        .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide .bottomLink {
            margin-top: 1rem
        }

            .authenticationPopup .popupWindow .tabBarWrapper .tabBarSlide .bottomLink span {
                color: var(--color1);
                font-weight: 500;
                margin-left: 1rem;
                cursor: pointer
            }

    .authenticationPopup .popupWindow .tabBarWrapper .chooseOption {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 0
    }

        .authenticationPopup .popupWindow .tabBarWrapper .chooseOption a {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -ms-flex-pack: justify;
            justify-content: space-between;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            width: 100%;
            padding: 2rem;
            font-size: clamp(18px,15.9536842105px + 0.0042631579*100vw,24.48px);
            font-weight: 600;
            border-bottom: 1px solid rgba(12,193,0,.2392156863);
            text-align: left
        }

            .authenticationPopup .popupWindow .tabBarWrapper .chooseOption a:hover {
                color: var(--gray)
            }

                .authenticationPopup .popupWindow .tabBarWrapper .chooseOption a:hover i {
                    color: var(--white);
                    background-color: var(--color1);
                    border: 1px solid var(--color1);
                    -webkit-transform: scale(1.2);
                    transform: scale(1.2);
                    -webkit-box-shadow: rgba(0,0,0,.1) 0px 10px 15px -3px,rgba(0,0,0,.05) 0px 4px 6px -2px;
                    box-shadow: rgba(0,0,0,.1) 0px 10px 15px -3px,rgba(0,0,0,.05) 0px 4px 6px -2px
                }

            .authenticationPopup .popupWindow .tabBarWrapper .chooseOption a:nth-last-child(1) {
                border-bottom: none
            }

            .authenticationPopup .popupWindow .tabBarWrapper .chooseOption a i {
                width: 35px;
                height: 35px;
                border-radius: 100%;
                border: 1px solid var(--black);
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-transition: var(--transition1);
                transition: var(--transition1)
            }

.authenticationPopup button {
    width: 100%
}

.authenticationPopup #loginForm .seperateText {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px;
    margin: 1.413rem 0
}

    .authenticationPopup #loginForm .seperateText::before, .authenticationPopup #loginForm .seperateText::after {
        content: "";
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        height: 1px;
        opacity: 1
    }

    .authenticationPopup #loginForm .seperateText::before {
        background: #000;
        background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(var(--color1)));
        background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, var(--color1) 100%)
    }

    .authenticationPopup #loginForm .seperateText::after {
        background: #fff;
        background: -webkit-gradient(linear, left top, right top, color-stop(1%, var(--color1)), to(rgba(255, 255, 255, 0)));
        background: linear-gradient(90deg, var(--color1) 1%, rgba(255, 255, 255, 0) 100%)
    }

.authenticationPopup #signupForm .otpSection {
    margin-top: 1.413rem
}

    .authenticationPopup #signupForm .otpSection .otpInput .inputBox {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

        .authenticationPopup #signupForm .otpSection .otpInput .inputBox .reOtpBtn {
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            color: var(--color1);
            font-weight: 500;
            gap: 10px
        }

            .authenticationPopup #signupForm .otpSection .otpInput .inputBox .reOtpBtn i {
                font-size: 14px;
                color: inherit
            }