
:root{
  --primary100: #ffcfad;
  --primary200: #ffa361;
  --primary300: #ff8b38;
  --primary400: #ff6900;
  --primary500: #f16300;
  --primary600: #d34a01;
  --secondary100: #c9f4ee;
  --secondary200: #a6f0e5;
  --secondary300: #6be4d2;
  --secondary400: #4ed3bf;
  --secondary500: #35a69c;
  --secondary600: #0e7370;
  --tertiary100: #f1f6f6;
  --tertiary200: #d6dcdc;
  --tertiary300: #a3b8b8;
  --tertiary400: #7ca1a4;
  --tertiary500: #284c52;
  --tertiary600: #1a3135;
  --cream100: #fcfaf5;
  --cream200: #f7f5f0;
  --neutral100: #ffffff;
  --neutral200: #e8e8e8;
  --neutral300: #afb3b5;
  --neutral400: #747a7c;
  --neutral500: #434647;
  --neutral600: #2d3132;
  --neutral700: #000000;
  --background: #fcfcfc;
}


/* COLOR Primary100 */
.colorPrimary100{ color: var(--primary100); }
.hoverColorPrimary100:hover{ color: var(--primary100); }
.bgColorPrimary100{ background-color: var(--primary100); }
.hoverBgColorPrimary100:hover{ background-color: var(--primary100); }
.borderPrimary100{ border-color: var(--primary100); }
.hoverBorderPrimary100:hover{ border-color: var(--primary100); }

/* COLOR Primary200 */
.colorPrimary200{ color: var(--primary200); }
.hoverColorPrimary200:hover{ color: var(--primary200); }
.bgColorPrimary200{ background-color: var(--primary200); }
.hoverBgColorPrimary200:hover{ background-color: var(--primary200); }
.borderPrimary200{ border-color: var(--primary200); }
.hoverBorderPrimary200:hover{ border-color: var(--primary200); }

/* COLOR Primary300 */
.colorPrimary300{ color: var(--primary300); }
.hoverColorPrimary300:hover{ color: var(--primary300); }
.bgColorPrimary300{ background-color: var(--primary300); }
.hoverBgColorPrimary300:hover{ background-color: var(--primary300); }
.borderPrimary300{ border-color: var(--primary300); }
.hoverBorderPrimary300:hover{ border-color: var(--primary300); }

/* COLOR Primary400 */
.colorPrimary400{ color: var(--primary400); }
.hoverColorPrimary400:hover{ color: var(--primary400); }
.bgColorPrimary400{ background-color: var(--primary400); }
.hoverBgColorPrimary400:hover{ background-color: var(--primary400); }
.borderPrimary400{ border-color: var(--primary400); }
.hoverBorderPrimary400:hover{ border-color: var(--primary400); }

/* COLOR Primary500 */
.colorPrimary500{ color: var(--primary500); }
.hoverColorPrimary500:hover{ color: var(--primary500); }
.bgColorPrimary500{ background-color: var(--primary500); }
.hoverBgColorPrimary500:hover{ background-color: var(--primary500); }
.borderPrimary500{ border-color: var(--primary500); }
.hoverBorderPrimary500:hover{ border-color: var(--primary500); }

/* COLOR Primary600 */
.colorPrimary600{ color: var(--primary600); }
.hoverColorPrimary600:hover{ color: var(--primary600); }
.bgColorPrimary600{ background-color: var(--primary600); }
.hoverBgColorPrimary600:hover{ background-color: var(--primary600); }
.borderPrimary600{ border-color: var(--primary600); }
.hoverBorderPrimary600:hover{ border-color: var(--primary600); }

/* COLOR Secondary100 */
.colorSecondary100{ color: var(--secondary100); }
.hoverColorSecondary100:hover{ color: var(--secondary100); }
.bgColorSecondary100{ background-color: var(--secondary100); }
.hoverBgColorSecondary100:hover{ background-color: var(--secondary100); }
.borderSecondary100{ border-color: var(--secondary100); }
.hoverBorderSecondary100:hover{ border-color: var(--secondary100); }

/* COLOR Secondary200 */
.colorSecondary200{ color: var(--secondary200); }
.hoverColorSecondary200:hover{ color: var(--secondary200); }
.bgColorSecondary200{ background-color: var(--secondary200); }
.hoverBgColorSecondary200:hover{ background-color: var(--secondary200); }
.borderSecondary200{ border-color: var(--secondary200); }
.hoverBorderSecondary200:hover{ border-color: var(--secondary200); }

