html,body { height:100%; margin:0; padding:0; width:100%;
	color:#333; }

body > #container {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns:30px 1fr 30px;
    grid-template-rows: 80px 25px 1fr;
}
header#main {
    grid-column:2/2;
    grid-row:1/1;
}
header#navInfo {
    grid-column:1/4;
    grid-row:2/2;
}
article{
	grid-column:2/2;
    min-height: 2em;
    grid-row:3/3;
  	align-self: start;
  	justify-self: center;
  	padding-top:15px;
}

footer{
	position:fixed; bottom:0px; left:0px; background-color:#d6efe7; width:100%; text-align:center;border-top:1px solid #aaa;
}

/* header part */
header#main div#logo > img { height:80px;}
header#main div#logo { vertical-align:middle; display:inline; }

header div.grid { 
	display:grid;
	grid-template-columns:50% 50%;
	height:100%;
}
header div.col1 { 
  	grid-column-start:1; 
  	grid-column-end:1;
  	align-self: center;
  	justify-self: center;
}
header div.col2 { 
  	grid-column-start:2; 
  	grid-column-end:2;
  	justify-self: start;
  	align-self: center;
}

header#navInfo .navInfo { width:300px; margin-left:30px; overflow:visible; position:relative; height:25px;}
header#navInfo .navInfo > div { position:absolute; white-space: nowrap; top:2px;}
header#navInfo .grid { background-color:#d6efe7; border-top:1px solid #aaa; border-bottom:1px solid #aaa;}

