html {
	background-color: #fde89d;
	color: #301000;
	font: 1em Georgia, serif;
}
body {
	width: 1200px;
	margin: auto;
	max-width: 100%;
	display: flex;
}
.avatar {
	border-radius: .3em .3em 0 0;
	height: 290px;
	width: 290px;
}
.sidebar-holder {
	display: inline-block;
	font: .9em Arial, sans-serif;
	padding: 1em;
}
.sidebar {
	background: #fff;
	width: 290px;
	border: .1em solid #301000;
	border-radius: .3em;
}
.sidebar p,
.sidebar h1 {
	margin: .1em;
	padding: 0em .4em;
	text-align: center;
}
.topnav ul {
	list-style: none;
	padding: 0;
}
.topnav ul li {
	border-top: .1em solid #fde89d;
	padding: .2em .4em;
}
@media only screen and (max-width: 768px), (orientation: portrait) {
	body {
		display: initial;
	}
	.sidebar {
		width: 100%;
		text-align: center;
	}
	.topnav ul {
		border-top: .1em solid #fde89d;
		padding: 1em;
	}
	.topnav ul li {
		border-top: none;
		display: inline;
		line-height: 1.5em;
		padding: 0;
	}
	.topnav ul li:not(:last-child):after {
		content: ' - '
	}
	.avatar {
		border-radius: 100%;
		display: block;
		margin: 0 auto;
		padding: 10px;
		height: 4em;
		width: 4em;
	}
	.sidebar h1,
	.sidebar .subheader {
		display: inline;
		margin: 0;
		padding: 0;
	}
	.sidebar .subheader:before {
		content: '/ '
	}
}
hr {
	border-width: .2em 0 0;
	border-style: dashed;
	border-color: #301000;
	max-width: 3em;
}

main {
	display: inline-block;
	padding: 1em;
}
main header {
	font-family: Arial, sans-serif;
}
main p {
	hyphens: auto;
	text-align: justify;
	text-indent: 1em;
}
main li {
	margin-bottom: 0.2em;
}
main li > p:first-child {
	margin-top: 0;
	text-indent: 0;
}
blockquote {
	color: #832917;
	border-left: .2em solid;
	margin: 1em 0;
	padding-left: 2em;
}
dt {
	font-weight: bold;
}
summary, main a {
	color: #99202c;
	text-decoration: underline;
}
summary:hover, main a:hover {
	color: #ec4b55;
	text-decoration: none;
}
kbd {
	border-width: 0 .1em;
	padding: 0 .5em;
	margin: 0 .5em;
	border-style: solid;
}
.sidebar a:not(.nolink) {
	color: #301000;
	text-decoration: underline;
}
.nolink,
.sidebar a:hover {
	color: #301000;
	text-decoration: none;
}
summary {
	cursor: pointer;
	display: block;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
}
table tr {
	border: .1em solid #99202c;
}
table tr:nth-child(2n+1) {
	background-color: #fad27f;
}
table th, table td {
	padding: .1em .3em;
}
table th {
	background-color: #ff6550;
}
table ol,
table ul {
	padding-left: 1em;
}
.pre-wrap {
	white-space: pre-wrap;
}