body {
	background-attachment: fixed;
	background-color: #fbf1c7;
	background-image: repeating-linear-gradient(13deg, transparent, transparent 14px, #f2e5bc 14px, #f2e5bc 16px),
repeating-linear-gradient(103deg, transparent, transparent 14px, #f2e5bc 14px, #f2e5bc 16px);
	color: #282828;
	font-family: sans-serif;
	font-size: 18px;
	margin: 0;
}

a {
	color: #b57614;
}

a.readmore {
	font-size: 16px;
}

pre > code {
	display: block;
	font-size: 14px;
	overflow-x: auto;
	padding: 0.5em;
	tab-size: 4;
}

time {
	font-weight: bold;
}

#nav_wrapper,
.container,
footer {
	padding-left: 16px;
	padding-right: 16px;
}

nav,
.container,
footer {
	max-width: 750px;
	margin-left: auto;
	margin-right: auto;
}

#nav_wrapper {
	background-color: #ebdbb2;
}

nav {
	position: relative;
	left: -16px;
}

nav a {
	color: #282828;
	display: inline-block;
	padding: 8px 16px;
	text-decoration: none;
}

nav a:hover,
nav a:focus,
nav a:active {
	text-decoration: underline;
}

nav a.active {
	background-color: #bdae93;
}

.container {
	background-color: #fbf1c7;
	padding: 8px 16px;
}

.container .buttons {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	font-size: 16px;
	margin-top: 16px;
}

.container .buttons .button {
	display: inline-block;
}

.container article {
	border-bottom: 2px solid #7c6f64;
}

footer {
	font-size: smaller;
}

@media (prefers-color-scheme: dark) {
	body {
		background-color: #282828;
		background-image: repeating-linear-gradient(13deg, transparent, transparent 14px, #32302f 14px, #32302f 16px),
repeating-linear-gradient(103deg, transparent, transparent 14px, #32302f 14px, #32302f 16px);
		color: #fbf1c7;
	}

	a {
		color: #fabd2f;
	}

	.container {
		background-color: #282828;
	}

	.container article {
		border-bottom: 2px solid #a89984;
	}

	#nav_wrapper {
		background-color: #3c3836;
	}

	nav a {
		color: #fbf1c7;
	}

	nav a.active {
		background-color: #665c54;
	}
}