:root{
  --metamerblue: #006899;
  --metamergreen: #62B22F;
  --blue050: #E9F1F5;
  --blue100: #EAF0F3;
  --blue200: #BEE0F1;
  --blue300: #8DCBE9;
  --blue400: #49A7D3;
  --blue500: #1684B8;
  --blue600: #006899;
  --blue700: #065880;
  --blue800: #0B374C;
  --blue900: #092A3A;
  --green050: #F7F4F0;
  --green800: #3F8513;
  --green500: #62B22F;
  --green400: #69BF32;
  --green300: #88CC6A;
  --green200: #A6E58A;
  --green900: #0F1D09;
  --purewhite: #FFFFFF;
  --gray900: #11181C;
  --gray800: #212D33;
  --gray700: #383E42;
  --gray600: #555759;
  --gray500: #7A7D80;
  --gray400: #9B9D9E;
  --gray300: #B7B9BA;
  --gray200: #D5D8D9;
  --gray100: #E8EAEB;
  --gray50: #F5F6F7;
}


/* COLOR MetamerBlue */
.colorMetamerBlue{ color: var(--metamerblue); }
.hoverColorMetamerBlue:hover{ color: var(--metamerblue); }
.bgColorMetamerBlue{ background-color: var(--metamerblue); }
.hoverBgColorMetamerBlue:hover{ background-color: var(--metamerblue); }
.borderMetamerBlue{ border-color: var(--metamerblue); }
.hoverBorderMetamerBlue:hover{ border-color: var(--metamerblue); }

/* COLOR MetamerGreen */
.colorMetamerGreen{ color: var(--metamergreen); }
.hoverColorMetamerGreen:hover{ color: var(--metamergreen); }
.bgColorMetamerGreen{ background-color: var(--metamergreen); }
.hoverBgColorMetamerGreen:hover{ background-color: var(--metamergreen); }
.borderMetamerGreen{ border-color: var(--metamergreen); }
.hoverBorderMetamerGreen:hover{ border-color: var(--metamergreen); }

/* COLOR Blue050 */
.colorBlue050{ color: var(--blue050); }
.hoverColorBlue050:hover{ color: var(--blue050); }
.bgColorBlue050{ background-color: var(--blue050); }
.hoverBgColorBlue050:hover{ background-color: var(--blue050); }
.borderBlue050{ border-color: var(--blue050); }
.hoverBorderBlue050:hover{ border-color: var(--blue050); }

/* COLOR Blue100 */
.colorBlue100{ color: var(--blue100); }
.hoverColorBlue100:hover{ color: var(--blue100); }
.bgColorBlue100{ background-color: var(--blue100); }
.hoverBgColorBlue100:hover{ background-color: var(--blue100); }
.borderBlue100{ border-color: var(--blue100); }
.hoverBorderBlue100:hover{ border-color: var(--blue100); }

/* COLOR Blue200 */
.colorBlue200{ color: var(--blue200); }
.hoverColorBlue200:hover{ color: var(--blue200); }
.bgColorBlue200{ background-color: var(--blue200); }
.hoverBgColorBlue200:hover{ background-color: var(--blue200); }
.borderBlue200{ border-color: var(--blue200); }
.hoverBorderBlue200:hover{ border-color: var(--blue200); }

/* COLOR Blue300 */
.colorBlue300{ color: var(--blue300); }
.hoverColorBlue300:hover{ color: var(--blue300); }
.bgColorBlue300{ background-color: var(--blue300); }
.hoverBgColorBlue300:hover{ background-color: var(--blue300); }
.borderBlue300{ border-color: var(--blue300); }
.hoverBorderBlue300:hover{ border-color: var(--blue300); }

/* COLOR Blue400 */
.colorBlue400{ color: var(--blue400); }
.hoverColorBlue400:hover{ color: var(--blue400); }
.bgColorBlue400{ background-color: var(--blue400); }
.hoverBgColorBlue400:hover{ background-color: var(--blue400); }
.borderBlue400{ border-color: var(--blue400); }
.hoverBorderBlue400:hover{ border-color: var(--blue400); }

/* COLOR Blue500 */
.colorBlue500{ color: var(--blue500); }
.hoverColorBlue500:hover{ color: var(--blue500); }
.bgColorBlue500{ background-color: var(--blue500); }
.hoverBgColorBlue500:hover{ background-color: var(--blue500); }
.borderBlue500{ border-color: var(--blue500); }
.hoverBorderBlue500:hover{ border-color: var(--blue500); }

