:root{
	--background: #FFF;
	--background2: #EFEFEF;
	--tabheadbg: #E1E1E1;
	--tabbg: #F9F9F9;
	--tabbghover: #E9E9E9;
	--border: #D1D1D1;
	--text: #333333;
	--textLight: #666666;
	--gtue: #DA1F3D;
}

html, body{
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	color: var(--text);
}

body{
	font-size: 1.2em;
	/*background: #CCC;*/
	background: var(--background);
}

body>div:first-child{
	min-height: 100vh;
	background: linear-gradient(170deg, rgb(225, 225, 225) 60%, #989da1 96%, #3e4347 100%);
	/*background: linear-gradient(transparent 7em, var(--gtue));*/
	display: inline-block;
	width: 100%;
}


a{
	color: #878787;
}
a:visited{
	color: #878787;
}
input[type=button]{
	height: 50px;
	min-width: 50px;
	border-radius: 10px;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	background: linear-gradient(135deg, #c7c6c8 46%, #797c7e 87%, #404040 100%);
}

#logout{
	height: inherit;
}

.switch{
	padding: 10px;
	border: 1px solid var(--textLight);
	background: var(--tabbghover);
	cursor: pointer;
	border-radius: 5px;
	min-width: 1em;
	text-align: center;
	box-shadow: 0 0 3px;
}
.switch.on{
	box-shadow: inset 0 0 3px;
}
.switch::before{
	content: attr(data-value);
}
.switch:hover{
	border: 1px solid var(--text);
	background: var(--border);
}
.switch:active{
	border: 1px solid #000;
	background: #888;
	box-shadow: none;
}


#head{
	padding: 5px 30px;
	border-bottom: 1px solid var(--border);
	margin-bottom: 20px;
	box-shadow: 0 0 20px;
	background-color: #070707;
	color: #878787;
}
#head>div{
	margin-left: 100px;
}
#head img{
	vertical-align: bottom;
}
#head > h1{
	margin-top: 38px;
}

.mblogo{
	width: 75px;
	float: left;
	margin-top: 15px;
	margin-right: 20px;
}

.brandList img{
	max-height: 100px;
	max-width: 100px;
	margin-top: 20px!important;
}

#nav{
	background: linear-gradient(var(--background), var(--border));
	border-bottom: 1px solid var(--border);
	margin-bottom: 1em;
	padding: 5px 30px;
}

#menu{
	background: var(--background2);
	border-top: 1px solid var(--border);
	min-height: 30px;
	box-shadow: 0 0 10px;
	margin-bottom: 2em;
	display: flex;
	flex-wrap: wrap;
}

#menu.left{
	float: left;
	margin-left: 0px;
	margin-right: 20px;
}

#fmenu > div{
	cursor: pointer;
}

#fmenu > div,
#menu > a{
	border: 1px solid var(--border);
	border-left: none;
	padding: 30px 40px 25px 30px;
	text-decoration: none;
	color: black;
	display: block;
	flex-grow: 1;
	min-width: 160px;
}

@media (min-width:1120px){
	#menu > a{
		padding-bottom: 15px;
		min-width: auto;
		border-top: none;
	}
}

.tempIFrame4Print{
	position: absolute;
	left: -1000px;
	top: 0;
	width: 1px;
	height: 1px;
	visibility: hidden;
}

#fmenu{
	float: right;
	width: 350px;
	border-left: 1px solid var(--border);
	background: var(--background2);
	box-shadow: 0 0 5px #000;
}

#fmenu:empty,
#menu:empty {
	display: none;
}

#menu.left > a{
	border-right: none;
	border-left: 1px solid var(--border);
}

#menu > .hasSubFunc{
	/**/
}
#menu >.menusubfunc{
	display: none;
}

.menuSelection{
	font-size: 0.8em;
	font-style: italic;
	color: var(--textLight);
	margin-left: 5px;
}

#fmenu > div:hover,
#menu > a:hover{
	background: rgba(0, 0, 0, .05);
}

#fmenu > .currentMenuOpt,
#menu > .currentMenuOpt{
	color: #da1f3d;
}
#fmenu > div:active,
#menu > a.currentMenuOpt,
#menu > a:active{
	background: rgba(0, 0, 0, .1);
}

#fmenu > .currentSubOpt,
#menu > .currentSubOpt{
	color: var(--textLight);
	cursor: pointer;
}

#fmenu .info{
	float: right;
}


