:root {
--btw0:	#000000;
--btw1:	#313746;
--btw2:	#393939;
--btw3:	#575757;
--btw4:	#7b7b7b;
--btw5:	#999999;
--btw6:	#D9D9D9;
--btw7:	#FBF9F9;
--btw8:	#F5F5F5;
--btw9:	#FFFFFF;
--colA10:	#62B4FF;
--colA11:	#9DD0FF;
--colA12:	#5AFF6B;
--colA13:	#B0FFB8;
--colA14:	#F0962D;
--colA15:	#FFBD70;
--colA16:	#FF47CB;
--colA17:	#FFB1E9;
--colA18:	#BA63FF;
--colA19:	#DAAAFF;
--colA20:	#FF7171;
--colA21:	#FFACB1;
--colA22:	#30C9D3;
--colA23:	#6BF3FC;
--colA24:	#FFF859;
--colA25:	#FFFDCD;
--color1:	#262C3C;
--color10:	#1A942D;
--color11:	#81CBD3;
--color12:	#CFF8E4;
--color13:	#F8CFCF;
--color14:	#D288F5;
--color15:	#29324A;
--color2:	#456ED2;
--color3:	#004044;
--color4:	#0396A6;
--color5:	#00B3C7;
--color6:	#3DA3DC;
--color7:	#BEE0FF;
--color7Aalt:	#01567880;
--color8:	#FCF9DA;
--color9:	#FF1C1C;
--colorA:	#313746;
--colorB:	#343C53;
--colorBalt:	#314663;
--colorC:	#2DBBEE;
--colorD:	#067077;
--colorE:	#0396A6;
--colorEalt:	#446288A0;
--colorF:	#30C9D3;
--colorG:	#00B3C7;
--colorG2:	#FF0000;
--colorH:	#F47500;
--colorJ:	#FFF500;
--colorK:	#00FF38;
--colorM:	#CFF8E4;
--colorN:	#F8CFCF;
--colorP:	#CFF8E4;
--colorR:	#F8CFCF;
--cuegreen: #00cd78;
--colorTransparent:	#00000000;
--page-mask:	rgba(0, 0, 0, 0.8);
--prompter-wait-mask:	#000000F0;
--prompter-wait-text:	#ffffff;
/* stopcolorpool */
--bg-main: var(--colorA);
--body-bg: var(--colorA);
--body-text: var(--btw8);
--book-text-border: var(--colorD);
--bottom-hint-text: var(--btw9);
--button-active-bg: var(--color6);
--button-active-text: var(--btw8);
--button-bg: var(--color4);
--button-bg-active: var(--color11);
--button-bg-inactive: var(--color12);
--button-disabled-bg: var(--color4);
--button-disabled-text: var(--btw3);
--button-hover: var(--color6);
--button-icon: var(--color5);
--button-icon-text: var(--color5);
--button-icon-var2: var(--color6);
--button-pressed: var(--color5);
--button-shadow: var(--color3);
--button-text: var(--btw1);
--button-text-on-hover: var(--colorA);
--button-text-var2: var(--color6);
--button-urgent: var(--color14);
--card-bg: var(--color1);
--card-icon: var(--color3);
--card-shadow: var(--color3);
--card-text: var(--color2);
--checkbox-active: var(--btw8);
--checkbox-bg: var(--color2);
--checkbox-border: var(--btw5);
--clock-bg: var(--color4);
--clock-text: var(--color5);
--colorset-blue-A: #62B4FF;
--colorset-blue-A-icon: var(--btw8);
--colorset-blue-A-text: var(--btw8);
--colorset-blue-B: #9DD0FF;
--colorset-blue-B-icon: var(--btw1);
--colorset-blue-B-text: var(--btw1);
--colorset-green-A: #5AFF6B;
--colorset-green-A-icon: var(--btw3);
--colorset-green-A-text: var(--btw3);
--colorset-green-B: #B0FFB8;
--colorset-green-B-icon: var(--btw1);
--colorset-green-B-text: var(--btw1);
--colorset-grey-A: var(--btw4);
--colorset-grey-A-icon: var(--btw8);
--colorset-grey-A-text: var(--btw8);
--colorset-grey-B: var(--btw5);
--colorset-grey-B-icon: var(--btw1);
--colorset-grey-B-text: var(--btw0);
--colorset-ochre-A: #F0962D;
--colorset-ochre-A-icon: var(--btw8);
--colorset-ochre-A-text: var(--btw8);
--colorset-ochre-B: #FFBD70;
--colorset-ochre-B-icon: var(--btw1);
--colorset-ochre-B-text: var(--btw1);
--colorset-pink-A: #FF47CB;
--colorset-pink-A-icon: var(--btw8);
--colorset-pink-A-text: var(--btw8);
--colorset-pink-B: #FFB1E9;
--colorset-pink-B-icon: var(--btw1);
--colorset-pink-B-text: var(--btw1);
--colorset-purple-A: #BA63FF;
--colorset-purple-A-icon: var(--btw8);
--colorset-purple-A-text: var(--btw8);
--colorset-purple-B: #DAAAFF;
--colorset-purple-B-icon: var(--btw1);
--colorset-purple-B-text: var(--btw1);
--colorset-red-A: #FF7171;
--colorset-red-A-icon: var(--btw8);
--colorset-red-A-text: var(--btw8);
--colorset-red-B: #FFACB1;
--colorset-red-B-icon: var(--btw1);
--colorset-red-B-text: var(--btw1);
--colorset-turquoise-A: #30C9D3;
--colorset-turquoise-A-icon: var(--btw8);
--colorset-turquoise-A-text: var(--btw8);
--colorset-turquoise-B: #6BF3FC;
--colorset-turquoise-B-icon: var(--btw1);
--colorset-turquoise-B-text: var(--btw1);
--colorset-yellow-A: #FFF859;
--colorset-yellow-A-icon: var(--btw2);
--colorset-yellow-A-text: var(--btw2);
--colorset-yellow-B: #FFFDCD;
--colorset-yellow-B-icon: var(--btw1);
--colorset-yellow-B-text: var(--btw1);
--common-a-text: var(--btw7);
--cue-hover-bg: var(--color1);
--cue-hover-text: var(--btw8);
--cue-link-bg: var(--color4);
--cue-link-text: var(--btw8);
--cue-menu-bg: var(--color2);
--cue-menu-border: var(--btw1);
--cue-menu-hover-text: var(--color6);
--cue-menu-text: var(--btw8);
--cue-text: var(--btw8);
--cue-tools-hover: var(--color6);
--cue-tools-text: var(--btw6);
--dash-cm-bg: var(--colorBalt);
--dash-cm-text: var(--btw8);
--dash-cm-text-hover: var(--color6);
--dashbox-A: var(--color15);
--dashbox-A-icon: var(--btw7);
--dashbox-A-text: var(--btw7);
--dashbox-B: var(--color1);
--dashbox-B-icon: var(--btw7);
--dashbox-B-text: var(--btw7);
--depreciated-list-bg: var(--color6);
--depreciated-list-hover-bg: var(--btw3);
--depreciated-list-hover-text: var(--btw8);
--depreciated-list-text: var(--btw8);
--dialog-A: var(--colorA);
--dialog-A-icon: var(--btw3);
--dialog-A-text: var(--btw7);
--dialog-B: var(--color1);
--dialog-B-icon: var(--btw6);
--dialog-B-input: var(--colorA);
--dialog-B-input-hover: var(--color15);
--dialog-B-input-text: var(--btw9);
--dialog-B-input-text-hover: var(--btw6);
--dialog-B-text: var(--btw9);
--divider: var(--color8);
--dropdown-bg: var(--btw2);
--dropdown-bg-hover: var(--color2);
--dropdown-border: var(--btw3);
--dropdown-checked: var(--color5);
--dropdown-sidenav-bg: var(--btw2);
--dropdown-sidenav-border: var(--btw3);
--dropdown-sidenav-text: var(--btw8);
--dropdown-sidenav-text-hover: var(--color4);
--dropdown-text: var(--btw9);
--dropdown-text-hover: var(--btw9);
--edit-pencil: var(--btw5);
--edit-pencil-hover: var(--colorC);
--general-urgent: var(--color14);
--graph-activity: var(--color13);
--H1: var(--color5);
--H2: var(--color5);
--H3: var(--color5);
--H4: var(--color5);
--header-bg: var(--color3);
--icon: var(--color4);
--icon-disabled: var(--color4);
--icon-hover: var(--colorC);
--icons-active: var(--color6);
--icons-inactive: var(--color5);
--information-dot: var(--color4);
--information-i: var(--color5);
--input-bg: var(--color1);
--input-bg-active: var(--color1);
--input-field-outline: var(--btw9);
--input-text: var(--btw5);
--link: var(--color6);
--link-hover: var(--color4);
--link-klicked: var(--color5);
--logo-version-light: var(--color13);
--main-bg: var(--color1);
--menu-bg: var(--btw1);
--menu-bg-hover: var(--btw3);
--menu-text: var(--btw7);
--menu-text-hover: var(--btw8);
--middle-fallback: var(--color1);
--middle-gradient-start: inherit;
--middle-gradient-stop: inherit;
--my-projects-bg: var(--color9);
--note-bg: var(--colorTransparent);
--note-icon: var(--btw6);
--note-text: var(--btw6);
--notification-number: var(--color5);
--notification-sircle: var(--color12);
--other-projects-bg: var(--color10);
--overview-activity-little: var(--color1);
--overview-activity-massive: var(--color6);
--overview-activity-none: var(--color14);
--overview-activity-some: var(--color15);
--overview-activity-today: var(--color12);
--p: var(--color5);
--pie-chart1: var(--color2);
--pie-chart2: var(--color6);
--pie-chart3: var(--color11);
--pie-chart4: var(--color12);
--pie-chart5: var(--color3);
--pie-chart6: var(--color8);
--popup-bg: var(--btw2);
--prompter-seq-active: var(--btw8);
--scrollbar-thumb: var(--color2);
--scrollbar-track: var(--colorBalt);
--seq-active: var(--color3);
--seq-bg: var(--btw5);
--seq-bg-active: var(--btw5);
--seq-icon: var(--btw5);
--seq-icon-active: var(--btw5);
--seq-text: var(--btw5);
--seq-text-active: var(--btw5);
--sidenav-active: var(--colorE);
--sidenav-bg: var(--colorBalt);
--sidenav-hover: var(--color7Aalt);
--sidenav-icon: var(--colorE);
--sidenav-icon-hover: var(--colorE);
--sidenav-text: var(--btw5);
--swich-active: var(--color10);
--swich-inactive: var(--color5);
--switch-boarder-inner-element: var(--color10);
--switch-boarder-outer-element: var(--color12);
--switch-shadow-inner-element: var(--color13);
--switch-shadow-outer-element: var(--color14);
--tab-bg: var(--color1);
--tab-inactive: var(--colorBalt);
--tab-text: var(--btw5);
--tab-text-pressed: var(--btw9);
--table-bg-hover: var(--color4);
--table-border: var(--btw4);
--table-text: var(--btw5);
--table-text-hover: var(--color6);
--text-bg: var(--colorEalt);
--text-link-hover: var(--color6);
--text-separator: var(--btw3);
--toolbar-bg: var(--colorBalt);
--toolbar-ping-text: var(--btw9);
--toolbar-text: var(--btw5);
--unrread-dot: var(--color11);

/* 24 */
--prompter-referenced-cue-link: #456ED250;  /* --ce-active (blau) auf XX% opacity */

}
[data-theme="light"] {
--bg-main: var(--btw6);
--body-bg: var(--btw6);
--body-text: var(--btw1);
--book-text-border: var(--btw8);
--bottom-hint-text: var(--btw1);
--button-active-bg: var(--btw6);
--button-active-text: var(--btw1);
--button-bg: var(--colorM);
--button-bg-active: var(--color11);
--button-bg-inactive: var(--color12);
--button-disabled-bg: var(--color4);
--button-disabled-text: var(--btw3);
--button-hover: var(--color4);
--button-icon: var(--color5);
--button-icon-text: var(--btw1);
--button-icon-var2: var(--colorD);
--button-pressed: var(--colorD);
--button-shadow: var(--color3);
--button-text: var(--btw1);
--button-text-on-hover: var(--colorA);
--button-text-var2: var(--colorA);
--button-urgent: var(--color14);
--card-bg: var(--btw8);
--card-icon: var(--color4);
--card-shadow: var(--color3);
--card-text: var(--colorA);
--checkbox-active: var(--btw8);
--checkbox-bg: var(--btw9);
--checkbox-border: var(--btw5);
--clock-bg: var(--color7);
--clock-text: var(--color5);
--colorset-blue-A: #62B4FF;
--colorset-blue-A-icon: var(--btw1);
--colorset-blue-A-text: var(--btw1);
--colorset-blue-B: #9DD0FF;
--colorset-blue-B-icon: var(--btw1);
--colorset-blue-B-text: var(--btw1);
--colorset-green-A: #5AFF6B;
--colorset-green-A-icon: var(--btw1);
--colorset-green-A-text: var(--btw1);
--colorset-green-B: #B0FFB8;
--colorset-green-B-icon: var(--btw1);
--colorset-green-B-text: var(--btw1);
--colorset-grey-A: var(--btw4);
--colorset-grey-A-icon: var(--btw1);
--colorset-grey-A-text: var(--btw8);
--colorset-grey-B: var(--btw5);
--colorset-grey-B-icon: var(--btw1);
--colorset-grey-B-text: var(--btw1);
--colorset-ochre-A: #F0962D;
--colorset-ochre-A-icon: var(--btw1);
--colorset-ochre-A-text: var(--btw1);
--colorset-ochre-B: #FFBD70;
--colorset-ochre-B-icon: var(--btw1);
--colorset-ochre-B-text: var(--btw1);
--colorset-pink-A: #FF47CB;
--colorset-pink-A-icon: var(--btw1);
--colorset-pink-A-text: var(--btw1);
--colorset-pink-B: #FFB1E9;
--colorset-pink-B-icon: var(--btw1);
--colorset-pink-B-text: var(--btw1);
--colorset-purple-A: #BA63FF;
--colorset-purple-A-icon: var(--btw1);
--colorset-purple-A-text: var(--btw1);
--colorset-purple-B: #DAAAFF;
--colorset-purple-B-icon: var(--btw1);
--colorset-purple-B-text: var(--btw1);
--colorset-red-A: #FF7171;
--colorset-red-A-icon: var(--btw1);
--colorset-red-A-text: var(--btw1);
--colorset-red-B: #FFACB1;
--colorset-red-B-icon: var(--btw1);
--colorset-red-B-text: var(--btw1);
--colorset-turquoise-A: #30C9D3;
--colorset-turquoise-A-icon: var(--btw1);
--colorset-turquoise-A-text: var(--btw1);
--colorset-turquoise-B: #6BF3FC;
--colorset-turquoise-B-icon: var(--btw1);
--colorset-turquoise-B-text: var(--btw1);
--colorset-yellow-A: #FFF859;
--colorset-yellow-A-icon: var(--btw1);
--colorset-yellow-A-text: var(--btw1);
--colorset-yellow-B: #FFFDCD;
--colorset-yellow-B-icon: var(--btw1);
--colorset-yellow-B-text: var(--btw1);
--common-a-text: var(--colorA);
--cue-hover-bg: var(--colorA);
--cue-hover-text: var(--btw8);
--cue-link-bg: var(--color4);
--cue-link-text: var(--btw8);
--cue-menu-bg: var(--prompter-wait-text);
--cue-menu-border: var(--btw1);
--cue-menu-hover-text: var(--color6);
--cue-menu-text: var(--colorA);
--cue-text: var(--btw8);
--cue-tools-hover: var(--color4);
--cue-tools-text: var(--btw6);
--dash-cm-bg: var(--btw9);
--dash-cm-text: var(--colorA);
--dash-cm-text-hover: var(--colorD);
--dashbox-A: var(--btw8);
--dashbox-A-icon: var(--color4);
--dashbox-A-text: var(--colorA);
--dashbox-B: var(--btw9);
--dashbox-B-icon: var(--btw1);
--dashbox-B-text: var(--btw1);
--depreciated-list-bg: var(--color6);
--depreciated-list-hover-bg: var(--btw3);
--depreciated-list-hover-text: var(--btw8);
--depreciated-list-text: var(--btw8);
--dialog-A: var(--btw8);
--dialog-A-icon: var(--colorD);
--dialog-A-text: var(--colorA);
--dialog-B: var(--btw9);
--dialog-B-icon: var(--colorD);
--dialog-B-input: var(--btw6);
--dialog-B-input-hover: var(--colorM);
--dialog-B-input-text: var(--colorA);
--dialog-B-input-text-hover: var(--colorA);
--dialog-B-text: var(--colorA);
--divider: var(--color8);
--dropdown-bg: var(--btw9);
--dropdown-bg-hover: var(--color4);
--dropdown-border: var(--btw3);
--dropdown-checked: var(--color5);
--dropdown-sidenav-bg: var(--btw9);
--dropdown-sidenav-border: var(--btw8);
--dropdown-sidenav-text: var(--colorA);
--dropdown-sidenav-text-hover: var(--color4);
--dropdown-text: var(--btw5);
--dropdown-text-hover: var(--btw8);
--edit-pencil: var(--colorA);
--edit-pencil-hover: var(--color5);
--general-urgent: var(--color14);
--graph-activity: var(--color13);
--H1: var(--btw1);
--H2: var(--btw1);
--H3: var(--btw1);
--H4: var(--btw1);
--header-bg: var(--btw9);
--icon: var(--color4);
--icon-disabled: var(--color4);
--icon-hover: var(--color2);
--icons-active: var(--color6);
--icons-inactive: var(--color5);
--information-dot: var(--color4);
--information-i: var(--color5);
--input-bg: var(--color1);
--input-bg-active: var(--color1);
--input-field-outline: var(--colorA);
--input-text: var(--colorA);
--link: var(--color6);
--link-hover: var(--colorD);
--link-klicked: var(--color5);
--logo-version-light: var(--color13);
--main-bg: var(--btw9);
--menu-bg: var(--btw7);
--menu-bg-hover: var(--btw5);
--menu-text: var(--btw1);
--menu-text-hover: var(--color2);
--middle-fallback: var(--btw8);
--middle-gradient-start: var(--btw8);
--middle-gradient-stop: var(--btw5);
--my-projects-bg: var(--color9);
--note-bg: var(--colorTransparent);
--note-icon: var(--btw1);
--note-text: var(--btw1);
--notification-number: var(--color5);
--notification-sircle: var(--color12);
--other-projects-bg: var(--color10);
--overview-activity-little: var(--color11);
--overview-activity-massive: var(--color6);
--overview-activity-none: var(--color14);
--overview-activity-some: var(--color15);
--overview-activity-today: var(--color12);
--p: var(--btw1);
--pie-chart1: var(--color2);
--pie-chart2: var(--color6);
--pie-chart3: var(--color11);
--pie-chart4: var(--color12);
--pie-chart5: var(--color3);
--pie-chart6: var(--color8);
--popup-bg: var(--btw2);
--prompter-seq-active: var(--btw1);
--scrollbar-thumb: var(--btw5);
--scrollbar-track: var(--btw7);
--seq-active: var(--colorM);
--seq-bg: var(--colorG2);
--seq-bg-active: var(--btw5);
--seq-icon: var(--btw5);
--seq-icon-active: var(--btw5);
--seq-text: var(--btw5);
--seq-text-active: var(--btw5);
--sidenav-active: var(--colorE);
--sidenav-bg: var(--btw8);
--sidenav-hover: var(--color4);
--sidenav-icon: var(--colorA);
--sidenav-icon-hover: var(--color4);
--sidenav-text: var(--colorA);
--swich-active: var(--color10);
--swich-inactive: var(--color5);
--switch-boarder-inner-element: var(--color11);
--switch-boarder-outer-element: var(--color12);
--switch-shadow-inner-element: var(--color13);
--switch-shadow-outer-element: var(--color14);
--tab-bg: var(--colorA);
--tab-inactive: var(--btw9);
--tab-text: var(--colorA);
--tab-text-pressed: var(--btw9);
--table-bg-hover: var(--colorM);
--table-border: var(--colorA);
--table-text: var(--colorA);
--table-text-hover: var(--color4);
--text-bg: var(--btw8);
--text-link-hover: var(--color6);
--text-separator: var(--btw3);
--toolbar-bg: var(--btw7);
--toolbar-ping-text: var(--btw1);
--toolbar-text: var(--btw1);
--unrread-dot: var(--color11);
}
.cuebox.blue {background-color: var(--colorset-blue-A);}
.cuebox.blue span.cueTitle {color: var(--colorset-blue-A-text);}
.cuebox.blue span.cueText {color: var(--colorset-blue-B-text); background-color: var(--colorset-blue-B);}
.cuebox.blue span.cuetools {color: var(--colorset-blue-A-icon);}
.cuebox.green {background-color: var(--colorset-green-A);}
.cuebox.green span.cueTitle {color: var(--colorset-green-A-text);}
.cuebox.green span.cueText {color: var(--colorset-green-B-text); background-color: var(--colorset-green-B);}
.cuebox.green span.cuetools {color: var(--colorset-green-A-icon);}
.cuebox.grey {background-color: var(--colorset-grey-A);}
.cuebox.grey span.cueTitle {color: var(--colorset-grey-A-text);}
.cuebox.grey span.cueText {color: var(--colorset-grey-B-text); background-color: var(--colorset-grey-B);}
.cuebox.grey span.cuetools {color: var(--colorset-grey-A-icon);}
.cuebox.ochre {background-color: var(--colorset-ochre-A);}
.cuebox.ochre span.cueTitle {color: var(--colorset-ochre-A-text);}
.cuebox.ochre span.cueText {color: var(--colorset-ochre-B-text); background-color: var(--colorset-ochre-B);}
.cuebox.ochre span.cuetools {color: var(--colorset-ochre-A-icon);}
.cuebox.pink {background-color: var(--colorset-pink-A);}
.cuebox.pink span.cueTitle {color: var(--colorset-pink-A-text);}
.cuebox.pink span.cueText {color: var(--colorset-pink-B-text); background-color: var(--colorset-pink-B);}
.cuebox.pink span.cuetools {color: var(--colorset-pink-A-icon);}
.cuebox.purple {background-color: var(--colorset-purple-A);}
.cuebox.purple span.cueTitle {color: var(--colorset-purple-A-text);}
.cuebox.purple span.cueText {color: var(--colorset-purple-B-text); background-color: var(--colorset-purple-B);}
.cuebox.purple span.cuetools {color: var(--colorset-purple-A-icon);}
.cuebox.red {background-color: var(--colorset-red-A);}
.cuebox.red span.cueTitle {color: var(--colorset-red-A-text);}
.cuebox.red span.cueText {color: var(--colorset-red-B-text); background-color: var(--colorset-red-B);}
.cuebox.red span.cuetools {color: var(--colorset-red-A-icon);}
.cuebox.turquoise {background-color: var(--colorset-turquoise-A);}
.cuebox.turquoise span.cueTitle {color: var(--colorset-turquoise-A-text);}
.cuebox.turquoise span.cueText {color: var(--colorset-turquoise-B-text); background-color: var(--colorset-turquoise-B);}
.cuebox.turquoise span.cuetools {color: var(--colorset-turquoise-A-icon);}
.cuebox.yellow {background-color: var(--colorset-yellow-A);}
.cuebox.yellow span.cueTitle {color: var(--colorset-yellow-A-text);}
.cuebox.yellow span.cueText {color: var(--colorset-yellow-B-text); background-color: var(--colorset-yellow-B);}
.cuebox.yellow span.cuetools {color: var(--colorset-yellow-A-icon);}
.box.blue {background-color: var(--colorset-blue-A);}
.box.blue span:first-child {color: var(--colorset-blue-A-text);}
.box.blue span:nth-child(2) {color: var(--colorset-blue-B-text); background-color: var(--colorset-blue-B);}
.box.blue span:nth-child(3) {color: var(--colorset-blue-A-icon);}
.box.blue span:nth-child(4) {color: #000;}
.cs_blue {color: var(--colorset-blue-B) !important; } 
.csa_blue {color: var(--colorset-blue-A) !important; } 
.box.green {background-color: var(--colorset-green-A);}
.box.green span:first-child {color: var(--colorset-green-A-text);}
.box.green span:nth-child(2) {color: var(--colorset-green-B-text); background-color: var(--colorset-green-B);}
.box.green span:nth-child(3) {color: var(--colorset-green-A-icon);}
.box.green span:nth-child(4) {color: #000;}
.cs_green {color: var(--colorset-green-B) !important; } 
.csa_green {color: var(--colorset-green-A) !important; } 
.box.grey {background-color: var(--colorset-grey-A);}
.box.grey span:first-child {color: var(--colorset-grey-A-text);}
.box.grey span:nth-child(2) {color: var(--colorset-grey-B-text); background-color: var(--colorset-grey-B);}
.box.grey span:nth-child(3) {color: var(--colorset-grey-A-icon);}
.box.grey span:nth-child(4) {color: #000;}
.cs_grey {color: var(--colorset-grey-B) !important; } 
.csa_grey {color: var(--colorset-grey-A) !important; } 
.box.ochre {background-color: var(--colorset-ochre-A);}
.box.ochre span:first-child {color: var(--colorset-ochre-A-text);}
.box.ochre span:nth-child(2) {color: var(--colorset-ochre-B-text); background-color: var(--colorset-ochre-B);}
.box.ochre span:nth-child(3) {color: var(--colorset-ochre-A-icon);}
.box.ochre span:nth-child(4) {color: #000;}
.cs_ochre {color: var(--colorset-ochre-B) !important; } 
.csa_ochre {color: var(--colorset-ochre-A) !important; } 
.box.pink {background-color: var(--colorset-pink-A);}
.box.pink span:first-child {color: var(--colorset-pink-A-text);}
.box.pink span:nth-child(2) {color: var(--colorset-pink-B-text); background-color: var(--colorset-pink-B);}
.box.pink span:nth-child(3) {color: var(--colorset-pink-A-icon);}
.box.pink span:nth-child(4) {color: #000;}
.cs_pink {color: var(--colorset-pink-B) !important; } 
.csa_pink {color: var(--colorset-pink-A) !important; } 
.box.purple {background-color: var(--colorset-purple-A);}
.box.purple span:first-child {color: var(--colorset-purple-A-text);}
.box.purple span:nth-child(2) {color: var(--colorset-purple-B-text); background-color: var(--colorset-purple-B);}
.box.purple span:nth-child(3) {color: var(--colorset-purple-A-icon);}
.box.purple span:nth-child(4) {color: #000;}
.cs_purple {color: var(--colorset-purple-B) !important; } 
.csa_purple {color: var(--colorset-purple-A) !important; } 
.box.red {background-color: var(--colorset-red-A);}
.box.red span:first-child {color: var(--colorset-red-A-text);}
.box.red span:nth-child(2) {color: var(--colorset-red-B-text); background-color: var(--colorset-red-B);}
.box.red span:nth-child(3) {color: var(--colorset-red-A-icon);}
.box.red span:nth-child(4) {color: #000;}
.cs_red {color: var(--colorset-red-B) !important; } 
.csa_red {color: var(--colorset-red-A) !important; } 
.box.turquoise {background-color: var(--colorset-turquoise-A);}
.box.turquoise span:first-child {color: var(--colorset-turquoise-A-text);}
.box.turquoise span:nth-child(2) {color: var(--colorset-turquoise-B-text); background-color: var(--colorset-turquoise-B);}
.box.turquoise span:nth-child(3) {color: var(--colorset-turquoise-A-icon);}
.box.turquoise span:nth-child(4) {color: #000;}
.cs_turquoise {color: var(--colorset-turquoise-B) !important; } 
.csa_turquoise {color: var(--colorset-turquoise-A) !important; } 
.box.yellow {background-color: var(--colorset-yellow-A);}
.box.yellow span:first-child {color: var(--colorset-yellow-A-text);}
.box.yellow span:nth-child(2) {color: var(--colorset-yellow-B-text); background-color: var(--colorset-yellow-B);}
.box.yellow span:nth-child(3) {color: var(--colorset-yellow-A-icon);}
.box.yellow span:nth-child(4) {color: #000;}
.cs_yellow {color: var(--colorset-yellow-B) !important; } 
.csa_yellow {color: var(--colorset-yellow-A) !important; } 

/* translation containers */
.box.lang {background-color: rgba(255,255,255,0.1);}
.box.lang span:nth-child(4) {color: #000;}