/* x-res compressed:
	- /public/res/style/scheme.css
	- /public/res/style/scheme-custom.css
	- /public/res/style/base.css
	- /public/res/style/base-custom.css
	- /public/res/style/z6n-icons.css
	- /public/res/style/z6n-icons-custom.css
	- /public/res/style/tray.css
	- /public/res/style/tray-custom.css
	- /public/res/style/context.css
	- /public/res/style/context-custom.css
	- /public/res/style/generic.css
	- /public/res/style/generic-custom.css
	- /public/res/style/elems.css
	- /public/res/style/elems-custom.css
	- /public/res/style/poweredby.css
	- /public/res/style/poweredby-custom.css
	- /public/res/style/user.css
	- /public/res/style/user-custom.css
	- /public/res/style/two.css
	- /public/res/style/two-custom.css
	- /public/res/style/navbar.css
	- /public/res/style/navbar-custom.css
	- /public/res/style/style.css
*/

/* '/public/res/style/scheme.css' -> 200 */
/* Copyright (C) 2024 - Sven Björn Ziehmann, DE-76137 Karlsruhe*/
:root {
	
	/* CI default variables, overwrite needed in base-custom.css */

	/* CI Colors*/ 
	--c_1: #ff6b00; /* main color with contrast to fg and bg (e.g. */ 
	--c_2: #ffd4b5; /* light version of c 1, contrast to fg */
	--c_3: #477f66; /* second color with contrast to fg and bg */
	--c_4: #c1e0d2; /* light version of c 3, contrast to fg */
	--c_5: #1d4163; /* third color with contrast to bg */
	--c_6: #8bbbe8; /* light version of c 5, contrast to fg */
	--c_7: #1d4163; /* fourth color with contrast to bg primaty used for clickable text */
	--c_8: #2f587e; /* light version of c 7, still contrast to bg (eg.active link)*/
	--c_9: #41416f; /* fifth color with contrast to fg and bg */
	--c_10: #9494c2; /* light version of c9, contrast to fg */

	/* CI Filter  (https://isotropic.co/tool/hex-color-to-css-filter/)*/
/*	--c1-filter: invert(44%) sepia(93%) saturate(2621%) hue-rotate(2deg) brightness(106%) contrast(103%);*/
	--c1-filter:  invert(24%) sepia(5%) saturate(5555%) hue-rotate(202deg) brightness(94%) contrast(84%);

	/*Signal Colors*/
	--c_b-neg: #ffe0e0; /* bg to indicate negative */
	--c_b-pos: #e2ffe0; /* bg to indicate positive */
	--c_b-sig: #fff2ca; /* bg to provide emphasis  */
	
	--c_f-neg: #800000; /* fg to indicate negative */
	--c_f-pos: #2B5E59; /* fg to indicate positive */
	--c_f-sig: #2B5E59; /* fg to provide emphasis  */

	/*BG Colors*/
	--c_b1: #ffffff; /* perfectly readable contrast to fg */
	--c_b2: #f3f3f3; /* good readable contrast to fg */
	--c_b3: #dddddd; /* good readable contrast to fg */
	--c_b4: #cccccc; /* readable contrast to fg */
	
	/*FG Colors*/
	--c_f1: #000000; /* perfectly readable contrast to bg */
	--c_f2: #333333; /* good readable contrast to bg */
	--c_f3: #666666; /* readable contrast to bg */
	--c_f4: #999999; /* readable contrast to bg */

}

@media ( prefers-color-scheme : dark) {
:root {
	--c_1: #ff6b00;
	--c_2: #b96427;
	--c_3: #477f66;
	--c_4: #496458;
	--c_5: #8bbbe8;
	--c_6: #1d4163;
	--c_7: #2f587e;
	--c_8: #1d4163;
	--c_9: #9494c2;
	--c_10: #41416f;
	--c_f-neg: #ff5a5a;
	--c_f-pos: #e2ffe0;
	--c_f-sig: #FeF78C;
	--c_b-neg: #BF4040;
	--c_b-pos: #2B5E59;
	--c_b-sig: #2B5E59;
	--c_f1: #eee;
	--c_f2: #ddd;
	--c_f3: #ccc;
	--c_f4: #aaa;
	--c_b1: #333;
	--c_b2: #444;
	--c_b3: #666;
	--c_b4: #999;
	--c1-filter: invert(0%) sepia(100%) saturate(36%) hue-rotate(225deg)
		brightness(107%) contrast(101%);
}
}

[data-scheme="dark"] {
	--c_1: #ff6b00;
	--c_2: #b96427;
	--c_3: #477f66;
	--c_4: #496458;
	--c_5: #8bbbe8;
	--c_6: #1d4163;
	--c_7: #2f587e;
	--c_8: #1d4163;
	--c_9: #9494c2;
	--c_10: #41416f;
	--c_f-neg: #ff5a5a;
	--c_f-pos: #e2ffe0;
	--c_f-sig: #FeF78C;
	--c_b-neg: #BF4040;
	--c_b-pos: #2B5E59;
	--c_b-sig: #2B5E59;
	--c_f1: #eee;
	--c_f2: #ddd;
	--c_f3: #ccc;
	--c_f4: #aaa;
	--c_b1: #333;
	--c_b2: #444;
	--c_b3: #666;
	--c_b4: #999;
	--c1-filter: invert(0%) sepia(100%) saturate(36%) hue-rotate(225deg)
		brightness(107%) contrast(101%);
}

[data-scheme="light"] {
	--c_1: #ff6b00;
	--c_2: #ffd4b5;
	--c_3: #477f66;
	--c_4: #c1e0d2;
	--c_5: #1d4163;
	--c_6: #8bbbe8;
	--c_7: #1d4163;
	--c_8: #2f587e;
	--c_9: #41416f;
	--c_10: #9494c2;
	--c_b-neg: #ffe0e0;
	--c_b-pos: #e2ffe0;
	--c_b-sig: #fff2ca;
	--c_f-neg: #800000;
	--c_f-pos: #2B5E59;
	--c_f-sig: #2B5E59;
	--c_b1: #ffffff;
	--c_b2: #f3f3f3;
	--c_b3: #dddddd;
	--c_b4: #cccccc;
	--c_f1: #000000;
	--c_f2: #333333;
	--c_f3: #666666;
	--c_f4: #999999;
	--c1-filter: invert(24%) sepia(5%) saturate(5555%) hue-rotate(202deg)
		brightness(94%) contrast(84%);
}


[data-scheme="clown"] {
	--c_1: #ff6b00;
	--c_2: #b96427;
	--c_3: #c01c28;
	--c_4: #ed333b;
	--c_5: #41416f;
	--c_6: #3d3d57;
	--c_7: #98cdff;
	--c_8: #75bcff;
	--c_f-neg: #ff5a5a;
	--c_f-pos: #e2ffe0;
	--c_f-sig: #FeF78C;
	--c_b-neg: #BF4040;
	--c_b-pos: #2B5E59;
	--c_b-sig: #2B5E59;
	--c_f1: #f9f06b;
	--c_f2: #f8e45c;
	--c_f3: #f5c211;
	--c_f4: #e5a50a;
	--c_b1: #061d3f;
	--c_b2: #3b2496;
	--c_b3: #1c71d8;
	--c_b4: #3584e4;
	--c1-filter: invert(0%) sepia(100%) saturate(36%) hue-rotate(225deg)
		brightness(107%) contrast(101%);
		
	*,*::before,*::after{
		font-family: "z003";
	}
}

[data-scheme="hicontrast-light"] {
	--c_1: #ff6b00;
	--c_2: #ffd4b5;
	--c_3: #477f66;
	--c_4: #c1e0d2;
	--c_5: #1d4163;
	--c_6: #8bbbe8;
	--c_7: #1d4163;
	--c_8: #2f587e;
	--c_9: #41416f;
	--c_10: #9494c2;
	--c_b-neg: #ffe0e0;
	--c_b-pos: #e2ffe0;
	--c_b-sig: #fff2ca;
	--c_f-neg: #800000;
	--c_f-pos: #2B5E59;
	--c_f-sig: #2B5E59;
	--c_b1: #ffffff;
	--c_b2: #ffffff;
	--c_b3: #ffffff;
	--c_b4: #ffffff;
	--c_f1: #000000;
	--c_f2: #000000;
	--c_f3: #000000;
	--c_f4: #000000;
	--c1-filter: invert(24%) sepia(5%) saturate(5555%) hue-rotate(202deg)
		brightness(94%) contrast(84%);
}