/*
#menu{
	background: var(--background2);
	border-top: 1px solid var(--border);
	border-bottom: 1px solid var(--border);
	margin-bottom: 1em;
	text-align: center;
	float: left;
	margin-right: 10px;
}

#menu > a{
	padding: 10px 30px;
	border-right: 1px solid var(--border);
	text-decoration: none;
	color: black;
		display: block;
}

#menu > a:hover{
	background: rgba(0, 0, 0, .05);
}

.currentMenuOpt{
	color: var(--gtue);
}

#menu > a.currentMenuOpt,
#menu > a:active{
	background: rgba(0, 0, 0, .1);
}

#menu:empty,
*/
#nav,
#nav:empty{
	display: none;
}

#nav>*,
.paddedInline>*{
	margin: 0 5px;
}
.paddedInline{
	padding-left: 66px;
}
.paddedInline>input,
.paddedInline>select{
	max-width: 300px;
	margin-left: 1em;
}

#nav>span:not(:last-child)::after{
	content: ' > ';
	color: #F00;
	margin-left: 10px;
}
#nav>span:last-child{
	font-weight: bold;
}

#main{
	padding: 5px 30px;
	padding-bottom: calc(2em + 5px);
	margin-right: 350px;
}
#main.right{
	margin-left: 350px;
	margin-right: 0;
}
#main:empty::after{
	content: 'Loading...';
}

#footer{
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 5px 30px;
	border-top: 1px solid var(--border);
	background: var(--background);
}



table, .hybridTab{
	border-collapse: collapse;
	background: var(--tabbg);
}

thead{
	background: var(--tabheadbg);
	font-weight: bold;
}

table tr, .hybridSet{
	border: 1px solid var(--border);
}

th, .hybridCell{
	text-align: left;
	padding: 2px 10px;
}
tbody>tr:hover, .hybridSet:hover{
	background: rgba(0, 0, 0, .05);
}

.hybridSet:hover:not(:active){
	box-shadow: 0 0 9px #000;
}

td, .hybridCell{
	padding: 2px 10px;
}

.hybridTab{
	display: table;
	position: relative;
}
.hybridTab.tileMode{
	display: grid;
	column-gap: 20px;
	row-gap: 20px;
	grid-template-columns: repeat(3, auto);
	background: inherit
}
.hybridTab.tileMode thead{
	display: none;
}
.hybridTab.tileMode tbody{
	display: block;
}

@media (min-width:1120px){
	.hybridTab.tileMode tbody{
		display: contents!important;
	}
}

.hybridTab>.modeSwitch{
	display: block;
	position: absolute;
	bottom: 100%;
	margin-bottom: -1px;
	left: 0;
	background: var(--tabbg);
	padding: 10px;
	border: 1px solid var(--border);
}
/*
.hybridTab>.modeSwitch>div{
	cursor: pointer;
}
*/

.hybridSet{
	display: table-row;
}

.hybridTab.tileMode .hybridSet{
	background: var(--tabbg);
	box-shadow: 5px 5px 15px #000;
}
.hybridTab.tileMode .hybridSet:hover{
	box-shadow: 0 0 9px #000;
}

.tileMode .hybridSet{
	display: grid;
	grid-template-columns: auto 1fr;
	column-gap: 10px;
	padding: 3px;
}
.tileMode .hybridSet.pageNav{
	display: flex;
	text-align: center;
}
.hybridSet.pageNav .hybridCell.pageNav > div{
	cursor: default;
	display: inline;
 }
.hybridSet.pageNav .hybridCell.pageNav > *{
	flex-grow: 1;
}
.tileMode .hybridSet.pageNav .hybridCell.pageNav > *{
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-bottom: 20px;
}
.hybridSet.pageNav .hybridCell.pageNav a:first-child{
	text-align: left;
	float: left;
}
.hybridSet.pageNav .hybridCell.pageNav a:last-child{
	text-align: right;
	float: right;
}
.tileMode .hybridSet.pageNav .hybridCell.pageNav a:last-child{
	margin-right: 25px;
}

.hybridCell{
	display: table-cell;
	word-break: break-word;
}
.hybridTab.tileMode .hybridCell{
	display: contents;
}
.hybridTab.tileMode .hybridCell[data-title]::before{
	content: attr(data-title) ": ";
	color: var(--textLight);
}
.hybridTab.tileMode .hybridCell[data-title=""]::before{
	content: '';
}
.hybridTab .hybridSet{
	margin-bottom: 10px;
}

.hybridTab:not(.form) .hybridSet:not(.pageNav) .hybridCell:last-child:has(a){
	display: none;
}
.hybridTab .hybridSet:not(.pageNav):has(.hybridCell:last-child>a){
	cursor: pointer;
}
.hybridTab.buttoned .hybridCell>span{
	text-align: center;
}


.flowdown{
	display: flex;
	flex-direction: column;
}

.flowright{
	display: flex;
	flex-direction: row;
}

.flowdown,
.flowright{
	/*for some reason we need this to make stuff scrollable*/
	min-width: 0px;
	min-height: 0px;
}

