﻿* {       /* Außen- Innenabstände global zurücksetzen */
 margin:0;
 padding:0;
}


body {
	font: 14px "Expletus Sans", cursive, Arial;
	color: #000000;

	background-color: #FFFFFF;
	
}

#container {				/*margin=Aussenabstand, padding=Innenabstand*/
	width: 80%;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: auto;
	margin-right: auto;
	/*background-color: #FFFFFF;*/
}


/* Ueberschrift 1 */

h1 {
	font-size: 25px;
	font-weight: bold;
}


/* Ueberschrift 2 */

h2 {
	font-size: 20px;
   	line-height:25px;
	font-weight: bold;
	/*margin-bottom: 20px;*/
}


.text_rot {
	color: #DF0101;
}



.menue-button {
	display: none;
}		



#verweisekopf {
	float: left;	
   	width: 200px;                   
	padding: 10px;			
	margin: 0px;			
   	font-size: 20px;
   	text-align: right;              
   	line-height: 25px;
   /*	background-color: #A4A4A4; */
}

#verweisekopf ul {
   	list-style: none;               /* keine Aufzählungspunkte */
}

#verweisekopf li {
/* 	display: inline; */
   	margin-left:2px;                
   	margin-right:2px;              
}

#verweisekopf a:link { text-decoration:none; color: #000000; }
#verweisekopf a:visited { text-decoration:none; color: #000000; }
#verweisekopf a:focus { text-decoration:none; color: #848484; }
#verweisekopf a:hover { text-decoration:none; color: #848484; }
	
#verweisekopf #aktuelle_seite a { text-decoration:none; color: #848484; }




#verweisekopf_logo {
	float:left;	
   	width: 200px;                   
	padding: 10px;			
	margin: 0px;			
   	font-size: 45px;
   	text-align: right;              
   	line-height:50px;
	font-weight: bold;
   /*	background-color: #A4A4A4; */
}

#verweisekopf_logo a:link { text-decoration:none; color: #000000; }
#verweisekopf_logo a:visited { text-decoration:none; color: #000000; }
#verweisekopf_logo a:focus { text-decoration:none; color: #848484; }
#verweisekopf_logo a:hover { text-decoration:none; color: #848484; }




#box_logo {
	padding-top: 73px;		
	padding-bottom: 14px;		
	margin: 0px;			
	text-align: left;
/*	background-color: #F2F2F2; */

}


#box_ueberschrift {
	margin-top: 30px;
	margin-bottom: 10px;
	padding: 10px;	
	text-align: left;
     /*   background-color: #FFFFFF; */
	
}

table {
	float:left;
	width: 100%;
	margin-top: 0px;
	margin-bottom: 0px;
	text-align: left;
     /*   background-color: #FFFFFF; */
}

.spalte1_ueberschrift {
	padding-top: 30px;
	padding-bottom: 10px;	
	padding-left: 10px;	
	font-size: 20px;
   	line-height:25px;
	font-weight: bold;
}


.spalte1 {
	width: 20%;
	padding: 10px;	
	font-size: 20px;
   	line-height:25px;
	font-weight: bold;
}

.spalte2 {
	padding: 10px;
	font-size: 16px;
   	line-height:30px;	
	text-align: left;
      /*  background-color: #F2F2F2; */
}


.link {
	margin-left: 5px;
	color: #000000;
}


.link:hover {
		color: #848484;
	}


#box_bild {  
	text-align: center;
}

#bild {  
	float:left;                     
	margin-top: 0px;
	margin-bottom: 0px;
	text-align: center;
}

#bild_Z {  
	padding: 0px;
	text-align: center;
}

.bild {
        max-width: 100%;
        height: auto;
        margin-bottom:0px;
	text-align: center;
}

label { width:500px; cursor:pointer; }

.Feld {font-size: 16px; margin-top: 2px; margin-bottom: 5px; padding: 5px; width:300px;}
.Bereich {font-size: 16px; margin-top: 2px; margin-bottom: 5px; padding: 5px; width:100%; }
.Button {  width:152px; padding: 5px; }


#box_bildbeschreibung {
	margin-top: 0px;
	margin-bottom: 50px;
	text-align: center;
	font-size: 16px
}

