:root {
    --base-100: #fff;
    --base-200: #000;
    --primary-100: #F15845;
    --primary-200: #FA6F48;
    --primary-300: #003fb9;
    --primary-400: #D74B3A;
    --secondary-100: #36C5F0;
    --secondary-200: #ECB22E;
    --secondary-300: #2EB67D;
    --secondary-400: #E3828D;
    --secondary-500: #0080FF;
    --secondary-600: #E01E1E;
    --secondary-700: #CCABCD;
    --gray-100: #232323;
    --gray-200: #646464;
    --gray-300: #888;
    --gray-400: #D9D9D9;
    --gray-500: #EFEFEF;
    --gray-600: #F8F8F8;
    --gray-700: #2B2F32;
    --pastel-100: #F6EFE8;
    --pastel-200: #F3D1CB;
    --pastel-300: #F5F3DD;
    --pastel-400: #F0E9FF;
    --pastel-500: #E9F3E4;
    --pastel-600: #E9EFF5;
    --pastel-700: #E2F5FF;
    --weight-extraBold: 800;
    --weight-bold: 700;
    --weight-medium: 500;
    --weight-normal: 400
}

/*
@media (min-width: 1440px) {
    html {
        font-size: 1.111vw;
    }
}
*/

@media (min-width: 1536px) {
    .col-2xl-7 {
        flex: 0 0 auto;
        width: 66.66666667%;
    }
    .col-2xl-5 {
        flex: 0 0 auto;
        width: 33.33333333%;
    }
}

.leftBgimg {
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #f4ece3;
}

