:root {
  /*COLORS*/
  --color1: #0068FF;
  --color2: #FFA912;
  --color3: #05E59A;
  --color4: #FF4848;
  --grey1: #f5f3f1;
  --color-dark: #0E1218;
  --color-light: #fff;
  --mobileHeader: 70px;
  /*DEFAULT FONT*/
  --basicfont: "Averta", Helvetica, sans-serif;
  --subfont: "IvyPresto", sans-serif;
  --fontcolor: #0E1218;
  --maxScreenSize: 1920px;
  --defaultColor: #cccccc;
  --focusedColor: #3c3c3c;
  --errorColor: #FF4848;
  --placeholder: #ccc;
  --rowSize: 10px;
  --inputSize: 15px;
  --buttonHover: #0c0e15;
  --buttonPadding: 15px 30px;
  --buttonRadius: 100px;
  --iconsize: 20px;
  /*FONTSIZES*/
  --min-viewport: 48;
  --max-viewport: 100;
  /* FONTSIZES */
  --min-fontsize: 1;
  --max-fontsize: 1.225;
  --pref-fontsize: calc(calc(var(--min-fontsize) * 1rem) + (var(--max-fontsize) - var(--min-fontsize)) * ((calc(var(--max-viewport) * 1vw) - calc(var(--min-viewport) * 1rem)) / (var(--max-viewport) - var(--min-viewport))));
  --fontsize: clamp(calc(var(--min-fontsize) * 1rem), var(--pref-fontsize), calc(var(--max-fontsize) * 1rem));
  --lineheight: 1.5;
  --min-xxs-fontsize: 0.7;
  --max-xxs-fontsize: 0.8;
  --pref-xxs-fontsize: calc(calc(var(--min-xxs-fontsize) * 1rem) + (var(--max-xxs-fontsize) - var(--min-xxs-fontsize)) * ((calc(var(--max-viewport) * 1vw) - calc(var(--min-viewport) * 1rem)) / (var(--max-viewport) - var(--min-viewport))));
  --xxs-fontsize: clamp(calc(var(--min-xxs-fontsize) * 1rem), var(--pref-xxs-fontsize), calc(var(--max-xxs-fontsize) * 1rem));
  --xxs-lineheight: 1.5;
  --min-xs-fontsize: 1;
  --max-xs-fontsize: 1.25;
  --pref-xs-fontsize: calc(calc(var(--min-xs-fontsize) * 1rem) + (var(--max-xs-fontsize) - var(--min-xs-fontsize)) * ((calc(var(--max-viewport) * 1vw) - calc(var(--min-viewport) * 1rem)) / (var(--max-viewport) - var(--min-viewport))));
  --xs-fontsize: clamp(calc(var(--min-xs-fontsize) * 1rem), var(--pref-xs-fontsize), calc(var(--max-xs-fontsize) * 1rem));
  --xs-lineheight: 1.5;
  /* S FONTSIZE */
  --min-s-fontsize: 1.125;
  --max-s-fontsize: 1.375;
  --pref-s-fontsize: calc(calc(var(--min-s-fontsize) * 1rem) + (var(--max-s-fontsize) - var(--min-s-fontsize)) * ((calc(var(--max-viewport) * 1vw) - calc(var(--min-viewport) * 1rem)) / (var(--max-viewport) - var(--min-viewport))));
  --s-fontsize: clamp(calc(var(--min-s-fontsize) * 1rem), var(--pref-s-fontsize), calc(var(--max-s-fontsize) * 1rem));
  --s-lineheight: 1.5;
  --min-m-fontsize: 1.1875;
  --max-m-fontsize: 1.625;
  --pref-m-fontsize: calc(calc(var(--min-m-fontsize) * 1rem) + (var(--max-m-fontsize) - var(--min-m-fontsize)) * ((calc(var(--max-viewport) * 1vw) - calc(var(--min-viewport) * 1rem)) / (var(--max-viewport) - var(--min-viewport))));
  --m-fontsize: clamp(calc(var(--min-m-fontsize) * 1rem), var(--pref-m-fontsize), calc(var(--max-m-fontsize) * 1rem));
  --m-lineheight: 1.2;
  --min-l-fontsize: 2;
  --max-l-fontsize: 3;
  --pref-l-fontsize: calc(calc(var(--min-l-fontsize) * 1rem) + (var(--max-l-fontsize) - var(--min-l-fontsize)) * ((calc(var(--max-viewport) * 1vw) - calc(var(--min-viewport) * 1rem)) / (var(--max-viewport) - var(--min-viewport))));
  --l-fontsize: clamp(calc(var(--min-l-fontsize) * 1rem), var(--pref-l-fontsize), calc(var(--max-l-fontsize) * 1rem));
  --l-lineheight: 1.2;
  --min-xl-fontsize: 1.6875;
  --max-xl-fontsize: 4.2;
  --pref-xl-fontsize: calc(calc(var(--min-xl-fontsize) * 1rem) + (var(--max-xl-fontsize) - var(--min-xl-fontsize)) * ((calc(var(--max-viewport) * 1vw) - calc(var(--min-viewport) * 1rem)) / (var(--max-viewport) - var(--min-viewport))));
  --xl-fontsize: clamp(calc(var(--min-xl-fontsize) * 1rem), var(--pref-xl-fontsize), calc(var(--max-xl-fontsize) * 1rem));
  --xl-lineheight: 1;
  --min-xxl-fontsize: 2.1;
  --max-xxl-fontsize: 6.5;
  --pref-xxl-fontsize: calc(calc(var(--min-xxl-fontsize) * 1rem) + (var(--max-xxl-fontsize) - var(--min-xxl-fontsize)) * ((calc(var(--max-viewport) * 1vw) - calc(var(--min-viewport) * 1rem)) / (var(--max-viewport) - var(--min-viewport))));
  --xxl-fontsize: clamp(calc(var(--min-xxl-fontsize) * 1rem), var(--pref-xxl-fontsize), calc(var(--max-xxl-fontsize) * 1rem));
  --xxl-lineheight: 0.9;
  --min-cases-fontsize: 2;
  --max-cases-fontsize: 3;
  --pref-cases-fontsize: calc(calc(var(--min-cases-fontsize) * 1rem) + (var(--max-cases-fontsize) - var(--min-cases-fontsize)) * ((calc(var(--max-viewport) * 1vw) - calc(var(--min-viewport) * 1rem)) / (var(--max-viewport) - var(--min-viewport))));
  --cases-fontsize: clamp(calc(var(--min-cases-fontsize) * 1rem), var(--pref-cases-fontsize), calc(var(--max-cases-fontsize) * 1rem));
  --min-news-date-fontsize: 0.8;
  --max-news-date-fontsize: 1.15;
  --pref-cases-fontsize: calc(calc(var(--min-news-date-fontsize) * 1rem) + (var(--max-news-date-fontsize) - var(--min-news-date-fontsize)) * ((calc(var(--max-viewport) * 1vw) - calc(var(--min-viewport) * 1rem)) / (var(--max-viewport) - var(--min-viewport))));
  --news-date-fontsize: clamp(calc(var(--min-news-date-fontsize) * 1rem), var(--pref-cases-fontsize), calc(var(--max-news-date-fontsize) * 1rem));
}
@media (max-width: 56em) {
  :root {
    --spacer: calc(0vw + var(--gutter));
    --section: 30px;
    --gutter: 15px;
    --min-gutter: -15px;
    --padding: 20px;
    --min-padding: -20px;
    --min-xl-fontsize: 2.5;
    --min-xxl-fontsize: 2.5;
    --xxl-lineheight: 1.1;
  }
}
@media (min-width: 56em) {
  :root {
    --spacer: calc(1vw + var(--gutter));
    --section: 60px;
    --gutter: 30px;
    --min-gutter: -30px;
    --padding: 20px;
    --min-padding: -20px;
  }
}
@media (min-width: 90em) {
  :root {
    --spacer: calc(2vw + var(--gutter));
    --section: 80px;
    --gutter: 40px;
    --min-gutter: -40px;
    --padding: 25px;
    --min-padding: -25px;
  }
}
@media (min-width: 100em) {
  :root {
    --spacer: calc(3vw + var(--gutter));
    --section: 100px;
    --gutter: 50px;
    --min-gutter: -50px;
    --padding: 30px;
    --min-padding: -30px;
  }
}
