body {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
    font-size: 16px;
    line-height: 1.5;
    background-color: #f9f9f9;
    color: #223c58;
}

strong {
    font-weight: 500;
}

a:focus {
    box-shadow: none;
}

input:focus {
    outline: none !important;
}

.login .message, .login .success {
    background-color: #ffffff;
    border-color: #223c58;
    -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,.075);
    box-shadow: 0 0 10px 0 rgba(0,0,0,.075);
}

.login .message a, .login .success a {
    color: #223c58;
}

.login #login_error {
    color: #cc0000;
    border-color: #cc0000;
    -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,.075);
    box-shadow: 0 0 10px 0 rgba(0,0,0,.075);
}

.login #login_error a {
    color: #cc0000;
    transition: .3s;
}

.login #login_error a:hover {
    opacity: .7;
}

.login #login_error strong {
    font-weight: 500;
}

#login {
    width: 350px;
    max-width: 90%;
}

.login h1 a {
    width: 180px;
    height: 42px;
    background-image: url('/wp-content/themes/veganwebagency/admin/img/veganwebagency_logo.svg');
    background-size: 180px;
}

.login form {
    position: relative;
    z-index: 5;
    margin-top: 30px;
    padding: 25px;
    border: 0;
    -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,.075);
    box-shadow: 0 0 10px 0 rgba(0,0,0,.075);
}

.login form.shake + #nav {
    animation: shake .2s cubic-bezier(.19,.49,.38,.79) both;
    animation-iteration-count: 3;
    transform: translateX(0);
}

.login label {
    font-size: 16px; 
    font-weight: 500;
    margin-bottom: 5px;
}

.login form .input, .login input[type=password], .login input[type=text] {
    font-size: 20px;
    padding: 7px 12px;
    color: #223c58;
    border-color: #d0d0d0;
    border-radius: 0;
    line-height: 1;
    transition: .3s;

    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.login form .input:focus, .login input[type=password]:focus, .login input[type=text]:focus {
    border-color: #223c58;
    box-shadow: 0 0 0 1px #223c58;
}

.login .button.wp-hide-pw {
    color: #223c58;
}

.login .button.wp-hide-pw, .login .button.wp-hide-pw:focus {
    border: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

.wp-core-ui .button-primary, .wp-core-ui a.button-group.button-large .button, .wp-core-ui a.button.button-large {
    font-size: 15px;
    font-weight: 500;
    line-height: normal !important;
    text-shadow: none;
    border: 0;
    border-radius: 0;
    padding: 7px 12px 9px !important;
    -webkit-box-shadow: 0 0 15px 0 rgb(0 0 0 / 10%) !important;
    box-shadow: 0 0 15px 0 rgb(0 0 0 / 10%) !important;
    transition: .3s;
}

.wp-core-ui a.button-group.button-large .button, .wp-core-ui a.button.button-large {
    color: #223c58;
    background: #ffffff;
}

.wp-core-ui .button-primary, .wp-core-ui .button-group.button-large a.button:hover, .wp-core-ui a.button.button-large:hover, .wp-core-ui a.button-group.button-large .button:focus, .wp-core-ui a.button.button-large:focus {
    color: #ffffff;
    background: #223c58;
}

.wp-core-ui .button-primary:hover, .wp-core-ui .button-primary:focus {
    color: #ffffff;
    background: #111E2C;
}

.user-pass-wrap {
    margin-bottom: 3px;
}

.login #login  form .forgetmenot {
    margin-top: 3px;
}

.login .forgetmenot label {
    font-size: 15px;
    font-weight: normal;
    color: #223c58;
    margin-bottom: 0;
}

.login .forgetmenot input {
    position: relative;
    width: 17px;
    height: 17px;
    border-radius: 0;
    margin-right: 4px;
    margin-top: -3px;
    box-shadow: none;
    border-color: #d0d0d0;
}

.login .forgetmenot input:checked {
    border-color: #223c58;
}

.login .forgetmenot input:checked::before {
    position: absolute;
    margin: 0;
    top: -1px;
    left: -2px;
    width: 18px;
    height: 18px;
    content: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%3E%20%3Cpath%20class%3D%22st0%22%20fill%3D%22%23223C58%22%20d%3D%22M14.8%2C4.9l1.3%2C0.9l-5.8%2C8.4H9L5.8%2C9.7l1.3-1.3l2.6%2C2.4L14.8%2C4.9z%22%2F%3E%20%3C%2Fsvg%3E') !important;
}

.login #backtoblog, .login #nav {
    font-size: 15px;
    padding: 0;
}

