body {
  font-family: 'Roboto Mono', monospace;
  background: dimgray;
}

a {
  text-decoration: none;
  color: inherit;
}

a:hover, a:hover * {
  background: red;
  color: white;
}

#introduction a {
  text-decoration: underline;
}

#introduction a:hover, #introduction a:hover * {
  text-decoration: none;
}

.box {
  border: solid 1px silver;
  box-shadow: 4px 4px 7px 0px rgba( 0, 0, 0, 0.2 );
  background: navy;
  color: silver;
}

nav.menu {
  padding-right: 1ex;
  margin-bottom: 1ex;
}

nav.menu ul {
  list-style: none;
  padding-left: 1ex;
}

nav.menu a {
  display: block;
  white-space: pre;
}

#introduction {
  overflow: scroll;
  padding: 0.5em;
  margin-bottom: 1ex;
}

footer {
  clear: both;
  font-size: 70%;
  color: silver;
}

footer dl {
  display: inline-grid;
  padding-left: 1em;
  grid-auto-flow: column;
  grid-auto-columns: auto;
}

footer dt, footer dd {
  margin: 0;
}

footer dt::after {
  content: ":";
  margin-right: 1ex;
}

footer dd {
  margin-right: 1ex;
}

footer dd:not(:last-child)::after {
  content: ","
}

/* index.css ends here */