.input-padding {
    padding:26px !important;
}

.padding-12 {
    padding:12px !important;
}

.margin-right-10 {
    margin-right:10px;
}

.margin-right-20 {
    margin-right:20px;
}

#submit-enter-username-box {
    display:none;
}

.text-align-center {
    text-align:center;
}

#google-sso-icon {
    color:#4285F4;
    font-size:50px;
}


#enter-username-button-box {
    min-height:40px !important;
}


.float-right {
    float:right;
}


.float-left {
    float:left;
}

.image-background {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.image-background-1 {
    background-image: url('../../assets/img/bg/1.jpg') !important;
}

.image-background-2 {
    background-image: url('../../assets/img/bg/2.jpg') !important;
}

.image-background-3 {
    background-image: url('../../assets/img/bg/3.jpg') !important;
}

.image-background-4 {
    background-image: url('../../assets/img/bg/4.jpg') !important;
}

.image-background-5 {
    background-image: url('../../assets/img/bg/5.jpg') !important;
}

.image-background-6 {
    background-image: url('../../assets/img/bg/6.jpg') !important;
}

.image-background-7 {
    background-image: url('../../assets/img/bg/7.jpg') !important;
}

.image-background-8 {
    background-image: url('../../assets/img/bg/8.jpg') !important;
}

.image-background-9 {
    background-image: url('../../assets/img/bg/9.jpg') !important;
}

.image-background-10 {
    background-image: url('../../assets/img/bg/10.jpg') !important;
}

.image-background-11 {
    background-image: url('../../assets/img/bg/11.jpg') !important;
}

.image-background-12 {
    background-image: url('../../assets/img/bg/12.jpg') !important;
}

.image-background-13 {
    background-image: url('../../assets/img/bg/13.jpg') !important;
}

.image-background-14 {
    background-image: url('../../assets/img/bg/14.jpg') !important;
}

.image-background-15 {
    background-image: url('../../assets/img/bg/15.jpg') !important;
}

.image-background-16 {
    background-image: url('../../assets/img/bg/16.jpg') !important;
}

#sms-code-counter, #reg-sms-code-counter {
    color:#A39EFF !important;
    font-weight:400;
}

a {
    text-decoration: none;
    cursor:pointer;
}

.margin-top-5 {
    margin-top:5px;
}

.margin-top-10 {
    margin-top:10px;
}

.margin-top-14 {
    margin-top:14px;
}

.margin-top-17 {
    margin-top:17px;
}

.margin-top-20 {
    margin-top:20px;
}

.margin-top-25 {
    margin-top:25px;
}

.margin-top-30 {
    margin-top:30px;
}

.margin-top-40 {
    margin-top:40px;
}

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

.margin-top-50 {
    margin-top:50px;
}

.margin-bottom-5 {
    margin-bottom:5px;
}

.margin-bottom-10 {
    margin-bottom:10px;
}

.margin-bottom-15 {
    margin-bottom:15px;
}

.margin-bottom-20 {
    margin-bottom:20px;
}

.margin-bottom-25 {
    margin-bottom:25px;
}

.margin-bottom-30 {
    margin-bottom:30px;
}

.margin-bottom-40 {
    margin-bottom:40px;
}

.margin-bottom-45 {
    margin-bottom: 45px;
}

.margin-bottom-50 {
    margin-bottom:50px;
}


#login-error-box {
    margin-bottom:20px;
}


.cover-container {
    margin-right: auto;
    margin-left: auto;
    background-clip: padding;
    background-clip: padding-box;
    background-color: #FFF;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.08);
    margin-top:35px;
    padding: 5px;
    color:#333;
    padding-top:30px;
    padding-bottom:30px;
}


.inner {
    padding: 30px;
}


.sms-code-input {
    color:#fff;
    width:73px;
    height:73px;
    font-size:20px;
    text-align:center;
    border-radius: 50%;
    border:1px solid #000;
    outline:none;
    font-weight:400;
    margin-left:3px;
    margin-right:3px;
    background:#2E2D2D !important;
    border-color:#494949 !important;
    opacity: 0.6;
}

