body {
  border-top: 1rem solid $primary-color;
  font-family: $sans-serif;
  font-size: pxToRem(20);
  padding: 2rem;
  margin: 0;
}

h1 {
  font-family: $ext-sans;
  font-weight: $bold;
}

h1,
h2,
h3,
h4 {
  margin-top: 1em;
  margin-bottom: 0.5em;
}

p {
  margin: 0.75rem 0;
  font-size: 1.25rem;
  line-height: 1.25;
}

a {
  text-decoration: none;
  color: $black;
  border-bottom: $dark-grey solid 0.1em;
  font-family: $ext-sans;
  margin: 1rem 0;

  &:hover {
    border-bottom: $primary-color solid 0.1rem;
  }
  &:focus {
    outline: pxToRem(3) solid $primary-color;
    outline-offset: pxToRem(5);
  }
}

code {
  background-color: $dark-grey;
  border: 1px solid $black;
  color: $white;
  padding: 0.15em;
  border-radius: 0.25em;
  font-size: 95%;

  pre & {
    border: none;
    padding: 0;
    border-radius: 0;
    font-size: inherit;
  }
}

ul[class] {
  list-style: none;
  margin: 0;
  padding: 0;
}

th {
  text-align: left;
}

pre[class*='language-'] {
  font-size: 1rem;
}