html {
  --vbs-font-family: "Barlow", sans-serif;

  /* Font sizes */
  --vbs-text-xl: 3rem;
  --vbs-text-lg: 1.7rem;
  --vbs-text-md: 1.2rem;
  --vbs-text: 1rem;
  --vbs-text-sm: 0.8rem;
  --vbs-text-xs: 0.7rem;

  --vbs-text-page-title: var(--vbs-text-xl);
  --vbs-text-navigation: var(--vbs-text);
  --vbs-text-footer: var(--vbs-text-sm);
  --vbs-text-h1: var(--vbs-text-lg);
  --vbs-text-h2: var(--vbs-text-md);
  --vbs-text-h3: var(--vbs-text);

  /* Font weights */
  --vbs-font-weight-light: 300;
  --vbs-font-weight-normal: 400;
  --vbs-font-weight-medium: 500;
  --vbs-font-weight-bold: 700;

  /* Styling Colors */
  --vbs-color-primary: #94003a;
  --vbs-color-primary-dark: #510022;
  --vbs-color-primary-gradient: linear-gradient(
    236deg,
    var(--vbs-color-primary) 0%,
    var(--vbs-color-primary-dark) 100%
  );
  --vbs-color-secondary: #009bc1;
  --vbs-color-secondary-dark: #002244;
  --vbs-color-secondary-gradient: linear-gradient(
    236deg,
    var(--vbs-color-secondary) 0%,
    var(--vbs-color-secondary-dark) 100%
  );

  /* Text Colors */
  --vbs-color-text: #002244;
}