/* THEME CHANGE : START */
@font-face {
    font-family: Poppins;
    src: url('/fonts/poppins_regular.ttf');
    font-style: normal;
}


body {
    font-size: 16px;
    font-family: Poppins !important;
    background: #F8F1E8;
}

.login-cover .overlay_black {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    top: 0;
    z-index: 0;
}

.login_box {
    background: #222222;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    padding: 10px 20px;
    box-shadow: 2px 2px 17px 0px rgb(0 0 0 / 79%);
    -webkit-box-shadow: 2px 2px 17px 0px rgb(0 0 0 / 79%);
    -moz-box-shadow: 2px 2px 17px 0px rgba(0, 0, 0, 0.79);
}

/** custom csss **/

.btn-custom {
    color: #fff;
    border-color: #F5C27D;
    text-transform: uppercase;
    border-radius: 10px;
    background: #F5C27D;
    font-size: 16px;
    font-weight: 700;
}

.btn-custom:hover {
    color: #fff;
    background-color: #F5C27D;
    border-color: #F5C27D
}

.vh-90 {
    height: 85vh !important;
}

.background-left {
    background-color: #F8F1E8;
}

.background-right {
    background-color: rgba(255, 255, 255, 255);
}

.image-radius {
    border-radius: 25px;
    background-position: left top;
    background-repeat: repeat;

}

.radius-btn {
    background-color: rgba(254, 249, 242, 255);
    border: 1px solid #739600;
    color: #f4c27d !important;
    text-transform: uppercase;
    position: relative;
    display: inline-block;
    margin: 1em;
    padding: 1em 2em;
    border: 0;
    border-radius: 30px;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    font-family: Poppins;
    font-size: 14px;
    font-weight: 700;
}

.login-text {
    color: #000;
    text-align: center;
    font-feature-settings: 'clig' off, 'liga' off;
    font-family: Poppins;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-transform: capitalize;


}

.login-text-area p {
    color: #6C6C6C;
    text-align: center;
    font-feature-settings: 'clig' off, 'liga' off;
    font-family: Poppins;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.rectangle {
    border-radius: 60px 0px 0px 60px;
    background: #fff;
    backdrop-filter: blur(3.5px);
}


input[type=email] {

    background-color: white;
    background-image: url('/images/sms1.svg') !important;
    background-position: 12px 12px;
    background-repeat: no-repeat;
    padding: 13px 20px 12px 45px;

}

#password,
input[type=password] {

    background-color: white;
    background-image: url('/images/lock22.svg');
    background-position: 13px 13px;
    background-repeat: no-repeat;
    padding: 13px 20px 12px 45px;

}

svg {
    display: inline-table;
}

.eye-slash {
    position: absolute;
    top: 28%;
    right: 11%;
    cursor: pointer;
}

.position-relative {
    position: relative;
}

input[type=password],
input[type=email],
input[type=password],
input[type=text] {
    border-radius: 10px !important;
    border: 1px solid #D2D2D2 !important;
    color: #000;
    width: 397px;
    height: 50px !important;
    flex-shrink: 0 !important;
    font-size: 13px;
    font-weight: 300;
}

::placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #000 !important;
    opacity: 1;
    /* Firefox */
}

:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #000 !important;
}

::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #000 !important;
}

.inner-frame {
    width: 432.48px;
    height: 525px;
    flex-shrink: 0;
}

.w-h-login {
    width: 397px;
    height: 45px;
    flex-shrink: 0;
}

.w {
    width: 397px;
}

.logo-width {
    width: 90%;
}

.login-form,
.alert {
    width: 397px;
}

input.text-danger {
    color: #000 !important;
}

input:-webkit-autofill,
input:-webkit-autofill:focus {
    transition: background-color 0s 600000s, color 0s 600000s;
}


.remember input[type=checkbox] {
    width: 19px;
    height: 19px;
    flex-shrink: 0;
    border-radius: 4px;
    border: 1px solid #D2D2D2 !important;
}
.remember input[type=checkbox]::after{
    color: red;
}

