:root {

    --wp--colour--base--white: #ffffff;
    --wp--colour--base--white--rgb:	255,255,255;
    --wp--colour--base--gray--10: #eef0f2;	
    --wp--colour--base--gray--10--rgb: 238,240,242;
    --wp--colour--base--gray--20: #d2d7db;	
    --wp--colour--base--gray--20--rgb: 210,215,219;
    --wp--colour--base--gray--30: #b5bec5;	
    --wp--colour--base--gray--30--rgb: 181,190,197;
    --wp--colour--base--gray--40: #9FA9B1;	
    --wp--colour--base--gray--40--rgb: 159,169,177;
    --wp--colour--base--gray--50: #88949D;	
    --wp--colour--base--gray--50--rgb: 136,148,157;
    --wp--colour--base--gray--60: #727E89;	
    --wp--colour--base--gray--60--rgb: 114,126,137;
    --wp--colour--base--gray--70: #5b6975;	
    --wp--colour--base--gray--70--rgb: 91,105,117;
    --wp--colour--base--gray--80: #3d474f;	
    --wp--colour--base--gray--80--rgb: 61,71,79;
    --wp--colour--base--gray--90: #202429;	
    --wp--colour--base--gray--90--rgb: 32,36,41;
    --wp--colour--base--black: #111315;	
    --wp--colour--base--black--rgb: 17,19,21;

    /* Active */
    --wp--colour--ui--green: #73b249;
    /* Qualified, qualified active */
    --wp--colour--ui--orange: #ffb300;
    /* Pending */
    --wp--colour--ui--blue: #3954a5;
    /* Expired, invalid */
    --wp--colour--ui--red: #f53717;
    /* Disabled, inactive, retired, unpublished */
    --wp--colour--ui--gray: var(--wp--colour--base--gray--50);
    /* Focus, select outline, also admin UI colour */
    --wp--colour--ui--select: var(--wp-admin-theme-color);
    /* UI Yellow */
    --wp--colour--ui--yellow: var(--wp--colour--base--white);
    /* UI Black */
    --wp--colour--ui--black: var(--wp--colour--base--black);

    /* WP Blues */
    --wp-admin-theme-color: #0693e3;
    --wp-admin-theme-color--rgb: 6,147,227;
    --wp-admin-theme-color-darker-10: #0573b1;
    --wp-admin-theme-color-darker-10--rgb: 5,115,177;
    --wp-admin-theme-color-darker-20: #035380;
    --wp-admin-theme-color-darker-20--rgb: 3,83,128;
}

body {
    background: var(--wp--colour--base--white);
    color: var(--wp--colour--base--black);
}

.login h1 {
    width: 100%;
}

.login form {
    box-shadow: none;
    border: none;
    background-color: transparent;
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}

.login form .input, 
.login form input[type=checkbox], 
.login input[type=text] {
    background: transparent;
}

#login {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: baseline;
}

.login .message,
.login .notice,
.login .success {
    background-color: var(--wp--colour--base--white);
    border-left: 4px solid var(--wp-admin-theme-color);
    box-shadow: 0 1px 6px 0 rgba(var(--wp--colour--base--black--rgb),.1);
    width: 100%;
    margin: auto 20px;
}

.login .success {
    border-left-color: var(--wp--colour--ui--green);
}

.login .notice-error {
    border-left-color: var(--wp--colour--ui--red);
}

#login form .forgetmenot {
    float: none;
    margin: -8px 0 16px 0;
}

.wp-core-ui .submit {
    display: flex;
    justify-content: stretch;
    flex-direction: column;
}

.wp-core-ui .button.button-large {
    background-color: var(--wp-admin-theme-color);
    border: 2px solid transparent;
    border-radius: 4px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-shadow: none;
    color: var(--wp--colour--base--white);
    display: inline-block;
    font-family: "Karla", Helvetica, Arial, sans-serif;
    font-weight: 700;
    letter-spacing: 0.02em;
    max-width: 100%;
    position: relative;
    outline: 0;
    text-align: center;
    text-decoration: none !important;
    -o-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    text-shadow: none;
}

	.wp-core-ui .button.button-large:hover {
	    background-color: var(--wp-admin-theme-color-darker-10);
	    border: 2px solid transparent;
	    box-shadow: 0 3px 18px 0 rgba(var(--wp--colour--base--black), 0.2);
	    color: var(--wp--colour--base--white);
	    transform: translateY(-0.25em);
	    transition: all .5;
	    -o-transition: all .5s;
	    -moz-transition: all .5s;
	    -webkit-transition: all .5s;
	}

    .wp-core-ui .button.button-large:focus-visible {
        outline: 2px solid var(--wp-admin-theme-color);
        outline-offset: 3px;
	}

#login > p {
    text-align: center;
    flex: 3 0 33%;
}

#login > p:first-of-type {
    padding: 0 1em 0 24px; 
    text-align: left;
}    

#login > p:last-of-type {
    padding: 0 24px 0 1em; 
    text-align: right;
}

#login #backtoblog a, 
#login #nav a,
#login p > a {
    color: var(--wp--colour--base--black);
    border-bottom: 1px dotted;
    text-decoration: none;
}

#login #backtoblog a:hover, 
#login #nav a:hover,
#login p > a:hover {
    color: var(--wp--colour--base--black);
    border-bottom: 1px solid;
    text-decoration: none;
}

:focus-visible,
a:focus-visible,
.button:focus-visible {
    box-shadow: none;
    outline: 1px dotted var(--wp-admin-theme-color);
    outline-offset: 3px;
}

a:focus-visible {
    border-bottom: none;
}

a:focus-within,
form:focus-within {
    box-shadow: none;
    outline: 1px dashed var(--wp--colour--base--gray--70);
    outline-offset: 3px;
}