:root { 
  --black: #000000;
  --celeste: #d7d0ca;
  --ebb: #e8e3de;
  --eerie-black: #18231b;
  --padua: #adf4c7;
  --shark: #232526;
  --white: #ffffff;
 
  --font-size-l: 13px;
  --font-size-m: 12px;
  --font-size-s: 10px;
  --font-size-xl: 16px;
  --font-size-xxl: 18px;
  --font-size-xxxl: 22px;
  --font-size-xxxxl: 30px;
 
  --font-family-joyride: "Joyride", Helvetica;
  --font-family-joyride-outline: "Joyride-Outline", Helvetica;
  --font-family-joyride-regular: "Joyride-Regular", Helvetica;
}
.joyride-regular-normal-shark-12px {
  color: var(--shark);
  font-family: var(--font-family-joyride-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-celeste-20px {
  color: var(--celeste);
  font-family: var(--font-family-joyride-regular);
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-padua-12px {
  color: var(--padua);
  font-family: var(--font-family-joyride-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-ebb-10px {
  color: var(--ebb);
  font-family: var(--font-family-joyride-regular);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-shark-15px {
  color: var(--shark);
  font-family: var(--font-family-joyride-regular);
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
}

.joyride-outline-normal-shark-30px {
  color: var(--shark);
  font-family: var(--font-family-joyride-outline);
  font-size: var(--font-size-xxxxl);
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-ebb-18px {
  color: var(--ebb);
  font-family: var(--font-family-joyride-regular);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-shark-30px {
  color: var(--shark);
  font-family: var(--font-family-joyride-regular);
  font-size: var(--font-size-xxxxl);
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-shark-24px {
  color: var(--shark);
  font-family: var(--font-family-joyride-regular);
  font-size: 24px;
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-shark-18px {
  color: var(--shark);
  font-family: var(--font-family-joyride-regular);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-padua-10px {
  color: var(--padua);
  font-family: var(--font-family-joyride-regular);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-shark-13px {
  color: var(--shark);
  font-family: var(--font-family-joyride-regular);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-shark-16px {
  color: var(--shark);
  font-family: var(--font-family-joyride-regular);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 400;
}

.joyride-normal-shark-21px {
  color: var(--shark);
  font-family: var(--font-family-joyride);
  font-size: 21px;
}

.joyride-regular-normal-shark-21px {
  color: var(--shark);
  font-family: var(--font-family-joyride-regular);
  font-size: 21px;
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-ebb-15px {
  color: var(--ebb);
  font-family: var(--font-family-joyride-regular);
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
}

.joyride-regular-normal-padua-18px {
  color: var(--padua);
  font-family: var(--font-family-joyride-regular);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 400;
}