@CHARSET "UTF-8";
/*
Farben:
gruen : rgb(135,175,53)
petrol: rgb(17,89,92)
rot: rgb(180,33,28)
blau: rgb(177,207,226)

dunkelblau: rgb(0,52,102);
mittelblau: rgb(80,114,149);

grau: rgb(104, 106, 105)
*/
/*
CSS zu SPES (ab 2019)  
*/
/* grosse Bildschirme: (Computer)
* iPad4, iPad Mini 1024px
* Nexus 7 960px;
*/
@media screen and (min-width: 960px) {
	#head-inner-small{display:none;}
	#navigation-main-small-btn-area{display:none;}	
	#navigation-main-small-btn-area a{display:none;}	
	#navigation-main-small{display:none;}
	.zw-normal-size{
		max-width:780px;
		min-width:300px;
		width:65%;
	}
}	
/* kleine Bildschirme (Smartphone)
* iPhpone 4 480px
* Samsung Galaxy S4 640px;
*/
@media screen and (max-width:959px) {
	#head-inner-fullsize{display:none;}
	#mtop{display:none;}
	#zw-margin{display:none;}
	#navigation-main{display:none;}
	.zw-normal-size{min-width:300px;}
	.printicon{display:none;}		
}
body {
	max-width:1920px;
	margin:0;
	padding:0;
	font-family: verdana;
	font-family: "Times New Roman", Times, serif;	
	font-size: 16px;
}
/*
h1 {font-size: 1.5em;color: #888;font-weight:normal;}
h2 {font-size: 1.2em;color: #666;}
h3 {font-size: 1.0em;color: #666;}
h4 {font-size: 1.5em;color: #666;font-weight:normal;}
h5 {font-size: 1.2em;color: #666;font-weight:normal;}
h6 {font-size: 1.0em;color: #666;font-weight:normal;}
*/
p {
	font-size: 1em;
	line-height: 1.75;
	margin-bottom:25px;
  	color: #383838;
}
a	{font-size: 1rem;text-decoration:none;font-style:italic;color: rgb(80,114,149)}
a:hover {text-decoration:underline;color: red;}
/* list elements */	
ul {
	list-style-type:'... ';
}
li {
	margin-bottom: 8px;
	font-size: 1.0em;
  	color: #383838; 	
	}
/* table elements */		
th	{
	margin: 0;
	border-bottom: 1px solid lightsteelblue; ;
	padding-right:1em;
	padding-top: 5px;
	padding-right:1em;
	padding-bottom: 3px;
	font-weight: bold;
	font-size: 1.0em;		
	}
tr {
 	background-color:#fff; 	
	}	
td	{
	margin: 0;
	border: 0;
	padding: 0;
	padding-left: 3px;
	padding-right: 3px;		
	padding-top: 3px;
	padding-bottom:3px;
	vertical-align: top;	
	text-align: left;
  	color: #333;
	}
/* form elements */	
label {display:inline-block;width:15em;}
select {font-size:1.1em;padding:0.4em;}
input {font-size: 1em;letter-spacing: normal; line-height: 1.5;}
textarea {padding:1em;font-size: 0.9em;}
img {max-width: 100%;height: auto;}
/*
* style für cookiehinweis ...
* Zusammenhang mit entspr. js Routinen in websitetools	
*/
#cookieNotice {
  	position: fixed;
  	display: block;
  	left: 0;
  	right: 0;
  	bottom: 20px;
  	margin: 0;
  	border-top:solid 1px #a0a0a0;  
	padding:10px;
	padding-left:1em;
	padding-right:10em; 
	font-size:0.8em;
	background:rgb(249,249,250);
	color:black;		 
}  
/*
* end
*/
#screenwrapper {
	min-width:300px;
}
 /*--- menu top: drop-down-menu -----------------------------------------------*/  
 #mtop {
	text-align:center;
	background: rgb(0,52,102);
 }
 #mtop-inner {
 	max-width:1280px; /* siehe co-wrapper */
	margin-left: auto;
	margin-right: auto;	
  	padding-left:2em;
	padding-right:2em;	
 	text-align:left; 
 }
 /* allgemeine Definitionen zur Vererbung */
 #mtop ul{
 	display:inline-block; 
  	padding:0;
  	margin:0;
	list-style-type:none;
 }
 #mtop li {
 	padding:0;
 	margin:0;
   	float:left;
 }
 #mtop  a {
    display: block;
    width:180px;
    padding:5px; 
    text-decoration: none;
    font-size: 1.1rem;
	background: rgb(0,52,102); 	
    color: #fff;
 }
 #mtop  a:hover {
    background:#fff;
    color: #000;
 } 
 /*** Ebene 0 */
 #mtop ul li {
    position: relative;
    width: 190px;
 }
 #mtop  li:hover {
    z-index: 530;  
    -moz-box-shadow: 5px 5px 5px #333;
    -webkit-box-shadow: 5px 5px 5px #333;
    box-shadow:5px 5px 5px #333; 
 }
