body {
	font-family: Verdana, sans-serif;
	margin: auto;
	padding: 20px;
	max-width: 720px;
	text-align: left;
	background-color: #fff;
	word-wrap: break-word;
	overflow-wrap: break-word;
	line-height: 1.5;
	color: #444;
}

  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  strong,
  b {
	  color: #222;
  }

  a {
	  color: #3273dc;

  }

  .title {
	  text-decoration: none;
	  border: 0;
  }

  .title span {
	  font-weight: 400;
  }

  nav a {
	  margin-right: 10px;
  }

  textarea {
	  width: 100%;
	  font-size: 16px;
  }

  input {
	  font-size: 16px;
  }

  content {
	  line-height: 1.6;
  }

  table {
	  width: 100%;
  }

  img {
	  max-width: 100%;
  }

  code {
	  padding: 2px 5px;
	  background-color: #f2f2f2;
  }

  pre code {
	  color: #222;
	  display: block;
	  padding: 20px;
	  white-space: pre-wrap;
	  font-size: 14px;
  }

  blockquote {
	  border-left: 1px solid #999;
	  color: #222;
	  padding-left: 20px;
	  font-style: italic;
  }

  footer {
	  padding: 25px;
	  text-align: center;
  }

  .helptext {
	  color: #777;
	  font-size: small;
  }

  .errorlist {
	  color: #eba613;
	  font-size: small;
  }


  ul.blog-posts {
	  list-style-type: none;
	  padding: unset;
  }

  ul.blog-posts li {
	  display: flex;
  }

  ul.blog-posts li span {
	  flex: 0 0 130px;
  }

  ul.blog-posts li a:visited {
	  color: #8b6fcb;
  }

  @media (prefers-color-scheme: dark) {
	  body {
		  background-color: #333;
		  color: #ddd;
	  }

	  h1,
	  h2,
	  h3,
	  h4,
	  h5,
	  h6,
	  strong,
	  b {
		  color: #eee;
	  }

	  a {
		  color: #8cc2dd;
	  }

	  code {
		  background-color: #777;
	  }

	  pre code {
		  color: #ddd;
	  }

	  blockquote {
		  color: #ccc;
	  }

	  textarea,
	  input {
		  background-color: #252525;
		  color: #ddd;
	  }

	  .helptext {
		  color: #aaa;
	  }
  }