body {
    background: var(--au-site-bg);
}

.login form {
    background: var(--au-light-bg);
}

#login { width: 100%; max-width: 380px;}

.login h1 a,
.login h1.wp-login-logo a {
    /* Use logo in variable if it exists, or fallback to AuRise logo */
    background-image: url('logo-login.png');
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    width: 320px;
    height: 260px;
}

.login form input[type="submit"],
.login form input[type="button"].button.button-primary {
    font-weight: 700;
    background: var(--au-cta-color);
    border-color: var(--au-cta-color);
    color: var(--au-cta-text);
}

.login form input[type="submit"]:active,
.login form input[type="submit"]:focus,
.login form input[type="submit"]:hover,
.login form input[type="button"].button.button-primary:active,
.login form input[type="button"].button.button-primary:focus,
.login form input[type="button"].button.button-primary:hover {
    background: var(--au-cta-color-hover);
    border-color: var(--au-cta-color-hover);
    color: var(--au-cta-text-hover);
}

.login #nav a,
.login #backtoblog a,
.login .privacy-policy-page-link a {
    color: var(--au-cta-color);
}

.login #nav a:active,
.login #nav a:focus,
.login #nav a:hover,
.login #backtoblog a:active,
.login #backtoblog a:focus,
.login #backtoblog a:hover,
.login .privacy-policy-page-link a:active,
.login .privacy-policy-page-link a:focus,
.login .privacy-policy-page-link a:hover {
    color: var(--au-cta-color-hover);
}