:root { 
  --alto: #dedede;
  --arapawa: #0c0466;
  --black: #000000;
  --eerie-black: #1d1817;
  --eerie-black-2: #1d18174c;
  --mirage: #1a202c;
  --neutral20: #ffffff;
  --neutral70: #6f757e;
  --neutral90: #27303e;
  --oyster-pink: #f9d0c8;
  --pohutukawa: #8d021f;
  --tertiary20: #fff5cc;
  --tertiary30: #ffeb99;
  --tertiary80: #997a00;
  --yellow: #ffff00;
 
  --font-size-l: 36px;
  --font-size-m: 24px;
  --font-size-s: 20px;
  --font-size-xl: 40px;
  --font-size-xs: 12px;
  --font-size-xxl: 42px;
  --font-size-xxs: 8px;
 
  --font-family-montserrat: "Montserrat", Helvetica;
  --font-family-open_sans: "Open Sans", Helvetica;
  --font-family-roboto: "Roboto", Helvetica;
}
.montserrat-medium-arapawa-24px {
  color: var(--arapawa);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 500;
}

.montserrat-medium-mirage-10px {
  color: var(--mirage);
  font-family: var(--font-family-montserrat);
  font-size: 10px;
  font-style: normal;
  font-weight: 500;
}

.montserrat-medium-mirage-3px {
  color: var(--mirage);
  font-family: var(--font-family-montserrat);
  font-size: 3px;
  font-style: normal;
  font-weight: 500;
}

.montserrat-medium-arapawa-8px {
  color: var(--arapawa);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-xxs);
  font-style: normal;
  font-weight: 500;
}

.montserrat-medium-mirage-16px {
  color: var(--mirage);
  font-family: var(--font-family-montserrat);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
}

.montserrat-semi-bold-white-20px {
  color: var(--neutral20);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 600;
}

.montserrat-semi-bold-white-40px {
  color: var(--neutral20);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 600;
}

.montserrat-medium-mirage-35px {
  color: var(--mirage);
  font-family: var(--font-family-montserrat);
  font-size: 35px;
  font-style: normal;
  font-weight: 500;
}

.montserrat-semi-bold-white-12px {
  color: var(--neutral20);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 600;
}

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

.montserrat-medium-mirage-6px {
  color: var(--mirage);
  font-family: var(--font-family-montserrat);
  font-size: 6px;
  font-style: normal;
  font-weight: 500;
}

.montserrat-semi-bold-pohutukawa-48px {
  color: var(--pohutukawa);
  font-family: var(--font-family-montserrat);
  font-size: 48px;
  font-style: normal;
  font-weight: 600;
}

.montserrat-medium-mirage-20px {
  color: var(--mirage);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 500;
}

.montserrat-semi-bold-pohutukawa-99px {
  color: var(--pohutukawa);
  font-family: var(--font-family-montserrat);
  font-size: 99px;
  font-style: normal;
  font-weight: 600;
}

.montserrat-medium-white-20px {
  color: var(--neutral20);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 500;
}

.montserrat-medium-white-40px {
  color: var(--neutral20);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 500;
}

.montserrat-semi-bold-white-8px {
  color: var(--neutral20);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-xxs);
  font-style: normal;
  font-weight: 600;
}

.montserrat-semi-bold-white-5px {
  color: var(--neutral20);
  font-family: var(--font-family-montserrat);
  font-size: 5px;
  font-style: normal;
  font-weight: 600;
}

.montserrat-semi-bold-pohutukawa-14px {
  color: var(--pohutukawa);
  font-family: var(--font-family-montserrat);
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
}

.montserrat-semi-bold-white-24px {
  color: var(--neutral20);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 600;
}

.montserrat-semi-bold-pohutukawa-36px {
  color: var(--pohutukawa);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 600;
}

.montserrat-bold-yellow-82px {
  color: var(--yellow);
  font-family: var(--font-family-montserrat);
  font-size: 82px;
  font-style: normal;
  font-weight: 700;
}

.montserrat-semi-bold-white-42px {
  color: var(--neutral20);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 600;
}

.montserrat-semi-bold-white-7px {
  color: var(--neutral20);
  font-family: var(--font-family-montserrat);
  font-size: 7px;
  font-style: normal;
  font-weight: 600;
}

.montserrat-normal-eerie-black-14px {
  color: var(--eerie-black);
  font-family: var(--font-family-montserrat);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}

.montserrat-bold-white-36px {
  color: var(--neutral20);
  font-family: var(--font-family-montserrat);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 700;
}

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

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

.montserrat-semi-bold-pohutukawa-56px {
  color: var(--pohutukawa);
  font-family: var(--font-family-montserrat);
  font-size: 56px;
  font-style: normal;
  font-weight: 600;
}

.montserrat-normal-eerie-black-57px {
  color: var(--eerie-black);
  font-family: var(--font-family-montserrat);
  font-size: 57px;
  font-style: normal;
  font-weight: 400;
}