/* COLOR Secondary300 */
.colorSecondary300{ color: var(--secondary300); }
.hoverColorSecondary300:hover{ color: var(--secondary300); }
.bgColorSecondary300{ background-color: var(--secondary300); }
.hoverBgColorSecondary300:hover{ background-color: var(--secondary300); }
.borderSecondary300{ border-color: var(--secondary300); }
.hoverBorderSecondary300:hover{ border-color: var(--secondary300); }

/* COLOR Secondary400 */
.colorSecondary400{ color: var(--secondary400); }
.hoverColorSecondary400:hover{ color: var(--secondary400); }
.bgColorSecondary400{ background-color: var(--secondary400); }
.hoverBgColorSecondary400:hover{ background-color: var(--secondary400); }
.borderSecondary400{ border-color: var(--secondary400); }
.hoverBorderSecondary400:hover{ border-color: var(--secondary400); }

/* COLOR Secondary500 */
.colorSecondary500{ color: var(--secondary500); }
.hoverColorSecondary500:hover{ color: var(--secondary500); }
.bgColorSecondary500{ background-color: var(--secondary500); }
.hoverBgColorSecondary500:hover{ background-color: var(--secondary500); }
.borderSecondary500{ border-color: var(--secondary500); }
.hoverBorderSecondary500:hover{ border-color: var(--secondary500); }

/* COLOR Secondary600 */
.colorSecondary600{ color: var(--secondary600); }
.hoverColorSecondary600:hover{ color: var(--secondary600); }
.bgColorSecondary600{ background-color: var(--secondary600); }
.hoverBgColorSecondary600:hover{ background-color: var(--secondary600); }
.borderSecondary600{ border-color: var(--secondary600); }
.hoverBorderSecondary600:hover{ border-color: var(--secondary600); }

/* COLOR Tertiary100 */
.colorTertiary100{ color: var(--tertiary100); }
.hoverColorTertiary100:hover{ color: var(--tertiary100); }
.bgColorTertiary100{ background-color: var(--tertiary100); }
.hoverBgColorTertiary100:hover{ background-color: var(--tertiary100); }
.borderTertiary100{ border-color: var(--tertiary100); }
.hoverBorderTertiary100:hover{ border-color: var(--tertiary100); }

/* COLOR Tertiary200 */
.colorTertiary200{ color: var(--tertiary200); }
.hoverColorTertiary200:hover{ color: var(--tertiary200); }
.bgColorTertiary200{ background-color: var(--tertiary200); }
.hoverBgColorTertiary200:hover{ background-color: var(--tertiary200); }
.borderTertiary200{ border-color: var(--tertiary200); }
.hoverBorderTertiary200:hover{ border-color: var(--tertiary200); }

/* COLOR Tertiary300 */
.colorTertiary300{ color: var(--tertiary300); }
.hoverColorTertiary300:hover{ color: var(--tertiary300); }
.bgColorTertiary300{ background-color: var(--tertiary300); }
.hoverBgColorTertiary300:hover{ background-color: var(--tertiary300); }
.borderTertiary300{ border-color: var(--tertiary300); }
.hoverBorderTertiary300:hover{ border-color: var(--tertiary300); }

/* COLOR Tertiary400 */
.colorTertiary400{ color: var(--tertiary400); }
.hoverColorTertiary400:hover{ color: var(--tertiary400); }
.bgColorTertiary400{ background-color: var(--tertiary400); }
.hoverBgColorTertiary400:hover{ background-color: var(--tertiary400); }
.borderTertiary400{ border-color: var(--tertiary400); }
.hoverBorderTertiary400:hover{ border-color: var(--tertiary400); }

/* COLOR Tertiary500 */
.colorTertiary500{ color: var(--tertiary500); }
.hoverColorTertiary500:hover{ color: var(--tertiary500); }
.bgColorTertiary500{ background-color: var(--tertiary500); }
.hoverBgColorTertiary500:hover{ background-color: var(--tertiary500); }
.borderTertiary500{ border-color: var(--tertiary500); }
.hoverBorderTertiary500:hover{ border-color: var(--tertiary500); }

/* COLOR Tertiary600 */
.colorTertiary600{ color: var(--tertiary600); }
.hoverColorTertiary600:hover{ color: var(--tertiary600); }
.bgColorTertiary600{ background-color: var(--tertiary600); }
.hoverBgColorTertiary600:hover{ background-color: var(--tertiary600); }
.borderTertiary600{ border-color: var(--tertiary600); }
.hoverBorderTertiary600:hover{ border-color: var(--tertiary600); }