.grow{
	flex-grow: 1;
}





.overlay{
	position: fixed;
	display: flex;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 100000;
}

.overlay>div{
	margin: auto;
    padding: 10px;
    border: #FFF solid 1px;
	background: #CCC;
}

.tempIFrame4Print{
	position: absolute;
	left: -1000px;
	top: 0;
	width: 1px;
	height: 1px;
	visibility: hidden;
}

.JSONOverlay{
	position: relative;
}
.JSONOverlay>div{
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	white-space: pre;
	background: #F8F9FD;
	border: 1px solid #000;
	border-radius: 3px;
	padding: 3px;
	z-index: 999;
}
.JSONOverlay:hover>div{
	display: block;
}

.orb{
	border: 1px solid var(--border);
	border-radius: 20px;
	height: 1em;
	width: 1em;
	display: inline-block;
}

.warnbox:empty{
	display: none;
}
.warnbox{
	border: 1px solid var(--border);
	margin-bottom: 2em;
}
.warnbox::before{
	content: 'ACHTUNG';
	font-size: 1.1em;
	font-weight: bold;
	color: var(--gtue);
}
.warnbox>div>div:first-child{
	font-weight: bold;
}
.warnbox>div>div:not(:first-child){
	margin-left: 5em;
}

.hybridCell:has(> input[type="radio"]),
.hybridCell:has(.conditionalInstruction > input[type="radio"]),
.hybridCell:has(.conditionalImageUpload > input[type="radio"]) {
	text-align: center;
}

.conditionalInstruction,
.conditionalImageUpload{
	position: relative;
}
.conditionalInstruction>div,
.conditionalImageUpload>div{
	display: none;
	position: absolute;
	top: 0;
	left: 200px;
	white-space: nowrap;
}
.conditionalInstruction>div{
	left: 140px;
}
.conditionalInstruction>input:checked+div,
.conditionalImageUpload>input:checked+div{
	display: block;
}

.conditionalInstruction>div>div,
.conditionalImageUpload>div>div{
	height: 2em;
	display: inline-block;
}
.conditionalInstruction>div>div>img,
.conditionalImageUpload>div>div>img{
	max-height: 2em;
	vertical-align: middle;
	cursor: pointer;
}

.conditionalInstruction .insStatus:has(+*+input[value=""])::before,
.conditionalImageUpload .imgStatus:has(+*+input[value=""])::before{
	content: '\2716 ';
	color: #F00;
}

.conditionalInstruction .insStatus:has(+*+input:not([value=""]))::before,
.conditionalImageUpload .imgStatus:has(+*+input:not([value=""]))::before,
.conditionalImageUpload .imgStatus:has(+*+*+input:not([value=""]))::before{
	content: '\2714 ';
	color: green;
}

.imgUploadForm .uploadPreview{
	max-height: 60vh;
	max-width: 60vw;
}


.globalres .hybridCell:nth-child(3n+2){
	border-left: 1px solid var(--border);
}
.globalres .hybridCell:nth-child(9n+2){
	border-left: 4px solid var(--border);
}

.globalres thead .hybridSet:nth-child(1) th.hybridCell{
	border-left: 4px solid var(--border);
}
.globalres thead .hybridSet:nth-child(2) th.hybridCell{
	border-left: 1px solid var(--border);
}
.globalres thead .hybridSet:nth-child(2) th.hybridCell:nth-child(3n+2){
	border-left: 4px solid var(--border);
}

.globalres .hybridTab{
	display: inline-block;
	overflow: auto;
}
.globalresSimple .hybridCell,
.globalres .hybridCell{
	min-width: 100px;
}

/*
.globalresSimple .hybridCell:nth-child(n+2){
	display: none;
}
.globalresSimple.pkw thead .hybridSet:first-child .hybridCell:nth-child(2),
.globalresSimple.pkw thead .hybridSet:not(:first-child) .hybridCell:nth-child(n+2):nth-child(-n+7),
.globalresSimple.pkw tbody .hybridCell:nth-child(n+2):nth-child(-n+7),

.globalresSimple.van thead .hybridSet:first-child .hybridCell:nth-child(3),
.globalresSimple.van thead .hybridSet:not(:first-child) .hybridCell:nth-child(n+8):nth-child(-n+13),
.globalresSimple.van tbody .hybridCell:nth-child(n+8):nth-child(-n+13),

.globalresSimple.smart thead .hybridSet:first-child .hybridCell:nth-child(4),
.globalresSimple.smart thead .hybridSet:not(:first-child) .hybridCell:nth-child(n+14),
.globalresSimple.smart tbody .hybridCell:nth-child(n+14){
	display: table-cell;
}

*/