[data-scheme="hicontrast-dark"] {
	--c_1: #ff6b00;
	--c_2: #b96427;
	--c_3: #477f66;
	--c_4: #496458;
	--c_5: #8bbbe8;
	--c_6: #1d4163;
	--c_7: #2f587e;
	--c_8: #1d4163;
	--c_9: #9494c2;
	--c_10: #41416f;
	--c_f-neg: #ff5a5a;
	--c_f-pos: #e2ffe0;
	--c_f-sig: #FeF78C;
	--c_b-neg: #BF4040;
	--c_b-pos: #2B5E59;
	--c_b-sig: #2B5E59;
	--c_f1: #fff;
	--c_f2: #fff;
	--c_f3: #fff;
	--c_f4: #fff;
	--c_b1: #000;
	--c_b2: #000;
	--c_b3: #000;
	--c_b4: #000;
	--c1-filter: invert(100%) sepia(100%) saturate(36%) hue-rotate(225deg)
		brightness(100%) contrast(100%);
}

.scheme-picker{
	padding: 0px 10px;
	display: inline-block;
	height: 100%;
}


/* '/public/res/style/scheme-custom.css' -> 404 */

/* '/public/res/style/base.css' -> 200 */
/* Copyright (C) 2024 - Sven Björn Ziehmann, DE-76137 Karlsruhe*/

/* Fonts : personalize fonts by replacing the .woff data in the runtime with the required font */
@font-face {
	font-family: "regular";
	src: url('/public/res/font/regular.woff');
}

@font-face {
	font-family: "monospace";
	src: url('/public/res/font/monospace.woff');
}


:root {

	/* Radius */
	--r_input: 4px;
	--r_button: 4px;
	--r_select: 4px;
	--r_pre: 4px;

	/*Padding*/
	--p_input-v: 6px;
	--p_input-h: 3px;
	
	--p_button: 10px;
	--p_select-v: 8px;
	--p_select-h: 4px;
	
	--p_details: 5px;
	--p_td: 2px;
	--p_th: 2px;
	--pr_td: 1em;
	--pr_th: 1em;
	
	--ptb_blockquote: 10px;
	--plr_blockquote: 20px;
	
	
	/*Margin*/
	--m_button: 3px;
	
	--mtb_blockquote: 10px;
	--mlr_blockquote: 20px;

	/*Margin Left*/
	--ml_list: 1em; /*list indent*/

	/*Height*/
	
	--h_line: 1.5;
	--h_button: 12px;

	/*Border*/
	--b_button: 0;
	--b_input: 2px;
	
	--b_blockquote: 5px;

	/*Color */

	--c_b-body: var(--c_b2);
	--c_f-body: var(--c_f2);

	--c_b-invalid: var(--c_b-neg);




	--c_b-input-focus-top: var(--c_1);
	--c_b-input-focus-left: var(--c_1);
	--c_b-input-focus-right: var(--c_2);
	--c_b-input-focus-bottom: var(--c_2);

	--c_b-input-top: var(--c_f4);
	--c_b-input-left: var(--c_f4);
	--c_b-input-right: var(--c_b3);
	--c_b-input-bottom: var(--c_b3);

	--c_b-filedrop: var(--c_b3);

	--c_b-checkbox: var(--c_1);

	--c_b-button: var(--c_1);
	--c_f-button: var(--c_b1);
	--c_f-button-stroke: var(--c_f-button);

	--c_b-button-top: var(--c_b3);
	--c_b-button-left: var(--c_b3);
	--c_b-button-right: var(--c_f4);
	--c_b-button-bottom: var(--c_f4);
	

	--c_b-select: var(--c_6);
	--c_f-select: var(--c_f1);

	--c_b-th: var(--c_3);
	--c_f-th: var(--c_b1);

	--c_accent: var(--c_6);
	--c_b-hover: var(--c_2);

	--c_sum-marker: var(--c_5);

	--c_figcaption: var(--c_5);

	--c_hr: var( --c_f4 );
	
	--c_list-marker: var(--c_3);
	
	--c_b-tablerow-1: var(--c_b1);
	--c_b-tablerow-2: var(--c_b2);
	
	--c_blockquote-marker: var(--c_5);
	--c_b-blockquote: var(--c_b2);
	
	--c_b-pre: var(--c_b2);
	--c_b-selected: var( --c_6 );
	
}

/* General styles */

*,
*::before,
*::after {
	font-family: 'regular';
	text-decoration: none;
	margin: 0;
	padding: 0;
	scrollbar-gutter: auto;
} 

*::selection {
  background-color: var( --c_4 );
}

input::placeholder{
  color: var( --c_f4 );
  font-size: 0.8em;
  opacity: 1; /* Firefox */
}

::-ms-input-placeholder { /* Edge 12 -18 */
  color: var( --c_f4 );
    font-size: 0.8em;
  
}


input{
	background-color: var(--c_b1);
	color: var( --c_f1 );
	border: 1px solid var(--c_b4);
}

/*Links*/

a {
	color: var(--c_f-link);
}

a:hover {
	color: var(--c_f-link-hover);
	cursor: pointer;
}

/*Body*/

body,html {
	background-color: var(--c_b-body);
	color: var(--c_f-body);
	line-height: var(--h_line);
	height: 100%;
	width: 100%;
	position: absolute;
	z-index: -100;
}


/*Inputs*/

input,
textarea {
	padding: var(--p_input-v) var(--p_input-h);
	border-radius: var(--r_input);

	border-top: var(--b_input) solid var(--c_b-input-top);
	border-left: var(--b_input) solid var(--c_b-input-left);
	border-right: var(--b_input) solid var(--c_b-input-right);
	border-bottom: var(--b_input) solid var(--c_b-input-bottom);
	box-sizing: border-box;
}

input :invalid {
	background-color: var(--c_b-invalid);
}

input:focus,
textarea:focus {
	outline: none !important;
	border-top: var(--b_input) solid var(--c_b-input-focus-top);
	border-left: var(--b_input) solid var(--c_b-input-focus-left);
	border-right: var(--b_input) solid var(--c_b-input-focus-right);
	border-bottom: var(--b_input) solid var(--c_b-input-focus-bottom);
}

input[type='radio'],
input[type='checkbox'],
input[type='range'] {
	accent-color: var(--c_accent);
}

input[type='file'] {
	background-color: var(--c_b-filedrop);
	padding: 1em;
}


/*Buttons*/

button,
input[type="submit"],
input::file-selector-button {
	display: inline;
	border-bottom: var(--b_button) solid var(--c_b-button-bottom);
	border-right: var(--b_button) solid var(--c_b-button-right);
	border-left: var(--b_button) solid var(--c_b-button-left);
	border-top: var(--b_button) solid var(--c_b-button-top);

	cursor: pointer;
	padding: var(--p_button);

	background-color: var(--c_b-button);
	color: var(--c_f-button);


	border-radius: var(--r_button);
	margin: var(--m_button);

	font-weight: bold;
}


button:hover,
input[type="submit"]:hover {
	background-image: linear-gradient(rgb(0 0 0/10%) 0 0);
}

button:active,
input[type="submit"]:active {
	background-image: linear-gradient(rgb(0 0 0/20%) 0 0);
}

button:disabled,
input[type="submit"]:disabled {
	opacity: 0.5;
	pointer-events: none;
	cursor: not-allowed;
	border: none;
}


button>* {
	height: var(--h_button);
}

button svg{	
	stroke: var(--c_f-button-stroke);
}

/*Lists*/

ul,
ol {
	list-style: none;
	
}

ul {
	margin-left: var(--ml_list);
	text-align: left;
}

ol {
	counter-reset: item;
	margin-left: var(--ml_list);
	text-align: left;
}

li {
	padding: 0 2px;
}

ol>li {
	counter-increment: item;
}

ol>li:before {
	content: counters(item, ".") ". ";
	color: var(--c_list-marker);
	margin-right: 2px;
	font-weight: bold;
}

li ol>li {
	margin-left: var(--ml_list);
}

li ol>li:before {
	content: counters(item, ".") " ";

}

ul li:before {
	content: "";
	border-left: 4px solid var(--c_list-marker);
	margin-right: 5px;
}


/*Images*/

img {
	vertical-align: middle;
}

/*Tables*/

table {
	/*border-collapse: collapse;*/
	table-layout: auto;
	position: relative;
	text-align: left;
}

thead{
	position: inherit;
	z-index: 1;
}

thead tr {
	position: sticky;
	box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.3);
	top: 0;
	background-color: var(--c_b-th);
}


thead th {
	z-index: 2;
	/*background-color: var(--c_b-th);*/
	color: var(--c_f-th);
}

th {
	padding: var(--p_th);
}

tr {
	background-color: var(--c_b-tablerow-1);
}


td {
	padding: var(--p_td);
}


tr:nth-of-type(2n) {
	background-color: var(--c_b-tablerow-2);
}

/*Select*/

