:root {
  --fs-xxl: 120px;
  --fs-xl: 80px;
  --fs-l: 64px;
  --fs-m: 40px;
  --fs-s: 28px;

  --fs-body-l: 18px;
  --fs-body-m: 16px;
  --fs-body-s: 14px;
  --fs-tags: 12px;
}

@media (width <= 1680px) {
  :root {
    --fs-xxl: 120px;
    --fs-xl: 60px;
    --fs-l: 56px;
    --fs-m: 36px;
    --fs-s: 24px;
  }
}

@media (width <= 1440px) {
  :root {
    --fs-xxl: 100px;
    --fs-xl: 48px;
    --fs-l: 48px;
    --fs-m: 32px;
    --fs-s: 20px;

    --fs-body-l: 16px;
    --fs-body-m: 14px;
  }
}

@media (width <= 1280px) {
  :root {
    --fs-l: 36px;
  }
}

@media (width <= 1024px) {
  :root {
    --fs-xxl: 80px;
    --fs-xl: 42px;
    --fs-l: 36px;
    --fs-m: 32px;
    --fs-s: 20px;
  }
}

@media (width <= 768px) {
  :root {
    --fs-xxl: 56px;
    --fs-xl: 32px;
    --fs-l: 28px;
    --fs-m: 24px;
    --fs-s: 20px;

    --fs-body-s: 12px;
  }
}

@media (width <= 560px) {
  :root {
    --fs-xxl: 32px;
    --fs-xl: 32px;
    --fs-l: 24px;
    --fs-m: 20px;
    --fs-s: 20px;

    --fs-body-l: 14px;
  }
}


@font-face {
  font-family: "formular";
  src: url("../fonts/Formular-Light.otf") format("otf"),
      url("../fonts/Formular-Light.ttf") format("ttf"),
      url("../fonts/formular-light-webfont.woff2") format("woff2"),
      url("../fonts/formular-light-webfont.woff") format("woff"),
      url("../fonts/Formular-Light.eot") format("eot");
  font-weight: 300;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: "formular";
  src: url("../fonts/Formular.otf") format("otf"),
      url("../fonts/Formular.ttf") format("ttf"),
      url("../fonts/formular-webfont.woff2") format("woff2"),
      url("../fonts/formular-webfont.woff") format("woff"),
      url("../fonts/Formular.eot") format("eot");
  font-weight: 400;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: "formular";
  src: url("../fonts/Formular-Medium.otf") format("otf"),
      url("../fonts/Formular-Medium.ttf") format("ttf"),
      url("../fonts/formular-medium-webfont.woff2") format("woff2"),
      url("../fonts/formular-medium-webfont.woff") format("woff"),
      url("../fonts/Formular-Medium.eot") format("eot");
  font-weight: 500;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: "formular";
  src: url("../fonts/Formular-Bold.otf") format("otf"),
      url("../fonts/Formular-Bold.ttf") format("ttf"),
      url("../fonts/formular-bold-webfont.woff2") format("woff2"),
      url("../fonts/formular-bold-webfont.woff") format("woff"),
      url("../fonts/Formular-Bold.eot") format("eot");
  font-weight: 600;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: "america";
  src: url("../fonts/gt-america-light-webfont.woff2") format("woff2"),
      url("../fonts/gt-america-light-webfont.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: "america";
  src: url("../fonts/gt-america-medium-webfont.woff2") format("woff2"),
      url("../fonts/gt-america-medium-webfont.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: "america";
  src: url("../fonts/gt-america-bold-webfont.woff2") format("woff2"),
      url("../fonts/gt-america-bold-webfont.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: block;
}
