:root { 
  --black: #000000;
  --blue-ribbon: #0059ff;
  --celeste: #d0d0d0;
  --portica: #f9e960;
  --white: #ffffff;
 
  --font-size-l: 17.4px;
  --font-size-m: 12.5px;
  --font-size-s: 10.5px;
  --font-size-xl: 20.7px;
  --font-size-xxl: 20.8px;
  --font-size-xxxl: 24.9px;
  --font-size-xxxxl: 35.7px;
 
  --font-family-roboto: "Roboto", Helvetica;
}
.roboto-medium-white-12-5px {
  color: var(--white);
  font-family: var(--font-family-roboto);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 500;
}

.roboto-medium-white-10-5px {
  color: var(--white);
  font-family: var(--font-family-roboto);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 500;
}

.roboto-semi-bold-celeste-24-9px {
  color: var(--celeste);
  font-family: var(--font-family-roboto);
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 600;
}

.roboto-semi-bold-celeste-20-9px {
  color: var(--celeste);
  font-family: var(--font-family-roboto);
  font-size: 20.9px;
  font-style: normal;
  font-weight: 600;
}