/** login */
* {
    box-sizing: border-box;
    moz-box-sizing: border-box;
    webkit-box-sizing: border-box;
}
/** Prevent scrolling in login page in IE*/
html {
    -ms-overflow-y: hidden;
}
body {
    background-color: #FFF;
}
.loginScreen {
    width: 350px;
    position: relative;
    margin: 220px auto 0;
}
.loginScreen:before {
    content: '';
    background-image: url(../custom/images/logos/main_logo.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center bottom;
    height: 150px;
    width: 100%;
    position: absolute;
    left: 0;
    top: -200px;
}
.loginScreen .loginTitle {
    font-size: 3em;
    font-family: 'D-DIN';
    margin-bottom: 20px;
}

.loginScreen .loginTitle.logout {
    font-size: 2em;
}
.loginScreen .loginForm input {
    color: #3A3A3A;
    border: 1px solid #E6E6E6;
    border-radius: 8px;
    padding: 16px 20px 14px 20px;
    margin-bottom: 20px;
    font-size: 1.1667em;
    width: 100%;
    height: 48px;
    outline: none;
}
.loginScreen .loginForm .label {
    display: inline-block;
    padding: 0 10px 3px 10px;
    position: relative;
    top: 10px;
    left: 10px;
    background: #FFF none;
    text-transform: uppercase;
    color: #5E5E5E;
    z-index: 1;
    font-size: 0.9167em;
}
.loginScreen .loginActions {
    overflow: hidden;
}
.loginActions .loginLinks {
    margin-top: 10px;
    padding: 0 10px;
    text-align: right;
}
.loginLinks #registerLink {
    float: left;
}
.TwoFactorRetryButtonDisable {
    background-color: #bFbFbF !important;
    color: #7F7F7F !important;
    border: none !important;
    pointer-events: none;
    cursor: none !important;
}
.loginScreen .button {
    width: 100%;
    height: 55px;
    background-color: var(--accent-colour-500);
    color: #FFF;
    cursor: pointer;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 30px 0;
    font-weight: bold;
    font-size: 1.3333em;
}
#twoFactorRetryButton {
    background-color: #FFF;
    color: var(--accent-colour-500);
    border: 1px solid #7F7F7F;
}
#openIdAndBasicAuth .button {
    width: 100%;
}
#openIdLogin {
    margin-bottom: 25px;
}
.loginScreen .submitButtonRow:not(:only-child) {
    margin-bottom: 20px;
}
.loginScreen .loginContent {
    margin-top: -10px;
    margin-bottom: 30px;
}
.loginScreen .captchaImages {
    height: 50px;
    margin: 10px 0 -10px;
}
.loginScreen .captchaReloadImage {
    cursor: pointer;
    margin: 25px 0 0 10px;
}
.loginScreen #loginMessages div {
    color: #FF4F4F;
    margin-bottom: 25px;
    font-weight: normal;
    font-style: italic;
    background: #FFF url(../images/warning.png) no-repeat top left;
    padding-left: 25px;
}
.showHideLoginElement {
    display: none;
}
.loginScreen .logoutContent {
    margin-top: 0;
}
.loginHelp {
    padding: 0 10px;
    text-align: right;
}
.loginIframe {
    width: 100%;
    height: 100%;
    border: none;
    background-color: #FFF;
}
.right {
    display: table-cell;
    vertical-align: top;
    background-color: #D8DDE6;
    width: 50%;
    height: 100%;
}
.left {
    background-color: #FFF;
    display: table-cell;
    vertical-align: top;
    height: auto;
}
.bodyWithIframe {
    display: table;
    width: 100%;
    overflow: auto;
}
.body {
    background-color: #FFF;
}
@media only screen and (max-width: 1024px) {
    #left {
        width: 100%;
    }

    #right, .loginHelp {
        display: none;
    }
}
.loginAsDifferentUser {
    padding-top: 20px;
    display: block;
}