/* COLOR Cream100 */
.colorCream100{ color: var(--cream100); }
.hoverColorCream100:hover{ color: var(--cream100); }
.bgColorCream100{ background-color: var(--cream100); }
.hoverBgColorCream100:hover{ background-color: var(--cream100); }
.borderCream100{ border-color: var(--cream100); }
.hoverBorderCream100:hover{ border-color: var(--cream100); }

/* COLOR Cream200 */
.colorCream200{ color: var(--cream200); }
.hoverColorCream200:hover{ color: var(--cream200); }
.bgColorCream200{ background-color: var(--cream200); }
.hoverBgColorCream200:hover{ background-color: var(--cream200); }
.borderCream200{ border-color: var(--cream200); }
.hoverBorderCream200:hover{ border-color: var(--cream200); }

/* COLOR Neutral100 */
.colorNeutral100{ color: var(--neutral100); }
.hoverColorNeutral100:hover{ color: var(--neutral100); }
.bgColorNeutral100{ background-color: var(--neutral100); }
.hoverBgColorNeutral100:hover{ background-color: var(--neutral100); }
.borderNeutral100{ border-color: var(--neutral100); }
.hoverBorderNeutral100:hover{ border-color: var(--neutral100); }

/* COLOR Neutral200 */
.colorNeutral200{ color: var(--neutral200); }
.hoverColorNeutral200:hover{ color: var(--neutral200); }
.bgColorNeutral200{ background-color: var(--neutral200); }
.hoverBgColorNeutral200:hover{ background-color: var(--neutral200); }
.borderNeutral200{ border-color: var(--neutral200); }
.hoverBorderNeutral200:hover{ border-color: var(--neutral200); }

/* COLOR Neutral300 */
.colorNeutral300{ color: var(--neutral300); }
.hoverColorNeutral300:hover{ color: var(--neutral300); }
.bgColorNeutral300{ background-color: var(--neutral300); }
.hoverBgColorNeutral300:hover{ background-color: var(--neutral300); }
.borderNeutral300{ border-color: var(--neutral300); }
.hoverBorderNeutral300:hover{ border-color: var(--neutral300); }

/* COLOR Neutral400 */
.colorNeutral400{ color: var(--neutral400); }
.hoverColorNeutral400:hover{ color: var(--neutral400); }
.bgColorNeutral400{ background-color: var(--neutral400); }
.hoverBgColorNeutral400:hover{ background-color: var(--neutral400); }
.borderNeutral400{ border-color: var(--neutral400); }
.hoverBorderNeutral400:hover{ border-color: var(--neutral400); }

/* COLOR Neutral500 */
.colorNeutral500{ color: var(--neutral500); }
.hoverColorNeutral500:hover{ color: var(--neutral500); }
.bgColorNeutral500{ background-color: var(--neutral500); }
.hoverBgColorNeutral500:hover{ background-color: var(--neutral500); }
.borderNeutral500{ border-color: var(--neutral500); }
.hoverBorderNeutral500:hover{ border-color: var(--neutral500); }

/* COLOR Neutral600 */
.colorNeutral600{ color: var(--neutral600); }
.hoverColorNeutral600:hover{ color: var(--neutral600); }
.bgColorNeutral600{ background-color: var(--neutral600); }
.hoverBgColorNeutral600:hover{ background-color: var(--neutral600); }
.borderNeutral600{ border-color: var(--neutral600); }
.hoverBorderNeutral600:hover{ border-color: var(--neutral600); }

/* COLOR Neutral700 */
.colorNeutral700{ color: var(--neutral700); }
.hoverColorNeutral700:hover{ color: var(--neutral700); }
.bgColorNeutral700{ background-color: var(--neutral700); }
.hoverBgColorNeutral700:hover{ background-color: var(--neutral700); }
.borderNeutral700{ border-color: var(--neutral700); }
.hoverBorderNeutral700:hover{ border-color: var(--neutral700); }

/* COLOR Background */
.colorBackground{ color: var(--background); }
.hoverColorBackground:hover{ color: var(--background); }
.bgColorBackground{ background-color: var(--background); }
.hoverBgColorBackground:hover{ background-color: var(--background); }
.borderBackground{ border-color: var(--background); }
.hoverBorderBackground:hover{ border-color: var(--background); }