select,refselect {
	background-color: var(--c_b-select);
	padding: var(--p_select-v) var(--p_select-h);
	border-radius: var(--r_select);
	box-sizing: border-box;	
	border: none;
	color: var(--c_f-select);
}

refselect {
	/*min-height: 20px; */
	display: inline-block;
}

/*Blockquote*/

blockquote {
	padding: var( --ptb_blockquote ) var( --plr_blockquote );
	margin: var( --mtb_blockquote ) var( --mlr_blockquote );
	background-color: var(--c_b-blockquote);
	border-left: var( --b_blockquote ) solid var(--c_blockquote-marker);
	border-right: var( --b_blockquote ) solid var(--c_blockquote-marker);
}

/*Code, Pre and Sample*/

code,
pre {
	font-family: "monospace";
	background-color: var(--c_b-pre);
	border-radius: var(--r_pre);
	display: inline-block;
	font-family: monospace;
	vertical-align: top;
	white-space: pre-wrap;
}

samp {
	font-family: "monospace";
}


/*Caption*/

figcaption {
	color: var(--c_figcaption);
	font-style: italic;
}

/*Horizontal line*/

hr {
	border: none;
	border-top: 2px solid var(--c_hr);
	height:0;
}


/*Details and Summary*/

details{
	padding: var(--p_details);
	display:inline;
}

summary {
	cursor: pointer;
}

summary::marker {
	color: var(--c_sum-marker);
}


/*Progress*/

progress {
	accent-color: var(--c_accent);
}

.hoverable:hover{
	background-color: var(--c_b-hover);
}

.clickable:hover{
	cursor: pointer;
}

.selected {
	background-color:var( --c_b-selected ) !important;
}

.selected:hover {
	background-color:var( --c_b-hover ) !important;
}

/* '/public/res/style/base-custom.css' -> 404 */

