:root {
  /* globals */
  --body-font-family: "Open Sans",sans-serif;
  --body-color: var(--primary-700);
  --heading-font-family: "Roboto Condensed",sans-serif;
  --heading-color: var(--primary-700);
  --link-color: var(--secondary-700);
  --link-color-hover: var(--secondary-900);
  --button-font-size: 16px;

  /* colors */
  --primary-900: #111111;
  --primary-800: #131313; /* shade + */
  --primary-700: #151515; /* base */
  --primary-600: #2c2c2c; /* tint + */
  --primary-500: #444444;
  --primary-400: #5b5b5b;
  --primary-300: #737373;
  --primary-200: #8a8a8a;
  --primary-100: #a1a1a1;
  --primary-50: #b9b9b9;

  --secondary-900: #111e4d;
  --secondary-800: #132256; /* shade + */
  --secondary-700: #152660; /* base */
  --secondary-600: #2c3c70; /* tint + */
  --secondary-500: #445180;
  --secondary-400: #5b6790;
  --secondary-300: #737da0;
  --secondary-200: #8a93b0;
  --secondary-100: #a1a8bf;
  --secondary-50: #b9becf;

  --tertiary-900: #ab8033;
  --tertiary-800: #c1903a; /* shade + */
  --tertiary-700: #d6a040; /* base */
  --tertiary-600: #daaa53; /* tint + */
  --tertiary-500: #deb366;
  --tertiary-400: #e2bd79;
  --tertiary-300: #e6c68c;
  --tertiary-200: #ebd0a0;
  --tertiary-100: #efd9b3;
  --tertiary-50: #f3e3c6;

  --accent-900: #171e32;
  --accent-800: #1a2139; /* shade + */
  --accent-700: #1d253f; /* base */
  --accent-600: #343b52; /* tint + */
  --accent-500: #4a5165;
  --accent-400: #616679;
  --accent-300: #777c8c;
  --accent-200: #8e929f;
  --accent-100: #a5a8b2;
  --accent-50: #bbbec5;

  --gray-900: #000000;
  --gray-800: #191919; /* shade + */
  --gray-700: #333333; /* base */
  --gray-600: #444444; /* tint + */
  --gray-500: #666666;
  --gray-400: #7f7f7f;
  --gray-300: #a1a1a1;
  --gray-200: #dbdbdb;
  --gray-100: #eeeeee;
  --gray-50: #f6f6f6;
}