body { margin: 0 2rem; font-size: 120%; background-color: silver; color: #131313; font-family: "Jost*", sans-serif; max-width: 640px; line-height: 1.7em; font-weight: 300; }
a { text-decoration-line: underline; text-decoration-style: dotted; }

@media (prefers-color-scheme: dark) {
  body { background-color: #131313; color: #EEE; }
  a {color: #a96;}
  hr { color: #EEE; }
  nav a { border-color: #a96; }
  nav a img { filter: invert(100%); }
}

main { box-sizing: border-box; padding: 0 1em; overflow-x: scroll; width: 100%; }
h1, h2, h3, h4, h5, h6 { margin-bottom:0.25em;}
ul { margin-top: 0.25em; padding-left: 1em; list-style-type: "\027A2"; }
li { padding-left:0.5em; }
th, td { text-align: left; padding-left: 1em; }
pre { overflow-x: scroll; white-space: pre-wrap; }
img { max-width: 100%; max-height: 480px; margin-right: 5px; }

nav a { margin-right: 0.5rem; border-bottom: thin dotted; text-decoration: none; }
nav a img { height: 1.6rem; width: 1.6rem; vertical-align: bottom; margin: 0.1rem 0px; }
nav#top-nav { float: right; }
nav#top-nav a { text-decoration: none; }
nav#top-nav ul {margin: 0; padding: 0;}
nav#top-nav li { margin:0; padding: 0; display: inline-block; }
nav#top-nav li a { padding: 0.5em; display: inline-block; }
nav#top-nav li.right { float: right; }
nav#top-nav li.dropdown ul { display: none; }
nav#top-nav li.dropdown:hover ul { display: block; position: absolute; }
nav#top-nav li.dropdown li, nav#top-nav li.dropdown li a { display: block; }
input, select, textarea { border: thin dotted; font-size: 1em; padding: 0.25em; }

/*
div.meta::before {
  content: "Meta:";
  font-style: italic;
}
*/
div.meta {
  margin-top: 1rem;
  border-top: thin dotted;
}

div.meta p.date-line {
  font-size: 80%;
  margin: 0;
  display: inline-block;
  font-style: italic;
}

div.meta p.date-line:first-of-type::after {
  content: "::";
  padding: 0 0.5rem;
}

div.meta p.date-line:nth-last-of-type(2n)::after {
  content: "::";
  padding: 0 0.5rem;
}

div.meta p.date-line:last-of-type::after {
  content: "";
}

hr {
    border: none;
    border-top: thin solid;
    width: 2em;
    text-align: center;
    overflow: visible;
}

hr:after {
    content: "//";
    display: block;
    position: relative;
    top: -1em;
    padding: 0;
    height: 0px;
}

a.internal-hyperlink::before {
  content: "{";
}

a.internal-hyperlink::after {
  content: "}";
}

ul.tags, ul.tags li {
  list-style: none;
  padding-left: 0;
  padding-right: 0.25rem;
}

ul.tags li {
  display: inline;
}

a.tag {
  white-space: nowrap;
  display: inline-block;
}

blockquote {
  padding-left: 1em;
  margin-left: 0;
  border-left: thin dotted;
}

figcaption {
  font-style: italic;
}