/* '/public/res/style/z6n-icons.css' -> 200 */
@font-face {
	font-family: "z6n-icons";
	src: url('/public/res/font/z6n-icons.woff');
}
	*[class^="zi-"]:before, *[class*="zi-"]:before {
	font-family: z6n-icons !important;
	font-style: normal;
	font-weight: normal !important;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.zi-refresh-double:before{content: "\e000";}
.zi-images-user:before{content: "\e001";}
.zi-file-medical:before{content: "\e002";}
.zi-users-class:before{content: "\e003";}
.zi-wifi-secure:before{content: "\e004";}
.zi-user-robot-xmarks:before{content: "\e005";}
.zi-rocket-lunch:before{content: "\e006";}
.zi-search-analyse:before{content: "\e007";}
.zi-angle-down-m:before{content: "\e008";}
.zi-print:before{content: "\e009";}
.zi-calendar-plus:before{content: "\e00a";}
.zi-users-alt:before{content: "\e00b";}
.zi-arrow-cw:before{content: "\e00c";}
.zi-rows-x:before{content: "\e00d";}
.zi-password:before{content: "\e00e";}
.zi-arrow-cc:before{content: "\e00f";}
.zi-scannerinnp:before{content: "\e010";}
.zi-basket-shopping-simple:before{content: "\e011";}
.zi-images:before{content: "\e012";}
.zi-signature-slash:before{content: "\e013";}
.zi-z6n-flower:before{content: "\e014";}
.zi-share:before{content: "\e015";}
.zi-claw-marks:before{content: "\e016";}
.zi-interaction-upload:before{content: "\e017";}
.zi-signature-lock:before{content: "\e018";}
.zi-angle-right:before{content: "\e019";}
.zi-z6n-tsc2:before{content: "\e01a";}
.zi-plane-alt:before{content: "\e01b";}
.zi-arrow-up-left:before{content: "\e01c";}
.zi-z6n-omk:before{content: "\e01d";}
.zi-camera-movie:before{content: "\e01e";}
.zi-massage:before{content: "\e01f";}
.zi-text-justify:before{content: "\e020";}
.zi-meteor:before{content: "\e021";}
.zi-calendar-lines-pen:before{content: "\e022";}
.zi-angle-up-s:before{content: "\e023";}
.zi-file-audio:before{content: "\e024";}
.zi-users:before{content: "\e025";}
.zi-bin:before{content: "\e026";}
.zi-heart:before{content: "\e027";}
.zi-text-left:before{content: "\e028";}
.zi-calendar-salary:before{content: "\e029";}
.zi-file-medical-alt:before{content: "\e02a";}
.zi-chess:before{content: "\e02b";}
.zi-marker:before{content: "\e02c";}
.zi-info:before{content: "\e02d";}
.zi-z6n:before{content: "\e02e";}
.zi-angle-left:before{content: "\e02f";}
.zi-nfc:before{content: "\e030";}
.zi-interaction-delete:before{content: "\e031";}
.zi-replace:before{content: "\e032";}
.zi-translate:before{content: "\e033";}
.zi-bandage-wound:before{content: "\e034";}
.zi-calendars:before{content: "\e035";}
.zi-robot:before{content: "\e036";}
.zi-sub:before{content: "\e037";}
.zi-calendar-week:before{content: "\e038";}
.zi-lemon:before{content: "\e039";}
.zi-ufo:before{content: "\e03a";}
.zi-filter-list:before{content: "\e03b";}
.zi-vector:before{content: "\e03c";}
.zi-fine-lock:before{content: "\e03d";}
.zi-angle-down:before{content: "\e03e";}
.zi-zoom-in:before{content: "\e03f";}
.zi-sun:before{content: "\e040";}
.zi-background:before{content: "\e041";}
.zi-point-of-sale:before{content: "\e042";}
.zi-turtle:before{content: "\e043";}
.zi-mug-hot:before{content: "\e044";}
.zi-sliders-v:before{content: "\e045";}
.zi-chart-histogram:before{content: "\e046";}
.zi-interaction-edit:before{content: "\e047";}
.zi-t-rex:before{content: "\e048";}
.zi-balloon:before{content: "\e049";}
.zi-list-check:before{content: "\e04a";}
.zi-phone:before{content: "\e04b";}
.zi-cross:before{content: "\e04c";}
.zi-chart-line-up:before{content: "\e04d";}
.zi-bag-shopping-minus:before{content: "\e04e";}
.zi-id-card-clip-alt:before{content: "\e04f";}
.zi-angle-up:before{content: "\e050";}
.zi-filterbar:before{content: "\e051";}
.zi-bacterium:before{content: "\e052";}
.zi-mime-7z:before{content: "\e053";}
.zi-paper-plane:before{content: "\e054";}
.zi-trash:before{content: "\e055";}
.zi-mp3-player:before{content: "\e056";}
.zi-mime-zip:before{content: "\e057";}
.zi-at:before{content: "\e058";}
.zi-signature:before{content: "\e059";}
.zi-filter:before{content: "\e05a";}
.zi-file-image:before{content: "\e05b";}
.zi-music-alt:before{content: "\e05c";}
.zi-users-medical:before{content: "\e05d";}
.zi-brightness:before{content: "\e05e";}
.zi-camera:before{content: "\e05f";}
.zi-phone2:before{content: "\e060";}
.zi-scissors:before{content: "\e061";}
.zi-battery-half:before{content: "\e062";}
.zi-pdf:before{content: "\e063";}
.zi-see:before{content: "\e064";}
.zi-battery-slash:before{content: "\e065";}
.zi-barcode:before{content: "\e066";}
.zi-newfolder:before{content: "\e067";}
.zi-scannerduplex:before{content: "\e068";}
.zi-display-arrow-down:before{content: "\e069";}
.zi-search:before{content: "\e06a";}
.zi-plus:before{content: "\e06b";}
.zi-battery-empty:before{content: "\e06c";}
.zi-angle-up-m:before{content: "\e06d";}
.zi-headphones:before{content: "\e06e";}
.zi-industry-alt:before{content: "\e06f";}
.zi-badge-sheriff:before{content: "\e070";}
.zi-microchip-ai:before{content: "\e071";}
.zi-new:before{content: "\e072";}
.zi-refresh:before{content: "\e073";}
.zi-beer:before{content: "\e074";}
.zi-coffee-beans:before{content: "\e075";}
.zi-angle-left-s:before{content: "\e076";}
.zi-calendar-image:before{content: "\e077";}
.zi-minus-hexagon:before{content: "\e078";}
.zi-trash-plus:before{content: "\e079";}
.zi-text-right:before{content: "\e07a";}
.zi-resources:before{content: "\e07b";}
.zi-sliders-h-square:before{content: "\e07c";}
.zi-help:before{content: "\e07d";}
.zi-password-smartphone:before{content: "\e07e";}
.zi-smartphone:before{content: "\e07f";}
.zi-sliders-v-square:before{content: "\e080";}
.zi-croissant:before{content: "\e081";}
.zi-script:before{content: "\e082";}
.zi-layout-fluid:before{content: "\e083";}
.zi-paperclip-vertical:before{content: "\e084";}
.zi-scanner:before{content: "\e085";}
.zi-diamond:before{content: "\e086";}
.zi-calendar-lines:before{content: "\e087";}
.zi-master-plan:before{content: "\e088";}
.zi-speech-text:before{content: "\e089";}
.zi-text-box-edit:before{content: "\e08a";}
.zi-carrot:before{content: "\e08b";}
.zi-wifi-error:before{content: "\e08c";}
.zi-ballot-check:before{content: "\e08d";}
.zi-file-spreadsheet:before{content: "\e08e";}
.zi-wifi-connected:before{content: "\e08f";}
.zi-calendar-event-tax:before{content: "\e090";}
.zi-user-robot:before{content: "\e091";}
.zi-region-pin-alt:before{content: "\e092";}
.zi-shopping-basket:before{content: "\e093";}
.zi-ban:before{content: "\e094";}
.zi-fox:before{content: "\e095";}
.zi-archive:before{content: "\e096";}
.zi-calendar-swap:before{content: "\e097";}
.zi-profile:before{content: "\e098";}
.zi-interaction-download:before{content: "\e099";}
.zi-calendar-star:before{content: "\e09a";}
.zi-file-csv:before{content: "\e09b";}
.zi-house-blank:before{content: "\e09c";}
.zi-image-slash:before{content: "\e09d";}
.zi-wifi-disconnected:before{content: "\e09e";}
.zi-call-incoming:before{content: "\e09f";}
.zi-preview:before{content: "\e0a0";}
.zi-octagon-xmark:before{content: "\e0a1";}
.zi-arrow-left-up:before{content: "\e0a2";}
.zi-false:before{content: "\e0a3";}
.zi-battery-quarter:before{content: "\e0a4";}
.zi-banana:before{content: "\e0a5";}
.zi-clapper-open:before{content: "\e0a6";}
.zi-filterbar-empty:before{content: "\e0a7";}
.zi-angle-right-m:before{content: "\e0a8";}
.zi-bookmark:before{content: "\e0a9";}
.zi-octagon-exclamation:before{content: "\e0aa";}
.zi-hexagon-check:before{content: "\e0ab";}
.zi-physics:before{content: "\e0ac";}
.zi-calendar-shift-swap:before{content: "\e0ad";}
.zi-candy-alt:before{content: "\e0ae";}
.zi-battery-exclamation:before{content: "\e0af";}
.zi-smile:before{content: "\e0b0";}
.zi-indent:before{content: "\e0b1";}
.zi-true:before{content: "\e0b2";}
.zi-circle-full:before{content: "\e0b3";}
.zi-list:before{content: "\e0b4";}
.zi-cross-religion:before{content: "\e0b5";}
.zi-z6n-wuza:before{content: "\e0b6";}
.zi-scroll:before{content: "\e0b7";}
.zi-duplicate:before{content: "\e0b8";}
.zi-pointer-text:before{content: "\e0b9";}
.zi-lock:before{content: "\e0ba";}
.zi-engine:before{content: "\e0bb";}
.zi-wiki:before{content: "\e0bc";}
.zi-scannerduplexnp:before{content: "\e0bd";}
.zi-calendar-heart:before{content: "\e0be";}
.zi-text-align-broken:before{content: "\e0bf";}
.zi-clapperboard-play:before{content: "\e0c0";}
.zi-calendar-payment-loan:before{content: "\e0c1";}
.zi-navigate:before{content: "\e0c2";}
.zi-clip:before{content: "\e0c3";}
.zi-text-center:before{content: "\e0c4";}
.zi-id-badge:before{content: "\e0c5";}
.zi-fee-receipt:before{content: "\e0c6";}
.zi-film:before{content: "\e0c7";}
.zi-file-zip:before{content: "\e0c8";}
.zi-bluetooth-alt:before{content: "\e0c9";}
.zi-vector-alt:before{content: "\e0ca";}
.zi-ballot:before{content: "\e0cb";}
.zi-square-rounded:before{content: "\e0cc";}
.zi-newfile:before{content: "\e0cd";}
.zi-save:before{content: "\e0ce";}
.zi-z6n-tsc:before{content: "\e0cf";}
.zi-arrow-up-right-from-square:before{content: "\e0d0";}
.zi-z6n-two:before{content: "\e0d1";}
.zi-discover:before{content: "\e0d2";}
.zi-file-download:before{content: "\e0d3";}
.zi-battery-three-quarters:before{content: "\e0d4";}
.zi-citrus-slice:before{content: "\e0d5";}
.zi-yin-yang:before{content: "\e0d6";}
.zi-hand:before{content: "\e0d7";}
.zi-save-simple:before{content: "\e0d8";}
.zi-scan:before{content: "\e0d9";}
.zi-angle-right-s:before{content: "\e0da";}
.zi-calendar-gavel-legal:before{content: "\e0db";}
.zi-scannerin:before{content: "\e0dc";}
.zi-map-marker:before{content: "\e0dd";}
.zi-circle-empty:before{content: "\e0de";}
.zi-calendar-pen:before{content: "\e0df";}
.zi-logout:before{content: "\e0e0";}
.zi-multiple-alt:before{content: "\e0e1";}
.zi-x-l:before{content: "\e0e2";}
.zi-moon:before{content: "\e0e3";}
.zi-clapperboard:before{content: "\e0e4";}
.zi-mic:before{content: "\e0e5";}
.zi-square-full:before{content: "\e0e6";}
.zi-file-user:before{content: "\e0e7";}
.zi-shrimp:before{content: "\e0e8";}
.zi-house-chimney-blank:before{content: "\e0e9";}
.zi-login:before{content: "\e0ea";}
.zi-filters:before{content: "\e0eb";}
.zi-medical-star:before{content: "\e0ec";}
.zi-palette:before{content: "\e0ed";}
.zi-mic2:before{content: "\e0ee";}
.zi-calendar-exclamation:before{content: "\e0ef";}
.zi-password-lock:before{content: "\e0f0";}
.zi-balance-scale-left:before{content: "\e0f1";}
.zi-x-bold:before{content: "\e0f2";}
.zi-plus-small:before{content: "\e0f3";}
.zi-interaction-add-image:before{content: "\e0f4";}
.zi-angle-down-s:before{content: "\e0f5";}
.zi-calendar-update:before{content: "\e0f6";}
.zi-trash-empty:before{content: "\e0f7";}
.zi-calendar-minus:before{content: "\e0f8";}
.zi-infinity:before{content: "\e0f9";}
.zi-badget-check-alt:before{content: "\e0fa";}
.zi-zoom-out:before{content: "\e0fb";}
.zi-aperture:before{content: "\e0fc";}
.zi-angle-left-m:before{content: "\e0fd";}
.zi-open:before{content: "\e0fe";}
.zi-filter-slash:before{content: "\e0ff";}
.zi-insert-alt:before{content: "\e100";}
.zi-rss:before{content: "\e101";}
.zi-microchip:before{content: "\e102";}
.zi-rotate-exclamation:before{content: "\e103";}
.zi-calendar-xmark:before{content: "\e104";}
.zi-cross-small:before{content: "\e105";}
.zi-battery-full:before{content: "\e106";}
.zi-settings-sliders:before{content: "\e107";}
.zi-pax:before{content: "\e108";}
.zi-mobile-button:before{content: "\e109";}
.zi-back-up:before{content: "\e10a";}
.zi-daisy:before{content: "\e10b";}
/* '/public/res/style/z6n-icons-custom.css' -> 404 */

/* '/public/res/style/tray.css' -> 200 */


:root{
	--c_progress_success: #69a669;	
	--c_progress: #80ca80; 
	--c_cprogress: #eac27a;
}


.tray{
	line-height: var(--h_footer);
	display: flex;
	flex-direction: row;
	/*margin: 0 10px;*/
	background-color: var( --c_b3);
	border: 0 0 0 1px solid black;
	min-width: 10px;
	height: var(--h_footer);
}

.trayElem{
	font-size: var(--h_footer);
	-webkit-user-select: none;
  	-ms-user-select: none;
  	user-select: none;
  	height: var(--h_footer);
  
}

/* .trayElem:hover{
	cursor: not-allowed;
}
 */
.trayElem.clickable:hover{
	cursor: pointer;
	
}



.tray .active{
	background-color: var( --c_b-noti-active );
	border-radius: 0 0 5px 5px;
}


.trayElem >*{
	height: var( --h_footer );
	display: inline-block;
	vertical-align: baseline;
	border-radius: 0 0 5px 5px;
	margin: 0 5px;
}

.tray svg{
	filter: contrast(50%);
}


.c_noti>*{
	animation: notifyAnimation 0.5s linear;
}


.c_noti>.c_noti-pop{
	animation: none;
}

.c_noti-pop{
	position: fixed;
	display: flex;
	flex-direction: column-reverse;
	bottom:var(--h_footer);
	right:0;
	white-space: normal;
	height: auto;
	max-height: var( --h_content );
	overflow-x: auto;
	line-height: normal;
	background-color: var( --c_b-noti-container );
	max-width: 100vw;
	animation: "none";
	border-radius: 5px 5px 0 5px;
	z-index: 99999;
	
}


progress::-moz-progress-bar{ 
	background: var(--c_progress);
}
progress::-webkit-progress-value { 
	background: var(--c_progress); 
}


progress[value] {
  /* Reset the default appearance */
  -webkit-appearance: none;
   appearance: none;
}

progress {
	color: var(--c_progress);
	border-radius: 5px;
	height: 10px;
	border: 1px solid var(--c_f4);
	width: 30vw;
	max-width: 400px;
	min-width: 150px;
}

progress.done::-moz-progress-bar{ 
	background: var(--c_progress_done);
}
progress.done::-webkit-progress-value { 
	background: var(--c_progress_done); 
}


progress.done{ 
	color: var(--c_progress_done);
}

progress.cprogress::-moz-progress-bar{ 
	background: var(--c_cprogress); 
}
progress.cprogress::-webkit-progress-value{ 
	background: var(--c_cprogress); 
}
progress.cprogress{ 
	color: var(--c_cprogress);
}

.progress{
   background: linear-gradient(-45deg, transparent  40%, #ffffff 50%, transparent 60%);
   background-size: 300%;
   background-position-x: 100%;
   animation: shimmer 1s infinite linear;
}

@keyframes shimmer {
   to {
      background-position-x: 0%
   }
}



.xprogressbar
{
	display: block;
	width: 100%;
	position: relative;
}

.xprogress {
	background-color: var(--c_progress);
	text-align: center;
  	/*color: var( --c_b1 );*/
  	position: absolute;
	display: inline;
}

.xprogress.horizontal {
	height: 100%;
	width: 0px;
	top: 0px;
}

.xprogress.vertical 
{
  	height: 50%;
  	left: 0px;
  	width: 100%;
  	bottom: 0px;
}

.progress {
	position: relative;
	height: var(--h_footer);
}

.progress>img{
	height: 100%;
	left: 0px;
  	width: 100%;
  	bottom: 0px;
  	z-index: 1;
  	vertical-align: baseline;
  	position: relative;
}


.progress-overlay{
	left: 0px;
  	width: 100%;
  	bottom: 0px;
  	filter: contrast(50%);
  	
}


.c_noti-pop>*>div{
 	background-color:var( --c_b-noti );
  	box-shadow: 1px 1px 3px 1px var(--c_b-noti-shadow );
  	border-radius: 5px;
  	margin: 5px;
  	position: relative;
  	overflow: auto;
  	flex-shrink: 0;
  	min-width: 300px;
}

.c_noti-pop div>.noti-content{
 	padding: 10px;
}

.c_noti-pop div>.noti-header{
	display: flex;
	justify-content: space-between;
}
.c_noti-pop>button{
	margin: auto;
	margin-bottom:5px;
	margin-top:5px;
	padding: 5px 10px;
}

/* @media screen and (max-width: 800px) {
.c_noti-pop>*>div{
  	width: 45vw;
  	min-width: 0;
}
}
 */
.noti-pop>*>div>h1{
	font-size: 24px;
	text-decoration: underline;
	text-decoration-color: var( --c_1 );
	display:inline;
}

.tray .controls > a{
	text-decoration: underline;
}

.tray .controls {
	margin: 5px 10px;
}


.tray .controls img{
	padding: 0 5px 0 0;
}


@keyframes notifyAnimation {
  12.5% { transform: translate(0px, -5px) rotate( -10deg ); }
  37.5% { transform: translate(0px, 5px) rotate( 10deg ); }
  50% { transform: translate(0px, 0px) rotate( 0deg ); }
  62.5% { transform: translate(0px, 5px) rotate( -10deg ); }
  87.5% { transform: translate(0px, -5px) rotate( 10deg ); }
}
/* '/public/res/style/tray-custom.css' -> 404 */

/* '/public/res/style/context.css' -> 200 */
:root {
	--c_b-context: var( --c_b2 ); /* bg of the right click context menu */
	--c_b-context-hover: var( --c_b-current );	/* bg of the hovered item in the right click context menu */
	--c_b-contexted: var( --c_4 ); /* */
	--c_f-contexted: var( --c_f2 ); /* */
	--c_f-contextmenu-border: var( --c_f4 ); /* */
	--c_f-contextmenu-icon: var( --c_3 );
}

.context-menu {
	background: var( --c_b-context );
	border: 1px solid var( --c_f-contextmenu-border );
	position: absolute;
	border-radius: 5px;
	z-index: 100;
}


.context-menu div {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 1.5em;
	padding: 2px 5px 2px 5px;
	white-space: nowrap;
}
.context-menu .zi {
 	object-fit: contain;
 	color: var( --c_f-contextmenu-icon );
 	padding-right: 10px;
 }

.context-menu .sub {
	padding-right: 0;
}

.context-menu .sub .expand svg{
	text-align: right;
	text-align: right;
	stroke: var( --c_f-contextmenu-svg );
	fill: var( --c_f1 );
 	padding: 0;
}

@media screen and (max-width: 700px) {

.context-menu div {
	height: 1.5em;
	font-size: 1.25em;
}

.context-menu svg {
 	height: 1.5em;
 }

}

.context-menu div:not(:last-child){
	border-bottom: 1px dashed var( --c_f-contextmenu-border );
}

.context-menu .default-action {
	font-weight: bold;
}

.context-menu div:hover {
	background-color: var( --c_b-context-hover );
	cursor: pointer;
}

.context-menu div:last-child:hover{
	border-radius: 0px 0px 5px 5px;
}

.context-menu div:first-child:hover{
	border-radius: 5px 5px 0px 0px;
}


.contexted {
	background-color:var( --c_b-contexted ) !important;
	color:var( --c_f-contexted ) !important;
}
/* '/public/res/style/context-custom.css' -> 404 */

/* '/public/res/style/generic.css' -> 200 */
:root {

	--c_b-header: var(--c_b1);
	--c_f-header: var(--c_f2);
	--c_f-header-border: var(--c_b3);
	--c_f-footer-border: var(--c_b3);

	--c_b-footer: var(--c_b3);
	--c_f-footer: var(--c_f2);
	
	--c_b_footer-tools: var(--c_f4);
	
	--c_b-noti: var( --c_b3 );
	--c_b-noti-container: var( --c_6 );
	--c_b-noti-active: var( --c_6 );
	--c_b-noti-shadow: var( --c_f3 );

	--c_f-closebtn: var(--c_2);
	
	--c_f-menu-icon: var(--c_f3);
	
	/*TODO c_b-input-passive*/
	--c_b-button-weak: var(--c_5);
	
	

	--c_underline-animation: var(--c_1);

	--c_f-loader: var(--c_1);

	/*Padding*/
	
	--p_footer-tools: 5px;

	/*Height*/
 	--h_header: 66px;
 	
	--h_footer: 32px;
	--h_header-banner: 42px;
	
	--h_content: calc(100vh - var(--h_header) -  var(--h_footer));
	
	--h_footer-tools: calc( 32px - var( --p_footer-tools ) - var( --p_footer-tools ) );
	
	/*Border*/
	
	--b_header: 2px;
	--b_footer: -1px;

	/*Fade*/
	--f_header: 2px;
	--f_footer: 2px;
	
	/*Before Content*/
	--before_button-on-enter: "\2386";
	
	/*Radius*/
	--r_box : 10px;
	
	--h_avatar: 48px;
	--w_avatar: 48px;
	
	--h_large: 96px;
	--w_large: 96px;
}

.ci-1 img, img.ci-1 {
	filter: var( --c1-filter );
}

body>main {
	height: var(--h_content);
	max-width: 100%;
	overflow: auto;
}

.fill-content {
	height: var(--h_content);
	min-height: var(--h_content);
	overflow: hidden !important;
	max-width: 100%;
	min-width:90vw;
}

.clear{
	clear:both;
}

header {
	background-color: var(--c_b-header);
	color: var(--c_f-header);
	width: 100%;
	margin:0;
	z-index: 100;
	box-shadow: 0 var(--b_header) var(--f_header) 0 var(--c_f-header-border);
	position: relative;
	overflow-x:auto;
	overflow-y: hidden;
	top:0;
	line-height:0;
}

header>*{

	line-height:var( --h_line );
}



#header-banner {
	height: var(--h_header-banner);
	display: inline-block;
	top: 0;
	position: absolute;
	left: 44px;
	padding-top: 8px;
}

/*FOOTER*/

.copyright {
	height: 100px;
	padding-top: 5px;
}

.copyright a {
	color: var(--cf_link);
	font-weight: bold;
}

.missing-image {
	background-color: var(--cb_invalid);
}

#powered-by {
	font-size: 10px;
	font-style: italic;
	margin: auto;
}

