:root { 
  --black: #000000;
  --black-haze: #f6f6f6;
  --concrete: #f2f2f2;
  --dove-gray: #70707012;
  --flamingo: #ee5a30;
  --gallery: #eeeeee;
  --heavy-metal: #2d2d2d;
  --iron: #d8d8d8;
  --main-color: #da1a35;
  --oslo-gray: #868e96;
  --placeholder-color: #b6b7b7;
  --primary-font-color: #4a4b4d;
  --secondary-font-color: #7c7d7e;
  --white: #ffffff;
 
  --font-size-l: 16px;
  --font-size-m: 14px;
  --font-size-s: 13px;
  --font-size-xl: 22px;
  --font-size-xs: 12px;
  --font-size-xxl: 24px;
  --font-size-xxxl: 30px;
 
  --font-family-cabin: "Cabin", Helvetica;
  --font-family-circularstd_black-regular: "CircularStd Black-Regular", Helvetica;
  --font-family-etihadaltis-bold: "EtihadAltis-Bold", Helvetica;
  --font-family-metropolis: "Metropolis", Helvetica;
  --font-family-metropolis-bold: "Metropolis-Bold", Helvetica;
  --font-family-metropolis-extrabold: "Metropolis-ExtraBold", Helvetica;
  --font-family-metropolis-medium: "Metropolis-Medium", Helvetica;
  --font-family-metropolis-mediumitalic: "Metropolis-MediumItalic", Helvetica;
  --font-family-metropolis-regular: "Metropolis-Regular", Helvetica;
  --font-family-metropolis-semibold: "Metropolis-SemiBold", Helvetica;
}
.metropolis-regular-normal-pink-swan-14px {
  color: var(--placeholder-color);
  font-family: var(--font-family-metropolis-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.metropolis-medium-pink-swan-12px {
  color: var(--placeholder-color);
  font-family: var(--font-family-metropolis-medium);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 500;
}

.metropolis-bold-white-16px {
  color: var(--white);
  font-family: var(--font-family-metropolis-semibold);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 700;
}

.metropolis-bold-gravel-14px {
  color: var(--primary-font-color);
  font-family: var(--font-family-metropolis-semibold);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 700;
}

.metropolis-medium-crimson-12px {
  color: var(--main-color);
  font-family: var(--font-family-metropolis-medium);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 500;
}

.metropolis-extra-bold-gravel-24px {
  color: var(--primary-font-color);
  font-family: var(--font-family-metropolis-extrabold);
  font-size: var(--font-size-xxl);
  font-style: normal;
  font-weight: 700;
}

.metropolis-bold-gravel-14px-2 {
  color: var(--primary-font-color);
  font-family: var(--font-family-metropolis-bold);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 700;
}

.metropolis-bold-gravel-13px {
  color: var(--primary-font-color);
  font-family: var(--font-family-metropolis-bold);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 700;
}

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

.metropolis-medium-gravel-13px {
  color: var(--primary-font-color);
  font-family: var(--font-family-metropolis-medium);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 500;
}

.metropolis-medium-concord-13px {
  color: var(--secondary-font-color);
  font-family: var(--font-family-metropolis-medium);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 500;
}

.metropolis-medium-heavy-metal-12px {
  color: var(--heavy-metal);
  font-family: var(--font-family-metropolis-medium);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 500;
}

.metropolis-bold-pink-swan-12px {
  color: var(--placeholder-color);
  font-family: var(--font-family-metropolis-semibold);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 700;
}

.metropolis-bold-gravel-16px {
  color: var(--primary-font-color);
  font-family: var(--font-family-metropolis-bold);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 700;
}

.metropolis-regular-normal-pink-swan-10px {
  color: var(--placeholder-color);
  font-family: var(--font-family-metropolis-regular);
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
}

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

.metropolis-bold-crimson-13px {
  color: var(--main-color);
  font-family: var(--font-family-metropolis-bold);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 700;
}

.metropolis-extra-bold-gravel-14px {
  color: var(--primary-font-color);
  font-family: var(--font-family-metropolis-extrabold);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 700;
}

.metropolis-extra-bold-gravel-30px {
  color: var(--primary-font-color);
  font-family: var(--font-family-metropolis-extrabold);
  font-size: var(--font-size-xxxl);
  font-style: normal;
  font-weight: 700;
}

.metropolis-regular-normal-pink-swan-37px {
  color: var(--placeholder-color);
  font-family: var(--font-family-metropolis-regular);
  font-size: 37px;
  font-style: normal;
  font-weight: 400;
}

.etihadaltis-bold-gravel-22px {
  color: var(--primary-font-color);
  font-family: var(--font-family-etihadaltis-bold);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 700;
}

.metropolis-regular-normal-pink-swan-11px {
  color: var(--placeholder-color);
  font-family: var(--font-family-metropolis-regular);
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
}

.etihadaltis-bold-gravel-18px {
  color: var(--primary-font-color);
  font-family: var(--font-family-etihadaltis-bold);
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
}

.metropolis-extra-bold-gravel-22px {
  color: var(--primary-font-color);
  font-family: var(--font-family-metropolis-extrabold);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 700;
}

.metropolis-regular-normal-concord-12px {
  color: var(--secondary-font-color);
  font-family: var(--font-family-metropolis-regular);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 400;
}

.circularstdblack-regular-normal-white-14px {
  color: var(--white);
  font-family: var(--font-family-circularstd_black-regular);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.metropolis-bold-crimson-14px {
  color: var(--main-color);
  font-family: var(--font-family-metropolis);
  font-size: var(--font-size-m);
}

.metropolis-bold-crimson-14px-2 {
  color: var(--main-color);
  font-family: var(--font-family-metropolis-bold);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 700;
}

.border-1px-dove-gray {
  border: 1px solid var(--dove-gray);
}

.border-1px-flamingo {
  border: 1px solid var(--flamingo);
}

.border-1px-main-color {
  border: 1px solid var(--main-color);
}

.border-1px-gallery {
  border: 1px solid var(--gallery);
}

.border-2px-secondary-font-color {
  border: 2px solid var(--secondary-font-color);
}