:root {
--font-std: "Barlow";
--font-semi: "Barlow Semi Condensed";
--font-condensed: "Barlow Condensed";
--card-background: rgb(245, 245, 250);
--card-forecolor: rgb(6, 6, 73);
--card-shadow-std: 0rem 0.1rem 0.2rem rgba(2, 20, 20, 0.45);
--card-border: 1px solid gray;
/*app*/
--app-background: rgba(13, 98, 138, 1);
--shadow-std: 0.2rem 0 0.2rem rgba(0, 0, 0, 0.4);
--links-forecolor: rgba(0, 100, 0, 1);
--links-hover-forecolor: rgb(247, 250, 87);
--app-text-color: rgb(0, 0, 0);
/*APP DARKMODE*/
--app-background: rgba(30, 30, 40, 1);
--shadow-std: 0.2rem 0 0.2rem rgba(0, 0, 0, 0.8);
--links-forecolor: rgb(255, 255, 249);
--links-hover-forecolor: rgb(247, 250, 87);
--app-text-color: rgb(240, 240, 240);
/*OBJ GENERAL*/
--obj-shadow-std: 0rem 0.1rem 0.2rem rgba(2, 20, 20, 0.65);
--obj-padding: 0.3rem;
/*OBJ LIGHT MODE*/
--obj-background: rgb(240, 240, 240);
--obj-forecolor: rgb(6, 6, 73);
--obj-titled-background: rgb(6, 60, 100);
--obj-titled-forecolor: white;
--obj-panel-background: rgba(0, 0, 0, 0.4);
/*OBJ DARK MODE*/
--obj-background: rgb(60, 60, 70);
--obj-forecolor: rgb(200, 200, 200);
--obj-titled-background: rgb(80, 80, 90);
--obj-titled-forecolor: white;
--obj-panel-background: rgba(200, 200, 200, 0.4);
/*UI*/
--mat-btns-back: aliceblue;
--mat-btns-border: 1px solid rgb(167, 173, 179);
--mat-btns-shadow: 0 1px 2px rgba(0, 0, 0, .2);
--mat-btns-textShadow: 0 1px 1px rgba(0, 0, 0, 0.3);
--mat-btns-fore: #201f23;
--mat-btns-highlight: yellow;
--ui-ctrl-color: rgb(45, 155, 238);
--ui-ctrl-hintcolor: white;
--ui-ctrl-hilightColor: rgb(9, 204, 181);
--ui-ctrl-contentBackground: white;
/*UI DARK MODE*/
--mat-btns-back: rgba(255, 253, 253, 0.7);
--mat-btns-border: 1px solid rgb(150, 150, 160);
--mat-btns-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
--mat-btns-textShadow: 0 1px 1px rgba(0, 0, 0, 0.3);
--mat-btns-fore: #201f23;
--mat-btns-highlight: rgba(255, 255, 255, 0.8);
--btns-turnon-background: rgba(9, 204, 181, 0.7);
--btns-turnon-fore: white;
--btns-turnon-shadow: 0 0 0.5rem rgba(9, 204, 181, 1);
--ui-ctrl-color: rgb(45, 155, 238);
--ui-ctrl-hintcolor: white;
--ui-ctrl-hilightColor: rgb(9, 204, 181);
;
--ui-ctrl-contentBackground: white;
--mat-back: white;
--mat-icons-enabled: #FF0089;
--mat-icons-disabled: gray;
--mat-fore: rgb(40, 40, 40);
--mat-fore2: rgb(60, 60, 60);
--mat-highlight-back: rgb(220, 220, 220);
--mat-invback: rgb(60, 60, 60);
--mat-invfore: white;
--mat-notification-back: rgba(255, 255, 10, 0.65);
--mat-notification-border: 1px solid rgb(200, 200, 0);
--mat-notification-fore: black;
--mat-shadow-inset: 0rem 0.1rem 0.15rem rgba(40, 40, 40, 0.7) inset;
--mat-shadow-object-inset: 0rem 0.2rem 0.25rem rgba(40, 40, 40, 0.7) inset;
--mat-shadow-light: 0rem 0.1rem 0.2rem rgba(100, 100, 100, 0.6);
--mat-shadow-right: 0.15rem 0 0.15rem rgba(40, 40, 40, 0.6);
--mat-shadow: 0rem 0.2rem 0.2rem rgba(100, 100, 100, 0.6);
--object-level1: rgb(240, 240, 245);
--object-level2: rgb(230, 230, 235);
--object-level3: rgb(220, 220, 225);
--object-level4: rgb(210, 210, 215);
--object-level5: rgb(200, 200, 205);
/*objects*/
--mc-obj-background: rgb(250, 250, 250);
--mc-obj-foreground: rgb(33, 33, 33);
--mc-obj-shadow: 0rem 0.2rem 0.2rem rgba(0, 0, 0, 0.4);
--mc-obj-border: none;
/*card*/
--mc-card-background: rgb(245, 245, 245);
--mc-card-foreground: black;
--mc-card-shadow: none;
--mc-card-border: 0.05rem solid rgba(200, 200, 200);
/*colors*/
--mc-green-4: rgb(4, 149, 132);
--mc-green-3: rgb(9, 181, 160);
--mc-green-2: rgb(9, 204, 181);
--mc-green-1: rgb(227, 255, 252);
--mc-red-5: rgb(158, 0, 18);
--mc-red-4: rgb(208, 2, 27);
--mc-red-3: rgb(234, 5, 58);
--mc-red-2: rgb(236, 98, 114);
--mc-red-1: rgb(236, 161, 170);
--mc-yellow-4: rgb(200, 200, 0);
--mc-yellow-3: rgb(255, 255, 10);
--mc-yellow-2: rgb(250, 250, 149);
--mc-yellow-1: rgb(255, 255, 227);
--mc-blue-5: rgb(6, 60, 100);
--mc-blue-4: rgb(8, 97, 165);
--mc-blue-3: rgb(11, 140, 242);
--mc-blue-2: rgb(45, 155, 238);
--mc-blue-1: rgb(153, 211, 255);
}
@font-face {
font-family: 'SourceSans';
src: url("/media/ui/font/sourcesanspro_otf/SourceSansPro-Regular.otf") format("opentype");
}
.debugInfo {
display: none;
}
body {
font-family: var(--font-std);
font-weight: 400;
font-size: 1 rem;
letter-spacing: normal;
background: var(--app-background);
padding: 0;
margin: 0;
}
div {
margin: 0;
padding: 0;
box-sizing: border-box;
}
hr {
margin-block-start: 0.2rem;
margin-block-end: 0.2rem;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: 500;
}
table {
font: var(--font-semi);
border-collapse: collapse;
}
button,
.button {
-webkit-appearance: none;
font-weight: 600;
/* height: 1.5rem; */
margin: 0rem 0.4rem 0 0.1rem;
cursor: pointer;
padding: 0.2rem 0.5rem 0 0.5rem;
background: var(--mat-btns-back);
color: var(--mat-btns-fore);
border: var(--mat-btns-border);
box-shadow: var(--mat-btns-shadow);
letter-spacing: -0.03rem;
font-size: 0.9rem;
background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(240, 240, 240, 1) 3%, rgba(240, 240, 240, 1) 96%, rgba(255, 255, 255, 1) 100%);
}
button i,
.button i {
font-size: 1rem;
}
button:hover {
background: var(--mat-btns-highlight)!important;
text-decoration: none;
transform: matrix(1, 0, 0, 1.08, 0, 0)
}
div.appBar {
/* font-weight: 600;
margin-left: 10%;
margin-right: 10%;
margin-bottom: 0.4rem;
border-radius: 0 0 7px 7px; */
}
div.appContent {
padding: 0.3rem;
}
div.appBar div.appTitle a.breadCrumb {
/* margin: 0;
padding: 0;
font-weight: 400;
font-size: 1rem; */
}
div.appBar div.appTitle a.breadCrumb::before {
/* content: "/";
color: var(--links-forecolor);
font-weight: inherit;
margin: 0;
padding: 0; */
}
div.appBar a {
/* background: none;
text-decoration: none;
color: var(--links-forecolor);
border: none; */
/* 
font-size: 1.2rem;
*/
/* font-family: inherit;
font-weight: 600;
*/
}
div.appBar a:hover {}
div.appBar div.appUserLogin {
float: right;
position: relative;
font-weight: 200;
}
div.appBar div.appUserMenu a {
/* text-decoration: none;
font-weight: 600;
color: white;
white-space: nowrap; */
}
div.appBar div.appUserLogin:hover {
text-decoration: none;
border-bottom: 2px dotted var(--links-hover-forecolor);
color: var(--links-hover-forecolor);
cursor: pointer;
}
div.appBar div.appBarBottom {
background: var(--obj-background);
width: 100%;
bottom: 1px;
position: absolute;
}
div.card {
box-shadow: var(--card-shadow-std);
background: var(--card-background);
color: var(--card-forecolor);
border: var(--card-border);
padding: 0.7rem;
border-radius: 4px;
display: inline-block;
min-width: 13rem;
}