/* ============================================================
   reset.css  -  BROWSER DEFAULT OVERRIDES

   Nikita: every browser comes with its own default styles
   (margins, font sizes, list bullets, etc). These defaults
   differ between Chrome, Safari, Firefox, and so on.
   This file flattens those defaults so the site looks the
   same everywhere. We then build our own styles on top.

   You almost never need to touch this file.
============================================================ */

/* Make every element calculate width including its padding and
   border. This is the modern default and makes layouts predictable. */
*, *::before, *::after { box-sizing: border-box; }

/* Remove the default margin and padding from every element. */
* { margin: 0; padding: 0; }

/* Prevent iOS Safari from auto-zooming text when the device rotates. */
html {
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* Default body line spacing and smoother font rendering on Mac. */
body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* Make media (images, video) behave like blocks and never overflow
   their container. This stops images breaking out of mobile layouts. */
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

/* Inputs and buttons should inherit the page font instead of
   using the browser default (which is usually ugly). */
input, button, textarea, select {
  font: inherit;
  color: inherit;
}

/* Stop long unbroken words from blowing out narrow containers
   on phones. */
p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }

/* Buttons should look like text by default. We add specific
   button styles in components.css when we actually want them
   to look like buttons. */
button {
  background: none;
  border: none;
  cursor: pointer;
}

/* Links inherit the colour of their parent text and have no underline.
   We add underlines on specific link classes (like .link-underline). */
a {
  color: inherit;
  text-decoration: none;
}

/* No bullets on lists unless we specifically want them. */
ul, ol { list-style: none; }

/* If the user has set their device to prefer reduced motion
   (an accessibility setting), turn off nearly all animation. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