#mtop  li:hover a{}
/*** Ebene 1 */
#mtop  li ul {
    top: 32px;
    left:0px;  
    position: absolute;
    display: none;
    width: 20em;
    padding:0px;
}
#mtop  li:hover ul {
    display: block;
}
#mtop li ul li {
    -moz-box-shadow: 5px 5px 5px #333;
    -webkit-box-shadow: 5px 5px 5px #333;
    box-shadow:5px 5px 5px #333;  
    width: 100%;
}
#mtop li ul li a{
    padding-left:20px;
    text-align:left;
    font-size: 1.0rem;
    /* Farben */ 
    background-color: #fff;
	color:#000;	
}
/* Ebene 2 ff soll nicht angezeigt werden */
#mtop li ul li ul li {
    display: none;  
}
/*
-----------------------------------------------------------------------------
 Buttonliste wird im internen Programmteil für die Button-Navigation benutzt
-----------------------------------------------------------------------------
*/
#nav-btnlist-main{
 	border-top:1px solid rgb(17,89,92); /*petrol*/
 	padding-left:1em;
 	padding-right:1em;
	text-align:center;
	
 }
#nav-btnlist-main-inner {
 	display:inline-block;
	width:100%; /* siehe einspaltig normal */
 } 
#nav-btnlist-main ul{
	float:right;
	padding:0;
  	margin:0;
	list-style-type:none; 	
 }
#nav-btnlist-main li{
	float:left;
 }
#nav-btnlist-main .buttonSubmitNavi {
	width: 150px;
	padding-top:3px;
	padding-bottom:3px;
	padding-left: 3%;
	padding-right:2%;
	/*border:2px solid rgb(0, 87, 92); */
	border:2px solid #fff;
	border-bottom:2px solid rgb(0, 87, 92);
	text-align:center;
	font-size:1.0em;
	font-style:italic;	
	/*
	background: rgb(0, 87, 92);			
	color:#fff;	
	*/	
	background: #fff;			
	color: rgb(0, 87, 92);	
}
#nav-btnlist-main .buttonSubmitNaviAktiv {
	width: 150px;
	padding-top:3px;
	padding-bottom:3px;
	padding-left: 3%;
	padding-right:2%;
	border:2px solid rgb(124, 175, 34); 
	text-align:center;
	font-size:1.0em;
	font-style:italic;	
	background:rgb(124, 175, 34);
	color:#fff;		
}
#nav-btnlist-main .buttonSubmitNavi:hover {
	border:2px solid rgb(124, 175, 34); 	
	background:rgb(124, 175, 34);
	color:#fff;
}
#nav-btnlist-main .buttonLogoutNavi{
	width: 150px;
	padding-top:3px;
	padding-bottom:3px;
	padding-left: 3%;
	padding-right:2%;
	border:2px solid #fff; 
	border-bottom:2px solid rgb(180,33,28); 
	text-align:center;
	font-size:1.0em;
	font-style:italic;	
	background:#fff;
	color: rgb(180,33,28);		
}
#nav-btnlist-main .buttonLogoutNavi:hover {
	border:2px solid rgb(124, 175, 34); 	
	background:rgb(124, 175, 34);
	color:#fff;
}
#nav-btnlist-sub{
	width:100%;	
	/*text-align:center;*/	
	padding-top:0.5em;
}
#nav-btnlist-sub ul{
	display:inline-block;
	margin:0;
  	padding:0;
	list-style-type:none; 
 }
