:root {


    --font: 'Roboto', system-ui, Avenir, Helvetica, Arial, sans-serif;
    font-family: 'Roboto', system-ui, Avenir, Helvetica, Arial, sans-serif;
    line-height: 1.5;
    font-weight: 400;
  
    color-scheme: light dark;
    color: #213547;
   
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: 100%;
    text-align: justify;
  
    --dft-spacement: 1rem;
   /* primary pallet */
    --primary-color-light: #66BFFF;
    --primary-color-main:#0074E4;
    --primary-color-dark: #002884;
    --primary-color-contrastText: #fff;
    /* secondary pallet */
    --secundary-color-light: #ffffff;
    --secundary-color-main:#f9f9f9;
    --secundary-color-dark: #CC5200;
    --secundary-color-contrastText: #e3ebff;



  --li4-color-primary-hsl: 250, 84%, 54%;
  --li4-color-bg-hsl: 0, 0%, 100%;
  --li4-color-contrast-high-hsl: 230, 7%, 23%;
  --li4-color-contrast-higher-hsl: 230, 13%, 9%;
  --li4-color-bg-light-hsl: 0, 0%, 100%;
  --li4-color-white-hsl: 0, 0%, 100%;
  --li4-color-bg-dark-hsl: 240, 4%, 95%;
  --li4-color-bg-lighter-hsl: 0, 0%, 100%;
  --li4-color-black-hsl: 230, 13%, 9%;

  --li4-space-3xs: 0.25rem;
  --li4-space-2xs: 0.375rem;
  --li4-space-xs: 0.5rem;
  --li4-space-sm: 0.75rem;

      
}