/* Login photograph stays visible; the portal uses a separate landscape image. */
.x-viewport body {
    background-color: rgb(0, 47, 76);
    background-image: linear-gradient(90deg, rgb(0, 47, 76) 35%, rgba(0,47,76,.85) 52%, rgba(0,47,76,0) 72%),
        url(../images/wohlwend/login-truck-close.jpg);
    background-repeat: no-repeat;
    background-position: center, right center;
    background-size: cover, auto 100%;
}
/* Center the login group in the space left of the 2:3 portrait photograph. */
.logo.logo-login, .login-window {
    left: max(16px, calc(50vw - 33.333333vh - 175px)) !important;
}
.logo.logo-login {
    position: fixed !important;
    top: max(20px, calc(50vh - 215px)) !important;
    width: 350px !important;
    padding-top: 0;
}
.login-window {
    top: max(124px, calc(50vh - 111px)) !important;
}
.x-viewport body.wohlwend-authenticated {
    background-image: linear-gradient(rgba(0,0,0,.45), rgba(0,0,0,.45)),
        url(../images/wohlwend/portal-fleet.jpg);
    background-position: center;
    background-size: cover;
}
@media (max-width: 700px) {
    .x-viewport body {
        background-image: linear-gradient(rgba(0,0,0,.45), rgba(0,0,0,.45)),
            url(../images/wohlwend/login-truck-close.jpg);
        background-position: center, center;
        background-size: cover;
    }
}

@media (max-width: 700px) {
    .logo.logo-login, .login-window {
        left: calc(50vw - 175px) !important;
    }
}