.remember span {
    color: var(--black, #000);
    text-align: right;
    font-feature-settings: 'clig' off, 'liga' off;
    font-family: Poppins;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    vertical-align: super;
    margin-left: 10px;
}

.forgot-text {
    color: var(--red, #EB5757);

    font-family: Poppins;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-left: 23%;
    vertical-align: super;
}

.otp input {
    width: 55px;
    height: 55px;
    flex-shrink: 0;
    border-radius: 10px;
    border: 1px solid var(--out-line, #D2D2D2);
    margin-left: 6px;
    color: var(--secondary-color, #0F0F18);
    text-align: center;
    font-family: Poppins;
    font-size: 26px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.otp,
#resend {
    color: #6C6C6C;
    font-feature-settings: 'clig' off, 'liga' off;
    font-family: Poppins;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.otp,
#resend a {
    color: var(--black, #000);
    font-feature-settings: 'clig' off, 'liga' off;
    font-family: Poppins;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}


.loading {
    position: fixed;
    z-index: 999;
    height: 2em;
    width: 2em;
    overflow: show;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

/* Transparent Overlay */
.loading:before {
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(rgba(20, 20, 20, .8), rgba(0, 0, 0, .8));

    background: -webkit-radial-gradient(rgba(20, 20, 20, .8), rgba(0, 0, 0, .8));
}

/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required) {
    /* hide "loading..." text */
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}

.loading:not(:required):after {
    content: '';
    display: block;
    font-size: 10px;
    width: 1em;
    height: 1em;
    margin-top: -0.5em;
    -webkit-animation: spinner 150ms infinite linear;
    -moz-animation: spinner 150ms infinite linear;
    -ms-animation: spinner 150ms infinite linear;
    -o-animation: spinner 150ms infinite linear;
    animation: spinner 150ms infinite linear;
    border-radius: 0.5em;
    -webkit-box-shadow: rgba(255, 255, 255, 0.75) 1.5em 0 0 0, rgba(255, 255, 255, 0.75) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) 0 1.5em 0 0, rgba(255, 255, 255, 0.75) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) -1.5em 0 0 0, rgba(255, 255, 255, 0.75) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.75) 0 -1.5em 0 0, rgba(255, 255, 255, 0.75) 1.1em -1.1em 0 0;
    box-shadow: rgba(255, 255, 255, 0.75) 1.5em 0 0 0, rgba(255, 255, 255, 0.75) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) 0 1.5em 0 0, rgba(255, 255, 255, 0.75) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.75) -1.5em 0 0 0, rgba(255, 255, 255, 0.75) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.75) 0 -1.5em 0 0, rgba(255, 255, 255, 0.75) 1.1em -1.1em 0 0;
}

/* Animation */

@-webkit-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-o-keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spinner {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@media (min-width: 1025px) {
    .h-custom-2 {
        height: 100%;
    }
}

/** ends here **/

.login_box .form-control {
    /* border-radius: 51px; */
    padding: 26px 21px;
    background-color: #565656 !important;
    color: #fff;
    border: none;
    font-size: 18px !important;
}

.login_box h5 {
    font-size: 20px;
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.sp-des {
    font-size: 20px;
    margin-top: 20px;
}

button.btn.btn-primary.btn-block.session-btn {
    background: #95B391;
    border-color: #95B391;
}

.login_box .alert-danger {
    color: #95B391;
    background-color: #fce3e3;
    border-color: #fce3e3;
}

font-style: italic;

@media (min-width: 576px) {
    .login-form {
        width: 30rem !important;
    }
}

.mt-45 {
    margin-top: 45px;
}

/* THEME CHANGE : END */

.container {
    display: grid;
    grid-template-columns: repeat(4, auto);
    grid-gap: 20px;
}

.card {
    margin: 0;
}