:root { 
  --abbey: #4e4e4e;
  --alto: #dbdbdb;
  --baltic-sea: #2c2d31;
  --black: #000000;
  --black-2: #00000033;
  --blue-bayoux: #4e5e79;
  --bon-jour: #dfe0e5;
  --cadet-blue: #acb1c6;
  --cadet-blue-2: #acb1c7;
  --celeste: #cbcbcb;
  --cyan--aqua: #00c3ff;
  --dove-gray: #70707060;
  --dove-gray-2: #707070cc;
  --gallery: #efefef;
  --mirage: #151920;
  --mirage-2: #151a20;
  --mirage-3: #141920;
  --quill-gray: #d2d2d2;
  --salmon-pearl: #eb3744;
  --slimy-green: #22c813;
  --supernova: #ffce00;
  --white: #ffffff;
  --white-2: #ffffff0f;
  --white-3: #ffffffcc;
  --white-4: #ffffff0f;
  --white-5: #ffffff03;
  --white-6: #ffffffd1;
 
  --font-size-l: 13px;
  --font-size-m: 12px;
  --font-size-s: 10px;
  --font-size-xl: 14px;
  --font-size-xxl: 15px;
  --font-size-xxxl: 16px;
  --font-size-xxxxl: 25px;
 
  --font-family-exo: "Exo", Helvetica;
}
.exo-normal-white-12px {
  color: var(--white);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

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

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

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

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

.exo-normal-white-12px-2 {
  color: var(--white-3);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

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

.exo-medium-bon-jour-12px {
  color: var(--bon-jour);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 500;
}

.exo-semi-bold-black-9px {
  color: var(--black);
  font-family: var(--font-family-exo);
  font-size: 9px;
  font-style: normal;
  font-weight: 600;
}

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

.exo-normal-white-14px {
  color: var(--white);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 400;
}

.exo-medium-white-13px {
  color: var(--white);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 500;
}

.exo-medium-white-15px {
  color: var(--white);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 500;
}

.exo-normal-white-14px-2 {
  color: var(--white-3);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 400;
}

.exo-normal-cadet-blue-13px {
  color: var(--cadet-blue);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 400;
}

.exo-bold-gallery-13px {
  color: var(--gallery);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 700;
}

.exo-bold-cyan--aqua-12px {
  color: var(--cyan--aqua);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 700;
}

.exo-normal-quill-gray-16px {
  color: var(--quill-gray);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 400;
}

.exo-normal-cadet-blue-12px {
  color: var(--cadet-blue-2);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.exo-semi-bold-celeste-15px {
  color: var(--celeste);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 600;
}

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

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

.exo-semi-bold-supernova-25px {
  color: var(--supernova);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-xxxxl);
}

.exo-semi-bold-supernova-25px-2 {
  color: var(--supernova);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-xxxxl);
  font-style: normal;
  font-weight: 600;
}

.exo-semi-bold-supernova-19px {
  color: var(--supernova);
  font-family: var(--font-family-exo);
  font-size: 19px;
  font-style: normal;
  font-weight: 600;
}

.exo-semi-bold-white-16px {
  color: var(--white);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 600;
}

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

.exo-semi-bold-white-14px {
  color: var(--white-6);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 600;
}

.exo-medium-white-17px {
  color: var(--white);
  font-family: var(--font-family-exo);
  font-size: 17px;
  font-style: normal;
  font-weight: 500;
}

.exo-semi-bold-alto-25px {
  color: var(--alto);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-xxxxl);
}

.exo-semi-bold-alto-25px-2 {
  color: var(--alto);
  font-family: var(--font-family-exo);
  font-size: var(--font-size-xxxxl);
  font-style: normal;
  font-weight: 600;
}

.exo-semi-bold-alto-19px {
  color: var(--alto);
  font-family: var(--font-family-exo);
  font-size: 19px;
  font-style: normal;
  font-weight: 600;
}