/* COLOR Blue600 */
.colorBlue600{ color: var(--blue600); }
.hoverColorBlue600:hover{ color: var(--blue600); }
.bgColorBlue600{ background-color: var(--blue600); }
.hoverBgColorBlue600:hover{ background-color: var(--blue600); }
.borderBlue600{ border-color: var(--blue600); }
.hoverBorderBlue600:hover{ border-color: var(--blue600); }

/* COLOR Blue700 */
.colorBlue700{ color: var(--blue700); }
.hoverColorBlue700:hover{ color: var(--blue700); }
.bgColorBlue700{ background-color: var(--blue700); }
.hoverBgColorBlue700:hover{ background-color: var(--blue700); }
.borderBlue700{ border-color: var(--blue700); }
.hoverBorderBlue700:hover{ border-color: var(--blue700); }

/* COLOR Blue800 */
.colorBlue800{ color: var(--blue800); }
.hoverColorBlue800:hover{ color: var(--blue800); }
.bgColorBlue800{ background-color: var(--blue800); }
.hoverBgColorBlue800:hover{ background-color: var(--blue800); }
.borderBlue800{ border-color: var(--blue800); }
.hoverBorderBlue800:hover{ border-color: var(--blue800); }

/* COLOR Blue900 */
.colorBlue900{ color: var(--blue900); }
.hoverColorBlue900:hover{ color: var(--blue900); }
.bgColorBlue900{ background-color: var(--blue900); }
.hoverBgColorBlue900:hover{ background-color: var(--blue900); }
.borderBlue900{ border-color: var(--blue900); }
.hoverBorderBlue900:hover{ border-color: var(--blue900); }

/* COLOR Green050 */
.colorGreen050{ color: var(--green050); }
.hoverColorGreen050:hover{ color: var(--green050); }
.bgColorGreen050{ background-color: var(--green050); }
.hoverBgColorGreen050:hover{ background-color: var(--green050); }
.borderGreen050{ border-color: var(--green050); }
.hoverBorderGreen050:hover{ border-color: var(--green050); }

/* COLOR Green800 */
.colorGreen800{ color: var(--green800); }
.hoverColorGreen800:hover{ color: var(--green800); }
.bgColorGreen800{ background-color: var(--green800); }
.hoverBgColorGreen800:hover{ background-color: var(--green800); }
.borderGreen800{ border-color: var(--green800); }
.hoverBorderGreen800:hover{ border-color: var(--green800); }

/* COLOR Green500 */
.colorGreen500{ color: var(--green500); }
.hoverColorGreen500:hover{ color: var(--green500); }
.bgColorGreen500{ background-color: var(--green500); }
.hoverBgColorGreen500:hover{ background-color: var(--green500); }
.borderGreen500{ border-color: var(--green500); }
.hoverBorderGreen500:hover{ border-color: var(--green500); }

/* COLOR Green400 */
.colorGreen400{ color: var(--green400); }
.hoverColorGreen400:hover{ color: var(--green400); }
.bgColorGreen400{ background-color: var(--green400); }
.hoverBgColorGreen400:hover{ background-color: var(--green400); }
.borderGreen400{ border-color: var(--green400); }
.hoverBorderGreen400:hover{ border-color: var(--green400); }

/* COLOR Green300 */
.colorGreen300{ color: var(--green300); }
.hoverColorGreen300:hover{ color: var(--green300); }
.bgColorGreen300{ background-color: var(--green300); }
.hoverBgColorGreen300:hover{ background-color: var(--green300); }
.borderGreen300{ border-color: var(--green300); }
.hoverBorderGreen300:hover{ border-color: var(--green300); }

/* COLOR Green200 */
.colorGreen200{ color: var(--green200); }
.hoverColorGreen200:hover{ color: var(--green200); }
.bgColorGreen200{ background-color: var(--green200); }
.hoverBgColorGreen200:hover{ background-color: var(--green200); }
.borderGreen200{ border-color: var(--green200); }
.hoverBorderGreen200:hover{ border-color: var(--green200); }

/* COLOR Green900 */
.colorGreen900{ color: var(--green900); }
.hoverColorGreen900:hover{ color: var(--green900); }
.bgColorGreen900{ background-color: var(--green900); }
.hoverBgColorGreen900:hover{ background-color: var(--green900); }
.borderGreen900{ border-color: var(--green900); }
.hoverBorderGreen900:hover{ border-color: var(--green900); }

