:root {
	/* Gruvbox color scheme https://github.com/morhetz/gruvbox-contrib */
	--gb-bg: #282828;
	--gb-bg1: #3c3836;
	--gb-bg2: #504945;
	--gb-bg3: #665c54;
	--gb-fg: #ebdbb2;
	--gb-fg2: #d5c4a1;
	--gb-fg3: #bdae93;
	--gb-bl: #458588;
	--gb-lbl: #83a598;
	--gb-aq: #689d6a;
	--gb-laq: #8ec07c;
	--pad-normal: 0.6em;
	--pad-title: 1em;
	--pad-summary: 1em;
}

@font-face {
	font-family: "Go";
	src:	url("go-regular-webfont.woff2") format("woff2"),
		url("go-regular-webfont.woff") format("woff");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "Go";
	src:	url("go-bold-webfont.woff2") format("woff2"),
		url("go-bold-webfont.woff") format("woff");
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: "Go Mono";
	src:	url("go-mono-webfont.woff2") format("woff2"),
		url("go-mono-webfont.woff") format("woff");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "Go Smallcaps";
	src:	url("go-smallcaps-webfont.woff2") format("woff2"),
		url("go-smallcaps-webfont.woff") format("woff");
	font-weight: normal;
	font-style: normal;
}

body {
	background-color: var(--gb-bg);
	color: var(--gb-fg);
	margin: 0;
	padding: 0;
	font-family: "Go", sans-serif;
	font-size: 11pt;
}

body > header {
	position: sticky;
	top: 0;
	border-bottom: 2px solid var(--gb-fg3);
	padding-top: 0;
	padding-left: 1em;
	padding-bottom: .1em;
	background-color: var(--gb-bg1);
}

body > header > h1 > a {
	color: unset;
	text-decoration: none;
}

body > header > h1 > a:visited { color: unset; }

body > header > a {
	margin-left: .2em;
	margin-right: .2em;
	padding-left: .4em;
	padding-right: .4em;
	vertical-align: 25%;
	font-family: "Go Smallcaps";
	text-decoration: none;
	color: var(--gb-lbl);
	background-color: var(--gb-bg2);
}

body > header > a:hover {
	color: var(--gb-fg);
	background-color: var(--gb-bg3);
}
	
main {
	padding-left: 1em;
}

main p {
	max-width: 80em;
}

a {
	color: var(--gb-bl);
}

a:visited {
	color: var(--gb-aq);
}

code {
	font-family: "Go Mono", monospace;	
}

h1 {
	display: inline;
	margin-right: 1rem;
}

h2, h3 {
	margin-top: .8em;
	margin-bottom: .4em;
	border-bottom: 1px solid var(--gb-fg2);
	padding-bottom: .2em;
}

.grid {
	margin-top: 1em;
	padding-left: 1em;
	display: flex;
	flex-wrap: wrap;
	gap: 1.2em;
}

.summary {
	padding-top: var(--pad-normal);
	padding-right: var(--pad-normal);
	padding-left: 1em;
	padding-bottom: 1em;
}

article {
	background-color: var(--gb-bg1);
	margin: .2em;
	width: 25em;
}

article > a {
	display: block;
	height: 100%;
	color: unset;
	text-decoration: unset;
}

article > a:visited { color: unset; }

article header {
	font-family: "Go Smallcaps", sans-serif;
	font-size: 12pt;
	background-color: var(--gb-bg3);
	padding: var(--pad-normal) var(--pad-normal);
	padding-left: var(--pad-title);
}

article img {
	width: 100%;
	height: 25ex;
	object-fit: cover;
	object-position: 0 0;
}

blockquote {
	padding-top: .5em;
	max-width: 60em;
	font-style: italic;
}

cite {
	padding-left: 6rem;
	padding-bottom: 1em;
	font-style: normal;
	font-weight: bold;
}

table {
	table-layout: fixed;
	border-collapse: collapse;
	margin: 1em 2rem;
}

thead tr :nth-child(1) {
	padding-right: 10em;
}

th {
	padding-left: .2em;
	padding-right: 1.5em;
	padding-bottom: .5em;
	border-bottom: .1em solid var(--gb-fg2);
}

td {
	padding: .2em 0;
	padding-left: .2em;
}

tbody tr:nth-child(1) td {
	padding-top: .5em;
}

tbody tr:nth-child(even) {
	background-color: var(--gb-bg1);
}