/**
 * The variables may seem like overkill but by providing a set of acceptable
 * families, sizes and weights we can ensure a consistent style throughout the
 * application. As the app grows and the number of contributors increases this
 * makes it much easier to ramp up.
 */
:root {
  /* Font Families */
  --font-family-primary: 'Exo', georgia, cursive;
  --font-family-secondary: 'Roboto', sans-serif;

  /* Font Family */
  --font-family-exo: 'Exo', georgia, cursive;
  --font-family-roboto: 'Roboto', sans-serif;

  /* Font Sizes */
  --font-size-10: 10px;
  --font-size-12: 12px;
  --font-size-14: 14px;
  --font-size-16: 16px;
  --font-size-18: 18px;
  --font-size-20: 20px;
  --font-size-24: 24px;
  --font-size-32: 32px;
  --font-size-36: 36px;

  /* Font weights */
  --font-weight-light: 300;
  --font-weight-regular: 500;
  --font-weight-bold: 700;
  --font-weight-extra-bold: 900;
}