.top-header {
    padding: 25px 15px;
    text-align: center;
}
.login-page, .register-page {
    background: #FFF;
    /* stacking context so the decorations below sit above this background
       but behind the login panel */
    position: relative;
    z-index: 0;
    min-height: 100vh;
}

/* home page decorations, same artwork and treatment as client/index --
   see .home-decor in client/css/style.css. The body is full width here,
   so no calc() break-out of a centered container is needed. */
.login-page::before,
.login-page::after {
    content: "";
    /* fixed, not absolute: pinned to the bottom of the window rather than to
       the bottom of the document, so they stay put whatever the page height */
    position: fixed;
    z-index: -1;
    opacity: .5;
    pointer-events: none;
    background-repeat: no-repeat;
}
/* the whole shape, never cropped: `contain` fits it inside the box, and the
   max-height keeps it clear of the top of the window on short screens
   (index hangs the same artwork full-height from the top instead) */
.login-page::before {
    bottom: 0;
    right: 0;
    width: 180px;
    height: 686px;
    max-height: 70vh;
    background-image: url("../../client/images/decor-right.png");
    background-size: contain;
    background-position: right bottom;
}
.login-page::after {
    bottom: 30px;
    left: 30px;
    width: 210px;
    height: 147px;
    background-image: url("../../client/images/decor-left.png");
    background-size: contain;
    background-position: left bottom;
}

.dbtn {
    padding: 14px;
    font-size: 14px;
    display: inline-block;
    border-radius: 20px;
    text-align: center;
}
.dbtn.green {
    background: var(--ga-orange);
    color: #FFF;
}
.alert-info { background-color: #529538 !important; border-color: #529538 !important; }
.login-page { font-family: var(--ga-font); }
@media (min-width: 992px){
    .col-md-offset-4 {
        margin-left: 33.33333333%;
    }
    .col-md-4 {
        width: 33.33333333%;
    }

}
