:root
{
	--hue: 150;
}

html
{
	background-color: hsl(var(--hue), 0%, 12.5%);
	color: hsl(var(--hue), 0%, 100%);
	font-family: sans-serif;
}

header
{
	/*
	background-color: hsl(0, 0%, 25%);
	border-bottom: 2px solid #888;
	padding-bottom: 16px;
	 */
	margin-bottom: 16px;
}

a
{
	text-decoration: none;
	color: hsl(var(--hue), 0%, 87.5%);
}

a:hover
{
	color: hsl(var(--hue), 0%, 100%);
	border-bottom: 2px solid hsl(0, 0%, 100%);
	transition: 1s ease color;
}

button
{
	padding: 8px 12px;
	text-transform: uppercase;
	cursor: pointer;

	background-color: hsl(var(--hue), 0%, 6.125%);
	border: 1px solid hsl(var(--hue), 0%, 6.125%);
	color: hsl(0, 0%, 87.5%);
	margin: 4px;
	border-radius: 4px;
}

input,select,textarea
{
	background-color: hsl(0, 0%, 25%);
	border: 1px solid hsl(0, 0%, 25%);
	color: hsl(0, 0%, 100%);
	padding: 4px;
	margin: 4px;
	border-radius: 4px;
	/*
	font-family: monospace;
	 */
}