/* css apparently merges the tags, so that's nice */
@media (prefers-color-scheme: dark) {
  /* Dark theme styles go here */
body { background-color: #000; color: #b8b8b8; }
code { background-color: #222; }
}

@media (prefers-color-scheme: light) {
  /* Light theme styles go here */
body { background-color: #fff; color: #000; }

}

body { font-size:14px; font-family: serif; }
h1 { text-align: center; }
h3 { text-align: center; }
video { max-width:100%; width:800px; }
code {
  border:1px solid lightgrey;
  display: block;
  font-family: monospace;
  white-space: pre;
  margin: 1em 0;
  padding: 2px;
  font-size: 105%;
  width: min-content;
 }

#wrap { max-width:94%; width:800px; margin: auto; }
#hdr { width:100%; height:auto; }
#copyright { font-size:12px; text-align:center; padding:40px; }
.description {
  border:1px solid #ccc;
  border-radius:5px;
  padding:30px;
  margin:5px;
}
.grid {
  width:254px;
  float:left;
  margin:3px;
  padding:3px;
  border:1px solid lightgrey;
}
.grid img {
  width:100%;
  height:auto;
}
.feather { 
  text-align:center;
  padding:5px;
}