.button { padding: 0.3em;margin-bottom: 0.3em; }
footer { 
	bottom:0em; 
	max-width:80em; 
	position:relative; 
	width: 100%; 
}
footer div p { font-size: 0.8em;}
footer table { min-width: 25%;}
h1 { 
	font-size: 1.3em; 
	font-weight: 600; 
}
table tr td input { 
	border-radius: 5px 5px 5px 5px;
	height:2em;
	margin: 0.2em; 
	width:100%; 
}


.button {
	margin: 0em 0em 0.5em 0.5em; 
	padding: 0.4em 0em; 
}
.company-logo { 
	float:right; 
	padding: 1em 1em 0.5em 1em; 
}
.company-logo img { width: 5em;}
.container {
	margin: 0px auto;
	max-width:80em;
	/* height: 100vh; */
	min-width:340px;
	padding:0px;
	width: 80%;
}
.content { 
	min-height:17em;
	padding-top:0em; 
	overflow: auto;
}
.content-inner, .footer-inner { 
	padding: 1em ; 
}
.content-title {
	margin-bottom: 1em;
}
.dialog { z-index: 1000; width: 80%; }
#dialog-content { width: 90%; font-size: 0.8em; }
.dialog-content { 
	max-width:80%; 
	min-width:70%;
}
.dialog-logo {width: 5em;}

.form-input, .form-label{ 
	float:left; 
	padding: 0.2em 0em;	
}

form { width: 100%; border: 0px solid darkgreen;}
.form-label { width: 10em; float: left; padding-bottom: 0.3em; }
.form-inputs { width: 60%; float: left; padding-bottom: 0.3em; }

.header {
	width: 100%;
}
.header-logo {
	width: 5em;
	height: 4em;
	margin-top: 3em;
	padding-right: 1em;
	float: right;
}
.header-logo-img {
	width: 100%;	
}
.icon, .icon-2, .icon-3, .icon-4, .fa, .fa-2, .fa-3, .fa-4 { margin-right: 0.5em !important; margin-top: 0em !important;}
.input-col-field { width: 45%;  }

.menu { z-index: 100;}
.menu li a { padding: 0.6em;}
.menu li ul , .menu ul li { min-width: 14em;}
.menu ul li ul li { min-width: 18em;}
.navi-head li { width: 25%;}

.portrait { position: relative; width: 13em; padding: 1.0em; }
.relative-bottom { position: absolute; bottom:1.4em;background-color: silver; opacity: 0.7 ;width:14.7em;padding: 0.5em;height:4.7em; font-size:0.75em;}

.td-label { font-weight: bold; width: 17em; }
.xspDataTableViewPanel , .table-view { font-size: 0.85em;}


@media only screen and ( max-width: 1024px){ /* iPads und kleiner */
	body { font-size: 1.0em;}
	.container{ font-size: 0.8em; }
	.container, #header , #footer { width: 95%; min-width:340px;}
	#content { min-height: 28em; }
	#content-banner { padding-top:0.79em;margin:0px;}	
	.dialog { max-width: 100%; }
	#dialog-content { width: 80%; font-size:0.8em; } 
	.dialog-content { 
		max-width:90%; 
		min-width:80%;
	}

	#footer { width: 100%; max-width: 100%; font-size: 1.3em; }
	.form-label { float:none; min-width: 100%; padding: 0em 0em;}
	.form-inputs { float:none; min-width: 100%; padding: 0.2em 0em; }
	#header { position: relative; top: 0px; width:100%; z-index:10; }
	.input-col-field { width: 100%;  }
	.mobile-only { display:block; }
	.navi-head li { width: 25%;}
	.navi-main li a , .navi-footer li a  { font-size: 1.0em; }
	.portrait { position: relative; width: 13em; padding: 1.0em; }
	.relative-bottom { position: absolute; bottom:1.45em;background-color: silver; opacity: 0.7 ;width:14.7em;padding: 0.5em;height:5.3em; font-size:0.75em;}
	table{ font-size: 0.8em; }
	.xspDataTableViewPanel , .table-view { font-size: 1.1em;}
}
@media only screen and ( max-width: 1024px) and (orientation: portrait){ /* iPads und kleiner */
	#dialog-content { width: 100%; margin-top: 1em; font-size: 0.8em;} 
	.dialog-content { 
		width:100%; 
	}
	.menu > li a { font-size: 0.7em;}
	.navi-head li { width: 33.33%; border-left: 1px solid #eee; text-align: center;}
	.content-content table { border: 1px solid #eee;margin-top:1em; width: 100%;}
	.td-label { width: 12em; border-bottom: 1px solid #eee;}
	.td-input { border-bottom: 1px solid #eee; width: 50%; }
}