:root {
  --sans-serif:
    IBM Plex Sans,
    Fira Sans,
    Cantarell,
    Avenir Next,
    Avenir,
    Helvetica Neue,
    Helvetica,
    Ubuntu,
    Roboto,
    -apple-system,
    BlinkMacSystemFont,
    Segoe UI,
    Droid Sans,
    Liberation Sans,
    sans-serif;

  --serif:
    IBM Plex Serif,
    Garamond,
    Iowan Old Style,
    Apple Garamond,
    Baskerville,
    Times New Roman,
    Source Serif Pro,
    Droid Serif,
    Liberation Serif,
    serif,
    Apple Color Emoji,
    Segoe UI Emoji,
    Segoe UI Symbol;

  --monospace:
    IBM Plex Mono,
    Inconsolata,
    Consolas,
    Ubuntu Mono,
    Menlo,
    Monaco,
    Lucida Console,
    Liberation Mono,
    monospace;
}

body {
  font-family: var(--sans-serif);
  font-size:   1.25em;
  margin:      auto;
  max-width:   80ch;
  padding:     0.5ex 0.5em;
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

p {
  font-family: var(--serif);
}

h1, h2, h3, h4, h5, h6 {
  font-size: 1em;
}

h2, h3 {
  background:  #c5dce8;
  border:      1px solid gray;
  font-family: var(--serif);
  padding:     0.5ex 0.5em;
  color:       #11577b;
  font-family: var(--serif);
  padding:     0.5ex 0.5em;
}

h3 {
  background: #e8f2f6;
  color:      #1e79a7;
}

h3 a:hover {
  text-decoration: none;
}

h3:first-of-type a:hover {
  text-decoration: underline;
}

pre {
  background:  #f6fcec;
  border:      1px solid gray;
  display:     block;
  font-family: var(--monospace);
  font-size:   0.95em;
  max-width:   100%;
  overflow:    auto;
  padding:     1ex 0.5em;
}

.copy {
  font-size: 1rem;
  margin:    5ex 0 1ex 0;
}
