:root {
	font-family: serif;
	text-rendering: optimizelegibility;
	font-kerning: normal;
	color-scheme: light dark;
}
/* <https://github.com/whatwg/html/issues/5426#issuecomment-607286557> */
@supports (color-scheme: light dark) {
	@media (prefers-color-scheme: dark) {
		a { color: gold; }
	}
}

a:hover {
	text-decoration-style: wavy;
}
main {
	margin: 0 auto;
}

ul {
	padding-left: 1.5rem;
}

.container {
	display: grid;
	grid-template-columns: 1fr 2fr;
}

.container #left {
	grid-column: 1;
}

.container #right {
	grid-column: 2;
}
@media screen and (max-width: 900px) {
	.container {
		display: table
	}
}



code { font-family: monospace }

.h-event .p-summary { display: inline-table }

h1,h2,h3,h4,h5,h6 {
	font-family: sans-serif;
	font-kerning: auto;
}

dt {
	font-weight: bold;
}

h1,h2 {
	display: table;
	padding: 0.25ex 0.25em;
}

h1 { border-bottom: 2pt solid }
h2 { border-bottom: 1pt solid }

dd {
	margin-left: 1rem;
}

li p {
	margin: 0.2rem;
}

.skills dd:not(.block) {
	display: inline-block;
}

@media screen {
	main { max-width: 70em }
	.container #left {
		max-width: 21em;
	}
}

@media print {
	nav, footer, .no-print { display: none }
	dl, p, li {
		font-size: 0.9em;
	}
	a:not(.link-no-print)::after { content: " (" attr(href) ")"; }
	.verbatim-print { font-family: monospace; }
	a::after {
		font-family: monospace;
		color: initial;
	}
	a {
		text-decoration: none;
		color: blue;
	}
	section { page-break-inside: avoid }
	abbr { text-decoration: none }
}