1html,
  2body {
  3	height: 100%;
  4	margin: 0;
  5	padding: 0;
  6}
  7
  8body {
  9	background: #f0f0f1;
 10	min-width: 0;
 11	color: #3c434a;
 12	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 13	font-size: 13px;
 14	line-height: 1.4;
 15}
 16
 17a {
 18	color: #2271b1;
 19	transition-property: border, background, color;
 20	transition-duration: .05s;
 21	transition-timing-function: ease-in-out;
 22}
 23
 24a {
 25	outline: 0;
 26}
 27
 28a:hover,
 29a:active {
 30	color: #135e96;
 31}
 32
 33a:focus {
 34	color: #043959;
 35	box-shadow: 0 0 0 2px #2271b1;
 36	/* Only visible in Windows High Contrast mode */
 37	outline: 2px solid transparent;
 38}
 39
 40p {
 41	line-height: 1.5;
 42}
 43
 44.login .message,
 45.login .notice,
 46.login .success {
 47	border-left: 4px solid #72aee6;
 48	padding: 12px;
 49	margin-left: 0;
 50	margin-bottom: 20px;
 51	background-color: #fff;
 52	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
 53	word-wrap: break-word;
 54}
 55
 56.login .success {
 57	border-left-color: #00a32a;
 58}
 59
 60/* Match border color from common.css */
 61.login .notice-error {
 62	border-left-color: #d63638;
 63}
 64
 65.login .login-error-list {
 66	list-style: none;
 67}
 68
 69.login .login-error-list li + li {
 70	margin-top: 4px;
 71}
 72
 73#loginform p.submit,
 74.login-action-lostpassword p.submit {
 75	border: none;
 76	margin: -10px 0 20px; /* May want to revisit this */
 77}
 78
 79.login * {
 80	margin: 0;
 81	padding: 0;
 82}
 83
 84.login .input::-ms-clear {
 85	display: none;
 86}
 87
 88.login .pw-weak {
 89	margin-bottom: 15px;
 90}
 91
 92.login .button.wp-hide-pw {
 93	background: transparent;
 94	border: 1px solid transparent;
 95	box-shadow: none;
 96	font-size: 14px;
 97	line-height: 2;
 98	width: 2.5rem;
 99	height: 2.5rem;
100	min-width: 40px;
101	min-height: 40px;
102	margin: 0;
103	padding: 5px 9px;
104	position: absolute;
105	right: 0;
106	top: 0;
107}
108
109.login .button.wp-hide-pw:hover {
110	background: transparent;
111}
112
113.login .button.wp-hide-pw:focus {
114	background: transparent;
115	border-color: #3582c4;
116	box-shadow: 0 0 0 1px #3582c4;
117	/* Only visible in Windows High Contrast mode */
118	outline: 2px solid transparent;
119}
120
121.login .button.wp-hide-pw:active {
122	background: transparent;
123	box-shadow: none;
124	transform: none;
125}
126
127.login .button.wp-hide-pw .dashicons {
128	width: 1.25rem;
129	height: 1.25rem;
130	top: 0.25rem;
131}
132
133.login .wp-pwd {
134	position: relative;
135}
136
137.no-js .hide-if-no-js {
138	display: none;
139}
140
141.login form {
142	margin: 24px 0;
143	padding: 26px 24px;
144	font-weight: 400;
145	overflow: hidden;
146	background: #fff;
147	border: 1px solid #c3c4c7;
148	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
149}
150
151.login form.shake {
152	animation: shake 0.2s cubic-bezier(.19,.49,.38,.79) both;
153	animation-iteration-count: 3;
154	transform: translateX(0);
155}
156
157@keyframes shake {
158	25% {
159		transform: translateX(-20px);
160	}
161	75% {
162		transform: translateX(20px);
163	}
164	100% {
165		transform: translateX(0);
166	}
167}
168
169@media (prefers-reduced-motion: reduce) {
170	.login form.shake {
171		animation: none;
172		transform: none;
173	}
174}
175
176.login-action-confirm_admin_email #login {
177	width: 60vw;
178	max-width: 650px;
179	margin-top: -2vh;
180}
181
182@media screen and (max-width: 782px) {
183	.login-action-confirm_admin_email #login {
184		box-sizing: border-box;
185		margin-top: 0;
186		padding-left: 4vw;
187		padding-right: 4vw;
188		width: 100vw;
189	}
190}
191
192.login form .forgetmenot {
193	font-weight: 400;
194	float: left;
195	margin-bottom: 0;
196}
197
198.login .button-primary {
199	float: right;
200}
201
202.login .reset-pass-submit {
203	display: flex;
204	flex-flow: row wrap;
205	justify-content: space-between;
206}
207
208.login .reset-pass-submit .button {
209	display: inline-block;
210	float: none;
211	margin-bottom: 6px;
212}
213
214.login .admin-email-confirm-form .submit {
215	text-align: center;
216}
217
218.admin-email__later {
219	text-align: left;
220}
221
222.login form p.admin-email__details {
223	margin: 1.1em 0;
224}
225
226.login .admin-email__heading {
227	border-bottom: 1px #f0f0f1 solid;
228	color: #50575e;
229	font-weight: normal;
230	padding-bottom: 0.5em;
231	text-align: left;
232}
233
234.admin-email__actions div {
235	padding-top: 1.5em;
236}
237
238.login .admin-email__actions .button-primary {
239	float: none;
240	margin-left: 0.25em;
241	margin-right: 0.25em;
242}
243
244#login form p {
245	margin-bottom: 0;
246}
247
248#login form .indicator-hint,
249#login #reg_passmail {
250	margin-bottom: 16px;
251}
252
253#login form p.submit {
254	margin: 0;
255	padding: 0;
256}
257
258.login label {
259	font-size: 14px;
260	line-height: 1.5;
261	display: inline-block;
262	margin-bottom: 3px;
263}
264
265.login .forgetmenot label,
266.login .pw-weak label {
267	line-height: 1.5;
268	vertical-align: baseline;
269}
270
271.login h1 {
272	text-align: center;
273}
274
275.login h1 a {
276	background-image: url(../images/w-logo-blue.png?ver=20131202);
277	background-image: none, url(../images/wordpress-logo.svg?ver=20131107);
278	background-size: 84px;
279	background-position: center top;
280	background-repeat: no-repeat;
281	color: #3c434a;
282	height: 84px;
283	font-size: 20px;
284	font-weight: 400;
285	line-height: 1.3;
286	margin: 0 auto 24px;
287	padding: 0;
288	text-decoration: none;
289	width: 84px;
290	text-indent: -9999px;
291	outline: none;
292	overflow: hidden;
293	display: block;
294}
295
296#login {
297	width: 320px;
298	padding: 5% 0 0;
299	margin: auto;
300}
301
302.login #nav,
303.login #backtoblog {
304	font-size: 13px;
305	padding: 0 24px;
306}
307
308.login #nav {
309	margin: 24px 0 0;
310}
311
312#backtoblog {
313	margin: 16px 0;
314	word-wrap: break-word;
315}
316
317.login #nav a,
318.login #backtoblog a {
319	text-decoration: none;
320	color: #50575e;
321}
322
323.login #nav a:hover,
324.login #backtoblog a:hover,
325.login h1 a:hover {
326	color: #135e96;
327}
328
329.login #nav a:focus,
330.login #backtoblog a:focus,
331.login h1 a:focus {
332	color: #043959;
333}
334
335.login .privacy-policy-page-link {
336	text-align: center;
337	width: 100%;
338	margin: 3em 0 2em;
339}
340
341.login form .input,
342.login input[type="text"],
343.login input[type="password"] {
344	font-size: 24px;
345	line-height: 1.33333333; /* 32px */
346	width: 100%;
347	border-width: 0.0625rem;
348	padding: 0.1875rem 0.3125rem; /* 3px 5px */
349	margin: 0 6px 16px 0;
350	min-height: 40px;
351	max-height: none;
352}
353
354.login input.password-input {
355	font-family: Consolas, Monaco, monospace;
356}
357
358.js.login input.password-input {
359	padding-right: 2.5rem;
360}
361
362.login form .input,
363.login input[type="text"],
364.login form input[type="checkbox"] {
365	background: #fff;
366}
367
368.js.login-action-resetpass input[type="text"],
369.js.login-action-resetpass input[type="password"],
370.js.login-action-rp input[type="text"],
371.js.login-action-rp input[type="password"] {
372	margin-bottom: 0;
373}
374
375.login #pass-strength-result {
376	font-weight: 600;
377	margin: -1px 5px 16px 0;
378	padding: 6px 5px;
379	text-align: center;
380	width: 100%;
381}
382
383body.interim-login {
384	height: auto;
385}
386
387.interim-login #login {
388	padding: 0;
389	margin: 5px auto 20px;
390}
391
392.interim-login.login h1 a {
393	width: auto;
394}
395
396.interim-login #login_error,
397.interim-login.login .message {
398	margin: 0 0 16px;
399}
400
401.interim-login.login form {
402	margin: 0;
403}
404
405/* Hide visually but not from screen readers */
406.screen-reader-text,
407.screen-reader-text span {
408	border: 0;
409	clip-path: inset(50%);
410	height: 1px;
411	margin: -1px;
412	overflow: hidden;
413	padding: 0;
414	position: absolute;
415	width: 1px;
416	word-wrap: normal !important; /* many screen reader and browser combinations announce broken words as they would appear visually */
417}
418
419/* Hide the Edge "reveal password" native button */
420input::-ms-reveal {
421	display: none;
422}
423
424#language-switcher {
425	padding: 0;
426	overflow: visible;
427	background: none;
428	border: none;
429	box-shadow: none;
430}
431
432#language-switcher select {
433	margin-right: 0.25em;
434}
435
436.language-switcher {
437	margin: 0 auto;
438	padding: 0 0 24px;
439	text-align: center;
440}
441
442.language-switcher label {
443	margin-right: 0.25em;
444}
445
446.language-switcher label .dashicons {
447	width: auto;
448	height: auto;
449}
450
451.login .language-switcher .button {
452	margin-bottom: 0;
453}
454
455@media screen and (max-height: 550px) {
456	#login {
457		padding: 20px 0;
458	}
459
460	#language-switcher {
461		margin-top: 0;
462	}
463}
464
465
466@media screen and (max-width: 782px) {
467	.interim-login input[type=checkbox] {
468		width: 1rem;
469		height: 1rem;
470	}
471
472	.interim-login input[type=checkbox]:checked:before {
473		width: 1.3125rem;
474		height: 1.3125rem;
475		margin: -0.1875rem 0 0 -0.25rem;
476	}
477
478	#language-switcher label,
479	#language-switcher select {
480		margin-right: 0;
481	}
482}
483
484@media screen and (max-width: 400px) {
485	.login .language-switcher .button {
486		display: block;
487		margin: 5px auto 0;
488	}
489}
490