:root {
	--hdwl-deep: #152433;
	--hdwl-accent: #d82b34;
	--hdwl-border: #dbe2e8;
	--hdwl-surface: #ffffff;
}

body.login {
	background: #f3f5f7;
}

.login h1 a {
	width: 280px;
	height: 76px;
	margin-bottom: 24px;
	background-image: url('hd-login-logo.svg');
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}

.login form {
	border: 1px solid var(--hdwl-border);
	border-radius: 10px;
	box-shadow: 0 12px 35px rgba(21, 36, 51, 0.08);
}

.login #backtoblog a,
.login #nav a {
	color: var(--hdwl-deep);
}

.login #backtoblog a:hover,
.login #nav a:hover,
.login #backtoblog a:focus,
.login #nav a:focus {
	color: var(--hdwl-accent);
}

.login .button-primary {
	background: var(--hdwl-deep);
	border-color: var(--hdwl-deep);
}

.login .button-primary:hover,
.login .button-primary:focus {
	background: #22394d;
	border-color: #22394d;
}