body {
  text-rendering: optimizeLegibility;
  font-variant-ligatures: common-ligatures;
  font-kerning: normal;
}

body > ul > li { font-family: PT Sans, Trebuchet MS, Helvetica, Arial; font-size: 14px; }

body > h2 > a {
  text-decoration:none;
  color:black;
}

ul {
	margin-bottom: 1em;
}

body > ul > li > a:first-child {
	margin-left: -17pt;
	float: left;
	background: #a0a0a0;
	color: #a0a0a0;
	text-decoration: none;
}

body > ul > li > a:first-child:hover {
	background: #000000;
	color: #ffffff;
}

body > ul > li {
	list-style-type: none;
	margin-top: 20pt;
	margin-right: 20pt;
	padding: 1em;
	background-color: #f8f8f8;
}

ul * ul > li { list-style-type: disc; }
ul ul > li { list-style-type: square; }

blockquote {
	margin-left: 1em;
	border: 1px dashed black;
	background-color: #f0f0f0;
	padding: 0.5em;
}

pre {
	margin-left: 1em;
	margin-right: 3em;
	border-left: 2px dotted black;
	background-color: #f0f0ff;
	font-family: Andale Mono, Luxi Mono, Courier;
	padding: 0.5em;
	overflow-x:scroll;
}

h3 { font-family: PT Sans, Trebuchet MS, Tahoma, Helvetica, Arial; }

h2 { font-family: Tahoma, Helvetica, Arial; text-align: center; font-size: 200%; }

a:hover { background: #ffa }

p[u] { background-color: #d0f8d0; }

p[u] + blockquote { background-color: #d0f8d0; }

@media ( prefers-color-scheme: dark) {
  :root {
    color: #ccc;
    background-color: #000;
  }
  body > h2 > a, h2 > a:visited { color: #ccc; }

  a { color: #bbf; }
  a:visited { color: #88f; }
  a:hover { color: #000; }
  body > ul > li { background-color: #181818; }
  blockquote, pre { background-color: #282828; }
  blockquote { border: 1px dashed white; }
  pre { border: 1px dotted white; }

  p[u], p[u]+ol, p[u]+ul { background-color: #030; }
  p[u] + blockquote { background-color: #283828; }

}