:root {
    /* globals */
    --body-font-family: PT Sans,Lato,sans-serif;
    --body-color: var(--gray-700);
    --heading-font-family: var(--body-font-family);
    --heading-color: var(--gray-700);
    --link-color: var(--primary-700);
    --link-color-hover: var(--primary-900);
    --button-font-size: 14px;
  
    /* colors */
    --primary-900: #0064a9;
    --primary-800: #0071be; /* shade + */
    --primary-700: #004676; /* base */
    --primary-600: #1a8ad7; /* tint + */
    --primary-500: #3397dc;
    --primary-400: #4da4e0;
    --primary-300: #66b1e5;
    --primary-200: #80bee9;
    --primary-100: #99cbed;
    --primary-50: #b3d8f2;
  
    --secondary-900: #006400;
    --secondary-800: #8dba3e; /* shade + */
    --secondary-700: #9dcf45; /* base */
    --secondary-600: #a7d458; /* tint + */
    --secondary-500: #b1d96a;
    --secondary-400: #badd7d;
    --secondary-300: #c4e28f;
    --secondary-200: #cee7a2;
    --secondary-100: #d8ecb5;
    --secondary-50: #e2f1c7;
  
    --tertiary-900: #004778;
    --tertiary-800: #005087; /* shade + */
    --tertiary-700: #004d82; /* base */
    --tertiary-600: #1a6aa1; /* tint + */
    --tertiary-500: #337aab;
    --tertiary-400: #4d8bb6;
    --tertiary-300: #669bc0;
    --tertiary-200: #80accb;
    --tertiary-100: #99bdd5;
    --tertiary-50: #b3cde0;
  
    --accent-900: #363636;
    --accent-800: #3d3d3d; /* shade + */
    --accent-700: #444444; /* base */
    --accent-600: #575757; /* tint + */
    --accent-500: #696969;
    --accent-400: #7c7c7c;
    --accent-300: #8f8f8f;
    --accent-200: #a2a2a2;
    --accent-100: #b4b4b4;
    --accent-50: #c7c7c7;
  
    --gray-900: #2e2e2e;
    --gray-800: #333333; /* shade + */
    --gray-700: #393939; /* base */
    --gray-600: #4d4d4d; /* tint + */
    --gray-500: #616161;
    --gray-400: #747474;
    --gray-300: #888888;
    --gray-200: #9c9c9c;
    --gray-100: #b0b0b0;
    --gray-50: #c4c4c4;
}