@font-face {
    font-family: 'icomoon';
    src: url('../fonts/icomoon.eot?ewiz93');
    src: url('../fonts/icomoon.eot?ewiz93#iefix') format('embedded-opentype'), url('../fonts/icomoon.ttf?ewiz93') format('truetype'), url('../fonts/icomoon.woff?ewiz93') format('woff'), url('../fonts/icomoon.svg?ewiz93#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-Authenticator-popup:before {
    content: "\e900";
}

.icon-check-email-popup:before {
    content: "\e901";
}

.icon-forgot-password-popup:before {
    content: "\e902";
}

.icon-password-popup:before {
    content: "\e903";
}

.icon-Call:before {
    content: "\e904";
}

.icon-email:before {
    content: "\e905";
}

.icon-hide-password:before {
    content: "\e906";
}

.icon-password:before {
    content: "\e907";
}

.icon-show-passoword:before {
    content: "\e908";
}

.icon-user:before {
    content: "\e909";
}


.pb-main {
    padding-bottom: 9rem !important;
}

.Barlow-Regular {
    font-family: barlow-regular;
}

.Barlow-Bold {
    font-family: barlow-bold;
}

.Barlow-Medium {
    font-family: barlow-medium;
}

.Barlow-Semibold {
    font-family: barlow-semibold;
}

.Barlow-fontsize-42 {
    font-size: 42px !important;
}

.Barlow-fontsize-16 {
    font-size: 16px !important;
}

.Barlow-fontsize-14 {
    font-size: 14px !important;
}

.Barlow-fontsize-15 {
    font-size: 15px !important;
}

.Barlow-fontsize-13 {
    font-size: 13px !important;
}

.Barlow-fontsize-12 {
    font-size: 12px !important;
}

.Barlow-fontsize-20 {
    font-size: 20px !important;
}

.Barlow-fontsize-18 {
    font-size: 18px !important;
}

.Barlow-fontsize-24 {
    font-size: 24px !important;
}

@font-face {
    font-family: 'barlow-bold';
    src: url('../fonts/Barlow-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'barlow-regular';
    src: url('../fonts/Barlow-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'barlow-medium';
    src: url('../fonts/Barlow-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'barlow-semibold';
    src: url('../fonts/Barlow-SemiBold.ttf') format('truetype');
}

@media (max-width: 991.5px) {
    #loginbackground {
        background-image: url('../images/Mobile Login Left banner@2x.png') !important;
        order: 2 !important;
    }

    #logindetailbackground {
        order: 1 !important;
    }

    #authendicationbackground {
        background-image: url('../images/Mobile 2FA Left banner@2x.png') !important;
        order: 2 !important;
    }

    #authendicationdetails {
        order: 1 !important;
    }

    #loginSection {
        height: 1009.5px !important;
    }

    #login2faSection {
        height: 730.5px !important;
    }

    #footer-padding {
        border-top: 0px solid #dee2e6 !important;
        bottom: 0 !important;
        width: 100% !important;
    }

    .m-loginwidth-2 {
        display: none !important;
    }

    .m-loginwidth-8 {
        width: 100% !important;
    }

    .m-top-mfa {
        margin-top: 2rem !important;
    }

    .m-top-login {
        margin-top: 5rem !important;
        padding-top: env(safe-area-inset-top); /* For newer devices */
    }

    #login-container {
        display: flex;
        flex-direction: column;
        height: 100vh; /* 100% of the viewport height */
    }

    /* Elements that should expand with available space */
    .expand {
        flex-grow: 1;
    }
}

@media(max-width:442.5px) {
    #loginbackground {
        background-image: url('../images/Mobile Login Left banner@2x.png') !important;
        order: 2 !important;
    }

    #logindetailbackground {
        order: 1 !important;
    }

    #authendicationbackground {
        background-image: url('../images/Mobile 2FA Left banner@2x.png') !important;
        order: 2 !important;
    }

    #authendicationdetails {
        order: 1 !important;
    }

    #loginSection {
        height: 1059.5px !important;
    }

    #login2faSection {
        height: 780.5px !important;
    }

    #footer-padding {
        border-top: 0px solid #dee2e6 !important;
        bottom: 0 !important;
        width: 100% !important;
    }


    .m-loginwidth-2 {
        display: none !important;
    }

    .m-loginwidth-8 {
        width: 100% !important;
    }

    .m-top-mfa {
        margin-top: 2rem !important;
    }

    .m-top-login {
        margin-top: 5rem !important;
        padding-top: env(safe-area-inset-top); /* For newer devices */
    }

    #login-container {
        display: flex;
        flex-direction: column;
        height: 100vh; /* 100% of the viewport height */
    }

    /* Elements that should expand with available space */
    .expand {
        flex-grow: 1;
    }
}


