:root {
  --black: #000000;
  --blue100: #1ca0c7;
  --cerulean: #01a7e1;
  --gallery: #f0f0f0;
  --gray: #7f7f7f;
  --greeybanner: #f6f6f6;
  --grey200: #d9d9d9;
  --greysfondo: #f6f6f6;
  --mountain-mist: #959595;
  --newyellow: #f2cd10;
  --nobel: #b3b3b3;
  --pumice: #c8c8c8;
  --white: #ffffff;
  --yellowtrovabirre: #f3cc00;
  --zest: #e18017;

  --font-size-l: 28px;
  --font-size-m: 28px;
  --font-size-s: 20px;
  --font-size-xs: 19px;
  --font-size-xxs: 18px;
  --font-size-xxxs: 17px;
  --font-size-xxxxs: 16px;

  --font-family-darker_grotesque: "Darker Grotesque", Helvetica;
  --font-family-inter: "Inter", Helvetica;
  --font-family-segoe_ui-bold: "Segoe UI-Bold", Helvetica;
  --font-family-segoe_ui-regular: "Segoe UI-Regular", Helvetica;
  --font-family-sriracha: "Sriracha", Helvetica;
}
.inter-normal-white-18px {
  color: var(--white);
  font-family: var(--font-family-inter);
  font-size: var(--font-size-xxs);
  font-style: normal;
  font-weight: 400;
}

.darkergrotesque-medium-gray-17px {
  color: var(--gray);
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-xxxs);
  font-style: normal;
  font-weight: 500;
}

.darkergrotesque-extra-bold-black-22px {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: 22px;
  font-style: normal;
  font-weight: 800;
}

.darkergrotesque-normal-cerulean-18px {
  color: var(--cerulean);
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-xxs);
  font-style: normal;
  font-weight: 400;
}

.inter-bold-white-12px {
  color: var(--white);
  font-family: var(--font-family-inter);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.darkergrotesque-bold-black-25px {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: 25px;
  font-style: normal;
  font-weight: 700;
}

.darkergrotesque-semi-bold-gray-20px {
  color: var(--gray);
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 600;
}

.darkergrotesque-extra-bold-black-25px {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: 25px;
  font-style: normal;
  font-weight: 800;
}

.darkergrotesque-medium-black-21px {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: 21px;
  font-style: normal;
  font-weight: 500;
}

.darkergrotesque-medium-mountain-mist-16px {
  color: var(--mountain-mist);
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-xxxxs);
  font-style: normal;
  font-weight: 500;
}

.inter-bold-white-18px {
  color: var(--white);
  font-family: var(--font-family-inter);
  font-size: var(--font-size-xxs);
  font-style: normal;
  font-weight: 700;
}

.darkergrotesque-normal-black-26px {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.segoeui-regular-normal-black-20px {
  color: var(--black);
  font-family: var(--font-family-segoe_ui-regular);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 400;
}

.darkergrotesque-extra-bold-white-13-5px {
  color: var(--white);
  font-family: var(--font-family-darker_grotesque);
  font-size: 13.5px;
  font-style: normal;
  font-weight: 800;
}

.darkergrotesque-semi-bold-black-26px {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 600;
}

.darkergrotesque-extra-bold-black-26px {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: 35px;
  font-style: normal;
  font-weight: 800;
}
.darkergrotesque-extra-bold-black-26px-mobile {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: 25px;
  font-style: normal;
  font-weight: 800;
}

.darkergrotesque-extra-bold-black-26px-2 {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 800;
}

.darkergrotesque-extra-bold-black-26px-2:hover {
  color: var(--yellowtrovabirre);
  background-color: black;
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 800;
}

.darkergrotesque-semi-bold-white-26px {
  color: var(--white);
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 600;
}

.darkergrotesque-semi-bold-white-19px {
  color: var(--white);
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 600;
}

.darkergrotesque-extra-bold-ripe-lemon-21px {
  color: var(--newyellow);
  font-family: var(--font-family-darker_grotesque);
  font-size: 21px;
  font-style: normal;
  font-weight: 800;
}

.sriracha-normal-black-36px {
  color: var(--black);
  font-family: var(--font-family-sriracha);
  font-size: 36px;
  font-style: normal;
  font-weight: 400;
}

.darkergrotesque-black-black-50px {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: 50px;
  font-style: normal;
  font-weight: 900;
}

.darkergrotesque-black-black-50px-mobile {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: 22px;
  font-style: normal;
  font-weight: 900;
}

.darkergrotesque-extra-bold-black-45px {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: 45px;
  font-style: normal;
  font-weight: 800;
}

.darkergrotesque-black-white-26px {
  color: var(--white);
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 900;
}

.darkergrotesque-normal-black-27px {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: 27px;
  font-style: normal;
  font-weight: 400;
}

.darkergrotesque-black-black-20px {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 900;
}

.darkergrotesque-bold-black-18px {
  color: var(--black);
  font-family: var(--font-family-darker_grotesque);
  font-size: var(--font-size-xxs);
  font-style: normal;
  font-weight: 700;
}
