// Body

}

html, body {

margin: 0;
padding: 0;

}

html {

font-family: $root-font-family;
font-size: $root-font-size;
line-height: $root-line-height;

@media (min-width: $large-breakpoint) {
  font-size: $large-font-size;
}

}

body {

color: $midnight-text-color;
background-color: $midnight-body-bg;
-webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;

@media (prefers-color-scheme: dark) {

color: $midnight-text-color-dark;
background-color: $midnight-body-bg-dark;
}

}

// No `:visited` state is required by default (browsers will use `a`) a {

color: $midnight-accent-light;
text-decoration: none;

// `:focus` is linked to `:hover` for basic accessibility
&:hover,
&:focus {
  text-decoration: none;
      color: $midnight-accent-light;

      @media (prefers-color-scheme: dark) {
  color: $midnight-accent-dark;
  }
}

strong {
  color: inherit;
}

@media (prefers-color-scheme: dark) {

color: $midnight-accent-dark;
}

}

img {

display: block;
max-width: 100%;
margin: 0 0 1rem;
border-radius: 5px;

}

table {

margin-bottom: 1rem;
width: 100%;
font-size: 85%;
border: 1px solid #d4d4d4;
border-collapse: collapse;

@media (prefers-color-scheme: dark) {

border: 1px solid #555555;
}

}

td, th {

padding: .25rem .5rem;
border: 1px solid #d4d4d4;

@media (prefers-color-scheme: dark) {

border: 1px solid #555555;
}

}

th {

text-align: left;

}

tbody tr:nth-child(odd) td, tbody tr:nth-child(odd) th {

background-color: #eee;

@media (prefers-color-scheme: dark) {

background-color: #2d2d2d;
}

}