
/*** Login page ***/
/* logo page */
/*background-color: #444 !important;*/
/*.login { background-image: url(../../images/login_bg.jpg) }
.login .logo { margin: 0 auto; margin-top: 50px; padding: 15px; text-align: center; }
.login .content { background-color: #fff; width: 360px; margin: 0 auto; margin-bottom: 0px; padding: 30px; padding-top: 10px; padding-bottom: 15px; }
.login .content h3 { color: #000; }
.login .content h4 { color: #555; }
.login .content p { color: #222; }
.login .content .login-form, .login .content .forget-form { padding: 0px; margin: 0px; }
.login .content .input-icon { border-left: 2px solid #35aa47 !important; }
.login .content .input-icon .form-control { border-left: 0; }*/
/*.login .content .forget-form { display: none; }*/
/*.login .content .register-form { display: none; }
.login .content .form-title { font-weight: 300; margin-bottom: 15px; margin-top: 15px; }
.login .content .form-actions { background-color: #fff; clear: both; border: 0px; border-bottom: 1px solid #eee; padding: 0px 30px 15px 30px; margin-left: -30px; margin-right: -30px; }
.login .content .form-actions .checkbox { margin-left: 0; padding-left: 0; }
.login .content .forget-form .form-actions { border: 0; margin-bottom: 0; padding-bottom: 20px; }
.login .content .register-form .form-actions { border: 0; margin-bottom: 0; padding-bottom: 0px; }
.login .content .form-actions .checkbox { margin-top: 8px; display: inline-block; }
.login .content .form-actions .btn { margin-top: 1px; }
.login .content .forget-password { margin-top: 15px; }*/
/* footer copyright */
/*.login .copyright { color: white; text-align: center; margin: 0 auto; padding: 10px; font-size: 11px; }
.login .copyright a { color: white; }

*/

