:root {
  /* globals */
  --body-font-family: 'Open Sans', Helvetica, Arial, sans-serif;
  --body-color: var(--gray-700);
  --heading-font-family: var(--body-font-family);
  --heading-color: #ffffff;
  --link-color: var(--secondary-700);
  --link-color-hover: var(--secondary-900);
  --button-font-size: 16px;

  /* colors */
  --primary-900: #8a0909;
  --primary-800: #9c0a0a; /* shade + */
  --primary-700: #AD0B0B; /* base */
  --primary-600: #b52323; /* tint + */
  --primary-500: #bd3c3c;
  --primary-400: #c65454;
  --primary-300: #ce6d6d;
  --primary-200: #d68585;
  --primary-100: #de9d9d;
  --primary-50: #e6b6b6;

  --secondary-900: #144253;
  --secondary-800: #174a5e; /* shade + */
  --secondary-700: #195268; /* base */
  --secondary-600: #306377; /* tint + */
  --secondary-500: #477586;
  --secondary-400: #5e8695;
  --secondary-300: #7597a4;
  --secondary-200: #8ca9b4;
  --secondary-100: #a3bac3;
  --secondary-50: #bacbd2;

  --tertiary-900: #801615;
  --tertiary-800: #901917; /* shade + */
  --tertiary-700: #A01C1A; /* base */
  --tertiary-600: #aa3331; /* tint + */
  --tertiary-500: #b34948;
  --tertiary-400: #bd605f;
  --tertiary-300: #c67776;
  --tertiary-200: #d08e8d;
  --tertiary-100: #d9a4a3;
  --tertiary-50: #e3bbba;

  --accent-900: #012635;
  --accent-800: #012b3b; /* shade + */
  --accent-700: #013042; /* base */
  --accent-600: #1a4555; /* tint + */
  --accent-500: #345968;
  --accent-400: #4d6e7b;
  --accent-300: #67838e;
  --accent-200: #8098a1;
  --accent-100: #99acb3;
  --accent-50: #ccd6d9;

  --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;
}