@media(max-width:470.5px) {
    #loginbackground {
        background-image: url('../images/Mobile Login Left banner@2x.png') !important;
        order: 2 !important;
    }

    #logindetailbackground {
        order: 1 !important;
    }

    #authendicationbackground {
        background-image: url('../images/Mobile 2FA Left banner@2x.png') !important;
        order: 2 !important;
    }

    #authendicationdetails {
        order: 1 !important;
    }

    #loginSection {
        height: 1009.5px !important;
    }

    #login2faSection {
        height: 780.5px !important;
    }

    #footer-padding {
        border-top: 0px solid #dee2e6 !important;
        bottom: 0 !important;
        width: 100% !important;
    }

    .m-loginwidth-2 {
        display: none !important;
    }

    .m-loginwidth-8 {
        width: 100% !important;
    }

    .m-top-mfa {
        margin-top: 2rem !important;
    }

    .m-top-login {
        margin-top: 5rem !important;
        padding-top: env(safe-area-inset-top); /* For newer devices */
    }

    #login-container {
        display: flex;
        flex-direction: column;
        height: 100vh; /* 100% of the viewport height */
    }

    /* Elements that should expand with available space */
    .expand {
        flex-grow: 1;
    }
}


@media(max-width:336.5px) {
    #loginbackground {
        background-image: url('../images/Mobile Login Left banner@2x.png') !important;
        order: 2 !important;
    }

    #logindetailbackground {
        order: 1 !important;
    }

    #authendicationbackground {
        background-image: url('../images/Mobile 2FA Left banner@2x.png') !important;
        order: 2 !important;
    }

    #authendicationdetails {
        order: 1 !important;
    }

    #loginSection {
        height: 1080.5px !important;
    }

    #login2faSection {
        height: 801.5px !important;
    }

    #footer-padding {
        border-top: 0px solid #dee2e6 !important;
        bottom: 0;
        width: 100%;
    }

    .m-loginwidth-2 {
        display: none !important;
    }

    .m-loginwidth-8 {
        width: 100% !important;
    }

    .m-top-mfa {
        margin-top: 2rem !important;
    }

    .m-top-login {
        margin-top: 5rem !important;
        padding-top: env(safe-area-inset-top); /* For newer devices */
    }

    #login-container {
        display: flex;
        flex-direction: column;
        height: 100vh; /* 100% of the viewport height */
    }

    /* Elements that should expand with available space */
    .expand {
        flex-grow: 1;
    }
}

@media only screen and (min-device-width: 1024px) and (max-device-height: 1366px) {
    #footer-padding {
        bottom: 0;
        width: 100%;
    }
}

.btn-reset {
    width: 127px !important;
    height: 38px !important;
    border: 1px solid #1D7486;
    border-radius: 12px;
    opacity: 1;
    color: #1D7486 !important;
    background: transparent !important;
}

.reset-logo {
    width : 200px !important;
    height : 60px !important;
}

#ll_loader, #sso_loader {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 2000;
    display: none;
    background: rgb(255, 255, 255, 0.8);
    padding: 20px 20px 13px 20px;
    border-radius: 12px;
}

#ll_loader_img, #sso_loader_img {
    width: 100px !important;
}

#remember_me:Checked {
    background-color: #ED1C24 !important;
}

#remember_me {
    border: 1px solid #E0E0E0 !important;
    box-shadow : none !important;
}

.input_field {
    position: relative;
}

.icon-sec {
    position: absolute;
    top: 0;
    top: 0;
    left: 10px;
    bottom: 0;
    width: 20px;
    line-height: 2.75rem !important;
    color: #aaa;
}

    .icon-sec.pwd {
        left: auto;
        right: 10px;
        line-height: 2.75rem !important;
        color: #aaa;
    }

.txtwidth {
    height: 42px;
}

.m-loginLeft {
    margin: 2.25rem 0rem 0.5rem 0rem !important;
}

.lm-loginLeft {
    margin: 2rem 0rem 0rem 0rem !important;
}

.m-loginlogo {
    width: 100% !important;
    height: 92px;
}

.btn-sign {
    width: 100% !important;
}

m-icon {
    margin: 0rem 0.5rem 0rem 0rem !important;
}

.ml-3 {
    margin-left: 0.75rem !important;
}

input[type="text"]:focus,
input[type="password"]:focus {
    border-color: #5DC6DB;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px #5DC6DB;
    outline: 0 none;
}

input {
    font-family: Barlow-Semibold;
}

.m-loginlabel {
    margin-top: 0.3rem !important;
}

.m-bottom-2 {
    margin-bottom: 2rem !important;
}

.m-modelborder {
    line-height: 17px !important;
    margin: 0rem 1rem 0.9rem 1rem !important;
}

.m-header {
    margin: 0rem 0rem -0.9rem 9.0rem !important;
}

.w-header-100 {
    width: 98% !important;
}

.m-logindetails {
    margin: 2rem 0rem 1.25rem 0rem !important;
}

.h-copybtn {
    height: 40px !important;
}

.divider {
    display: flex;
    align-items: center;
    text-align: center;
    color: #757575;
}

.divider .line {
    flex: 1;
    border: 1px solid #757575;
    margin: 0 10px;
}

.divider .text {
    white-space: nowrap;
}

.btn-sso {
    border-radius: 5px;
    border: 1px solid #E0E0E0;
    background: #FFF;
    width: 100%;
    height: 42px;
    padding-top: 8px;
}

.btn-back {
    width: 30px !important;
    border: none !important;
}

#footer-padding {
    padding-top: 20px !important;
}

.bg-gray {
    background: #ECEDEE !important;
}

.logo-s-48 {
    width: 100% !important;
    height: 48px !important;
}