#sms-code-input-divider {
    margin-right:4px;
    margin-left:4px;
    font-size:16px;
    font-weight:bold;
}


#login-progress-box {
    margin-bottom:30px;
}

#progress-box-loader {
    min-height:80px;
    margin-top:40px;
    margin-bottom:40px;
    text-align:center;
}

#progress-box-loading-icon {
    font-size:30px;
    margin-bottom:20px;
}

.cover-container {
    margin-top:30px;
    margin-bottom:30px;
}


.yubico-logo {
    width:38%;
}

.yubico-color {
    color:#9aca3c !important;
}



#mfa-enter-login-box {
    width:350px;
}

.login-error-item {
    border-right:0;
    border-top:0;
    border-bottom:0;
    border-left: 2px solid #c1002b !important;
    border-radius:0;
}

#yubico-success-box {
    margin-left:80px;
    margin-top:20px;
}

#yubico-logging-in-message {
    margin-left:75px;
}

body {
    background:#202020;
}


#forgot-your-password-label {
    color:#A39EFF !important;
}

.login-input-label {
    color:#A39EFF !important;
}

.login-input {
    padding:24px !important;
    background:#2E2D2D !important;
    border-color:#494949 !important;
    color:#fff !important;
    border-radius: 4px !important;
    opacity: 0.6;
    font-size:14px;
}

.bankid-login-input {
    padding:20px !important;
    background:#2E2D2D !important;
    border-color:#494949 !important;
    color:#fff !important;
    border-radius: 4px !important;
    opacity: 0.6;
    font-size:14px;
}

.login-input-bg {
    background:#2E2D2D !important;
    border-color:#494949 !important;
    color:#fff !important;
    opacity: 0.6;
}

.logo-rec {
    font-weight:700 !important;
    font-family: 'Titillium Web', sans-serif;
    letter-spacing: -2px;
}

.logo-man {
    font-weight:400 !important;
    font-family: 'Titillium Web', sans-serif;
    letter-spacing: -2px;
}

.transparent {
    background-color: transparent;
}


.margin-left-120{
    margin-left:120px;
}

.margin-left-4 {
    margin-left:4px;
}

.margin-left-10 {
    margin-left:10px;
}

.margin-left-15 {
    margin-left:15px;
}

.margin-left-20 {
    margin-left:20px;
}

.margin-top-10 {
    margin-top:10px;
}

.margin-top-15 {
    margin-top:15px;
}

.margin-bottom-10 {
    margin-bottom:10px;
}


.centered {
  position: fixed;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}


/***   MOBILE   ***/
@media only screen and (max-width: 600px) {

    #bankid-box {
        width:100% !important;
        margin-left:-15px !important;
        margin-right:-15px !important;
    }

    #bankid-box iframe {
        margin-top:0px !important;
        width: calc(100% + 30px) !important;
        margin-left:-15px !important;
        margin-right:-15px !important;
        -webkit-box-shadow: 0 !important;
        -moz-box-shadow: 0 !important;
        box-shadow: 0 !important;
        border-radius: 0px !important;
    }


    #login-box {
        width:98%;
    }

    #mfa-enter-login-box {
        width:98%;
    }

    .sms-code-input {
        width:66px;
        height:66px;
        font-size:16px;
    }

    .reg-sms-code-input {
        width:66px !important;
        height:66px !important;
        font-size:13px;
    }

    #user-profile-box {
        text-align:center;
    }

    .login-input-label {
        font-size:17px;
        margin-bottom:10px;
    }

}



/******     BANK ID      *******/

#bankid-box {
    text-align:center;
}

#bankid-box iframe {
    background:#fff;
    padding:0;
    margin-top: calc(100vh - 360);
    border-radius: 7px;
    border:0;
    width:450px;
    height:360px;
    -webkit-box-shadow: 0px 0px 26px -5px rgba(0,0,0,1);
    -moz-box-shadow: 0px 0px 26px -5px rgba(0,0,0,1);
    box-shadow: 0px 0px 26px -5px rgba(0,0,0,1);
}

