/** globals */
body {
	font-family: "Sans-Serif";
	background-color: #f3f1f5;
	color: #53575a;

	font-size: 1.5em;
	width: 80%;
	margin-left: auto; margin-right: auto;
	margin-top: 2vh; margin-bottom: 2vh;
}
img {
	max-height: 100%;
	max-width: 100%;
	object-fit: scale-down;
	border-radius: 4px;
}
a {
	color: #BD6B73;
	font-weight: bold;
}
ul { list-style: square inside; }
li { margin: 10px 0; }

/** columns */
.columns { display: flex; }
.columns > * {
	margin-top: 2vh;
	margin-bottom: 2vh;
}
.left {
	position: sticky;
	top: 2vh;
	bottom: 2vh;
	height: 90vh;
	width: 20%;
}
.right { width: 80%; }

/** content types */
.header {
	text-align: center;
	color: #f3f1f5;
	background-color: #53575a;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 1%;
	padding-bottom: 1%;
}
.content {
	padding-left: 2%;
	padding-right: 2%;
}
pre, code {
	background: #FFF1F5;
}
pre {
	font-family: monospace;
	page-break-inside: avoid;
	word-wrap: break-word;
	padding: 16px;
}

.figure {
	width:	60%;
	height:	60%;
	padding: 2%;
	text-align: center;
}
.caption { font-size: 0.75em; }
.footer { float: right; }