:root {
  /* FDIC Colors */
  /* Primary */
  --fdic-dark-blue:  #003256; /* Brand: Navy */
  --fdic-med-blue: #0d6191;
  --fdic-med-blue-darker: #0c5a88;
  --fdic-blue-tint-40: #9ec0d3; /* Brand: Blue Tint 40 */
  --fdic-blue-tint-20: #cfdfe9; /* Brand: Blue Tint 20 */
  /* 2025 Updated Link Colors */
  --fdic-blue-denim: #1278b0;
  --fdic-purple-deluge: #855aa5;
  --fdic-purple-deluge-dark: #79579f;
  /* Secondary */
  --fdic-gold-brand: #c0ae6a; /* Brand: Gold */
  --fdic-gold-tint-40: #e6dfc3; /* Brand: Gold Tint 40 */
  --fdic-gold-tint-20: #f2efe1; /* Brand: Gold Tint 20 */
  /* Other */
  --fdic-tan: #B7AC83;
  --fdic-gold: #7F7141; /* #736539? */
  --fdic-brass: #A48923;
  --fdic-teal: #00908C;
  --fdic-rose: #C8326C;
  --fdic-disable: #777678;
  --fdic-black: #000000;
  --fdic-white: #ffffff;
  --fdic-neutral-020: #d8d8d8;
  --fdic-neutral-100: #171717;
  --fdic-neutral-100-shadow: rgba(23, 23, 23, 0.08);
  --fdic-light-blue: #38b6ff;
  --fdic-map-blue: rgb(12, 78, 130);
  --fdic-map-hover: rgb(77, 120, 165);

  /* Site colors */
  --body-background-color: #f9f7f3;
  --body-text-color: #1b1b1b;
  --footer-secondary-bg-color: #1b1d20;
  --footer-secondary-menu-color: #ffffff;
  /* --default-font-color: #444343; Retired in favor of --body-text-color */
  --text-primary: var(--body-text-color);
  --text-secondary: var(--fdic-dark-blue);
  --text-accent: var(--fdic-gold);
  --surface-primary: var(--body-background-color);
  --surface-secondary: var(--fdic-dark-blue);
  --surface-accent: var(--fdic-blue-tint-20);
  --table-header-bg-color: var(--fdic-dark-blue);
  --table-header-text-color: var(--fdic-white);
  --table-header-font-family: var(--font-family-title);
  --table-row-bg-color: var(--fdic-white);
  --table-row-even-bg-color: #f9f8f5;
  --table-border-color: #c5c5c5;
  --link: var(--fdic-blue-denim);
  --link-hover: var(--fdic-med-blue);
  --link-visited: var(--fdic-purple-deluge);
  --link-visited-hover: var(--fdic-purple-deluge-dark);
  /* Note: visited link colors should not be used for UI/navigation contexts:
  menus, breadcrumbs, sidebar navigation, sign-up, login, footnotes, etc. */

  /* Font styles */
  --default-font-size: 1rem;
  --default-line-height: 1.6rem;
  --xs-font-size: 0.75rem;
  --xs-line-height: 1.25rem;
  /* not sure what to call font-family-sans-pro */
  --font-family-sans-pro: Source Sans Pro Web, Helvetica Neue, Helvetica, Roboto, Arial, sans-serif;
  --font-family-title: "Merriweather Web", Georgia, Cambria, "Times New Roman", Times, serif;
  --font-family-paragraph: "Open Sans", "Source Sans Pro Web", "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
  --font-family-fontawesome: "Font Awesome 5 Free";
  --font-weight-normal: 400;
  --font-weight-semi-bold: 600;

  /* Headings */
  --heading-family: var(--font-family-title);
  --heading-margin: 1.5em 0 0.5em 0;
  --heading-padding: 0;
  /* H1 */
  --h1-size: 2.25rem;
  --h1-line-height: 1.25;
  --h1-weight: 100;
  /* H2 */
  --h2-size: 1.5rem;
  --h2-line-height: 1.25;
  --h2-weight: 400;
  /* H3 */
  --h3-size: 1.25rem;
  --h3-line-height: 1.25;
  --h3-weight: 400;
  /* H4 */
  --h4-size: 1rem;
  --h4-line-height: 1.25;
  --h4-weight: 600;
  /* H5 */
  --h5-size: 0.875rem;
  --h5-line-height: 1.25;
  --h5-weight: 600;
  /* H6 */
  --h6-size: 0.75rem;
  --h6-line-height: 1.25;
  --h6-weight: 600;

  /* Spacing */
  /* Small */
  /* Between small icons and text */
  /* Padding inside inputs (i.e. search bar) */
  /* Padding inside icons, buttons, tables */
  --spacing-2xs: 0.25rem; /* 4px */
  --spacing-xs: 0.5rem; /* 8px */
  --spacing-sm: 0.75rem; /* 12px */
  /* Medium */
  /* Around larger components (i.e. cards) */
  /* Between items in less densely packed areas */
  --spacing-md: 1rem; /* 16px */
  --spacing-lg: 1.5rem; /* 24px */
  --spacing-xl: 2rem; /* 32px */
  --spacing-2xl: 2.5rem; /* 40px */
  /* Large */
  /* Largest pieces of UI and layout */
  /* Between body page content and footer */
  --spacing-3xl: 3rem; /* 48px */
  --spacing-4xl: 4rem; /* 64px */

  /* Breakpoints */
  /* Use this as a guide */
  /* CSS media queries do not support the use of vars yet */
  /* https://drafts.csswg.org/css-env-1 */
  /* --xs: 'screen and (min-width): 0'; */
  /* 480px */
  /* --sm: 'screen and (min-width): 30rem'; */
  /* 768px */
  /* --md: 'screen and (min-width): 48rem'; */
  /* 1040px */
  /* --lg: 'screen and (min-width): 65rem'; */
  /* 1440px */
  /* --xl: 'screen and (min-width): 90rem'; */
}
