:root {
  /* Primary color shades */
  --md-primary-fg-color: var(--primary-dark-blue);
  --md-primary-fg-color--light: var(--secondary-light-blue);
  --md-primary-fg-color--dark: var(--primary-dark-blue);
  --md-primary-bg-color: var(--light-grey);
  --md-primary-bg-color--light: var(--secondary-light-blue);
  --md-text-link-color: var(--primary-red);

  /* Accent color shades */
  --md-accent-fg-color: var(--primary-red);
  --md-accent-fg-color--transparent: hsla(348, 100%, 27%, 0.1);
  --md-accent-bg-color: var(--white);
  --md-accent-bg-color--light: hsla(0, 0%, 100%, 0.7);

  /* Code block color shades */
  --md-code-bg-color: var(--light-grey);
  --md-code-fg-color: var(--darker-grey);

  /* Footer */
  --md-footer-bg-color: var(--primary-dark-blue);
  --md-footer-bg-color--dark: var(--secondary-dark-blue);
  --md-footer-fg-color: var(--white);
  --md-footer-fg-color--light: hsla(0, 0%, 100%, 0.7);
  --md-footer-fg-color--lighter: hsla(0, 0%, 100%, 0.3);
}