/* navs */
nav#main li a { display:inline-block;}
nav#main li a:hover { color:#56ad88;}
ul.navHori { margin:0;padding:0px; }
ul.navHori > li > ul { display:none;}
ul.navHori > li { float:left; padding:5px; list-style:none; cursor:pointer;}
ul.navHori ul[submenu] { position:absolute; display:none;z-index:200; }
ul.navHori ul[submenu] > li { padding:5px; border:1px solid black; margin:0; list-style:none; cursor:pointer;background-color:white;}
ul.navHori li a { text-decoration:none; color:#333; width:100%; height:100%; display:inline-block;} 
ul.navHori:after {
    content: ".";
    clear: both;
    display: block;
    visibility: hidden;
    height: 0px;
}

nav#submenu { height:30px; border-bottom:1px solid #333; width:100%;}
nav#submenu li a { display:inline-block;}
nav#submenu li a:hover { color:#56ad88;}
ul.navSubmenu { margin:0;padding:0px; }
ul.navSubmenu > li > ul { display:none;}
ul.navSubmenu > li { float:left; padding:5px; list-style:none; cursor:pointer;}
ul.navSubmenu ul[submenu] { position:absolute; display:none;z-index:200; }
ul.navSubmenu ul[submenu] > li { padding:5px; border:1px solid black; margin:0; list-style:none; cursor:pointer;background-color:white;}
ul.navSubmenu li a { text-decoration:none; color:#333; width:100%; height:100%; display:inline-block;} 
ul.navSubmenu:after {
    content: ".";
    clear: both;
    display: block;
    visibility: hidden;
    height: 0px;
}

section#main { margin-bottom:60px;}

/*dialogs */
[data-dlg] { display:none; }

/* lists */
[data-container] [data-action] { cursor:pointer; background-repeat:no-repeat; background-size: 16px 16px; display:inline-block; width:16px; height:16px;  }
[data-container] [data-action="edit"] { background-image: url('/core/images/icons/edit-2.png');  }
[data-container] [data-action="mwst_edit"] { background-image: url('/core/images/icons/edit-2.png'); position:absolute; }
[data-container] [data-action="delete"] { background-image: url('/core/images/icons/edit-delete-2.png');  }
[data-container] [data-action="add"] { background-image: url('/core/images/icons/edit-add-2.png');  }
[data-container] [data-action="save"] { background-image: url('/core/images/icons/Save.png');  }
[data-container] [data-action="cancel"] { background-image: url('/core/images/icons/Delete.png');  }

/* href styles */
a { text-decoration:none; color:#333; }
a:hover { color:#56ad88; }

/* h styes */
h3 { color:#56ad88; }


/* table styles */
table { border-collapse: collapse; border-spacing:0px;}
table td.valignTop { vertical-align:top; }
table td { padding:2px 18px; border-bottom:1px solid #ccc;vertical-align:top;}
table td.action,table th.action { border-left:1px solid #888888;}
table th { padding:2px 18px; border-bottom:1px solid #888888;vertical-align:top; text-align:left;}

/* table style kosten */
table.kosten { width:100%;}
table.kosten td {vertical-align:middle; border:none;}

th[data-field="VZNK"] { width:124px;}
th[data-field="VZHK"] { width:124px;}
span[data-field="VZHK"] { text-align:right; width:calc(100% - 20px); display:inline-block;}
span[data-field="VZNK"] { text-align:right; width:calc(100% - 20px); display:inline-block;}
input[data-field="VZHK"] { text-align:right; width:80px;}
input[data-field="VZNK"] { text-align:right; width:80px;}
[data-field="BETRAG"] { text-align:right;}
[data-field="LK_BETRAG"] { text-align:right;}
[data-field="BRENNSTOFF_MENGE"] { text-align:right;}
[data-field="WERT_LAST"] { text-align:right;}
[data-field="ABLESEWERT"] { text-align:right;}
[data-field="VERBRAUCH"] { text-align:right;}
[data-field="VERBRAUCH_VM"] { text-align:right;}
[data-field="VERBRAUCH_VJ"] { text-align:right;}
span[data-field="MWST_BETRAG"] { text-align:right; display:inline-block; width:100%;}
.extendHeader { }
.extendHeaderC > div  { display:inline-block; }
.extendHeaderC > div.extendSort > div  { display:inline-block; }
.extendHeaderC [data-extend-action]  { cursor:pointer; background-repeat:no-repeat; background-size: 16px 16px; display:inline-block; width:16px; height:16px; }

.extendHeaderC [data-extend-action="sortd"]  { background-image: url('/core/images/icons/arrow-down-2.png');  }
.extendHeaderC [data-extend-action="sorta"]  { background-image: url('/core/images/icons/arrow-up-2.png');  }

section div.submenu { background-color:red;}

div.userdata { width:650px;}

div.infoArea { text-align:center;}
div.infoArea { margin-top:5px; margin-bottom:5px;}
div.infoArea .error { color:red;}
div.infoArea .info { color:blue;}

.two_fields { width:100%; position:relative;}
.two_fields > a { position:absolute; top:0px; left:0px;}

a.genPDF { font-style:italic; color:#56ad88; }
a.genPDF_nutzer { font-style:italic; color:#56ad88; margin-left:20px; }


/* tabs */
[data-register-tab-type="container"] [data-register-tab-type="tabs"] {
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	align-items: center;
	width: calc(100% - 6px);
	position: relative;
	top: 0px;
	left: 0;
	z-index: 99;
	border: solid #dee2e6;
	border-width: 0 0 3px 0;
	border-color: transparent transparent #dee2e6 transparent;
	box-sizing: border-box;
	background-color: #fff;
	margin: 10px 0px;
}
[data-register-tab-type="container"] [data-register-tab-type="tabs"] [data-register-tab] {
	position: relative;
	font-weight: 700;
	font-size: 16px;
	text-align: center;
	color: #6c757d;
	background: #ffffff;
	border: solid #dee2e6;
	border-width: 0 0 3px 0;
	border-color: transparent transparent #dee2e6 transparent;
	padding: 10px 16px;
	border-top-right-radius: 6px;
	border-top-left-radius: 6px;
	margin: 0 0 -3px 0;
	cursor: pointer;
	white-space: pre;
	transition: background-color 0.2s, border-color 0.2s, box-shadow 0.2s;
}
[data-register-tab-type="container"] [data-register-tab-type="tabs"] [data-register-tab].activeTab {
	background: #ffffff;
	border-color: #3B82F6;
	color: #3B82F6;
	border-width: 0 0 3px 0;
	/* outline: 0 none;outline-offset: 0;box-shadow: inset 0 0 0 0.2rem #BFDBFE; */
	transition: background-color 0.2s, border-color 0.2s, box-shadow 0.2s;
}
[data-register-tab-type="container"] [data-register-tab-type="tabs"] [data-register-tab]:not(.activeTab):hover {
	background: #ffffff;
	border-color: #adb5bd;
	color: #6c757d;
	border-width: 0 0 3px 0;
}