/* Resets and generics. */

body {
	font-family: sans-serif;
}

h1, h2, h3, h4 {
	font-family: serif;
}

textarea, pre, kbd { font-size: 16px; }

img {
	max-width: 100%;
	height: auto;
}

kbd {
	display: inline-block;
	padding: 0em .4em;
	background: #eee;
}

.readable {
	max-width: 36em;
	position: relative;
}

/* Messages. */

.message {
	margin-bottom: .75em;
	padding: .375em;
}

.message.info { background: #dfd; }
.message.warning { background: #fec; }
.message.error { background: #fdd; }

#status.shown {
	max-width: 10em;
	padding: 3em 1em;
	background: #cf9;
	position: absolute;
	top: 2em;
	left: 2em;
	opacity: 0.95;
	box-shadow: 5px 5px 5px rgba(0,0,0,.33);
	border-radius: 5px;
	opacity: 0;
	transition: opacity 1s ease-out 3s;
}
#status
#status.hidden
{
	opacity: 1;
}

/* Forms. */

.item {
	margin-bottom: .75em;
}

.item label {
	display: inline-block;
	min-width: 8em;
}

input { width: 32%; min-width: 8em; max-width: 16em; }
input.narrow,
input[type="submit"]
{ width: 16%; min-width: 4em; max-width: 4em; }
input.wide { width: 100%; min-width: 16em; max-width: 30em; }