:root {
	--bg: #1e1f21;
	--fg: #eeeeee;
	--fg-link: #88a2bc;

	--code-bg: #0e0f11;
	--code-fg: #eeeeee;

	--quote-bg: #0e0f11;
	--quote-fg: #bbbbbb;
}

html, body {
	height: 100%;
	padding-left: 1px;
	padding-bottom: 10px;
}

body {
	background: var(--bg);
	color: var(--fg);
	font-family: serif;
	font-size: 16px;
	max-width: 50%;

	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

article {
	flex: 1;
}

/* header */
header h1 {
	/* font-size: 35px; */
	font-style: italic;
}

header a {
	color: var(--fg-link);
	text-decoration: none;
}

/* links */
a {
	color: var(--fg-link);
	text-decoration: underline;
	text-decoration-style: dotted;
}

a:hover {
	background: var(--fg-link);
	color: var(--fg);
	font-style: italic;
}

blockquote {
	color: var(--quote-fg);
	display: block;
	margin-left: 20px;
}

code {
	color: var(--code-fg);
	padding: 0.1em 0.25em;
}

pre {
	color: var(--code-fg);
	padding: 2px 2px;
	overflow-x: auto;
	margin: 1rem 0;
}

pre code {
	background: none;
	padding: 0;
}