/*
@media (max-width: 480px) {
    .login .logo { margin-top: 10px; }
    .login .content { width: 280px; }
    .login .content h3 { font-size: 22px; }
    .login .checkbox { font-size: 13px; }
}


*/
html, body { height: 100%; margin: 0px; padding: 0px; font-size: 14px; font-weight: 400; }
body { display: flex; flex-direction: column; color: #646c9a; background: #2f353b url(../../../App_Assets/images/1.jpg) no-repeat; background-size: cover; }
.login-wrapper { display: flex; flex-direction: row; flex: 1 0 auto; height: 100%; }
.content-left { flex-direction: column; width: 605px; padding: 3rem; background-repeat: no-repeat; background-size: cover; }
.content-right { flex: 1; flex-direction: column; display: flex; align-content: center; justify-content: center; }
.content { display: flex; flex: 1 0 auto; justify-content: space-between; flex-direction: column; height: 100%; overflow: auto; }
.content-right > .content { background: #fff; border-radius: 0.5rem !important; padding: 1rem; }
.form-title { margin-bottom: 10px; font-weight: 600 !important; text-align: center; font-size: 2rem; }
.content-form { width: 450px; position: relative; }
.w-100 { width: 100% }
.content-head > img { float: left }
.content-head > small { padding-top: 48px; display: inline-block; color: #e8f0fe; }
.content-body, .content-foot { display: flex; }
.content-body { justify-content: center; }
.content-foot { flex-direction: column; align-items: center; }
.input-icon i { margin: 16px 2px 4px 10px; }
.form-control { border: none; height: 50px; background-color: rgba(247, 247, 249, 0.7); padding-left: 1.25rem; padding-right: 1.25rem; -webkit-transition: background-color 0.3s ease; transition: background-color 0.3s ease; }
.help-block { font-size: 80% }
.captcha-group { height: 47px; border: 1px solid #EEE; border-left: 2px solid #35aa47 !important; }
.captcha-group > div { float: left !important; }
td { text-align: center; vertical-align: middle; }
.captcha-grid { position: absolute; width: 181px; z-index: 2; top: 26px; margin-left: 119px; }
.captcha-grid input[type=radio] { display: none; }
.captcha-grid input[type=radio] + label { cursor: pointer; display: block; height: 100%; line-height: 25px; color: #999; margin: 0px; }
.captcha-grid input[type=radio] + label:before { display: block; font-family: FontAwesome; font-size: 20px; }
.captcha-grid input[type=radio] + label:before { content: "\f00c"; color: #FFF; background: #FFF; }
.captcha-grid input[type=radio] + label:hover:before { background: #F5F5F5; }
.captcha-grid input[type=radio]:checked + label:before, .captcha-grid input[type=radio]:checked + label:hover:before { content: "\f00c"; color: #888; }
.captcha-error-msg { padding: 1px 4px; }

.kt-login__actions { display: flex; justify-content: space-between; align-items: center; margin: 3rem 0; }
.kt-login__actions .kt-login__link-forgot { color: #a7abc3; }
.kt-login__actions .kt-login__link-forgot:hover { color: #2c77f4; }
.kt-login__actions .kt-login__btn-primary { height: 50px; padding-left: 2.5rem; padding-right: 2.5rem; }
.btn { border-radius: 0.25rem !important; }
.btn-primary { color: #fff; background-color: #5867dd; border-color: #5867dd; }
.btn-primary:hover { color: #fff; background-color: #384ad7; border-color: #2e40d4; }
.btn.btn-primary.btn-elevate { -webkit-box-shadow: 0px 4px 16px 0px rgb(88 103 221 / 15%); box-shadow: 0px 4px 16px 0px rgb(88 103 221 / 15%); }
.btn.btn-elevate { -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }

.btn-warning { color: #212529; background-color: #ffb822; border-color: #ffb822; color: #111111; }
.btn-warning:hover { color: #212529; background-color: #fbaa00; border-color: #eea200; }

.kt-login__info { display: flex; justify-content: space-between; }
.kt-login__info .kt-login__copyright { color: rgba(255, 255, 255, 0.6); }
.kt-login__info .kt-login__menu > a { text-decoration: none; margin-right: 0.5rem; display: inline-block; color: rgba(255, 255, 255, 0.6); }
.kt-login__info .kt-login__menu > a:hover { color: #fff }

.alert { padding: 15px; border: 1px solid transparent; border-radius: 4px !important; }
.alert-success { background-color: #abe7ed; border-color: #abe7ed; color: #27a4b0; }
.alert-info { background-color: #e0ebf9; border-color: #e0ebf9; color: #327ad5; }
.alert-warning { background-color: #f9e491; border-color: #f9e491; color: #c29d0b; }
.alert-danger { background-color: #fbe1e3; border-color: #fbe1e3; color: #e73d4a; }

@keyframes fadeOut {
    0% { opacity: 1; visibility: visible; }
    90% { opacity: 1; visibility: visible; }
    100% { opacity: 0; visibility: hidden; }
}

.fadeOut { animation: fadeOut 8s ease-in; opacity: 0; }

.seal-wrapper { padding: 1rem; display: flex; justify-content: space-around; flex-wrap: wrap; width: 100%; }
.seals { display: flex; flex-direction: row; justify-content: space-around; flex-grow: 1; margin: 0.75% 0; }

@media (min-width: 1025px) {
    .login-wrapper .content-left { }
    .login-wrapper .content-right { padding: 3rem; }
    .content-form { align-content: center; }
}

@media (max-width: 1024px) {
    .login-wrapper { flex-direction: column; }
    .login-wrapper .content-left { width: 100%; height: auto; padding: 2rem 1.5rem; }
    .login-wrapper .content-right { padding: 1rem; }
}

#btnLogin.loading:after { font-family: 'FontAwesome'; content: "\f110"; margin-left: 10px; animation: fa-spin 1s infinite steps(8); display: inline-block; }
.eye { -webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none !important; position: absolute; right: 9px; top: 10px; cursor: pointer; }
.eye:after { content: "\f070"; display: block; font: normal normal normal 24px/1 FontAwesome; right: 0; position: absolute; color: #AAA; outline: none; }
.eye:checked:after { content: "\f06e"; }
.legal { display: flex; justify-content: space-evenly; border-top: 0px solid #DDD; padding-top: 1rem; width: auto }
.legal > a { display: flex; justify-content: space-evenly; align-items: center; font-size: 0.8rem; text-align: center; padding: 0 0.5rem; border-left: 1px solid #CCC; }
.legal > a:first-child { border: none; }
