h3,
h2 + h3,
h3 + h4 {
	margin-top: 1.6em;
}

.terminal {
	background-color: #f9fafa;
}

.terminal pre {
	border: none;
	border-left: 1px solid #dadada;
	margin-top: 0.8em;
	margin-left: 1em;
	padding-left: 1em;
	background-color: transparent;
}

code {
	font-size: 0.9em;
}

pre code {
	font-size: 1em;
	color: #f56300;
}

pre code span {
	color: #e30000;
}

pre code.highlight {
	color: #000000;
}

pre code.highlight span {
	color: #008009;
}

.exhibit {
	width: 777px;
	height: 534px;
}

@media only screen and (max-width: 1068px) {
	.exhibit {
		width: 652px;
		height: 448px;
	}
}
@media only screen and (max-width: 734px) {
	pre code {
		font-size: 0.9em;
	}
	.exhibit {
		width: 100%;
		max-height: 505px;
	}
}

/* === DARK MODE === */
body[data-color-scheme="dark"] .terminal {
	background-color: rgba(255, 255, 255, 0.1);
}
html body[data-color-scheme="dark"] .terminal pre {
	background-color: transparent;
}
body[data-color-scheme="dark"] pre code {
	border-color: rgba(214, 214, 214, 0.2);
	color: var(--glyph-orange);
}
body[data-color-scheme="dark"] pre code span {
	color: var(--glyph-red);
}
body[data-color-scheme="dark"] pre code.highlight {
	color: #ffffff;
}
body[data-color-scheme="dark"] pre code.highlight span {
	color: var(--glyph-green);
}