:root {
    --red: #FF0000;
    --red_light: #f78374;
    --red_dark: #eb6756;
    --red_opt: #fbc6bf;
    --red_gradual: linear-gradient(45deg, #f43f3b, #ec008c);
    --border_red: 1px solid #FF0000;
    --orange: #fdad4e;
    --orange_light: #febe72;
    --orange_dark: #f09e3d;
    --orange_opt: #fedeb8;
    --orange_gradual: linear-gradient(45deg, #ff9700, #ed1c24);
    --border_orange: 1px solid #fdad4e;
    --yellow: #FFFF00;
    --yellow_light: #fef2ce;
    --border_yellow: 1px solid #FFFF00;
    --green: #008000;
    --green_light: #00FFFF;
    --green_dark: #0dc2aa;
    --green_opt: #9fece2;
    --green_olive: #8dc63f;
    --green_gradual: linear-gradient(45deg, #39b54a, #8dc63f);
    --border_green: 1px solid #008000;
    --cyan: #1cbbb4;
    --cyan_light: #d2f1f0;
    --border_cyan: 1px solid #1cbbb4;
    --blue: #2495ff;
    --blue_light: #42a4ff;
    --blue_dark: #000080;
    --blue_opt: #a7d5ff;
    --blue_greys: #eef7ff;
    --blue_gradual: linear-gradient(45deg, #0081ff, #1cbbb4);
    --border_blue: 1px solid #2495ff;
    --purple: #800080;
    --purple_light: #e1d7f0;
    --purple_opt: #ebd4ef;
    --purple_mauve: #9c26b0;
    --purple_gradual: linear-gradient(45deg, #9000ff, #5e00ff);
    --border_purple: 1px solid #800080;
    --pink: #e03997;
    --pink_light: #f9d7ea;
    --pink_gradual: linear-gradient(45deg, #ec008c, #6739b6);
    --border_pink: 1px solid #e03997;
    --brown: #333333;
    --brown_light: #ede1d9;
    --border_brown: 1px solid #333333;
    --grey_999: #999;
    --grey: #8ba6c0;
    --grey_light: #e7ebed;
    --grey_stb: #e6ebf3;
    --grey_eee: #eee;
    --grey_ddd: #ddd;
    --grey_f0: #f0f0f0;
    --grey_f1: #f1f1f1;
    --grey_f5: #f5f5f5;
    --grey_f9: #f9f9f9;
    --grey_fa: #fafafa;
    --border_grey: 1px solid #8ba6c0;
    --gray: #808080;
    --gray_light: #b6c9dc;
    --gray_dark: #7391ae;
    --gray_opt: #d1dbe6;
    --border_gray: 1px solid #808080;
    --white: #ffffff;
    --border_white: 1px solid #ffffff;
    --black: #000000;
    --border_black: 1px solid #000000;
    --transparent_red: rgba(204, 69, 59, 0.2);
    --transparent_orange: rgba(217, 109, 26, 0.2);
    --transparent_yellow: rgba(224, 170, 7, 0.2);
    --transparent_green: rgba(48, 156, 63, 0.2);
    --transparent_cyan: rgba(28, 187, 180, 0.2);
    --transparent_blue: rgba(0, 102, 204, 0.2);
    --transparent_purple: rgba(88, 48, 156, 0.2);
    --transparent_pink: rgba(199, 50, 134, 0.2);
    --transparent_brown: rgba(140, 88, 53, 0.2);
    --transparent_grey: rgba(114, 130, 138, 0.2);
    --transparent_gray: rgba(114, 130, 138, 0.2);
    --transparent_black: rgba(26, 26, 26, 0.2);
}

.bg_red {
    background-color: var(--red);
}

.bg_red_light {
    background-color: var(--red_light);
}

.bg_red_dark {
    background-color: var(--red_dark);
}

.bg_red_opt {
    background-color: var(--red_opt);
}

.bg_red_gradual {
    background-image: var(--red_gradual);
}

.bd_red {
    border: 1px solid var(--red);
}

.bg_orange {
    background-color: var(--orange);
}

.bg_orange_light {
    background-color: var(--orange_light);
}

.bg_orange_dark {
    background-color: var(--orange_dark);
}

.bg_orange_opt {
    background-color: var(--orange_opt);
}

.bg_orange_gradual {
    background-image: var(--orange_gradual);
}

.bd_orange {
    border: 1px solid var(--orange);
}

.bg_yellow {
    background-color: var(--yellow);
}

.bg_yellow_light {
    background-color: var(--yellow_light);
}

.bd_yellow {
    border: 1px solid var(--yellow);
}

.bg_green {
    background-color: var(--green);
}

.bg_green_light {
    background-color: var(--green_light);
}

.bg_green_dark {
    background-color: var(--green_dark);
}

.bg_green_opt {
    background-color: var(--green_opt);
}

.bg_green_olive {
    background-color: var(--green_olive);
}

.bg_green_gradual {
    background-image: var(--green_gradual);
}

.bd_green {
    border: 1px solid var(--green);
}

.bg_cyan {
    background-color: var(--cyan);
}

.bg_cyan_light {
    background-color: var(--cyan_light);
}

.bd_cyan {
    border: 1px solid var(--cyan);
}

.bg_blue {
    background-color: var(--blue);
}

.bg_blue_light {
    background-color: var(--blue_light);
}

.bg_blue_dark {
    background-color: var(--blue_dark);
}

.bg_blue_opt {
    background-color: var(--blue_opt);
}

.bg_blue_greys {
    background-color: var(--blue_greys);
}

.bg_blue_gradual {
    background-image: var(--blue_gradual);
}

.bd_blue {
    border: 1px solid var(--blue);
}

.bg_purple {
    background-color: var(--purple);
}

.bg_purple_light {
    background-color: var(--purple_light);
}

.bg_purple_opt {
    background-color: var(--purple_opt);
}

.bg_purple_mauve {
    background-color: var(--purple_mauve);
}

.bg_purple_gradual {
    background-image: var(--purple_gradual);
}

.bd_purple {
    border: 1px solid var(--purple);
}

.bg_pink {
    background-color: var(--pink);
}

.bg_pink_light {
    background-color: var(--pink_light);
}

.bg_pink_gradual {
    background-image: var(--pink_gradual);
}

.bd_pink {
    border: 1px solid var(--pink);
}

.bg_brown {
    background-color: var(--brown);
}

.bg_brown_light {
    background-color: var(--brown_light);
}

.bd_brown {
    border: 1px solid var(--brown);
}

.bg_grey_999 {
    background-color: var(--grey_999);
}

.bg_grey {
    background-color: var(--grey);
}

.bg_grey_light {
    background-color: var(--grey_light);
}

.bg_grey_stb {
    background-color: var(--grey_stb);
}

.bg_grey_eee {
    background-color: var(--grey_eee);
}

.bg_grey_ddd {
    background-color: var(--grey_ddd);
}

.bg_grey_f0 {
    background-color: var(--grey_f0);
}

.bg_grey_f1 {
    background-color: var(--grey_f1);
}

.bg_grey_f5 {
    background-color: var(--grey_f5);
}

.bg_grey_f9 {
    background-color: var(--grey_f9);
}

.bg_grey_fa {
    background-color: var(--grey_fa);
}

.bd_grey {
    border: 1px solid var(--grey);
}

.bg_gray {
    background-color: var(--gray);
}

.bg_gray_light {
    background-color: var(--gray_light);
}

.bg_gray_dark {
    background-color: var(--gray_dark);
}

.bg_gray_opt {
    background-color: var(--gray_opt);
}

.bd_gray {
    border: 1px solid var(--gray);
}

.bg_white {
    background-color: var(--white);
}

.bd_white {
    border: 1px solid var(--white);
}

.bg_black {
    background-color: var(--black);
}

.bd_black {
    border: 1px solid var(--black);
}

.bg_transparent_red {
    background-color: var(--transparent_red);
}

.bg_transparent_orange {
    background-color: var(--transparent_orange);
}

.bg_transparent_yellow {
    background-color: var(--transparent_yellow);
}

.bg_transparent_green {
    background-color: var(--transparent_green);
}

.bg_transparent_cyan {
    background-color: var(--transparent_cyan);
}

.bg_transparent_blue {
    background-color: var(--transparent_blue);
}

.bg_transparent_purple {
    background-color: var(--transparent_purple);
}

.bg_transparent_pink {
    background-color: var(--transparent_pink);
}

.bg_transparent_brown {
    background-color: var(--transparent_brown);
}

.bg_transparent_grey {
    background-color: var(--transparent_grey);
}

.bg_transparent_gray {
    background-color: var(--transparent_gray);
}

.bg_transparent_black {
    background-color: var(--transparent_black);
}

.bd_transparent {
    border: 1px solid var(--transparent);
}