body {
  font-family: "Georgia", serif;
  color: #333;
  background-color: #ffffff;
  margin-bottom: 6rem;
}

@media only screen {
  header {
    margin: 3rem auto;
    text-align: center;
  }

  header a {
    text-decoration: none;
  }

  q {
    quotes: "\201C" "\201D" "\2018" "\2019";
  }

  section h1 {
    font-family: "Crete Round", "Georgia", serif;
    font-weight: normal;
    font-style: italic;
    font-size: 2.0rem;
    margin-bottom: 2rem;
    color: #000;
  }

  section h2, section h3 {
    font-family: "Crete Round", "Georgia", serif;
    font-weight: normal;
    font-size: 1.4rem;
    margin: 2em 0 1em 0;
    color: #000;
  }

  section h2 a {
    color: #111;
  }

  section h3 {
    font-size: 1.2rem;
    margin: 2em 0 0 0;
  }

  section h3 + p {
    margin-top: 0.2em;
  }

  section tt {
    font-family: "Inconsolata", monospace;
  }

  section tt a {
    color: #00f;
    text-decoration: none;
  }

  section blockquote {
    font-style: italic;
    margin: 1rem 1.5rem;
  }

  section p {
    line-height: 1.5rem;
    font-weight: 400;
    font-size: 1.0625rem;
  }

  section a {
    color: #333;
  }

  section code {
    font-family: "Inconsolata", monospace;
    font-size: 1.0625rem;
    line-height: 1.0625rem;
    border: 1px solid #eee;
    padding: 0 0.2rem;
    color: #333;
    background-color: #fff;
  }

  section img.illustration {
    float: right;
    margin: 30px;
  }

  section time {
    font-size: 1.0625rem;
  }

  section {
    display: block;
    margin: auto;
    width: 90%;
  }

  pre {
    font-family: "Inconsolata", monospace;
    font-size: 1.0625rem;
  }

  pre var {
    font-style: normal;
  }

  pre var.string {
    color: #999;
  }

  pre var.symbol {
    color: #666;
  }

  pre var.keyword {
    color: #111;
    font-weight: 600;
  }
}

@media only screen and (min-width: 70rem) {
  header {
    position: fixed;
    top: 100px;
    left: calc((100% - 40rem - 146px) / 4);
    margin: 0;
    display: block;
    text-align: left;
  }

  section {
    display: block;
    margin: 100px auto auto auto;
    width: 38rem;
  }
}