body {
	background: #ffd;
	font: 1em/1.4 serif;
}
a:link {
	color: #88b;
	text-decoration: none;
}
a:visited {
	color: #85b;
}
a:hover {
	color: #bac;
	background: #eed;
	text-decoration: underline;
}
img {
	height: auto;
	max-width: 100%;
}

header {
	text-align: center;
	height: 3em;
}
header a:link, header a:visited {
	font: italic 2em serif;
	color: black;
}
header a::before {
	font-style: normal;
	content: '[';
}
header a::after {
	font-style: normal;
	content: ']';
}

table {
	background: #ddb;
}
tr:nth-child(even),
td:nth-child(odd) {
	background: #eec;
}
tr:nth-child(even) td:nth-child(odd),
tr:nth-child(odd) td:nth-child(even) {
	background: #ffd;
}
td:not(:first-child) {
	text-align: right;
}
td[colspan] {
	text-align: center;
}

dt {
	font-weight: bold;
}
main dd {
	margin-top: 0.3em;
}
main dd + dt {
	margin-top: 0.6em;
}

footer {
	text-align: center;
}
footer:not(:last-child) aside {
	visibility: hidden;
}

/* Basic layout constraints */
body {
	max-width: 72em;
	margin: 0 auto;
	padding: 1em;
}
body > nav dt, body > nav dd {
	margin: 0 0.5em 0.25em;
	text-indent: -0.5em;
}
body > nav a {
	display: block;
	margin: 0 -1em;
	padding: 0 1em;
}

/* Yet Another Holy Grail layout, grid ver. sans IE support */
body {
	display: grid;
	grid: "h" "c" "l" "r" "f";
	grid-gap: 1em;
}
header, main, footer { grid-column: 1 / -1; }
header { order: -1; }
footer { order: 1; }

@media (min-width: 33em) {
	body { grid: "h h" "c c" "l r" "f f" / 1fr 1fr; }
}

@media (min-width: 41em) {
	body { grid: "h h" "c l" "c r" 1fr "f f" / 1fr 14.5em; }
	main { grid-area: c; }
}

@media (min-width: 57em) {
	body { grid: "h h h" "l c r" "f f f" / 14.5em 1fr 14.5em; }
}