:root {
	--theme-color: #39c;
	--theme-color-light: #6cf;
	--theme-color-dark: #069;
	--drop-shadow-enabled: 0 0 5px #333;
	--border-style-solid: 1px solid #bbb;
	--border-radius: 4px;
}

html {
	background-color: #666;
	color: #333;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: 13px;
	font-weight: normal;
	line-height: 1.5;
}

body {
	padding: 0;
	margin: 0;
}

h1 {
	background-color: var(--theme-color-dark);
	color: #e6e6e6;
	font-size: 24px;
	font-weight: bold;
	text-align: left;
	padding: 10px 20px;
	box-shadow: var(--drop-shadow-enabled);
	margin: 0;
}

h2 {
	background-color: var(--theme-color);
	color: #fff;
	font-size: 20px;
	font-weight: normal;
	text-align: center;
	padding: 15px 30px;
	border-bottom: 1px solid var(--theme-color-dark);
	margin: 0;
}

input {
	font-size: 15px;
	padding: 5px 10px;
}

#container {
	width: 400px;
	padding: 0;
	margin: 5em auto;
}

#error {
	margin: 0 30px 15px 30px;
	padding: 10px 20px;
	border: 2px solid #700;
	background-color: #fee;
	font-size: 15px;
	border-radius: var(--border-radius);
	box-shadow: var(--drop-shadow-enabled);
}

#login {
	background-color: #fff;
	font-weight: bold;
	border: 3px solid var(--theme-color-dark);
	border-radius: var(--border-radius);
	box-shadow: var(--drop-shadow-enabled);
}

#login form {
	padding: 25px 30px;
	margin: 0;
}

#login form div+div {
	margin-top: 15px
}

#submit {
	text-align: right;
}

.input {
	width: 312px;
	border: 1px solid var(--theme-color-dark);
	border-radius: var(--border-radius);
}

.input:FOCUS {
	background-color: #e6e6e6;
	border-color: #686868;
}

.button {
	background-color: #e6e6e6;
	color: var(--theme-color-dark);
	font-weight: bold;
	padding: 5px 20px;
	border-color: var(--theme-color);
	border-radius: var(--border-radius);
}

.button:HOVER {
	background-color: var(--theme-color-light);
	color: #333;
}