@font-face {
	font-family: "WaverlyHand";
	src: url("WaverlyHand1_fixie.ttf");
}

@font-face {
	font-family: "Sun12x22";
	src: url("sun12x22.ttf");
}

@font-face {
	font-family: "HersheySimplex";
	src: url("HersheySansSVG2.otf");
}

html {
	background: wheat;
}

h1 { font-size: 1.5em; }

body {
	background: rgb(255 249 242);
	font-family: Helvetica, sans-serif;
	text-align: center;
	max-width: 800px;
	margin: auto;
	padding: 20px 0px;
}

.handwritten { font-family: "WaverlyHand"; font-size: 1.25em; margin: 0; line-height: 1.25em; }
.terminal { font-family: "Sun12x22"; margin: 0; }
.typewritten { font-family: "HersheySimplex"; margin: 0; }

.purple { color: #794FD2; }
.greybg { background: #c0c0c0; }
.green { color: green; }

.left { text-align: left; }
.right { text-align: right; }

img { color: green; font-family: "HersheySimplex"; }

img { max-width: 100%; }

main header { margin-bottom: 1em; }
main footer { margin-top: 1em; }

aside { background: white; text-align: left; padding: 1em; }

@media (prefers-color-scheme: dark) {
	aside {
		background: #111; color: white;
	}
	html {
		background: #222;
	}
	body { background: #444; color: #eee; }
	a:link { color: #a9a9fc; }
	a:visited { color: #d1a1d1; }
}