style.scss

---
# keep the first three line front matter
---
body {
	margin: 0;
	min-height: 100vh;
	display: grid;
	grid-template-rows: auto 1fr auto;
	grid-template-columns: 100%;
	color: #333;
}

a {
	text-decoration: none;
	color: inherit;
}

body > header {
	text-align: center;
	position: sticky;
	top: -32px;
	h1 {
		margin: 0;
		font-size: 1.5em;
	}
}

nav {
	background-color: #333;
	color: #ccc;
	h2 {
		display: none;
	}
	ul {
		list-style: none;
		margin: 0 auto;
		padding: 0;
		display: flex;
		max-width: 960px;
	}
	li {
		flex-grow: 1;
	}
	li[aria-current="true"] {
		color: #fff;
	}
	a {
		display: block;
		padding: .5em 0;
	}
}

main {
	box-sizing: border-box;
	width: 100%;
	padding: .5em;
	max-width: 960px;
	margin: 0 auto;
	h1, h2, h3 {
		text-align: center;
	}
	a {
		text-decoration: underline;
	}
	a:hover {
		color: #000;
	}
}

body > footer {
	text-align: center;
	padding: .5em 0;
}