/* Global styles */
html {
  font-family: serif;
  line-height: 1.75;
}

body {
  /* Make all text justified on the page. This might be too broad, p and li might be enough. */
  text-align: justify;
  background: #191919;
  color: #c8c8c8;
}

a {
  color: #ff7b00;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: monospace;
  margin-top: 3.5rem;

  /*
    All text is justified on the page, don't make it so in headers. If this is not specified then
    header that wrap to the next line could get too choppy when justified.
    */
  text-align: start;
}

h1 {
  font-size: 2.5rem;
}

img {
  max-width: 100%;
  width: auto;
  height: auto;
}

pre {
  text-align: left;
  white-space: pre-wrap;
}

li {
  /*
    The extra top and bottom margin on <li> elements makes it easier to click
    on links in list items on mobile. Fixes a reduced SEO Lighthouse score.
    Tap targets are not sized appropriately: https://web.dev/tap-targets/
    */
  margin: 0.5em 0;
}

p {
  /* Add automatic hyphenation. Works if the HTML lang attribute is set. */
  hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
}