footer>img {
	height: var( --h_footer-tools );
	object-fit: contain;
}

footer>*{	
	vertical-align: bottom;
	display: inline-block;
}


footer {
	width: 100%;
	background-color: var(--c_b-footer);
	color: var(--c_f-footer);
	box-shadow: 0 var(--b_footer) var(--f_footer) 0 var(--c_f-footer-border);
	font-weight: normal;
  	bottom: 0;
  	overflow-y: hidden;
  	overflow-x: auto;
  	display: flex;
  	justify-content: space-between;
  	align-items: center;
  	line-height: 0;
  	white-space: nowrap;
}

.lr {
	display: flex;
  	justify-content: space-between;
  	align-items: center;
}


footer .tools button{
	height: var( --h_footer-tools );
	width: var( --h_footer-tools );
	padding: 0px;
	background-color: var( --c_b_footer-tools );
}


/*Locale*/

.selected_lang {
	font-weight: bold;
}


#lang_picker > img{
	height: var( --h_footer-tools );
}


#lang_picker{
	display: inline-block;
	text-transform: uppercase;
	height: 27px;
	margin-top: 3px;
}



#lang_picker select {
	background-color: var( --c_b-footer );
	color: var( --c_f-footer );
	padding: 0;
	vertical-align: middle;
}