.bankid-logo-no {
    margin-top:25px;
    margin-bottom:30px;
    width:50%;
}

.bankid-logo-se {
    margin-top:25px;
    margin-bottom:30px;
    width:30%;
}

.bankid-se-logo {
    margin-top:15px;
    margin-bottom:20px;
    width:30%;
}

.bankid-no-color {
    color:#5378AC !important;
}

#bankid-logging-in-message {
    margin-left:57px;
}

#bankid-success-box {
    margin-left:62px;
    margin-top:20px;
}

#bankid-error-box {
    margin-top:20px;
}





/*********   Register MFA device    **********/


#mobile-phone-prefix-box {
    width:60px;
    opacity:0.9 !important;
}

.mfa-input {
    padding:18px !important;
    background:#2E2D2D !important;
    border-color:#494949 !important;
    color:#fff !important;
    border-radius: 4px !important;
    font-size:14px;
    opacity: 0.8;
}

.mfa-input:hover {
    opacity:1;
    cursor:pointer;
}


#mobile-phone-prefix {
    width:42px !important;
}

.reg-sms-code-input {
    color:#fff;
    width:73px;
    height:73px;
    font-size:20px;
    text-align:center;
    border-radius: 50%;
    border:1px solid #000;
    outline:none;
    font-weight:400;
    margin-left:3px;
    margin-right:3px;
    background:#2E2D2D !important;
    border-color:#494949 !important;
    opacity: 0.6;
}

.select-mfa-box {
    height:155px;
    padding-left:10px;
    padding-right:10px;
    border-left:1px solid #ccc;
    padding:20px;
}


.select-mfa-img-box {
    text-align:center;
    height:60px;
    margin: 1em 0;
    position: relative;
}

.select-mfa-img-box img {
    max-width:90%;
    max-height:90px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.mfa-box-yubico-logo {
    max-width:65% !important;
}

.select-mfa-img-box i {
    font-size:50px;
}

.select-mfa-label {
    margin-top:20px;
    text-align:center;
}

/*********   Choose MFA    **********/

.choose-mfa-box {
    border-left:1px solid #ccc;
}

.choose-mfa-yubico-box {
    margin-top:32px;
    margin-bottom:10px;
}


.choose-mfa-sms-box {
    margin-top:22px;
}

.choose-mfa-sms-box i {
    font-size:50px;
}


/**********    general     ***********/

.font-size-18 {
    font-size:18px;
}

.font-size-20 {
    font-size:20px;
}

.font-size-22 {
    font-size:22px;
}

.font-size-25 {
    font-size:25px;
}

.font-size-30 {
    font-size:30px;
}

.font-size-50 {
    font-size:50px;
}

.font-size-70 {
    font-size:70px;
}

.font-size-100 {
    font-size:100px;;
}

.max-width-60p {
    max-width:60% !important;
}

.max-width-70p {
    max-width:70% !important;
}

.max-width-75p {
    max-width:75% !important;
}

.max-width-150 {
    max-width:150px;
}

.max-width-300 {
    max-width:300px;
}

.height-20 {
    height:20px;
}

.height-25 {
    height:25px;
}

.height-30 {
    height:30px;
}

.height-90 {
    height:90px;
}

.width-27 {
    width:27px;
}

.width-90 {
    width:90px;
}

.width-220 {
    width:220px;
}

.display-none {
    display:none;
}

.img-circle {
    border-radius: 50% !important;
    object-fit: cover !important;
    box-shadow: 0 0 0 2px rgba(0,0,0,.1), 0 3px 4px rgba(0,0,0,.2) !important;
}




#recman-legal-links {
    float:right;
    margin-top:50px;
    height:30px;
    line-height:40px;
}

#recman-legal-links a {
    color:#fff;
    font-size:11px;
    margin-right:15px;
}

#recman-legal-links a:hover {
    text-decoration: underline;
}

.disabled-link {
    pointer-events: none;
    opacity: 0.5;
    cursor: default;
}
