:root { 
  --alto: #dddddd;
  --blue-jeans: #57b1fa;
  --blue-whale: #022148;
  --celeste: #cecece;
  --dove-gray: #707070;
  --gallery: #f0f0f0;
  --hawkes-blue: #cde5f8;
  --hint-of-red: #f9f9f9;
  --mountain-mist: #959595;
  --nobel: #b5b5b5;
  --nobel-2: #b2b2b2;
  --pattens-blue: #ddeffd;
  --quick-silver: #a5a5a5;
  --shark: #252525;
  --silver: #bfbfbf;
  --tickle-me-pink: #f9809f;
  --white: #ffffff;
  --wild-sand: #f4f4f4;
 
  --font-size-l: 15px;
  --font-size-m: 14px;
  --font-size-s: 13px;
  --font-size-xl: 18px;
  --font-size-xs: 12px;
  --font-size-xxl: 25px;
  --font-size-xxxl: 30px;
 
  --font-family-fredoka: "Fredoka", Helvetica;
  --font-family-newrubrik-bold: "NewRubrik-Bold", Helvetica;
  --font-family-newrubrik-extrabold: "NewRubrik-ExtraBold", Helvetica;
  --font-family-newrubrik-medium: "NewRubrik-Medium", Helvetica;
  --font-family-newrubrik-regular: "NewRubrik-Regular", Helvetica;
  --font-family-newrubrik-semibold: "NewRubrik-SemiBold", Helvetica;
}
.fredoka-semi-bold-blue-whale-30px {
  color: var(--blue-whale);
  font-family: var(--font-family-fredoka);
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 600;
}

.newrubrik-extra-extra-bold-white-20px {
  color: var(--white);
  font-family: var(--font-family-newrubrik-extrabold);
  font-size: 20px;
  font-style: normal;
  font-weight: 800;
}

.fredoka-semi-bold-blue-whale-15px {
  color: var(--blue-whale);
  font-family: var(--font-family-fredoka);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 600;
}

.newrubrik-extra-extra-bold-white-11px {
  color: var(--white);
  font-family: var(--font-family-newrubrik-extrabold);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}

.fredoka-semi-bold-blue-whale-23px {
  color: var(--blue-whale);
  font-family: var(--font-family-fredoka);
  font-size: 23px;
  font-style: normal;
  font-weight: 600;
}

.newrubrik-extra-extra-bold-white-14px {
  color: var(--white);
  font-family: var(--font-family-newrubrik-extrabold);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 800;
}

.fredoka-normal-quick-silver-25px {
  color: var(--quick-silver);
  font-family: var(--font-family-fredoka);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 400;
}

.fredoka-normal-quick-silver-13px {
  color: var(--quick-silver);
  font-family: var(--font-family-fredoka);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 400;
}

.fredoka-normal-quick-silver-16px {
  color: var(--quick-silver);
  font-family: var(--font-family-fredoka);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.newrubrik-bold-blue-whale-20px {
  color: var(--blue-whale);
  font-family: var(--font-family-newrubrik-bold);
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
}

.newrubrik-medium-nobel-20px {
  color: var(--nobel-2);
  font-family: var(--font-family-newrubrik-medium);
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
}

.fredoka-medium-nobel-30px {
  color: var(--nobel);
  font-family: var(--font-family-fredoka);
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 500;
}

.newrubrik-bold-blue-whale-16px {
  color: var(--blue-whale);
  font-family: var(--font-family-newrubrik-bold);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
}

.fredoka-medium-nobel-15px {
  color: var(--nobel);
  font-family: var(--font-family-fredoka);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 500;
}

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

.fredoka-medium-nobel-14px {
  color: var(--nobel);
  font-family: var(--font-family-fredoka);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 500;
}

.newrubrik-medium-nobel-14px {
  color: var(--nobel-2);
  font-family: var(--font-family-newrubrik-medium);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 500;
}