@font-face {
    font-family: ErasBoldITC;
    src: url("../fonts/erasbolditc.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: Poppins;
    src: url("../fonts/Poppins-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: Arial Rounded MT;
    src: url("../fonts/Arial Rounded MT Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

body {
    margin: 0 !important;
    padding: 0 !important;
}

h1 {
    color: #4a4a4a;
    font-family: ErasBoldITC;
    font-size: 40px;
    line-height: 1.2; /* 60px */
}
h2 {
    color: #4a4a4a;
    font-family: Eras Bold ITC;
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 45px */
}

h3 {
    color: #4a4a4a;
    font-family: Eras Bold ITC;
    font-size: 25px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 37.5px */
}

h4 {
    color: #fff;
    font-family: Eras Bold ITC;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 30px */
}

h5 {
    color: #4a4a4a;
    font-family: ErasBoldITC;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 27px */
}

h6 {
    color: #4a4a4a;
    font-family: ErasBoldITC;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 19.5px */
}

body .phpdebugbar {
    display: none;
}
/*p*/
/*{*/
/*color: #4A4A4A !important;*/
/*text-align: center;*/
/*font-family: "Arial Rounded MT";*/
/*font-size: 14px;*/
/*font-style: normal;*/
/*font-weight: 400;*/
/*line-height: 1.5; !* 21px *!*/
/*}*/

.email-verification .card_text_bellow_heading {
    /*color: #000;*/
    text-align: center;
    /*font-family: Arial Rounded MT;*/
    /*font-size: 14px;*/
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 21px */
}

.email-verification .card_text_bellow_heading p {
    color: #000;
    font-family: Arial Rounded MT;
    font-size: 14px;
}

.login-page .logo span,
.register-page .logo span {
    color: #7c5cc4;
}

.login-page a.forgot-pass,
.login-page a.signup,
.register-page a.forgot-pass,
.register-page a.signup {
    font-size: 0.8em;
    color: #7c5cc4;
}

.login-page,
.register-page {
    /* background: #f5f5f5; */
    /* background-image: url('../images/auth/auth-light.jpg'); */
    background: rgba(1, 30, 124, 0.96);
    position: relative;
    /*background-image: url("../images/auth/Vinbay_Icon.png");*/
    /*z-index: 0;*/
    box-shadow: -5px 5px 14px 0px rgba(0, 0, 0, 0.05);
    width: 100%;
    min-height: auto;
    position: relative;
}
.login-page:before,
.register-page:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 92%;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto 0;
    display: block;
    background-image: url("../images/auth/Vinbay_Icon.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

.dark-mode .login-page,
.dark-mode .register-page {
    /* background: #f5f5f5; */
    /* background-image: url('../images/auth/auth-light.jpg'); */
    background: rgba(1, 30, 124, 0.96);
    box-shadow: -5px 5px 14px 0px rgba(0, 0, 0, 0.05);
    width: 100%;
    min-height: auto;
}

.login-page .form-outer,
.register-page .form-outer {
    min-height: 100vh;
    width: 585px;
    /*height: 518px;*/
    flex-shrink: 0;
    margin: 0 auto;
    padding: 40px 0;
    position: relative;
}

.login-page .copyrights,
.register-page .copyrights {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
}

.login-page .copyrights p,
.register-page .copyrights p {
    font-size: 0.6em;
    font-weight: 300;
    margin-bottom: 10px;
}

.login-page .form-inner,
.register-page .form-inner {
    border-radius: 15px;
    background: #fff;
    box-shadow: -5px 5px 14px 0px rgba(0, 0, 0, 0.05);
    /* border-radius: 5px; */
    padding: 50px 75px;
    /* background: #FFF; */
    /* box-shadow: 0 0 35px rgba(0, 0, 0, .1); */
    margin-bottom: 20px;
    width: 100%;
}

.dark-mode .login-page .form-inner,
.dark-mode .register-page .form-inner {
    border-radius: 5px;
    padding: 40px 30px;
    background: #283046;
    box-shadow: 0 0 35px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
    width: 100%;
}

.login-page .logo,
.register-page .logo {
    font-size: 2em;
    font-weight: 500;
}

.login-page p,
.register-page p {
    font-size: 0.8em;
    font-weight: 300;
    color: #aaa;
    margin-bottom: 0;
}

.login-page form,
.register-page form {
    margin: 2rem auto 1rem;
    /* max-width: 300px */
}

.login-page a.forgot-pass:focus,
.login-page a.forgot-pass:hover,
.login-page a.signup:focus,
.login-page a.signup:hover,
.register-page a.forgot-pass:focus,
.register-page a.forgot-pass:hover,
.register-page a.signup:focus,
.register-page a.signup:hover {
    color: #66b0ff;
    text-decoration: none;
}

.login-page a.forgot-pass,
.register-page a.forgot-pass {
    display: block;
}

.login-page a.create-account,
.register-page a.create-account {
    border-radius: 50px;
    font-size: 0.75em;
    margin-top: 10px;
    color: #999;
    text-transform: uppercase;
}

.login-page .terms-conditions,
.register-page .terms-conditions {
    margin-top: 20px;
}

.login-page small,
.register-page small {
    font-size: 0.65em;
    color: #aaa;
    line-height: 0.9em;
}

@media (min-width: 768px) {
    .login-page p,
    .register-page p {
        font-size: 0.9em;
    }
    .login-page form label.label-custom,
    .register-page form label.label-custom {
        font-size: 0.9em;
    }
    .login-page form small,
    .register-page form small {
        font-size: 0.8em;
    }
    .login-page .terms-conditions label,
    .register-page .terms-conditions label {
        font-size: 0.9em;
    }
    .login-page a.forgot-pass,
    .login-page a.signup,
    .register-page a.forgot-pass,
    .register-page a.signup {
        font-size: 0.8em;
    }
    .login-page small,
    .register-page small {
        font-size: 0.8em;
    }
    .login-page .copyrights p,
    .register-page .copyrights p {
        font-size: 0.85em;
        font-weight: 400;
    }
}

.form-group-material {
    position: relative;
    margin-bottom: 20px;
}

input.input-material {
    width: 100%;
    /* border: none;
	border-bottom: 1px solid #eee;
	padding: 10px 0;*/
    color: #868e96;
    font-weight: 300;
}

.dark-mode input.input-material {
    background: #283046;
}

input.input-material ~ label {
    /* color: #aaa;
	position: absolute;
	top: 14px;
	left: 0;
	cursor: text;
	-webkit-transition: all .2s;
	transition: all .2s;
	font-weight: 300 */
    color: #000;
    font-family: Arial Rounded MT;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 16.5px */
}

input.input-material ~ label.error {
    color: #dc3545;
    font-size: 0.75em;
    margin-bottom: 0;
    /*position: absolute;*/
    /*top: auto;*/
    /*bottom: -30px;*/
    left: 0;
}

.form-group-material {
    position: relative;
}
.form-group-material label.error {
    position: absolute;
    bottom: -15px;
}

input.input-material:focus {
    border-color: #7c5cc4;
    outline: none;
}

input.input-material ~ label.active {
    font-size: 0.8em;
    top: -10px;
    color: #7c5cc4;
}

input.form-control-custom:checked + label::before {
    background: #7c5cc4 !important;
}

.btn {
    font-weight: 400;
    border: 1px solid transparent;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
    padding: 0.45rem 0.75rem;
    font-size: 0.9rem;
    line-height: 1.5;
    -webkit-transition:
        background-color 0.15s ease-in-out,
        border-color 0.15s ease-in-out,
        -webkit-box-shadow 0.15s ease-in-out;
    transition:
        background-color 0.15s ease-in-out,
        border-color 0.15s ease-in-out,
        -webkit-box-shadow 0.15s ease-in-out;
    transition:
        background-color 0.15s ease-in-out,
        border-color 0.15s ease-in-out,
        box-shadow 0.15s ease-in-out;
    transition:
        background-color 0.15s ease-in-out,
        border-color 0.15s ease-in-out,
        box-shadow 0.15s ease-in-out,
        -webkit-box-shadow 0.15s ease-in-out;
}

.btn-primary {
    color: color-yiq(#7c5cc4);
    background-color: #7c5cc4;
    border-color: #7c5cc4;
}

.btn-primary:hover {
    background-color: #6244a6;
    border-color: #6244a6;
}

.btn-success {
    color: color-yiq(#34cea7);
    background-color: #34cea7;
    border-color: #34cea7;
}

.btn-success:hover {
    color: color-yiq(#34cea7);
    background-color: #34cea7;
    border-color: #34cea7;
}

.btn-success.focus,
.btn-success:focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);
}

.btn-info {
    color: color-yiq(#17a2b8);
    background-color: #17a2b8;
    border-color: #17a2b8;
}

.btn-info:hover {
    color: color-yiq(#138496);
    background-color: #138496;
    border-color: #117a8b;
}

.btn-info.focus,
.btn-info:focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5);
}

.btn-dark {
    color: color-yiq(#343a40);
    background-color: #343a40;
    border-color: #343a40;
}

.btn-dark:hover {
    color: color-yiq(#23272b);
    background-color: #23272b;
    border-color: #1d2124;
}

.btn-dark.focus,
.btn-dark:focus {
    -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
    box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
}

/* Anas */
.my_btn_primary {
    border-radius: 5px;
    background: rgba(1, 30, 124, 0.96);
    color: #fff;
    min-width: 100%;
    font-family: Poppins;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 16.5px */
    box-shadow: -6px 6px 14px 0px rgba(0, 0, 0, 0.05);
    padding: 10px 10px;
    align-items: center;
}
.my_btn_primary_2 {
    border-radius: 5px;
    background: rgba(1, 30, 124, 0.96);
    color: #fff;
    min-width: unset;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 16.5px */
    box-shadow: -6px 6px 14px 0px rgba(0, 0, 0, 0.05);
    padding: 10px 10px;
    align-items: center;
}
.my_btn_settings {
    border-radius: 5px;
    /*background: rgba(1, 30, 124, 0.96);*/
    /*color: #FFF;*/
    min-width: 100%;
    font-family: Poppins;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 16.5px */
    box-shadow: -6px 6px 14px 0px rgba(0, 0, 0, 0.05);
    padding: 10px 10px;
    align-items: center;
}
.my_btn_save {
    display: flex;
    width: 355px;
    height: 37px;
    padding: 8px 20px;
    justify-content: center;
    align-items: center;
    /*gap: 304px;*/
    /*flex-shrink: 0;*/
    border-radius: 5px;
    background: rgba(1, 30, 124, 0.96);
    box-shadow: -6px 6px 14px 0px rgba(0, 0, 0, 0.05);
    color: #fff;
    font-family: "Arial Rounded MT";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 16.5px */
}
.my_btn_skip {
    border-radius: 5px;
    background: rgba(74, 74, 74, 0.96);
    box-shadow: -6px 6px 14px 0px rgba(0, 0, 0, 0.05);
    display: flex;
    width: 117px;
    height: 37px;
    padding: 8px 20px;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-family: "Arial Rounded MT";
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 16.5px */
}
.V_background_page .form-group-material .input-material {
    border-radius: 5px;
    background: #fff;
    box-shadow: -6px 6px 14px 0px rgba(0, 0, 0, 0.05);
    display: inline-flex;
    padding: 10px 10px 10px 10px;
    /* flex-direction: column; */
    align-items: flex-start;
    /* gap: 10px; */
    border: none;
    font-family: Arial Rounded MT;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 16.5px */
}
.V_background_page .form-group-material .input-material::placeholder {
    color: #bcbcbc;
    font-family: Arial Rounded MT;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 16.5px */
}
.register_page.V_background_page .form-group-material .form-check {
    display: flex;
    align-items: center;
    gap: 5px;
}
.register_page.V_background_page .form-group-material .form-check .error {
    order: 4;
    display: block;
    margin-bottom: 0;
    color: #dc3545;
}

.text_aligning_left {
    text-align: left;
}
.text_aligning_right {
    text-align: right;
}
.V_background_page .form-group-material.form_footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.V_background_page .form-group-material.form_footer .form-check {
    color: #4a4a4a;
    font-family: Arial Rounded MT;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 16.5px */
}

/*.V_background_page .signin_form_tag*/
/*{*/
/*padding: 100px;*/
/*}*/
.V_background_page .form-inner .register-section {
    color: #4a4a4a;
    font-family: Arial Rounded MT;
    font-size: 11px;
    padding-top: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.V_background_page .form-inner .signup.register-section {
    color: rgba(1, 30, 124, 0.96);
    font-family: Arial Rounded MT;
    font-size: 11px;
    padding-top: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.login_form_check_text {
    color: #4a4a4a;
    font-family: Arial Rounded MT;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 16.5px */
}
/*.V_background_page .form-inner .form-check*/
/*{*/
/*	padding-left: 2.25rem;*/
/*}*/
.V_background_page .form-inner .form-check-input {
    margin-top: 0.2rem;
}
.floating_right {
    float: right;
}

mark {
    background-color: yellow;
}

.V_background_page .form-group-material .forgot-pass {
    /*margin-left: 5px;*/
    /*font-size: 11px;*/
    color: rgba(1, 30, 124, 0.96);
    font-family: Arial Rounded MT;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 15px */
}

.V_background_page .form-group-material label {
    color: #000;
    font-family: Arial Rounded MT;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.2; /* 16.5px */
}

.input_margin_bottom {
    margin-bottom: 14px;
}
.checkbox_line_margin_bottom {
    margin-bottom: 30px;
}

.register_page .form-inner {
    border-radius: 15px;
    background: #fff;
    box-shadow: -5px 5px 14px 0px rgba(0, 0, 0, 0.05);
    /* border-radius: 5px; */
    padding: 50px 30px;
    /* background: #FFF; */
    /* box-shadow: 0 0 35px rgba(0, 0, 0, .1); */
    margin-bottom: 20px;
    width: 100%;
}
.welcome_form .form-inner {
    border-radius: 15px;
    background: #fff;
    box-shadow: -5px 5px 14px 0px rgba(0, 0, 0, 0.05);
    /* border-radius: 5px; */
    padding: 50px 50px;
    /* background: #FFF; */
    /* box-shadow: 0 0 35px rgba(0, 0, 0, .1); */
    margin-bottom: 20px;
    width: 100%;
}

.register_page .form-group-material select,
.welcome_form .form-group-material select {
    width: 100%;
}
.register_page .form-group-material.form_footer {
    padding-left: 15px;
    justify-content: unset;
    align-items: center;
}

.register_page .form-group-material button {
    margin: 0 5px;
}
.email-verification .form-group-material .verification_code_input {
    display: inline-flex;
    padding: 10px 10px;
    border-radius: 5px;
    background: #fff;
    border: none;
    box-shadow: -6px 6px 14px 0px rgba(0, 0, 0, 0.05);
    justify-content: center;
    align-items: center;
    letter-spacing: 6.5px;
    gap: 10px;
}
.email-verification .form-group-material .verification_code_input::placeholder {
    color: #4a4a4a;
    font-family: "Arial Rounded MT";
    font-size: 13px;
    letter-spacing: 6.5px;
}
.qr_code_division {
    display: inline-flex;
    padding: 20px;
    align-items: flex-start;
    gap: 10px;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0px 7px 15px 0px rgba(0, 0, 0, 0.05);
}
/*.qr_code_division svg {*/
/*width: 72px;*/
/*height: 72px;*/
/*}*/
.V_background_page p {
    color: #4a4a4a;
    text-align: center;
    font-family: "Arial Rounded MT";
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.8; /* 21px */
}
.welcome_form.V_background_page p {
    color: #4a4a4a;
    text-align: center;
    font-family: "Arial Rounded MT";
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.8;
}
.welcome_form.V_background_page span {
    color: #011e7c;
}

/*Partner login page*/
.partner_login_page .login_note p {
    text-align: left;
    line-height: 1.2;
}
.partner_login_page .login_note p span {
    font-weight: 600;
}

/**/

/* password field styling */

.password_field_wrapper .password_field_input {
    position: relative;
}
.password_field_wrapper .toggle_password {
    position: absolute;
    top: 40px;
    right: 10px;
    color: grey;
}

/**/

/*Confirmation Sweet alert*/

.swal2-container .swal2-modal.swal2-popup .swal2-icon.swal2-warning {
    display: none !important;
}
.swal2-container .swal2-modal.swal2-popup {
    border-radius: 20px;
}
.swal2-container .swal2-modal.swal2-popup .swal2-actions .swal2-confirm {
    background: #011e7c !important;
    min-width: 130px;
}
.swal2-container .swal2-modal.swal2-popup .swal2-actions .swal2-cancel {
    background: #4a4a4a !important;
    min-width: 130px;
}
.swal2-container .swal2-modal.swal2-popup .swal2-actions {
    gap: 15px;
}

.swal2-container .swal2-modal .swal2-icon .swal2-success-ring {
    border-color: #011e7c;
    background: #011e7c;
}
.swal2-container .swal2-modal .swal2-success-line-long {
    background: white;
    z-index: 999;
}
.swal2-container .swal2-modal .swal2-success-line-tip {
    background: white;
    z-index: 999;
}

.swal2-container .swal2-modal .swal2-title {
    font-family: ErasBoldITC;
    font-weight: 900;
}

.swal2-container .swal2-modal .swal2-html-container {
    font-size: 25px;
    padding-top: 10px;
    color: #4a4a4a;
    font-weight: 500;
}

/*Confirmation Sweet alert*/

.V_background_page .login_options_wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;
}

@media screen and (max-width: 768px) {
    .login-page .form-outer,
    .register-page .form-outer {
        width: 100%;
    }

    .login-page .form-inner,
    .register-page .form-inner {
        padding: 40px 50px;
    }

    .register_page.login-page.V_background_page .d-flex.input_margin_bottom {
        display: block !important;
    }
}

@media screen and (max-width: 480px) {
    .login-page .form-inner,
    .register-page .form-inner {
        padding: 35px 35px;
    }
}

@media screen and (max-width: 375px) {
    .login-page .form-inner,
    .register-page .form-inner {
        padding: 30px 25px;
    }
}