.login #nav {
    position: relative;
    z-index: 1;
    margin: 0;
    width: 100%;
    background: #ffffff;
    -webkit-box-shadow: 0 0 15px 0 rgba(0,0,0,.1);
    box-shadow: 0 0 15px 0 rgba(0,0,0,.1);
}

.login #nav a {
    display: block;
    padding: 10px 24px;
    color: #8c8c8c;
    transition: .3s;
}

.login #nav a:hover {
    color: #223c58;
}

.login #backtoblog, .login .privacy-policy-page-link {
    display: none;
}


/* Reset Password */
#login form .user-pass1-wrap p:first-child {
    margin-bottom: 0;
}

.pw-weak {
    position: relative;
    padding-left: 26px;
}

.pw-weak input {
    position: absolute;
    top: 6px;
    left: 0;
    width: 17px;
    height: 17px;
    margin-right: 4px;
    margin-top: -3px;
    border-radius: 0;
    box-shadow: none;
    border-color: #d0d0d0;
}

.pw-weak input:focus {
    border-color: #223c58;
    box-shadow: 0 0 0 1px #223c58;
}

.pw-weak input:checked {
    border-color: #223c58;
}

input[type=checkbox]:checked::before {
    position: absolute;
    margin: 0;
    top: -1px;
    left: -2px;
    width: 18px;
    height: 18px;
    content: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%3E%20%3Cpath%20class%3D%22st0%22%20fill%3D%22%23223C58%22%20d%3D%22M14.8%2C4.9l1.3%2C0.9l-5.8%2C8.4H9L5.8%2C9.7l1.3-1.3l2.6%2C2.4L14.8%2C4.9z%22%2F%3E%20%3C%2Fsvg%3E) !important;
}

#pass1-text.short, #pass1.short, #pass1-text.bad, #pass1.bad {
    border-color: #cc0000;
}

#pass1-text.short:focus, #pass1.short:focus, #pass1-text.bad:focus, #pass1.bad:focus {
    box-shadow: 0 0 0 1px #cc0000;
}

#pass-strength-result.short, #pass-strength-result.bad {
    color: #ffffff;
    background-color: #cc0000;
    border-color: #cc0000;
}

#pass1-text.good, #pass1.good {
    border-color: #FFBE0B;
}

#pass1-text.good:focus, #pass1.good:focus {
    box-shadow: 0 0 0 1px #FFBE0B;
}

#pass-strength-result.good {
    color: #223c58;
    background-color: #FFBE0B;
    border-color: #FFBE0B;
}

#pass1-text.strong, #pass1.strong {
    border-color: #223c58;
}

#pass-strength-result.strong {
    color: #ffffff;
    background-color: #223c58;
    border-color: #223c58;
}


/* Login Action */
.login h1.admin-email__heading {
    font-size: 26px;
    font-weight: 500;
    color: #223c58;
    border-bottom: 0;
    padding-bottom: .5rem;
}

#login form p {
    margin-top: 0;
    margin-bottom: .75rem;
}

#login form p a {
    color: #223c58;
    transition: .3s;
}

#login form p a:hover {
    opacity: .7;
}

.admin-email__actions div {
    padding-top: .75em;
    margin-bottom: .5em;
}

.admin-email__actions div a.button {
    margin-right: 7px;
}

.admin-email__actions-secondary a {
    text-decoration: none;
    color: #8c8c8c;
    transition: .3s;
}

.admin-email__actions-secondary a:hover {
    color: #223c58;
}


/* Password Protect */
.login-password-protected #loginform {
    margin-bottom: 0;
}

.login-password-protected #password_protected_pass {
    margin-top: 5px;
}

.login-password-protected.login label {
    margin-bottom: 0;
    width: 100%;
}


@media screen and (max-width: 767px) {

    .login form {
        padding: 15px;
    }

    .login form .forgetmenot {
        margin-top: -10px;
    }

    #login form p.submit {
        float: left;
        width: 100%;
    }

    .login .button-primary {
        float: left;
    }

    .login #nav a {
        padding: 10px 15px;
    }

}