/* Standard Colors */
:root {
	--bg-color: #4c4c4c
	--bg-color-light: #939393
	--bg-color-dark: #353535
	
   	--accent-color: #a11919;
    --accent-color-light: #f04745;
    --accent-color-dark: #660000;

   	--text-color: #fafafa;
    --text-color-light: #ffffff;
    --text-color-dark: #bababa;

    --error-color: #ec363a;

	--extra-color: #6c757d;
    --bw-media-color: #9e1a1a;
}


body {
  	background-color: var(--bg-color-light);
}
h1 {
	font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
    display: block;
    font-size: 2em;
    margin-block-start: 0.67em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

.login {
  	width: 400px;
  	background-color: var(--text-color);
  	box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.3);
  	margin: 100px auto;
	padding-bottom: 4px;
}
.login h1 {
  	text-align: center;
  	color: var(--bg-color-dark);
  	font-size: 24px;
  	padding: 20px 0 20px 0;
  	border-bottom: 1px solid var(--bg-color);
}
.login form {
  	display: flex;
  	flex-wrap: wrap;
  	justify-content: center;
}
.login form input[type="submit"] {
	font-family: "Roboto", "Helvetica Neue", Arial, sans-serif;
	font-size: 18px;
  	width: 100%;
  	padding: 15px;
 	margin-top: 4px;
 	margin-bottom: 0px;
  	background-color: var(--extra-color);
  	border: 0;
  	cursor: pointer;
  	font-weight: bold;
  	color: var(--text-color-light);
  	transition: background-color 0.2s;
}
.login form input[type="submit"]:hover {
	color: var(--text-color-light);
	background-color: var(--bw-media-color);
  	transition: background-color 0.2s;
	outline-width: 0;

}