﻿.divLoginBackgroundContainer{display:none;}
.frmLogin{display: table-cell;vertical-align: middle;background-color: transparent;flex: 0;}
.loginInput{width: 297px;height: 45px;border: 1px solid #ccc;border-left: none;font-size: 14px;color: #868f9b;border-top-right-radius: 5px;border-bottom-right-radius: 5px;margin-left: 45px;padding-bottom: 0px;}
.loginInput input{height: 100%;padding: 0 10px;}
.loginInputWrapper:nth-last-child(1){display:block;}
.loginInputWrapper .btn{background:none;background-color: #fff;font-size: 20px;text-transform: uppercase;border: #f26122;width: auto;height: auto;}
.pageWrapper { background-image: url(Background-Image.jpg); background-size: cover; background-position: center; }
.divLoginWrapper:before { background-image: url(Welcome-Texts-image.png); background-size: auto; width: 399px; height: 285px; content: ""; position: absolute; top: -20px; background-repeat: no-repeat; }

#RecoverPasswordLink{text-decoration:none;}
#RecoverPasswordLink:hover{
    text-decoration:underline;
}
.loginBox { background-image: none; float: left; background-color: #f26122; border-radius: 30px; width: 400px; left: 60px; top: 270px; position: absolute; height: auto; margin: 0; padding: 10px; }
.loginHeader { height: 10%; background-color: #f26122; border-radius:30px; }
.loginHeaderWrapper { color: white; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; font-size: 45px; text-align: center; height: 20px; padding-left: 0; border-radius:30px; }
.loginBodyWrapper { background-color: transparent; padding-left: 20px; padding-right: 20px;height:222px; }
.loginBodyWrapper .hr30 { margin-top: 0px; }
.loginBody { display: table-row; height: 20%; padding-bottom: 0px; }
.loginInput #LoginID { background-color: #fff; }
.loginInputWrapper { background-color: white; padding: 5px; width: auto; height: auto; border-radius: 10px;display: block; }
.loginInputWrapper.text-center { background-color: inherit; }
.loginInputWrapper a { color: white; }
.loginInputWrapper:nth-last-child(1) {display: flex; flex-direction: column-reverse; width: 100%; align-items: center; height: 80px; justify-content: space-between;}
.loginLogo { padding-top: 4px; padding-left: 4px;display:inline-block; }
.loginLogoIcon { width: 35px; height: 35px; }
.loginUserLogoIcon { background-image: url(03.png); background-size: cover; }
.loginPasswordLogoIcon { background-image: url(04.png); background-size: cover; background-position: 0 0; }
.loginUserLogo { background-color: #fff; border-right: solid #f26122; border-bottom-right-radius: 0; border-top-right-radius: 0; }
.loginPasswordLogo { background-color: #fff; border-right: solid #f26122; border-bottom-right-radius: 0; border-top-right-radius: 0; }
.btn:hover { color: #fff; background-color: #f26122; border: 2px solid #fff; }
.btn { background-color: #fff; color: #f26122; border: #f26122; border-radius: 10px; font-weight: bold; padding: 6px 25px; text-transform: uppercase; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; font-size: 20px; }
.divLoginWrapper { width: 100%; height: 100%; display: table; padding-top: 20px; padding-left: 50px;background: none; }
.contentWrapper { background-image: url(AeonBig_logo.png); background-size: cover; }
.loginInput { border: none; color: #868f9b; }
input[data-val-required]:not([data-val-required-allowempty]):not([disabled]) { color: #000; border: none; background-color: #fff; }
.loginFooterWrapper { display: table-cell; text-align: center; vertical-align: middle; background-color: #f26122; }

@media (max-width: 767px) {
    .loginBox { min-width: 300px; }
    .loginHeaderWrapper { padding: 0; }
    .loginFooter { height: 30px; }
}

@media (max-width: 480px) {
    .divLoginWrapper { padding-left: 0; }
    .divLoginWrapper:before { width: 90%; background-size: contain; margin: 0 auto; display: block; left: 20px; }
    .loginBox { width: 90%; float:none; margin: 0 auto; left: 20px; }
    .loginFooter { height: 30px; }
    .frmLogin { padding-top: 250px; vertical-align: top; }
}

@media (max-height: 700px) {
    .divLoginWrapper:before { background-size: contain; height: 45%; }
    .loginHeaderWrapper { font-size: 40px; padding-bottom: 10px; }
    .loginBox { height: auto; max-height: 50%; padding:5px; top: 43%; }
    .frmLogin { padding-top: 80px; }
    .loginLogo { padding-top: 0px; padding-left: 2px; width: 45px; height: 35px;}
    .loginInput { height:35px; }
}

@media (max-height: 530px) {
    .divLoginWrapper:before { height: 0px; }
    .loginBox { position: static; }
    .frmLogin { padding-top: 0px; vertical-align: middle; }
}

@media (max-height: 470px) {
    .divLoginWrapper:before { height: 0px; }
    .loginBox { position: static; }
}