@media (min-width: 1280px) {
    .leftBgimg {
        background-size: contain;
    }

}
@media (min-width: 768px) and (max-width: 1023px) {
    .loginSec .col-md-6.col-lg-7 {
        flex: 0 0 auto;
        width: 58%;
    }
    .loginSec .col-md-6.col-lg-5 {
        flex: 0 0 auto;
        width: 42%;
    }
}
@media (min-width: 1024px){
    .loginSec .col-2xl-7 {
        flex: 0 0 auto;
        width: 62%;
    }
    .loginSec .col-2xl-5 {
        flex: 0 0 auto;
        width: 38%;
    }
}
    html {
        font-size: 16px;
    }

    .h-full {
        height: 100vh;
    }

    @media (min-width: 1200px) {
        html {
            font-size: 14px; /* 16px - 2px */
        }
    }

    @media (min-width: 1366px) {
        html {
            font-size: 16px; /* 16px - 1px */
        }
    }

    @media (min-width: 1400px) {
        html {
            font-size: clamp(1rem, calc(0.5vw + 0.8vh), 5rem);
            /*font-size: 1.101vw !important;*/
        }
    }

    .p-20 {
        padding: 1.25rem;
        padding-right:1rem !important;
    }

    @media (min-width:768px) {
        .p-20 {
            padding: 2.5rem;
        }
    }

    @media (min-width: 1024px) {
        .p-20 {
            padding: 4rem;
        }
    }

    @media (min-width: 1280px) {
        .p-20 {
            padding: 5rem;
        }
    }

    .pt-29 {
        padding-top: 1.75rem
    }

    .max-w-38rm {
        max-width: 38.875rem;
    }

    .h64 {
        font-size: 2rem;
        font-weight: 800;
        line-height: 100%;
    }

    @media (min-width: 1280px) {
        .h64 {
            font-size: 4rem;
            font-weight: 800;
            line-height: 100%;
        }
    }

    @media (min-width: 1024px) and (max-width: 1280px) {
        .h64 {
            font-size: 3rem;
        }
    }

    .inline-block {
        display: inline-block;
    }

    .loginSecTop a img {
        width: 8.5rem;
        height: auto;
    }

    .text-base-100 {
        color: #fff !important
    }

    .bg-base-100 {
        background-color: #fff !important
    }

    .border-base-100 {
        border-color: #fff !important
    }

    .text-base-200 {
        color: #000 !important
    }

    .bg-base-200 {
        background-color: #000 !important
    }

    .border-base-200 {
        border-color: #000 !important
    }

    .text-primary-100 {
        color: #F15845 !important
    }

    .bg-primary-100 {
        background-color: #F15845 !important
    }

    .border-primary-100 {
        border-color: #F15845 !important
    }

    .text-primary-200 {
        color: #1D4ED8 !important
    }

    .bg-primary-200 {
        background-color: #1D4ED8 !important
    }

    .border-primary-200 {
        border-color: #1D4ED8 !important
    }

    .text-primary-300 {
        color: #320B33 !important
    }

    .bg-primary-300 {
        background-color: #320B33 !important
    }

    .border-primary-300 {
        border-color: #320B33 !important
    }

    .text-primary-400 {
        color: #D74B3A !important
    }

    .bg-primary-400 {
        background-color: #D74B3A !important
    }

    .border-primary-400 {
        border-color: #D74B3A !important
    }

    .text-secondary-100 {
        color: #36C5F0 !important
    }

    .bg-secondary-100 {
        background-color: #36C5F0 !important
    }

    .border-secondary-100 {
        border-color: #36C5F0 !important
    }

    .text-secondary-200 {
        color: #ECB22E !important
    }

    .bg-secondary-200 {
        background-color: #ECB22E !important
    }

    .border-secondary-200 {
        border-color: #ECB22E !important
    }

    .text-secondary-300 {
        color: #2EB67D !important
    }

    .bg-secondary-300 {
        background-color: #2EB67D !important
    }

    .border-secondary-300 {
        border-color: #2EB67D !important
    }

    .text-secondary-400 {
        color: #E3828D !important
    }

    .bg-secondary-400 {
        background-color: #E3828D !important
    }

    .border-secondary-400 {
        border-color: #E3828D !important
    }

    .text-secondary-500 {
        color: #0080FF !important
    }

    .bg-secondary-500 {
        background-color: #0080FF !important
    }

    .border-secondary-500 {
        border-color: #0080FF !important
    }

    .text-secondary-600 {
        color: #E01E1E !important
    }

    .bg-secondary-600 {
        background-color: #E01E1E !important
    }

    .border-secondary-600 {
        border-color: #E01E1E !important
    }

    .text-secondary-700 {
        color: #CCABCD !important
    }

    .bg-secondary-700 {
        background-color: #CCABCD !important
    }

    .border-secondary-700 {
        border-color: #CCABCD !important
    }

    .text-gray-100 {
        color: #232323 !important
    }

    .bg-gray-100 {
        background-color: #232323 !important
    }

    .border-gray-100 {
        border-color: #232323 !important
    }

    .text-gray-200 {
        color: #646464 !important
    }

    .bg-gray-200 {
        background-color: #646464 !important
    }

    .border-gray-200 {
        border-color: #646464 !important
    }

    .text-gray-300 {
        color: #888 !important
    }

    .bg-gray-300 {
        background-color: #888 !important
    }

    .border-gray-300 {
        border-color: #888 !important
    }

    .text-gray-400 {
        color: #D9D9D9 !important
    }

    .bg-gray-400 {
        background-color: #D9D9D9 !important
    }

    .border-gray-400 {
        border-color: #D9D9D9 !important
    }

    .text-gray-500 {
        color: #EFEFEF !important
    }

    .bg-gray-500 {
        background-color: #EFEFEF !important
    }

    .border-gray-500 {
        border-color: #EFEFEF !important
    }

    .text-gray-600 {
        color: #F8F8F8 !important
    }

    .bg-gray-600 {
        background-color: #F8F8F8 !important
    }

    .border-gray-600 {
        border-color: #F8F8F8 !important
    }

    .text-gray-700 {
        color: #2B2F32 !important
    }

    .bg-gray-700 {
        background-color: #2B2F32 !important
    }

    .border-gray-700 {
        border-color: #2B2F32 !important
    }

    .text-pastel-100 {
        color: #F6EFE8 !important
    }

    .bg-pastel-100 {
        background-color: #F6EFE8 !important
    }

    .border-pastel-100 {
        border-color: #F6EFE8 !important
    }

    .text-pastel-200 {
        color: #F3D1CB !important
    }

    .bg-pastel-200 {
        background-color: #F3D1CB !important
    }

    .border-pastel-200 {
        border-color: #F3D1CB !important
    }

    .text-pastel-300 {
        color: #F5F3DD !important
    }

    .bg-pastel-300 {
        background-color: #F5F3DD !important
    }

    .border-pastel-300 {
        border-color: #F5F3DD !important
    }

    .text-pastel-400 {
        color: #F0E9FF !important
    }

    .bg-pastel-400 {
        background-color: #F0E9FF !important
    }

    .border-pastel-400 {
        border-color: #F0E9FF !important
    }

    .text-pastel-500 {
        color: #E9F3E4 !important
    }

    .bg-pastel-500 {
        background-color: #E9F3E4 !important
    }

    .border-pastel-500 {
        border-color: #E9F3E4 !important
    }

    .text-pastel-600 {
        color: #E9EFF5 !important
    }

    .bg-pastel-600 {
        background-color: #E9EFF5 !important
    }

    .border-pastel-600 {
        border-color: #E9EFF5 !important
    }

    .text-pastel-700 {
        color: #E2F5FF !important
    }

    .bg-pastel-700 {
        background-color: #E2F5FF !important
    }

    .border-pastel-700 {
        border-color: #E2F5FF !important
    }

    .font-extraBold {
        font-weight: 800 !important
    }

    .font-bold {
        font-weight: 700 !important
    }

    .font-medium {
        font-weight: 500 !important
    }

    .font-normal {
        font-weight: 400 !important
    }



    body {
        font-family: "Inter",sans-serif;
        /* font-family: "Manrope", sans-serif;*/
        font-size: 1rem;
        line-height: 1.5rem;
    }

    h1, h2, h3, h4, h5, h6 {
        margin: 0;
        font-weight: var(--weight-bold)
    }

    .h1, .h2, .h3, .h4, .h5, .h6 {
        font-weight: var(--weight-normal)
    }



    h1, .h1 {
        font-size: 1.625rem;
        line-height: 2rem
    }

    @media (min-width: 1280px) {
        h1, .h1 {
            font-size: 2rem;
            line-height: 2.5rem
        }
    }

    h2, .h2 {
        font-size: 1.625rem;
        line-height: 2rem
    }

    h3, .h3 {
        font-size: 1.25rem;
        line-height: 1.5rem
    }

    h4, .h4 {
        font-size: 1.125rem;
        line-height: 1.5rem
    }

    h5, .h5 {
        font-size: 1rem;
        line-height: 1.5rem
    }

    h6, .h6 {
        font-size: 0.875rem;
        line-height: 1.25rem
    }

    .text-sm {
        font-size: 0.8125rem;
        line-height: 1.125rem
    }

    .text-md {
        font-size: 0.75rem;
        line-height: 1rem
    }

    .text-xl {
        font-size: 1.75rem;
        line-height: 2.125rem
    }

    label, .label, .text-xs {
        font-size: 0.625rem;
        line-height: 0.75rem
    }



    body {
        color: var(--gray-100)
    }

    .container-fluid {
        padding: 0 2.5rem
    }

    .z-index-1 {
        z-index: 1
    }

    .flex-grow-1 {
        flex-grow: 1
    }

    a, button {
        outline: none;
        -webkit-transition: all 0.3s;
        transition: all 0.3s
    }

    button {
        padding: 0;
        background: none;
        border: 0;
        box-shadow: none
    }

    .btn-primary {
        padding: 0.75rem 1.5rem;
        display: inline-block;
        text-align: center;
        border-radius: 0.375rem;
        font-size: 1rem;
        line-height: 1.5rem;
        font-weight: var(--weight-bold);
        text-decoration: none;
        background-color: var(--primary-200);
        color: var(--base-100)
    }

        .btn-primary:hover {
            background-color: var(--primary-300);
            box-shadow: 0px 8px 16px rgba(74,21,75,0.12)
        }

        .btn-primary:disabled {
            background-color: var(--gray-400);
            box-shadow: none
        }

    .btn-primary-outlinehover {
        padding: 0.75rem 1.5rem;
        display: inline-block;
        text-align: center;
        border-radius: 0.375rem;
        font-size: 1rem;
        line-height: 1.5rem;
        font-weight: var(--weight-bold);
        text-decoration: none;
        background-color: var(--primary-200);
        color: var(--base-100);
        border: 1px solid var(--primary-200);
    }

        .btn-primary-outlinehover:hover {
            background-color: transparent;
            color: var(--primary-200);
            box-shadow: 0px 8px 16px rgba(74,21,75,0.12);
        }

        .btn-primary-outlinehover:disabled {
            /* background-color: var(--primary-200);*/
            opacity: .7;
            box-shadow: none
        }

    .btn-white {
        padding: 0.75rem 1.5rem;
        display: inline-block;
        text-align: center;
        border-radius: 0.375rem;
        font-size: 1rem;
        line-height: 1.5rem;
        font-weight: var(--weight-bold);
        text-decoration: none;
        background-color: rgba(255,255,255,0.3);
        color: var(--gray-100);
        border: 1px solid rgba(136,136,136,0.3)
    }

        .btn-white:hover {
            border-color: var(--primary-200);
            background-color: var(--base-100);
            box-shadow: 0px 8px 16px rgba(0,0,0,0.12);
            color: var(--gray-100)
        }

        .btn-white:disabled {
            background-color: var(--gray-600);
            border-color: var(--gray-400);
            color: var(--gray-400);
            box-shadow: none
        }

            .btn-white:disabled svg path {
                fill: var(--gray-400)
            }

    .btn-secondary {
        padding: 0.75rem 1.5rem;
        display: inline-block;
        text-align: center;
        border-radius: 0.375rem;
        font-size: 1rem;
        line-height: 1.5rem;
        font-weight: var(--weight-bold);
        text-decoration: none;
        background-color: var(--primary-100);
        color: var(--base-100)
    }

        .btn-secondary:hover {
            background-color: var(--primary-400);
            box-shadow: 0px 8px 16px rgba(241,88,69,0.12)
        }

        .btn-secondary:disabled {
            box-shadow: none;
            background-color: var(--gray-400);
            color: var(--base-100)
        }

    .btn-outline {
        padding: 0.75rem 1.5rem;
        display: inline-block;
        text-align: center;
        border-radius: 0.375rem;
        font-size: 1rem;
        line-height: 1.5rem;
        font-weight: var(--weight-bold);
        text-decoration: none;
        background-color: var(--primary-200);
        color: var(--base-100);
        background-color: transparent;
        color: var(--primary-200);
        border: 1px solid var(--gray-400)
    }

        .btn-outline:hover {
            background-color: var(--primary-300);
            box-shadow: 0px 8px 16px rgba(74,21,75,0.12)
        }

        .btn-outline:disabled {
            background-color: var(--gray-400);
            box-shadow: none
        }

        .btn-outline:hover {
            color: var(--base-100)
        }

    .btn-sm {
        padding: 0.625rem 1rem;
        border-radius: 0.375rem;
        font-size: 0.875rem;
        line-height: 1.25rem;
        font-weight: var(--weight-bold)
    }

    .btn-xs {
        padding: 0.375rem 0.75rem;
        border-radius: 50rem;
        font-size: 0.75rem;
        line-height: 1rem;
        font-weight: var(--weight-bold)
    }

    input[type="password"]::-ms-reveal,
    input[type="password"]::-ms-clear {
        display: none;
    }

    .btn-link {
        text-decoration: none;
        color: var(--primary-200)
    }

        .btn-link:hover {
            color: #000;
            cursor: pointer
        }

    .form-group {
        margin-bottom: 1rem;
        position: relative
    }

    input[type='text'], input[type='email'], input[type='number'], input[type='password'], textarea, input[type='tel'] {
        width: 100%;
        padding: 0.815rem 1rem;
        background-color: hsl(0deg 0% 0% / 2%);
        border: 1px solid var(--gray-400);
        border-radius: 0.375rem;
        box-shadow: none;
        outline: none;
        color: var(--gray-100);
        font-size: .875rem;
        line-height: 1.25rem;
    }

        input[type='text']::placeholder, input[type='email']::placeholder, input[type='number']::placeholder, input[type='password']::placeholder, textarea::placeholder {
            color: var(--gray-300)
        }

        input[type='text']:focus, input[type='email']:focus, input[type='number']:focus, input[type='password']:focus, textarea:focus {
            border-color: var(--primary-200);
            box-shadow: 0px 6px 12px rgba(0,0,0,0.12)
        }

        input[type='text'].error, input[type='email'].error, input[type='number'].error, input[type='password'].error, textarea.error {
            border-color: var(--primary-100)
        }

        input[type='text'].input_alert, input[type='email'].input_alert, input[type='number'].input_alert, input[type='password'].input_alert, textarea.input_alert {
            border-bottom-left-radius: 0;
            border-bottom-right-radius: 0
        }

            input[type='text'].input_alert + .alert, input[type='email'].input_alert + .alert, input[type='number'].input_alert + .alert, input[type='password'].input_alert + .alert, textarea.input_alert + .alert {
                border-top-left-radius: 0;
                border-top-right-radius: 0
            }

    .input_valid {
        position: absolute;
        right: 0.875rem;
        top: 1.563rem;
        transform: translateY(-50%)
    }

        .input_valid svg {
            display: block
        }

    .chatBtn {
        position: fixed;
        bottom: 1rem;
        right: 1.5rem;
        z-index: 9
    }

    .alert {
        padding: 0.875rem 1rem 0.875rem 3rem;
        text-align: left;
        background-repeat: no-repeat;
        background-position: 1rem 0.75rem;
        border-width: 1px;
        border-style: solid
    }

        .alert.alert-warning {
            background-color: var(--primary-100);
            border-color: var(--primary-100);
            color: var(--base-100);
            border-radius: 0.375rem;
            background-image: url(../images/icon_warning.svg)
        }

    .checkBox {
        position: relative;
        padding-left: 1.75rem;
        cursor: pointer
    }

        .checkBox .checkBoxCheck {
            border: 1px solid var(--gray-400);
            border-radius: 0.25rem;
            display: inline-block;
            width: 1.25rem;
            height: 1.25rem;
            vertical-align: top;
            position: absolute;
            left: 0;
            background-repeat: no-repeat;
            background-position: center;
            -webkit-transition: all 0.3s;
            transition: all 0.3s
        }

        .checkBox input[type="checkbox"] {
            display: none
        }

            .checkBox input[type="checkbox"]:checked ~ .checkBoxCheck {
                background-color: var(--gray-100);
                border: 1px solid var(--gray-100);
                background-image: url(../images/check_white.svg)
            }

    .loginSec {
        /*background-color: var(--pastel-100);
            background-image: url(../images/login_bg.svg);
    padding: 2.5rem 2.5rem 1.5rem;*/
        height: 100vh;
        background-repeat: no-repeat;
        background-position: left bottom;
        position: relative;
        overflow: auto;
        display: flex;
        flex-direction: column
    }

    .text-danger {
        font-size: .75rem;
        line-height: 1rem;
        text-align: left;
        width: 100%;
        display: block;
    }
    /*.loginSec.loginSecImg {
        background-image: url(../images/login_bg_2.svg)
    }
*/
    @media (min-width: 640px) {
        .sm\:block {
            display: block;
        }
    }

    #subtitletext {
        text-wrap: pretty;
    }

    .loginSecBottom {
        text-align: center;
        padding-bottom: 3.5rem;
    }

        .loginSecBottom a {
            font-weight: 500;
            text-decoration: underline;
        }

    .logoutState {
        max-width: 30rem;
    }

    .loginFlow {
        position: relative;
        z-index: 1;
    }

    .loginSecInner {
        /*  position: relative;
    z-index: 1;
     flex-grow: 1;
    display: flex;*/
        text-align: center;
        flex-direction: column
    }

    .text-balance {
        text-wrap: balance;
    }

    .loginSecTop {
        flex-grow: 1;
        display: flex;
        flex-direction: column;
    }

    .flex {
        display: flex;
    }

    .justify-center {
        justify-content: center;
    }

    .justify-start {
        justify-content: flex-start;
    }

    .items-center {
        align-items: center;
    }

    .centerBorder {
        width: 1px;
        background-color: #fff;
        height: 25.2rem;
        animation: borderDrop 2s ease-out forwards;
        opacity: .25;
        margin: 0 1.781rem;
    }

    @keyframes borderDrop {
        0% {
            height: 0;
        }

        100% {
            height: 25.2rem;
        }
    }

    .text-right {
        text-align: right;
        margin: 0;
    }

    .text-left {
        text-align: left;
    }

    .mt-5 {
        padding-top: 5rem;
        margin: 0;
    }

    .opacity-75 {
        opacity: 0.75;
    }

    .p-text {
        font-size: 0.875rem;
        line-height: 1.25rem;
    }

    @media (min-width: 768px) {
        .h3 {
            font-size: 1.5rem;
            line-height: 2rem;
            letter-spacing: -0.02rem;
        }

        .inputFieldop div#signupForm_Tooltip {
            position: absolute;
            right: 0.438rem;
            z-index: 0;
        }
    }

    @media (min-width: 1024px) {
        .h3 {
            font-size: 2rem;
            line-height: 1.2;
            letter-spacing: -0.02rem;
        }

        .p-text {
            font-size: 1rem;
            line-height: 1.4;
        }
    }

    .loginSecForm {
        width: 100%;
        max-width: 42.8125rem;
        margin: 1.5rem auto;
        flex-grow: 1
    }

    .OnLogin a svg {
        width: 1.25rem;
        height: 1.25rem;
    }

    .max-w-72 {
        max-width: 18rem;
    }

    .min-w-11 {
        min-width: 11rem;
    }

    .block {
        display: block;
    }

    .logo img {
        width: 2.125rem;
        height: 2.625rem;
    }

    .loginArea {
        max-width: 25.5rem;
        margin: auto;
        width: 100%;
        padding: 2rem 1rem;
    }

    .chatBtn img {
        width: 6.25rem;
        height: 6.25rem;
    }

    .inputFieldop {
        position: relative;
    }

        .inputFieldop input {
            padding-right: 2.5rem;
        }

        /*   .inputFieldop input::placeholder {
                font: 1rem;
            }*/

        .inputFieldop div#signupForm_Tooltip svg {
            width: 1.25rem;
            height: 1.25rem;
        }

            .inputFieldop div#signupForm_Tooltip svg path {
                fill: #f15845;
            }

    .loginSecForm form {
        /*      width: 100%;
        max-width: 27.375rem;
        margin: 0 auto*/
    }

    .validationError {
        text-align: left;
        font-size: 0.75rem;
    }

    .loginDivider {
        margin: 2rem 0;
        position: relative
    }

        .loginDivider:before, .loginDivider:after {
            content: "";
            height: 1px;
            background-color: var(--gray-400);
            width: calc(50% - 1.1875rem);
            position: absolute;
            top: 50%
        }

        .loginDivider:before {
            left: 0
        }

        .loginDivider:after {
            right: 0
        }

        .loginDivider span {
            padding: 0 1.1875rem;
            position: relative;
            z-index: 1;
            background-color: #fff;
        }

    .otp_group {
        display: flex;
        align-items: center
    }

        .otp_group input {
            height: 2.688rem;
            margin: 0 0.25rem;
            text-align: center;
            font-size: 1.25rem;
            font-family: Monospaced, monospace;
            border: 0.094rem solid #e2e2e2;
            border-radius: 0.5rem !important;
            color: rgb(0, 0, 0);
            background: #f7f7f7;
            box-shadow: rgb(229, 229, 229) 0.25px 0.5px 1px 0px;
            transition: background-color 0.3s, border-color 0.1s;
            min-height: 3rem;
        }

            .otp_group input:nth-child(1), .otp_group input:nth-child(5) {
                border-radius: 0.375rem 0 0 0.375rem
            }

            .otp_group input:nth-child(3), .otp_group input:nth-child(7) {
                border-radius: 0 0.375rem 0.375rem 0
            }

        .otp_group span {
            margin: 0 0.5rem
        }

    .come-from-modal.right.show .modal-dialog {
        right: 0px;
        height: 100%;
        overflow: auto;
        opacity: 1;
        transition: opacity 0.35s;
        transition: right 0.35s
    }

    .come-from-modal.right .modal-dialog {
        margin-right: 0;
        height: 100vh;
        margin-top: 0;
        margin-bottom: 0;
        max-width: 95%;
        opacity: 0;
        right: -1.875rem;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        transition: all 0.3s
    }

    .come-from-modal.right .modal-dialog-scrollable .modal-content {
        height: 100%;
        border-radius: 0
    }

    .come-from-modal.right .btnClose {
        cursor: pointer
    }

    .modal-header {
        justify-content: end
    }

        .modal-header .modal-backdrop {
            opacity: 0.6 !important
        }

    .scrollRight {
        padding: 2.1875rem 3.375rem
    }

    .termsList {
        max-width: 14.125rem;
        position: fixed
    }

        .termsList li {
            text-align: right;
            margin-bottom: 1rem
        }

            .termsList li a {
                color: var(--gray-100)
            }

                .termsList li a.active {
                    font-weight: 700
                }

    @media (max-width: 767px) {
        .inputFieldop div#signupForm_Tooltip {
            display: none !important;
        }

        .chatBtn img {
            width: 4.25rem;
            height: 4.25rem;
        }

        .chatBtn {
            position: fixed;
            bottom: 0rem;
            right: 0;
            z-index: 9;
        }
    }

    ul, ul li {
        list-style: none
    }

    a, a:hover {
        text-decoration: none
    }

    .w-54 {
        width: 54%
    }

    .mwidth-86 {
        width: 86%
    }

    .w-86 {
        width: 86%
    }

    .w-90 {
        width: 90%
    }

    .mb-32 {
        margin-bottom: 2rem
    }

    .mb-20 {
        margin-bottom: 1.25rem
    }

    .pb-60 {
        padding-bottom: 60px
    }

    .px-60 {
        padding-left: 60px;
        padding-right: 60px
    }

    .mb-12 {
        margin-bottom: 0.75rem
    }

    .py-72 {
        padding-top: 72px;
        padding-bottom: 72px
    }

    .pb-32 {
        padding-bottom: 2rem
    }

    .rounded-10 {
        border-radius: 0.625rem
    }

    .borderBottom {
        border-bottom: 1px solid var(--gray-400)
    }

    .textDecoration {
        text-decoration-line: underline;
        text-decoration-style: dotted;
        text-decoration-color: var(--gray-100)
    }

    .form-check.custom-switch input {
        float: left;
        padding: 0.8125rem 0;
        width: 3rem;
        background-color: var(--primary-200) !important;
        box-shadow: none !important;
        border: none !important;
        margin: 0px 0.625rem;
        background-size: 1.9375rem;
        border-radius: 0.9375rem;
        background-position: center left -2px;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important
    }

    .form-check.custom-switch .form-check-label {
        float: left
    }

        .form-check.custom-switch .form-check-label.active {
            font-weight: 700 !important;
            color: var(--gray-100) !important
        }

    .form-check.custom-switch:checked {
        background-position: center right -2px
    }

    .disc {
        background: var(--base-100);
        border-radius: 0.3125rem;
        color: var(--primary-100);
        padding: 0.1875rem 0.3125rem
    }

    .planDashboard .card {
        position: relative;
        -webkit-transition: all 0.3s;
        transition: all 0.3s
    }

        .planDashboard .card .posBtn {
            position: absolute;
            top: -40px;
            border-bottom-left-radius: 0;
            border-bottom-right-radius: 0;
            width: 101.2%;
            left: -2px;
            display: none
        }

        .planDashboard .card.active {
            transform: scale(1.1);
            z-index: 999;
            border: 2px solid var(--primary-200) !important;
            border-top-left-radius: 0 !important;
            border-top-right-radius: 0 !important;
            border-bottom-left-radius: 6px !important;
            border-bottom-right-radius: 6px !important
        }

            .planDashboard .card.active .posBtn {
                display: block
            }

        .planDashboard .card:before {
            content: '';
            position: absolute;
            top: 0;
            right: 0;
            background-image: url("../images/planFrame.png");
            background-repeat: no-repeat;
            width: 72px;
            height: 63px
        }

        .planDashboard .card:nth-child(1) {
            border-radius: 6px 0px 0px 6px
        }

        .planDashboard .card:nth-child(2) {
            border-radius: 0;
            border-right: 0;
            border-left: 0
        }

        .planDashboard .card:nth-child(3) {
            border-radius: 0 6px 6px 0
        }

        .planDashboard .card .price-info .year-val {
            display: none
        }

        .planDashboard .card .price-info .month-val {
            display: block
        }

        .planDashboard .card .price-info.year_value .year-val {
            display: block
        }

        .planDashboard .card .price-info.year_value .month-val {
            display: none
        }

    .planTable .posBtn {
        position: absolute;
        top: -15px;
        left: 50%;
        transform: translateX(-50%)
    }

    .planTable thead {
        border-bottom: transparent
    }

        .planTable thead th {
            width: 25%;
            border-top: 1px solid var(--gray-400)
        }

            .planTable thead th:not(:last-child) {
                border-right: 1px solid var(--gray-400)
            }

            .planTable thead th:not(:first-child) {
                text-align: center
            }

            .planTable thead th:nth-child(3) {
                background-color: var(--pastel-100);
                position: relative;
                border-bottom: 1px solid var(--pastel-100)
            }

            .planTable thead th p {
                margin-bottom: 8px;
                margin-top: 1.5rem
            }

    .planTable tbody tr:first-child td p:nth-child(5) {
        height: 60px
    }

    .planTable tbody tr:first-child td p:nth-child(6) {
        height: 40px
    }

    .planTable tbody tr:last-child td {
        border-bottom: transparent !important
    }

    .planTable tbody tr td:nth-child(3) {
        background-color: var(--pastel-100)
    }

    .planTable tbody tr td:not(:last-child) {
        border-right: 1px solid var(--gray-400);
        border-bottom: 1px solid var(--gray-400)
    }

    .planTable tbody tr td:last-child {
        border-bottom: 1px solid var(--gray-400)
    }

    .planTable tbody tr td:not(:first-child) {
        text-align: center
    }

    .planTable tbody tr td p {
        margin-bottom: 1.5rem
    }

    .planTable tbody tr td .dash {
        position: relative
    }

        .planTable tbody tr td .dash:after {
            position: absolute;
            content: '';
            width: 14.67px;
            background-color: var(--gray-100);
            top: 50%;
            left: 50%;
            height: 1px;
            transform: translate(-50%, -50%)
        }

    .planTable tbody tr td .head {
        margin-top: 1.5rem
    }

    .planAccordian .accordion-item {
        border-right: 0;
        border-left: 0;
        border-top: 0
    }

        .planAccordian .accordion-item .accordion-button {
            background: none;
            color: var(--gray-700);
            box-shadow: none;
            font-weight: 500;
            padding: 1.5rem 0
        }

            .planAccordian .accordion-item .accordion-button:not(.collapsed)::after {
                background-image: url(../images/minus.png);
                background-position: center;
                background-size: 100%
            }

            .planAccordian .accordion-item .accordion-button:after {
                background-image: url(../images/plus.png);
                background-position: center;
                background-size: 100%
            }

    .planAccordian .accordion-body {
        padding: 0 0 1.5rem 0
    }

    .smooth-scroll {
        scroll-behavior: smooth
    }

    .selectric-wrapper {
        position: relative;
        cursor: pointer;
        text-align: left
    }

    .selectric-responsive {
        width: 100%
    }

    .selectric {
        border: 1px solid var(--gray-200);
        border-radius: 3px;
        background: #F8F8F8;
        position: relative;
        overflow: hidden;
        background-color: var(--base-100);
        border: 1px solid var(--gray-400);
        border-radius: 0.375rem
    }

        .selectric .label {
            display: block;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            margin: 0;
            font-size: 1rem;
            line-height: 1.5em;
            color: #444;
            height: 1.5em;
            user-select: none;
            padding: 0.75rem 3.375rem 0.75rem 1rem;
            height: auto;
            color: var(--gray-100)
        }

        .selectric .button {
            display: block;
            position: absolute;
            right: 0;
            top: 0;
            bottom: 0;
            background-image: url(../images/select_arrow_down.svg);
            background-repeat: no-repeat;
            background-position: center;
            color: transparent !important;
            width: 3.375rem
        }

    .selectric-focus .selectric {
        box-shadow: 0px 6px 12px rgba(0,0,0,0.12);
        border-color: var(--primary-200)
    }

    .selectric-hover .selectric {
        box-shadow: 0px 6px 12px rgba(0,0,0,0.12);
        border-color: var(--primary-200)
    }

        .selectric-hover .selectric .button {
            color: #a2a2a2
        }

            .selectric-hover .selectric .button:after {
                border-top-color: #a2a2a2
            }

    .selectric-open {
        z-index: 9999
    }

        .selectric-open .selectric {
            border-color: var(--primary-200);
            box-shadow: 0px 6px 12px rgba(0,0,0,0.12)
        }

        .selectric-open .selectric-items {
            display: block
        }

    .selectric-disabled {
        filter: alpha(opacity=50);
        opacity: 0.5;
        cursor: default;
        user-select: none
    }

    .selectric-hide-select {
        position: relative;
        overflow: hidden;
        width: 0;
        height: 0
    }

        .selectric-hide-select select {
            position: absolute;
            left: -100%
        }

        .selectric-hide-select.selectric-is-native {
            position: absolute;
            width: 100%;
            height: 100%;
            z-index: 10
        }

            .selectric-hide-select.selectric-is-native select {
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                height: 100%;
                width: 100%;
                border: none;
                z-index: 1;
                box-sizing: border-box;
                opacity: 0
            }

    .selectric-input {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 1px !important;
        height: 1px !important;
        outline: none !important;
        border: none !important;
        *font: 0/0 a !important;
        background: none !important
    }

    .selectric-temp-show {
        position: absolute !important;
        visibility: hidden !important;
        display: block !important
    }

    .selectric-items {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        background: #F8F8F8;
        border: 1px solid #c4c4c4;
        z-index: -1;
        box-shadow: 0 0 10px -6px
    }

        .selectric-items .selectric-scroll {
            height: 100%;
            overflow: auto
        }

    .selectric-above .selectric-items {
        top: auto;
        bottom: 100%
    }

    .selectric-items ul, .selectric-items li {
        list-style: none;
        padding: 0;
        margin: 0;
        font-size: 1rem;
        line-height: 20px;
        min-height: 20px
    }

    .selectric-items li {
        display: block;
        padding: 10px;
        color: #666;
        cursor: pointer
    }

        .selectric-items li.selected {
            background: #E0E0E0;
            color: #444
        }

        .selectric-items li.highlighted {
            background: #D0D0D0;
            color: #444
        }

        .selectric-items li:hover {
            background: #D5D5D5;
            color: #444
        }

    .selectric-items .disabled {
        filter: alpha(opacity=50);
        opacity: 0.5;
        cursor: default !important;
        background: none !important;
        color: #666 !important;
        user-select: none
    }

    .selectric-items .selectric-group .selectric-group-label {
        font-weight: bold;
        padding-left: 10px;
        cursor: default;
        user-select: none;
        background: none;
        color: #444
    }

    .selectric-items .selectric-group.disabled li {
        filter: alpha(opacity=100);
        opacity: 1
    }

    .selectric-items .selectric-group li {
        padding-left: 25px
    }

    .field-validation-error {
        background-color: var(--primary-100);
        border-color: var(--primary-100);
        color: var(--base-100);
        border-radius: 0 0 0.375rem 0.375rem;
        background-image: url(../images/icon_warning.svg);
        padding: 0.875rem 1rem 0.875rem 3rem;
        text-align: left;
        background-repeat: no-repeat;
        background-position: 1rem 0.75rem;
        border-width: 1px;
        border-style: solid;
        font-size: 0.875rem;
        line-height: 1.25rem;
        display: block;
        position: relative;
        bottom: 4px;
    }

    /*css for loader*/
    .loader {
        display: none;
        position: fixed;
        z-index: 1000;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        background: rgba( 255, 255, 255, .8 ) 50% 50% no-repeat;
    }

    /* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
    body.loading .loader {
        overflow: hidden;
    }

    /* Anytime the body has the loading class, our
   modal element will be visible */
    body.loading .loader {
        display: block;
    }

    .loader_img {
        position: fixed;
        margin-left: 50%;
        margin-top: 20%;
        width: 100px;
        height: 100px;
    }

    .input-validation-error.alert-error {
        border-color: var(--primary-100);
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

        .input-validation-error.alert-error + .field-validation-error {
            border-top-left-radius: 0;
            border-top-right-radius: 0;
        }

    /*.cc-window.cc-banner.cc-type-info.cc-theme-block.cc-bottom {
        position: absolute;
        bottom: 4rem;
        left: 0px;
        z-index: 2;
        background-color: #ffff;
        max-width: 48rem;
        width: 100%;
        right: 0px;
        margin: auto;
        padding: 2rem 3rem 2rem 7.2rem;
        border-radius: 0.375rem;
        box-shadow: 0 1px 3px 0 rgba(60,64,67,.3), 0 4px 8px 3px rgba(60,64,67,.15);
    }
               .cc-window.cc-banner.cc-type-info.cc-theme-block.cc-bottom span.cc-message:before {
                content: "Cookies Consent";
                font-size: 1.25rem;
                color: #232323;
                font-weight: 700;
                top: 0px;
                width: 100%;
                display: block;
                padding-bottom: 0.5rem;
            }
            .cc-window.cc-banner.cc-type-info.cc-theme-block.cc-bottom .cc-compliance {
            margin-top: 1.4rem;
        }

    */

    .cc-window.cc-type-info.cc-theme-block.cc-bottom {
        position: absolute;
        bottom: 0;
        left: 0px;
        display: flex;
        z-index: 10;
        background-color: #ffffff;
        max-width: 100%;
        width: 100%;
        right: 0px;
        margin: auto;
        padding: .256rem 1rem;
        border-radius: 0;
        align-items: center;
        min-height: 3.25rem;
        box-shadow: 0px 0px 11px rgb(0 0 0 / 12%);
    }

        .cc-window.cc-type-info.cc-theme-block.cc-bottom span.cc-message {
            font-size: 0.813rem !important;
            color: #000000;
            position: relative;
        }

        .cc-window.cc-type-info.cc-theme-block.cc-bottom span.cokLogo {
            margin-right: .7rem;
        }

            .cc-window.cc-type-info.cc-theme-block.cc-bottom span.cokLogo img {
                max-height: 1.25rem;
            }

        .cc-window.cc-type-info.cc-theme-block.cc-bottom span.cc-message a.cc-link {
            text-decoration: none;
            color: #fff;
        }

        .cc-window.cc-type-info.cc-theme-block.cc-bottom .cc-compliance a.cc-btn.cc-dismiss {
            padding: 0.2rem 1.5rem;
            display: inline-block;
            text-align: center;
            border-radius: 1.375rem;
            font-size: 0.813rem !important;
            line-height: 1.5rem;
            font-weight: 600;
            text-decoration: none;
            background-color: var(--primary-200);
            color: var(--base-100);
            min-width: 7rem;
            margin-left: 1.5rem;
        }

        .cc-window.cc-type-info.cc-theme-block.cc-bottom:after {
            content: url(data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M30.0751 2.8125H30C15 2.8125 2.8125 14.9944 2.8125 30C2.8125 45.0056 15 57.1875 30 57.1875C45.0187 57.1875 57.1875 45.0056 57.1875 30C57.1875 28.0069 56.9813 26.0644 56.5688 24.195C56.5126 23.9287 56.3438 23.7 56.1001 23.5706C55.8563 23.4412 55.575 23.4206 55.3313 23.5163C54.45 23.8406 53.5125 24.0187 52.5375 24.0187C49.9688 24.0187 47.6813 22.7944 46.2376 20.8969C46.0501 20.6437 45.7312 20.5069 45.4124 20.5331C45.2062 20.55 44.9812 20.5594 44.7562 20.5594C40.3875 20.5594 36.825 17.0025 36.825 12.6225C36.825 12.4612 36.8438 12.3019 36.8438 12.1425C36.8625 11.7281 36.6186 11.3475 36.2249 11.205C33.1874 10.0931 31.0126 7.17375 31.0126 3.75L30.9375 3.83062C30.9375 3.80437 30.9375 3.77812 30.9375 3.75C30.9375 3.41812 30.7688 3.12749 30.5063 2.96062C30.4313 2.86874 30.2813 2.81438 30.0751 2.8125ZM29.1936 4.70062C29.5311 8.28187 31.8 11.3025 34.95 12.7106C35.0063 18.0844 39.375 22.4344 44.7562 22.4344C44.8687 22.4344 44.9626 22.4325 45.0563 22.4287C46.8563 24.5475 49.5375 25.8937 52.5375 25.8937C53.3625 25.8937 54.1688 25.7906 54.9376 25.5994C55.1813 27.0281 55.3125 28.4981 55.3125 30C55.3125 43.9706 43.9688 55.3125 30 55.3125C16.0312 55.3125 4.6875 43.9706 4.6875 30C4.6875 16.3031 15.5999 5.13187 29.1936 4.70062ZM30 39.9262C27.6 39.9262 25.6501 41.8725 25.6501 44.2706C25.6501 46.6669 27.6 48.6131 30 48.6131C32.4 48.6131 34.3499 46.6669 34.3499 44.2706C34.3499 41.8725 32.4 39.9262 30 39.9262ZM30 41.8012C31.3687 41.8012 32.4749 42.9075 32.4749 44.2706C32.4749 45.6319 31.3687 46.7381 30 46.7381C28.65 46.7381 27.5251 45.6319 27.5251 44.2706C27.5251 42.9075 28.65 41.8012 30 41.8012ZM42.8062 30.0544C40.4062 30.0544 38.4563 32.0006 38.4563 34.3988C38.4563 36.795 40.4062 38.7413 42.8062 38.7413C45.2062 38.7413 47.1375 36.795 47.1375 34.3988C47.1375 32.0006 45.2062 30.0544 42.8062 30.0544ZM42.8062 31.9294C44.1562 31.9294 45.2625 33.0356 45.2625 34.3988C45.2625 35.76 44.1562 36.8662 42.8062 36.8662C41.4374 36.8662 40.3313 35.76 40.3313 34.3988C40.3313 33.0356 41.4374 31.9294 42.8062 31.9294ZM16.5001 27.93C14.1188 27.93 12.1687 29.8762 12.1687 32.2744C12.1687 34.6706 14.1188 36.6169 16.5001 36.6169C18.9001 36.6169 20.85 34.6706 20.85 32.2744C20.85 29.8762 18.9001 27.93 16.5001 27.93ZM16.5001 29.805C17.8688 29.805 18.975 30.9112 18.975 32.2744C18.975 33.6356 17.8688 34.7419 16.5001 34.7419C15.1501 34.7419 14.0437 33.6356 14.0437 32.2744C14.0437 30.9112 15.1501 29.805 16.5001 29.805ZM26.5876 15.9956C24.2064 15.9956 22.2562 17.9419 22.2562 20.34C22.2562 22.7362 24.2064 24.6844 26.5876 24.6844C28.9876 24.6844 30.9375 22.7362 30.9375 20.34C30.9375 17.9419 28.9876 15.9956 26.5876 15.9956ZM26.5876 17.8706C27.9564 17.8706 29.0625 18.9769 29.0625 20.34C29.0625 21.7031 27.9564 22.8094 26.5876 22.8094C25.2376 22.8094 24.1312 21.7031 24.1312 20.34C24.1312 18.9769 25.2376 17.8706 26.5876 17.8706Z' fill='%234A154B'/%3E%3C/svg%3E%0A);
            position: absolute;
            left: 2rem;
            top: 2rem;
        }

        .cc-window.cc-type-info.cc-theme-block.cc-bottom.cc-invisible {
            display: none;
        }

    @media (max-width: 767px) {
        .cc-window.cc-type-info.cc-theme-block.cc-bottom {
            flex-direction: column;
            align-items: baseline;
        }

            .cc-window.cc-type-info.cc-theme-block.cc-bottom span.cc-message {
                padding-bottom: .75rem;
            }

        .cc-window.cc-banner.cc-type-info.cc-theme-block.cc-bottom .cc-compliance {
            padding: .5rem 0;
        }

        .cc-window.cc-type-info.cc-theme-block.cc-bottom .cc-compliance a.cc-btn.cc-dismiss {
            margin-left: 0rem;
        }

        .cc-window.cc-type-info.cc-theme-block.cc-bottom span.cokLogo {
            margin: .5rem 0;
        }

        .cc-window.cc-banner.cc-type-info.cc-theme-block.cc-bottom .cc-message {
            margin-right: auto;
            line-height: 1.1rem;
            font-size: .7rem !important;
        }
    }

    #651 .input_valid {
        position: absolute;
        right: 0.875rem;
        top: 1.55rem;
        transform: translateY(-50%)
    }

    form#OtpLogInForm {
        padding-top: 1.5rem;
    }

        form#OtpLogInForm .otp_group + .form-group {
            margin-bottom: 3rem;
        }

    a#eye_password, a#eye_close_password {
        position: absolute;
        right: 1rem;
        top: 0.7rem;
    }

    .signUpForm .form-group {
        position: relative;
    }

    .tooltip {
        position: absolute;
        display: inline-block;
        opacity: 1 !important;
        top: 0.313rem;
        right: -2rem;
    }

        .tooltip .tooltiptext {
            visibility: hidden;
            width: 12rem;
            background-color: white;
            color: #232323;
            text-align: center;
            border-radius: 6px;
            padding: 0.75rem 0.75rem;
            position: absolute;
            z-index: 1;
            bottom: 107%;
            left: auto;
            right: -0.375rem;
            font-size: .75rem;
            line-height: 1rem !important;
            box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.10);
            border: 0.063rem solid #efefef;
            font-weight: 400;
        }

            .tooltip .tooltiptext::after {
                content: "";
                position: absolute;
                top: 100%;
                left: auto;
                margin-left: 5px;
                border-width: 8px;
                border-style: solid;
                border-color: white transparent transparent transparent;
            }

        .tooltip:hover .tooltiptext {
            visibility: visible;
        }

    .goBackbtn {
        position: absolute;
        left: 0.75rem;
        top: 0.75rem;
        padding: 0;
        margin: 0px;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 0.25rem;
    }

        .goBackbtn svg {
            padding: .07rem;
        }

            .goBackbtn svg path {
                fill: #000;
            }

    .logoLink {
        margin-bottom: 2.25rem;
    }

        .logoLink img {
            width: 2.125rem;
            height: auto;
        }

    .logoutState {
        max-width: 30rem;
    }

    .logoutBG {
        background-image: url(../images/logoutBg.png);
        background-repeat: no-repeat;
        background-position: center top;
        background-size: 100% auto;
        padding: 2rem 1rem;
    }

    .cc-window.cc-banner.cc-type-info.cc-theme-block.cc-bottom .cc-message {
        margin-right: auto;
    }

    .signupLink {
        max-width: 23.5rem;
        width: 100%;
        margin: 1rem auto;
        border-top: 1px solid #d9d9d9;
        padding-top: 1rem;
    }