#box_text_centriert {
	margin-top: 0px;
	margin-bottom: 50px;
	text-align: center;
}




#fusszeile {
	height: 70px;
	border-top: 1px #000000 solid;
	margin-top: 150px;
	margin-bottom: 0px;
	padding-top:5px;
	padding-left:20px;
	text-align: left;
	font-size: 12px;
	line-height: 20px;
     /* background-color: #F2F2F2;  */ 

}

#verweisefuss ul {
   	list-style: none;               /* keine Aufzählungspunkte */
   	text-align: center;

}

#verweisefuss li {

        display: inline-block;
   	width: 90px;                
	font-size: 12px;
	margin-top: 0px;
	margin-bottom: 10px;
}

#verweisefuss a:link { text-decoration:none; display: block; width: 80px; color: #000000; }
#verweisefuss a:visited { text-decoration:none; display: block; width: 80px; color: #000000; }
#verweisefuss a:focus { text-decoration:none; display: block; width: 80px; color: #848484; }
#verweisefuss a:hover { text-decoration:none; display: block;width: 80px; color: #848484; }


#box_icon_centriert {
	padding-bottom: 5px;
	text-align: center;
}

.icon {
    max-width: 100%;
    height: auto;
    margin-bottom: 0px; 
}

.icon:hover {
    margin-bottom: 0px;
    border-bottom: 3px dotted #848484;
}


/* CSS erweitern um MENÜ-Button und entsprechende Steuerung */






@media only screen and (min-width: 1600px) {


	#bild {  
	  float:none;           
	  margin-top: 0px;
	  margin-bottom: 0px;
	  text-align: center;
	}


	#bild_z {  
	  float:none;            
	  margin-top: 0px;
	  margin-bottom: 0px;
	  text-align: center; 
	}


	.bild {
   	  max-width: 100%;
    	  height: auto;
    	  margin-bottom: 600px; /*Wenn der Text länger ist wie die Bilder an der Seite, abstand einstellen   */

	}

	table {
	  float:left;
	  width: 65%;
	  margin-top: 0px;
	  margin-bottom: 0px;
	  text-align: left;
	}



}




@media only screen and (max-width:800px) {

	#container {
	  width: 100%;
	}


	.menue-button {
		display: block;
	}



	.menue-button {
	  background-color: #D8D8D8;
	  display: block;
	  position: absolute;
	  width: 100%; 
	  right: 0;
	  top: 0;
	  padding: 10px;
	  font-size: 25px;
	  font-weight: bold;
	  text-align: center;
	  color: black;
	  cursor: pointer;
	  text-decoration: none;
	  border-bottom: 3px solid #FFFFFF;
	}



	#verweisekopf {
	  position: absolute;
	  top: 50px;
	  right: 0;
	  width: 100%;   
	  text-align: center; 
	  font-size: 25px;
	  font-weight: bold;
	  display: none; 
          background-color: #F2F2F2;  
	}	

	#verweisekopf li { 
	  margin: 0px;
 	  padding-top: 20px;
	  padding-bottom: 20px;

	  border-bottom: 3px solid #FFFFFF;
	}

	.menue-button:hover {
		color: #DF0101;
	}



	#verweisekopf_logo { 
	  float:left;	
  	  width: 200px;                   
	  padding: 10px;			
	  margin-top: 55px;			
   	  font-size: 45px;
   	  text-align: right;             
   	  line-height:50px;
	  font-weight: bold;
   /*	  background-color: #A4A4A4; */
	}


	#box_logo {
	  padding-top: 128px;		
	  padding-bottom: 14px;		
	  margin-top: 0px;		
	  text-align: left;
/*	  background-color: #F2F2F2; */
	}


	table {
	  float:left;
	  width: 100%;
	  margin-top: 0px;
	  margin-bottom: 0px;
	  text-align: left;
     /*   background-color: #FFFFFF; */
}


}



/* die Magie, um die Steuerung einzublenden (auch auf mobile Devices) */

#nav-menue:target #verweisekopf {
	display: block;
}
	

/* ausblenden des Menü-Buttons zum öffnen - somit wird der zum Schließen sichtbar */

#nav-menue:target .menue-button-beschr-open { 
	display: none ; 
}	




