<link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet"> 
<style>

  html {
    margin: 0;
    padding: 0;
  }

  body {
    color: #333;
    background-color: white;
    background-image: url('/paper.png');
    background-repeat: repeat;
  }

  a,
  a:visited,
  a:hover,
  a:active {
    color: rgb(62, 231, 123);
    text-decoration: none;
  }
  a:hover {
    text-decoration: underline;
  }

  .dim {
    color: rgb(62, 231, 123, 0.5);
  }

  @media (prefers-color-scheme: dark) {
    body {
      color: rgb(50, 200, 100);
      background-color: #010;
      background-image: none;
    }

    a,
    a:visited,
    a:hover,
    a:active {
      color: rgb(62, 231, 123);
    }

    .dim {
      color: rgb(62, 231, 123, 0.5);
    }
  }

  @media (prefers-color-scheme: light) {
    body {
      color: #333;
      background-color: white;
      background-image: url('/paper.png');
      background-repeat: repeat;
    }

    a,
    a:visited,
    a:hover,
    a:active {
      color: #333;
      font-weight: bold;
    }

    .dim {
      color: rgba(30, 30, 30, 0.5);
    }
  }

  /* Manually toggled dark class on body */
  body.dark {
    color: rgb(50, 200, 100);
    background-color: #010;
    background-image: none;
  }
  .dark a,
  .dark a:visited,
  .dark a:hover,
  .dark a:active {
    color: rgb(62, 231, 123);
  }
  .dark .dim {
    color: rgb(62, 231, 123, 0.5);
  }

  /* Manually toggled light class on body */
  body.light {
    color: #333;
    background-color: white;
    background-image: url('/paper.png');
    background-repeat: repeat;
  }

  .light a,
  .light a:visited,
  .light a:hover,
  .light a:active {
    color: #333;
    font-weight: bold;
  }

  .light .dim {
    color: rgba(30, 30, 30, 0.5);
  }

  .page-wrapper {
    text-align: center;
  }

  .inner-wrapper {
    display: inline-block;
    text-align: left;
    white-space: pre;
    font-family: 'Inconsolata', monospace;
    margin: 0 auto;
    width: auto;
  }

  ol {
    padding: 0;
    line-height: 0.5em;
  }

  @media screen and (min-width: 700px) {
    body, html {
      font-size: 18px;
    }
  }
  @media screen and (min-width: 900px) {
    body, html {
      font-size: 24px;
    }
  }
</style>