.caption{
	float:left;
	height:16px;
}

.close {
	position: absolute;
	top: 5px;
	right: 10px;
	color: var(--c_f2);
	opacity: 0.5;
	transform: scale(1.0);
	transition: 0.3s;
}

.close:hover {
	opacity: 1;
	transform: scale(1.4);
	transition: 0.3s;
}


/*HELPER*/

.inline-follow {
	display: inline-block;
	vertical-align: middle;
}

.script {
	display: none;
}

.middle * {
	vertical-align: middle;
}

.error-msg {
	background-color: var(--c_b-neg);
	margin: 10px;
}

.inactive {
	opacity : 0.7;
}


.illegal {
	background-color: var(--c_ib-neg);
}

.hit {
	background-color: var(--c_b-sig);
}

.right {
	text-align: right;
}

.left {
	text-align: left;
}

.center {
	text-align: center;
}


.mauto {
	margin: auto !important;
}

.error {
	font-weight: bold;
	background-color: var(--c_b-neg);
}

.warning {
	font-weight: bold;
	background-color: var(--c_b-sig);
}

.success{
	background-color: var(--c_b-pos);
}

.warning a {
	color: var(--c_7);
}

.striked {
	text-decoration: line-through;
}

.fulfilled {
	background-color: var(--c_b-pos);
}


.hit {
	background-color: var(--c_b-pos);
	font-weight: bold;
	display: inline;
	padding: 0;
	margin: 0;
}

.overlayed{
	margin:3px;
} 

.overlay{
	display: inline-block;
	position: relative;
	font-size: 12px;
	left: -60px;
	max-width:40px;
	/*opacity: 0.4;*/
	width:40px;
	border-radius: 50%;
	text-align:center;
}

.overlayed .padded{
	padding-right: 40px;
} 

.overlay .padded{
	left: -40px;
	max-width: 40px;
}

.filter button{
	vertical-align: bottom;
}

#search{
	margin: 12px;
}

/* ANIMATIONS */

/* Loading animation */

.dyn-sub{
	text-align: center;
}

.dyn-sub svg{
	width: 64px;
	padding: 3px;
}


.loader {
	display: none;
	position: fixed;
	top: calc(50% - 128px);
	left: calc(50% - 128px);
	width: 256px;
	height: 256px;
	border-radius: 15%;
	perspective: 800px;
	z-index: 1000;
	color: var(--c_f-loader);
}

.inner {
	position: absolute;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	border-radius: 50%;
}

.inner.one {
	left: 0%;
	top: 0%;
	animation: rotate-one 2s linear infinite;
	border-bottom: 30px solid var(--c_loader);
}

.inner.two {
	right: 0%;
	top: 0%;
	animation: rotate-two 2s linear infinite;
	border-right: 30px solid var(--c_loader);
}

.inner.three {
	right: 0%;
	bottom: 0%;
	animation: rotate-three 2s linear infinite;
	border-top: 30px solid var(--c_loader);
}

@keyframes rotate-one {
	0% {
		transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg);
	}

	100% {
		transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg);
	}
}

@keyframes rotate-two {
	0% {
		transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg);
	}

	100% {
		transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg);
	}
}

@keyframes rotate-three {
	0% {
		transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg);
	}

	100% {
		transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg);
	}
}


/* Underline animation */


.slborder {
	border-left: 10px solid var(--c_underline-animation);
	margin: 20px;
	padding-left: 5px;
}

.hover-underline-animation {
	display: inline-block;
	position: relative;
	color: var(--c_underline-animation);
}

.hover-underline-animation:after {
	content: '';
	position: absolute;
	width: 100%;
	transform: scaleX(0);
	height: 5px;
	bottom: 0;
	left: 0;
	background-color: var(--c_underline-animation);
	transform-origin: bottom right;
	transition: transform 0.25s ease-out;
}

.hover-underline-animation:hover:after {
	transform: scaleX(1);
	transform-origin: bottom left;
}


.current.hover-underline-animation:after {
	background-color: var( --c_f4 );
}
 a.current{
	/*font-family: mono;*/
	font-weight: bold;
}





/* .loading {
	border: 5px solid;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-radius: 100%;
	animation: spin 1s ease-in-out infinite;
	height: 12px;
	width: 12px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
} */

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

.bar1,
.bar2,
.bar3 {
	width: 28px;
	height: 3px;
	background-color: var(--c_f-menu-icon);
	margin: 4px 0;
	transition: 0.4s;
	border-radius: 3px;
}

/* Rotate first bar */
.change .bar1 {
	transform: translate(0, 7px) rotate(-45deg);
}

/* Fade out the second bar */
.change .bar2 {
	opacity: 0;
}

/* Rotate last bar */
.change .bar3 {
	transform: translate(0, -7px) rotate(45deg);
}

/*Highlight*/
.highlight {
	animation: highlightAnimation 2.5s linear;
}


@keyframes highlightAnimation {
	0% {
		background-color: rgba(255, 255, 255, 0);
	}

	/* Start color */
	20% {
		background-color: var(--c_b-pos)
	}

	/* Midway color */
	80% {
		background-color: var(--c_b-pos)
	}

	/* Midway color */
	100% {
		background-color: rgba(255, 255, 255, 0);
	}

	/* End color */
}


/*Blinker*/

@keyframes blinker {
	50% {
		opacity: 0;
	}
}

.blink {
	animation: blinker 2s step-start infinite;
}

#backdrop {
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 500;
	height: 100%;
	width: 100%;
	background: rgba(0, 0, 0, 0.5);
	display: none;
	text-align: center;
}

/*LISTS*/

ol.list-marker li:before {
	border-right: 3px solid var(--c_accent);
	margin-right: 5px;
}

/*TABLES*/

:root {
	--cb_row_hover: var(--c_b3);
	--c_b-row-tools: var(--c_3);
	--c_f-row-tools: var(--c_b1);

	--c_b-dyn-loading: var(--c_b3);
	--c_b-dyn-error: var(--c_b-neg);
}



/*Table*/

.c_table {
	width: 100%;
	overflow:auto;
}

.c_table tr img {
	padding: 2px;
}


.c_table .tools button {
	border-radius: 30%;
	border: none;
	padding: 5px;
	background-color: var(--c_b-row-tools);
	color: var(--c_f-row-tools);
	font-weight: bold;
}

/*Dyn-Table*/

.dynamic-table td {
	overflow: hidden;
	word-break: keep-all;
	white-space: nowrap;
	max-width: 1px;
}

.dynamic-table td>* {
	word-break: break-all;
	overflow: auto;
	text-overflow: ellipsis;
}

.dyn-loading {
	background-color: var(--c_b-dyn-loading);
}

.dyn-error {
	background-color: var(--c_b-dyn-error) !important;
}

/*Hover-Table*/

.hover tr:hover {
	background-image: linear-gradient(rgb(0 0 0/10%) 0 0);
}

/*TOOLS*/




.tools {
	white-space: nowrap;
	text-align: right;
}

