:root {

    /* colors */


  --amber: #FEBF00;

  /* Filorent's Blue color palette */

  --blue-dark-2: #0c2764;
  --blue-dark-1: #113587;
  --blue-base: #133c98;
  --blue-light-1: #174abb;
  --blue-light-2: #1c58de;

/* neutral and accent colors */

  --white-original: #ffffff;

  --white: #fcfcfd;
  --black: #191308;

  --accent-1: #2cd7cc;
  --accent-2: #4dddd4;
  --accent-3: #6cd1cb;
  --accent-4: #99dfdb;
  --accent-5: #d0f6f4;

  
  --grey-dark-2: #72819b;
  --grey-dark-1: #a0aabb;
  --grey-base: #ced3dc;
  --grey-light-1: #e5e8ec;
  --grey-light-2: #f0f2f5;
  --grey-light-3: #f7f8fa;


 /* Semi-transparent black and white for overlays */
  --c-white-transparent-1: rgba(255, 255, 255, 0.8);
  --c-white-transparent-2: rgba(255, 255, 255, 0.4);
  --c-white-transparent-3: rgba(255, 255, 255, 0.2);
  
  --c-black-transparent-1: rgba(0, 0, 0, 0.5);
  --c-black-transparent-2: rgba(0, 0, 0, 0.3);
  --c-black-transparent-3: rgba(0, 0, 0, 0.2);
  --c-black-transparent-4: rgba(0, 0, 0, 0.1);

  /* UI Colors */

  --green: #2e8b57;
  --yellow: var(--amber);

  --red: #ff0000;
  --red-dark: #cc0000;
  --red-light: #ff4d4d;
  --green-dark: #006400;
  --green-light: #2e8b57;

  
  --yellow-dark: #cc9a00;
  --yellow-base: var(--amber);   
  --yellow-light-1: #ffebb0;
  --yellow-light-2: #fff5d7;



    /* font families */

    --ff-sans1: 'Roboto', Verdana, Arial, sans-serif;
    --ff-sans2: 'Lato', Helvetica, Arial, sans-serif;
    --ff-cursive1: 'Caveat Brush', cursive;
    --ff-display1: 'Barlow Condensed', 'Arial Narrow', sans-serif;
    --ff-monospace1: 'Courier New', monospace;

    
    /* https://screenspan.net/fallback */

    /* font sizes: */

    --fs-small2: 0.75rem;
    --fs-small: 0.833rem;
    --fs-p: 0.91rem;
    --fs-p2: 1rem;
    --fs-p3: 1.1rem;
    --fs-h3: 1.22rem;
    --fs-h2: 1.48rem;
    --fs-h1: 1.97rem;

    --fw-light: 300;
    --fw-normal: 400;
    --fw-minibold: 500;
    --fw-semibold: 600;
    --fw-bold: 700;
    --fw-extrabold: 900;

    /*   1320px =  82.5 rem    */ 

    /* some clamps */
    --fc-small2: clamp(0.7rem, -0.45vw + 0.79rem, 0.42rem);
    --fc-small: clamp(0.79rem, -0.36vw + 0.86rem, 0.56rem);
    --fc-p: clamp(0.89rem, -0.22vw + 0.93rem, 0.75rem);
    --fc-p2: clamp(1rem, 0vw + 1rem, 1rem);
    --fc-h3: clamp(1.13rem, 0.33vw + 1.06rem, 1.33rem);
    --fc-h2: clamp(1.27rem, 0.82vw + 1.1rem, 1.78rem);
    --fc-h1: clamp(1.42rem, 1.51vw + 1.12rem, 2.37rem);
    --fc-h1plus: clamp(1.6rem, 2.49vw + 1.1rem, 3.16rem);

    /* margins */
    --margin-xxs: 0.125rem;
    --margin-xs: 0.25rem;
    --margin-s: 0.5rem;
    --margin-m: 1rem;
    --margin-l: 1.25rem;
    --margin-xl: 2.5rem;
    --margin-xxl: 3.75rem;

    /* some margin clamps */


    --mc-l: clamp(0.5rem, calc(0.5rem + ((1vw - 0.2rem) * 1.875)), 1.25rem);
    --mc-xl: clamp(var(--margin-s), calc(0.5rem + ((1vw - 0.2rem) * 5)), (var(--margin-xl)));

    /* border radius */

    --br-s: 8px;
    --br-m: 12px;
}