#nav-btnlist-sub li{
	float:left;
}	 
#nav-btnlist-sub .buttonSubmitNavi {
	width: 200px;
	padding-top:3px;
	padding-bottom:3px;
	padding-left: 3%;
	padding-right:2%;
	text-align:center;
	font-size:0.9em;
	font-style:italic;	
	background: #fff;			
	color:rgb(0, 87, 92);		
}
#nav-btnlist-sub .buttonSubmitNaviAktiv {
	width: 200px;
	padding-top:3px;
	padding-bottom:3px;
	padding-left: 3%;
	padding-right:2%;
	text-align:center;
	font-size:0.9em;
	font-style:italic;	
	background:rgb(124, 175, 34);
	color:#fff;		
}
#nav-btnlist-sub .buttonSubmitNavi:hover {
	background:rgb(124, 175, 34);
	color:#fff;
}

  
#co-background {}
#co-wrapper {
	margin:0;
	padding:0;
}
#co-main {
	width:100%;
	overflow: hidden;
	min-height:600px;
	padding-top:0;
	padding-bottom:0;	
}
#co-foot {
	padding-top:0.5em;
	padding-bottom:0.5em;
	overflow:hidden;
	background:#fff;
	text-align:right;	
}
#foot {
	width:100%;
	min-height:300px;
	overflow: hidden;	
	background:rgb(0,52,102);		
}
#foot-inner {
	max-width:1280px;
	margin-left: auto;
	margin-right: auto;
	margin-top:0;
	margin-bottom:0;
}
#foot ul {
	list-style-type:none;
}
#foot ul li {
    width: 12rem;
}
#foot p {}
#foot  a {
    display: block;
    padding:5px;
    color:white;
}

#foot  li:hover {
    z-index: 530;  
    -moz-box-shadow: 5px 5px 5px #333;
    -webkit-box-shadow: 5px 5px 5px #333;
    box-shadow:5px 5px 5px #333;   
 } 
#foot .links {
	width:25%;
	min-width:200px;
	min-height:300px;
	float:left;
}
#foot .normal {
	width:25%;
	min-width:200px;	
	min-height:300px;
	float:left;
}
#foot .rechts {
	width:25%;
	min-width:200px;	
	min-height:300px;
	float:left;
}
#foot .rand {
	width:23%;
	min-width:200px;	
	min-height:300px;
	float:left;
	padding-left:1em;
}
.fixed-foot{
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: rgb(0,52,102); /*dunkelblau*/
  color: white;
  text-align: center;
}
/*
*
* Content-Bereiche
*
*/
/*------ einspaltig ------*/
.co-einspaltig-normal {
	clear:both;
	max-width:980px;
	min-width:300px;
	margin-left: auto;
	margin-right: auto;
	padding-left:1em;
	padding-right:1em;	
}
/*------ zweispaltig ------*/
.co-zweispaltig-wrapper {
	clear:both;
	max-width:980px;
	min-width:300px;
	margin-left: auto;
	margin-right: auto;
}
.co-zweispaltig-normal {
	float:left;
	max-width:458px;
	min-width:300px;	
	min-height:300px;
	padding-left:16px;	
	padding-right:16px;				
}
.co-zweispaltig-rechts{
	float:left;
	max-width:458px;
	min-width:300px;
	min-height:300px;
	padding-left:16px;	
	padding-right:16px;	
}

/*------ dreispaltig ------*/
.co-dreispaltig-wrapper{
	clear:both;
	max-width:997px;	
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
}
.co-dreispaltig-links{
	float:left;
	width:300px;
	min-height:300px;
	padding-right:1em;	
	padding-left:1em;	
}
.co-dreispaltig-normal {
	float:left;	
	width:300px;
	min-height:300px;
	padding-right:1em;
	padding-left:1em;				
}
.co-dreispaltig-rechts{
	float:left;
	width:300px;
	min-height:300px;
	padding-right:1em;	
	padding-left:1em;	
}

/*------ vierspaltig ------*/