.tools button {
	border-radius: 50%;
	border: none;
	margin: 5px;
	font-weight: bold;
	opacity: 0.8; 
	line-height: 0;
	font-size: 30px;
}

.tools button img{
	height: 20px;
	vertical-align: middle;
}


body>main .tools{
	position: fixed;
	bottom: calc( var(--h_footer) + 10px );
	right: 10px;
	text-align: right;
}

body>main.tools.sticky-bottom{
	position: sticky;
	bottom: 0;
}


/*CONTAINER*/

.container {
	padding: 40px 20px;
	margin: 2% auto 2% auto;
	width: 80%;
	max-width: 700px;
	min-width: 50px;
	overflow: hidden;
}

.box {
	background-color: var( --c_b1 );
	border: 2px solid var( --c_f4 );
	box-shadow: 2px 4px var( --c_f4 );
	word-wrap: break-word;
	overflow: auto;
	border-radius: var( --r_box );
}

.disclaimer {
	background-color: var(--c_4);
}

.text{
	padding: 10px 40px;	
}

.sticky {
	position: sticky;
	top: 0;
}

img.avatar {
	height: var( --h_avatar );
	width: var( --w_avatar );
	object-fit: contain;
	border-radius: 50%;		/*move to generic avatar*/
}



img.large {
	height: var( --h_large );
	width: var( --w_large );
}


.preview>img {
	background-image: linear-gradient(45deg, var(--c_b-checkersboard2) 25%, var(--c_b-checkersboard1) 25%),
		linear-gradient(-45deg, var( --c_b-checkersboard2) 25%, var(--c_b-checkersboard1) 25%),
		linear-gradient(45deg, var(--c_b-checkersboard1) 75%, var( --c_b-checkersboard2 ) 75%),
		linear-gradient(-45deg, var(--c_b-checkersboard1) 75%, var(--c_b-checkersboard2) 75%);
	background-size: 10% 10%;
	min-width: 30vw;
	object-fit:contain;
}


.c_flow.tile {
	display: flex;
	flex-wrap: wrap;
	margin: auto;
}

.tile>*{
	padding: 10px;
	margin: 10px;
	text-align: center;
}

@media screen and (max-width: 700px) {

	.container {
		margin: 0;
		border: none;
	}

}

.fillparent{
	height: inherit;
	width: 100%;
	display:block;
	overflow: auto;
}

.full{
	width: 100%;
}

.monospace{
	font-family: "monospace";
}

/* '/public/res/style/generic-custom.css' -> 404 */

/* '/public/res/style/elems.css' -> 404 */

/* '/public/res/style/elems-custom.css' -> 404 */

/* '/public/res/style/poweredby.css' -> 200 */

#powered-by
{
	height: 32px;
	background-color: var( --c_b1 );
	padding: 2px 5px; 
	position:relative;
	margin:0;
}

#powered-by img
{
	height: var( --h_footer-tools );
	padding: var( --p_footer-tools );
}
	
#powered-by:before {
  content: '';
  position: absolute;
  bottom: 0;
  left: -24px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 40px 25px;
  border-color: transparent transparent var( --c_b1 ) transparent;
}

/* '/public/res/style/poweredby-custom.css' -> 404 */

/* '/public/res/style/user.css' -> 200 */
:root {
	--c_b-user: var(--c_b3);
	--c_f-user-shadow: var(--c_f3);


	--h_userimg: 32px;
	

	--top_user: 5px;
	--right_user: 10px;
	--font_user: 12px;
	--r_user: 5px;
	--b_user: 0;
	--f_user: 3px;
	--p_user: 5px;
}

/*USER*/

.profile_menu {
	/* position: absolute;
	right: var(--right_user);
	top: var(--top_user); */
	font-size: var(--font_user);
	text-align: right;
	float:right;
	margin:8px;
}

.user>img {
	display: inline;
	height: var(--h_userimg);
	width: var(--h_userimg);
	vertical-align: middle;
	border-radius: 50%;
}

.user img:hover {
	cursor: pointer;
}

.user {
	border-radius: var(--r_user);
	background-color: var(--c_b-user);
	box-shadow: 0 var(--b_user) var(--f_user) 0 var(--c_f-user-shadow);
	padding: var(--p_user);
}

.user a {
	display: block;
	text-decoration: underline;
	
}

.user.mimic img {
	opacity: 0.5;
}

.mimic{
	background-color: var( --c_b-sig );
}

@media(max-width: 600px) {
	.user div {
		display: none;
	}

	.user {
		border-radius: 30px;
	}
	
	.user:hover {
		background-color: var( --c_b-hover);
	}
}



/* '/public/res/style/user-custom.css' -> 404 */

/* '/public/res/style/two.css' -> 200 */
:root {
	--c_b-current: var(--c_2);
	

	
	--c_b-static-header: var(--c_b4);
	
	--pl_static-header: 5px;
	--pr_static-header: 5px;
	--pt_static-header: 5px;
	--pb_static-header: 5px;
	
	--mr_static-header-tools : 15px;
}






/*}*/

/*SEARCH*/

form.search-form {
	margin-top: 15vh;
	display: inline-block;
	text-align: center;
	width: 100%;
}

form.search-form>input {
	width: 400px;
}

	
@media screen and (max-width: 800px) {
	form.search-form>input {
		width: 50vw;
	}
}







.static-header > .tools{
	float: right;
	margin-right: var(--mr_static-header-tools);
}




	
	
	
	
	
/* '/public/res/style/two-custom.css' -> 404 */

/* '/public/res/style/navbar.css' -> 200 */
:root {
	--c_b-menu: var( --c_b3 );
	--h_navbar-pos1: 52px;
	--h_navbar-pos2: 98px;
	--h_navbar-1: calc( 100vh - var( --h_navbar-pos1 ));
	--h_navbar-2: calc( 100vh - var( --h_navbar-pos2 ));
	--c_b-navbar: var(--c_b1);
	--c_f-navbar: var(--c_f2);
}

nav{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	overflow-y: scroll;
	background-color: var(--c_b3 );
	box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
	height: 100vh;
	box-shadow: 10px 5px 6px -2px var( --c_f4 );
	
	border-radius: 0 10px 0 0;
	min-width:300px;
	max-width: 100%;
	letter-spacing: 0.2em;
	line-height: 32px;
	font-size: 16px;
	border-top: var( --h_navbar-pos1 ) solid var(--c_b3 );
}

.side-nav div{
	width: 100%;
	padding-left: 16px;
	box-sizing: border-box;
}

nav svg{
	stroke: var(--c_f2);
}

nav svg:hover{
	stroke: var(--c_1);
}

nav a{
	color: var( --c_f2 ) !important;
	width: calc( 100% - 32px);
	box-sizing: border-box;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-right: 20px;
}

nav a.current{
	color: var( --c_1 ) !important;;
}


.side-nav
{
	position: relative;
	top: 0;
	min-width:300px;
	padding-bottom: 32px;
}

.glass{
	background-color: rgba(0,0,0,0);
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	display: none;
	z-index: 100;
}

nav .topline{
	border-top: 2px solid var( --c_f4 );
	position: sticky;
	top:0;
}

nav .spacer{
	display: inline-block;
	width: 16px;
	height: 16px;
	padding-top: 5px;
	padding-bottom: 5px;
}

nav .expander{
	display: inline-block;
	width:16px;
	vertical-align: middle;
	padding-top: 5px;
	padding-bottom: 5px;
} 

nav .menuparent{
	font-weight: bold;
}
.main_navbar > h1{
	display: inline;
}

.c_navbar > nav > *{
	overflow: hidden;
    display: block;
    /*text-align: right;*/
	color: var(--c_f_navbar);
	padding: 4px 10px;
/* 	text-transform: uppercase; */
}


.c_navbar > h2 {
	display: none;
	/* text-transform: uppercase; */
	margin: auto;
	width: 100%;
}

.c_navbar.collapsed > h2 {
	display: block;
	position: absolute;
}


.c_navbar {
	/*background-color: var(--c_b-navbar);*/
	color: var(--c_f-navbar);
	overflow: auto;
	white-space: nowrap;
	float: left;
}


.c_navbar nav a.parent {
	font-weight: bold;
}

.c_navbar nav a.parent::before {
	content: ">>";
}


/*RESPONSIVE MENU*/

.c_navbar a.menu_expand {

	display: block;
	stroke: var( --c_f2 );
	fill: var( --c_f2 );
	stroke-width: 2px;
	height: var( --h_header-banner );
	width: var( --h_header-banner );
	stroke-linecap: round;
	/*background-color: var( --c_b-header );*/
	border-radius: 10px 10px 0 0;
	display: inline-block;
	padding-top: 8px;
	padding-left: 2px;
	padding-right: 2px;
	padding-bottom: 0;
	z-index: 101;
	position: relative;
}