/* COLOR PureWhite */
.colorPureWhite{ color: var(--purewhite); }
.hoverColorPureWhite:hover{ color: var(--purewhite); }
.bgColorPureWhite{ background-color: var(--purewhite); }
.hoverBgColorPureWhite:hover{ background-color: var(--purewhite); }
.borderPureWhite{ border-color: var(--purewhite); }
.hoverBorderPureWhite:hover{ border-color: var(--purewhite); }

/* COLOR Gray900 */
.colorGray900{ color: var(--gray900); }
.hoverColorGray900:hover{ color: var(--gray900); }
.bgColorGray900{ background-color: var(--gray900); }
.hoverBgColorGray900:hover{ background-color: var(--gray900); }
.borderGray900{ border-color: var(--gray900); }
.hoverBorderGray900:hover{ border-color: var(--gray900); }

/* COLOR Gray800 */
.colorGray800{ color: var(--gray800); }
.hoverColorGray800:hover{ color: var(--gray800); }
.bgColorGray800{ background-color: var(--gray800); }
.hoverBgColorGray800:hover{ background-color: var(--gray800); }
.borderGray800{ border-color: var(--gray800); }
.hoverBorderGray800:hover{ border-color: var(--gray800); }

/* COLOR Gray700 */
.colorGray700{ color: var(--gray700); }
.hoverColorGray700:hover{ color: var(--gray700); }
.bgColorGray700{ background-color: var(--gray700); }
.hoverBgColorGray700:hover{ background-color: var(--gray700); }
.borderGray700{ border-color: var(--gray700); }
.hoverBorderGray700:hover{ border-color: var(--gray700); }

/* COLOR Gray600 */
.colorGray600{ color: var(--gray600); }
.hoverColorGray600:hover{ color: var(--gray600); }
.bgColorGray600{ background-color: var(--gray600); }
.hoverBgColorGray600:hover{ background-color: var(--gray600); }
.borderGray600{ border-color: var(--gray600); }
.hoverBorderGray600:hover{ border-color: var(--gray600); }

/* COLOR Gray500 */
.colorGray500{ color: var(--gray500); }
.hoverColorGray500:hover{ color: var(--gray500); }
.bgColorGray500{ background-color: var(--gray500); }
.hoverBgColorGray500:hover{ background-color: var(--gray500); }
.borderGray500{ border-color: var(--gray500); }
.hoverBorderGray500:hover{ border-color: var(--gray500); }

/* COLOR Gray400 */
.colorGray400{ color: var(--gray400); }
.hoverColorGray400:hover{ color: var(--gray400); }
.bgColorGray400{ background-color: var(--gray400); }
.hoverBgColorGray400:hover{ background-color: var(--gray400); }
.borderGray400{ border-color: var(--gray400); }
.hoverBorderGray400:hover{ border-color: var(--gray400); }

/* COLOR Gray300 */
.colorGray300{ color: var(--gray300); }
.hoverColorGray300:hover{ color: var(--gray300); }
.bgColorGray300{ background-color: var(--gray300); }
.hoverBgColorGray300:hover{ background-color: var(--gray300); }
.borderGray300{ border-color: var(--gray300); }
.hoverBorderGray300:hover{ border-color: var(--gray300); }

/* COLOR Gray200 */
.colorGray200{ color: var(--gray200); }
.hoverColorGray200:hover{ color: var(--gray200); }
.bgColorGray200{ background-color: var(--gray200); }
.hoverBgColorGray200:hover{ background-color: var(--gray200); }
.borderGray200{ border-color: var(--gray200); }
.hoverBorderGray200:hover{ border-color: var(--gray200); }

/* COLOR Gray100 */
.colorGray100{ color: var(--gray100); }
.hoverColorGray100:hover{ color: var(--gray100); }
.bgColorGray100{ background-color: var(--gray100); }
.hoverBgColorGray100:hover{ background-color: var(--gray100); }
.borderGray100{ border-color: var(--gray100); }
.hoverBorderGray100:hover{ border-color: var(--gray100); }

/* COLOR Gray50 */
.colorGray50{ color: var(--gray50); }
.hoverColorGray50:hover{ color: var(--gray50); }
.bgColorGray50{ background-color: var(--gray50); }
.hoverBgColorGray50:hover{ background-color: var(--gray50); }
.borderGray50{ border-color: var(--gray50); }
.hoverBorderGray50:hover{ border-color: var(--gray50); }