.co-vierspaltig-wrapper{
	clear:both;
	max-width:1050px;	
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
}
.co-vierspaltig-links{
	float:left;
	width:230px;
	min-height:300px;
	padding-right:1em;	
	padding-left:1em;	
}
.co-vierspaltig-normal {
	float:left;	
	width:230px;
	min-height:300px;
	padding-right:1em;
	padding-left:1em;				
}
.co-vierspaltig-rechts{
	float:left;
	width:230px;
	min-height:300px;
	padding-right:1em;	
	padding-left:1em;	
}
.co-vierspaltig-rand{
	float:left;
	width:230px;
	min-height:300px;
	padding-right:1em;	
	padding-left:1em;	
}

/*------ einspluszweispaltig ------*/

.co-einspluszweispaltig-wrapper{
	max-width:1280px;	
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
}
.co-einspluszweispaltig-links{
	max-width:1280px; /* gesamte Spaltenbreite oben*/
	min-width:300px;
	margin-left: auto;
	margin-right: auto;	
}
.co-einspluszweispaltig-normal {
	float:left;
	max-width:780px;
	min-width:300px;	
	min-height:300px;
	padding-right:1em;
	padding-left:1em;				
}
.co-einspluszweispaltig-rechts{
	padding-left:1em;
	float:left;
	min-width:300px;
	max-width:400px;
	min-height:300px;	
}
/* Verwendung in cl-base */
.box_tabelle {
	clear:both;
	padding:0;
	}
.box_tabelle tr {
	}	
.box_tabelle th {
	margin:0;
	padding-left:3px;
	padding-right:3px;	
	font-size:12px;
	}	
.box_tabelle td {
	margin:0;
	padding:0;
	font-size:12px;
	}
.box_tabelle td p{font-size:11px;}		

.buttonSubmit {
	width: 200px;
	padding-top:3px;
	padding-bottom:3px;
	padding-left: 3%;
	padding-right:2%;
	border-left: 2px solid #ccc;	
	border-top: 2px solid #ccc;
	border-right: 2px solid #999;
	border-bottom: 2px solid #999;
	border-radius: 0.5em;	
	text-align:center;
	font-size:1.0em;
	font-style:italic;	
	background: #fff;			
	color:#000;		
}
.buttonSubmit:hover {
	background:#ddd;
}
.buttonPrint {
	width: 200px;
	padding-top:5px;
	padding-bottom:5px;
	padding-left: 3%;
	padding-right:2%;
	border-left: 2px solid #ccc;	
	border-top: 2px solid #ccc;
	border-right: 2px solid #999;
	border-bottom: 2px solid #999;
	border-radius: 0.5em;	
	text-align:left;
	font-size:1.2em;
	font-style:italic;	
	background: #fff;			
	color:rgb(0, 87, 92);		
}
.buttonPrint:hover {
	background:rgb(124, 175, 34);
	color:#fff;
}
.buttonAbmelden {
	border-radius: 0.5em;
	padding:10px;
 	background:rgb(0, 87, 92);		
	color: #fff;	
}
.buttonAbmelden:hover {
  background:rgb(124, 175, 34);	
}
 /*--- Button fuer Auswahl in Tabelle -----------------------------------------------*/  
.buttonAW {
	width: 30px;
	border-left: 2px solid #ccc;	
	border-top: 2px solid #ccc;
	border-right: 2px solid #999;
	border-bottom: 2px solid #999;
	text-align:center;
	font-size:0.8em;
	font-style:italic;	
}
 /*--- crumb-Pfad über Content -----------------------------------------------*/  
.crumb {
	overflow:hidden;
	padding-right:0.5em;
	text-align:right;
	margin:0.3em;
	font-size:0.7rem;
	font-style:italic;
}
#btnToTop {
	z-index: 999; 	
	display: none; 
	position: fixed; 
	bottom: 22px; 
	right: 0.5em; 
	outline: none;
	width:80px;
	height:80px;
	padding-bottom:5px;
	border:1px solid black;   
	border-radius: 50%; 
	font-size: 30px; 
	background-color: white;
	color: black;	
}
#btnToTop:hover {background-color: #555;color: white;border:1px solid white;}	