header .pagetitle{
	width: 100%;
	text-align: center;
	margin: auto;
	position: fixed;
	display: block;
	overflow: auto;
	z-index: -1;
	top: 22px;
}

header h1{
	font-size: 22px;
	display: block;
	white-space: nowrap;
	overflow: auto;
}
	

@media screen and (max-width: 600px) {

	
header .pagetitle{
	position: relative;
	top:0;
}

	header h1{
	font-size: 18px;
}
	
	
.glass{
	background-color: rgba(0,0,0,0.5);
}

/* header .pagetitle{
	display: inline-block;
	position: relative;
	padding: 3px 0;

} */


	


/* .c_navbar a.menu_expand {
	position: fixed;
	top:52px;
	left: 0;
	box-shadow: none;
	border-radius: 0 10px 0 0;
} */

nav{
	max-width: 80vw;
} 

/* nav{
	top: var( --h_navbar-pos2 );
	min-width: 80vw;
	letter-spacing: 0;
	height: var( --h_navbar-2 );
	max-height: var( --h_navbar-2 );
} */



}


/* 
@media screen and (max-width: 1000px) {

	.c_navbar a.menu_expand{
	position: fixed;
	left:0;
}

}*/

.c_navbar a.menu_expand.expanded {
	background-color: var( --c_b-menu );
}


.c_navbar {
	border-top: none;
}

.c_navbar nav a.self {
	font-style: italic;
	border-right: 2px solid var(--c_f3);
}

.shiftIn{
	animation: shift-in 0.2s;
}

.shiftOut{
	animation: shift-out 0.2s;
}

@keyframes shift-in {
  0% { transform: translateX( -100% ); }
  100% { 
  	transform: translateX( 0 ); 
  }
}

@keyframes shift-out {
  0% { transform: translateX( 0 ); }
  100% { 
  	transform: translateX( -100% ); 
  }
}

.shiftDown{
	animation: shift-down 0.2s;
}

.shiftUp{
	animation: shift-up 0.2s;
}

@keyframes shift-down {
  0% { transform: translateY( -100% ); opacity: 1; }
  100% { 
  	transform: translateY( 0 ); opacity: 0; 
  }
}

@keyframes shift-up {
  0% { transform: translateY( 0 ); opacity: 1; }
  100% { 
  	transform: translateY( -100% ); ; opacity: 0;
  }
}


/* '/public/res/style/navbar-custom.css' -> 404 */

/* '/public/res/style/style.css' -> 200 */

:root {
	--c_b-body: var(--c_5);
	--c_b-disclaimer: #1d4163;
	--c_f-disclaimer: #fff;
	--c_b-body: var(--c_b-disclaimer );
}


@keyframes fadeIn { 
	0% {
		opacity: 0;
		}
	100% {
		opacity: 1;
		}
}

.transparent {
	opacity : 0;
}

.fade-in.visible {
	animation: fadeIn 0.8s ease-in;
}

#riddle {
	align-self: flex-start;
	margin-top:-40px;
}

.section {
	background-color: var( --c_b2 );
	box-sizing: border-box;
	object-fit: contain;
	font-size: 1.5em;
	padding: 40px;
	display: flex;
	flex-direction: row;
	justify-content: center;
	position: relative;
	overflow: hidden;
	flex-wrap: wrap;
	align-items: center;
	gap: 40px;
	min-width: 300px;
	
	
	h1{
		font-size: 1.7em;
	}
	
	h2{
		font-size: 1.3em;
		font-weight: normal;
	}
	
	&.rel30-70>*{
		width: 50%;
	}
	
	&.rel30-70>:first-child{
		width: 40%;
	}
	
	&.rel70-30>*{
		width: 40%;
	}
	
	&.rel70-30>:first-child{
		width: 50%;
	}
	
	&.fs>*{
		width:100%;
	}
	
	@media (max-width: 1200px) {
	
		width: 100%;
		padding: 0;
		margin: 0;
		border-radius: 0;
		font-size: 1.2em;
		gap: 40px;
		object-fit: contain;
		
		h1{
			font-size: 1.6em;
		}
			
		h2{
			font-size: 1.4em;
			font-weight: normal;
		}
		
		&.rel30-70>*{
			width: 100%;
		}

		&.rel30-70>:first-child{
			width: 100%;
		}

		&.rel70-30>*{
			width: 100%;
		}

		&.rel70-30>:first-child{
			width: 100%;
		}
	}
	
	@media (max-width: 900px) {
	
		gap: 20px;
		width: 100%;
		
		#riddle {
		margin-top: -10px;
		}
	}
	
	@media (max-width: 600px) {
		
		font-size: 1.1em;
		gap: 10px;
		width: 100%;
		object-fit: contain;
		h1{
			font-size: 1.5em;
		}
			
		h2{
			font-size: 1.3em;
		}
	}
}

.subsection {
	width: 100%;
	padding: 0;
}

.element{
	object-fit: contain;
	border-radius: 10px;
	max-width: 2048px;
	min-width: 300px;
	p{
		padding: 1em 0;
	}
	
	img&{
		padding: 0;
		margin: 0;
		max-width: 1024px;
	}

	@media (max-width: 1200px) {
		
		img&{
			max-width: 1024px;
			width: 100%;
			object-fit: contain;
			border-radius: 0;
		}
	}
}



.textbox{
	border-radius: 10px;
	padding: 40px;
	
	@media (max-width: 1200px) {
		padding: 40px;
	}
	
	@media (max-width: 900px) {
		border-radius: 0px;
		padding: 20px;
	}

	@media (max-width: 600px) {
		padding: 10px;
	}
}



.contact{
	
	padding-top: 20px;
	
	&>button{
		border-radius: 20px;
		width:40px;
		height:40px;
		background-color: var( --c_3 );
		margin: 16px 16px 16px 0;
		
		>img{
			height: 100%;
			vertical-align: middle;
		}
		
		&:hover{
			background-color: var( --c_1 );
		}
		
		@media (max-width: 900px) {
		margin: 8px 8px 8px 0;
	}
	}
	
	&.sub a{
		border-bottom: 2px solid var( --c_1 );
		margin: 0 20px;
	}
	
	a{
		vertical-align: middle;
	
		&:hover{
			color: var( --c_1 );
		}
	}
	
	
}
 
.sub {
	padding: 20px;
	
	img&{
		max-width:28em;
	}
}

.subheading{
	border-left: 6px solid var( --c_1 );
	padding: 10px 50px;
	min-width: 300px;
	box-sizing: border-box;
	>h1{
		font-size: 2.0em;
		padding: 10px;
	}
	
	>h2{
		font-family: "monospace";
		color: var( --c_5 );
		padding: 5px 0;
	}
	
	>p{
		width:100%;
	}
	
	
	@media (max-width: 900px) {
	
		padding: 10px 20px;
		
		>h1{
			font-size: 1.5em;
		}
		
		>h2{
			font-family: "monospace";
			color: var( --c_5 );
			padding: 5px 0;
		}
	}
}

.pageheading{
	
	display:flex;
	flex-direction: column;
	flex-wrap: nowrap;
	width: fit-content;
	
	>h1{
		font-size: 3.0em;
		display: inline-block;
		padding: 10px 50px;
		color: var( --c_5 );
 		
 		@media (max-width: 900px) {
			font-size: 1.8em;
			padding: 10px;
		}
 		
	}

	>h2{
		font-size: 1.0em;
		display: inline-block;
		padding: 10px 100px;
		
		@media (max-width: 900px) {
			text-align: center;
			padding: 5px;
		}
	}

}


.bottom-logo{
	width: 226px;
	padding: 10px;
	
	@media (max-width: 900px) {
		width: 196px;
	}
}

.bottom-text{
	padding: 20px 10px;
}

.subphrase{
	font-weight: bold;
}


.read-more{
	display: inline-block;
	text-align: right;
	width:100%;
	color: var( --c_3 );
	
	>a{
		font-weight: bold;
		display: inline-block;
		padding: 10px 0 10px 10px;
		margin: 10px 0 10px 10px;
		border-radius: 10px;
		color: var( --c_5 );
	}	
}


.c1{
	background-color: var( --c_1 );
	color: #fff;
}

.c2{
	background-color: var( --c_2 );
	color: var( --c_f1 );
}

.c3{
	background-color: var( --c_b-disclaimer );
	color: var( --c_f-disclaimer );
}

.b3{
	background-color: var( --c_b3 );
	color: var( --c_f1 );
	
	.subheading h2{
		color: var( --c_5 );
	}
}

.b2{
	background-color: var( --c_b2 );
	color: var( --c_f1 );
}

.b1{
	background-color: var( --c_b1 );
	color: var( --c_f1 );
}