.middle {
    vertical-align:middle
}

.login-form {
    background:#fff
}

.login-form .bx--tooltip__trigger.bx--tooltip--bottom.bx--tooltip--align-center .bx--assistive-text {
    -webkit-transform: translate(-80%, 100%);
    transform:translate(-80%, 100%)
}

.login-form .fields-container {
    padding:1rem 0
}

@media (min-width: 42rem) {
    .login-form .fields-container {
        padding:1rem
    }
}

.login-form .heading-container {
    margin-top: .5rem;
    margin-bottom: .5rem;
    padding-bottom:1rem
}

.login-form .heading-container .heading {
    font-size: 1.75rem;
    font-weight: 400;
    line-height: 1.29;
    letter-spacing:0
}

.login-form .heading-container .heading span {
    font-weight:600
}

.login-form .bx--text-input__field-outer-wrapper {
    width:100%
}

.login-form .bx--text-input-wrapper {
    margin-bottom:1rem
}

.login-form .bx--label, .login-form form .bx--tooltip__label {
    font-size:.875rem
}

.login-form .remember-me-wrapper {
    margin-top:.5rem
}

.login-form .bx--label, .login-form  {
    width:100%
}

.login-form .bx--label .forgot-link, .login-form .forgot-link {
    font-size: .75rem;
    float:right
}

.login-form .body-01 {
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.43;
    letter-spacing:.16px
}

.login-form .bottom-link-container {
    border-top: 1px solid #dcdcdc;
    margin-top:1.5rem
}

.outer {
    display: table;
    position: absolute;
    height: 100%;
    width:100%
}

@media (min-width: 42rem) {
    .outer {
        background-color:#f4f4f4
    }
}

.middle {
    display: table-cell;
    vertical-align:top
}

@media (min-width: 42rem) {
    .middle {
        vertical-align:middle
    }
}

.inner {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    max-width: 530px;
    width: calc(100% - 40px);
    margin-bottom: 28px;
    min-width: 320px;
    min-height: 338px;
    overflow:hidden
}

.login-container {
    height:100%
}

@media (min-width: 42rem) {
    .login-container {
        margin:auto
    }
}

.login-container .form-area, .login-container > .bx--row {
    height:100%
}

.login-container .help-link {
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.43;
    letter-spacing:.16px
}

@media (min-width: 42rem) {
    .login-container .help-link {
        padding-top:1rem
    }
}

.login-container .logo {
    margin-bottom:.5rem
}

.login-container .logo svg.logo {
    fill: #fff;
    width: 64px;
    height:64px
}