body {
  font-family: Verdana;
}
.halloween{
  font-family: 'Creepster', cursive;
}
.valentines {
  font-family: cursive;
}
:root {
  --svg-fill: black;
  --svg-stroke: black;
}
@media (prefers-color-scheme: dark) {
  body {
    background-color: black;
    color: white;
  }
  a { color: #90e8df; }
  a:visited{ color: #aed5fc; }
  :root {
  --svg-fill: white;
  --svg-stroke: white;
}
}
h1, h2, h3 {
  margin-bottom: 0.2em;
}
ul {
  margin-top: 0.2em;
  margin-bottom: 0;
}

/* Shared box styling */
.box {
  border: 1px solid;
  margin-bottom: 1em;
  display: block;
}

/* Specific styles for portrait box */
.portrait-box {
  width: 240px;
  height: 300px;
}

.portrait-box img {
  width: 100%;
  height: 100%;
}

/* Specific styles for canvas box */
.canvas-box {
  width: 600px;
  height: 400px;
}

.raised {
  position: relative;
  top: -32px;
  font-size: 2em
}

.poly {
  width: 80px;
}

.blob {
  width: 150px;
}

.banner {
  width: 100%; 
  height: 150px; 
  display: block; 
  overflow: hidden;
}

.binaryClock {
  width: 100%;
  height: auto;
}

.solar {
}
.sun, .earth, .moon, .orbit, .zodiac, .symbol {
  fill: none;
  stroke: currentColor;
}
.sun { fill: currentColor; }
.earth { fill: currentColor; }
.moon { fill: currentColor; }
.symbol {
  /*font-size: 6px;*/
  text-anchor: middle;
  dominant-baseline: middle;
}