/* basics */
@viewport{
    zoom: 1.0;
    width: extend-to-zoom;
}

body {
	  background: #888888;
	  padding: 0 5%;
	  font-family: Verdana, Arial, Helvetica , Sans-serif; 
	  font-weight: normal;
	  color: WhiteSmoke;	
}

a {
	text-decoration: none;
	color: WhiteSmoke;
}



#main {
	display:block;
}

#main article {
	display:inline-block; 
	width:65.3%; 
	vertical-align: top;
	padding-top:0.625em;
	text-align:center;
}

#main article_ganzeBreite {
	display:inline-block; 
	width:100%; 
	vertical-align: top;
	padding-top:0.625em;
	text-align:left;
}

#main article_ganzeBreite img {
	width: 30%;
	float:right;
}


#main article_ganzeBreite figure img {
	width: 23%;
	float: left;
	margin-left: -2.5em;
	margin-right: 1.5em;
	margin-bottom: 1.0em;
}

#main article_ganzeBreite a{
	 text-decoration: underline;
}



#main aside {
	display:inline-block;
	width:31.0%;             /*30.6*/
	margin-left:3%; 
	padding:0em;
	vertical-align:top;
}

#main aside  img{               
	width:90%;
	height: auto;
	display: block;                    /* Bild wird im Element zentriert */
    margin-left: auto;                 /* Bild wird im Element zentriert */
    margin-right: auto;				   /* Bild wird im Element zentriert */
}

#main aside section {
	margin-bottom:1.313em;
	border-bottom: 0.188em solid #cc0000;
}


h1 {
  margin: 0 0 30 0 ; 
  font-size: 1.5em;  
}

h2 {
  margin: 0; 
  font-size: 1.2em;  
  font-weight: 500;
  text-align: center;
  letter-spacing: 0.3em;
  padding: 0.5em;  
}


h5 {
  margin: 0; 
   font-size: 0.85em;
   font-weight: normal;
  text-align: center;
  letter-spacing: 0.1em;
}

p {
   font-size: 0.95em;
   font-weight: normal;
}




/* Navigation */ 
nav {
	display:block;
	height:2.5em;
	background:#d0d0d0;
	text-align:center;
	margin: 0em 0em 0em 0em;
	border-bottom: 0.188em solid #aa0000;
}

nav ul {
	display:block;
}

nav ul li {
	display:inline;
	margin:0em 0.188em 0em 0.188em;
}
nav ul li a {
	color:#454040;
	font-size: 1.0em;          /*1.125  das ist ohne Veröffentlichung*/
	line-height:2.5em;
	/*padding:0.563em 0.938em 0.375em 0.983em;*/
	/*padding: 0.375em;         das ist ohne Veröffentlichung*/
	padding: 0.175em; 
	transition:background 0.2s;
	-webkit-transition:background 0.2s;
}

nav ul li a:hover {
	background:#d0d0d0;
	border-top: 0.0625em solid #aa0000;          /*     #FF9900;   */
}
nav ul li a.active {
	/*border-bottom: 0.188em solid #aa0000;     */     /*      #FF9900;  */
	color: #aa0000;
}

ul {
	margin:0px;
	padding:0px;
}

ul.datenschutz {
	margin-left :2em;	
}

li {
	list-style:square;
	font-family:Helvetica;
	font-weight:100;
	color:#2F2D2C;
	line-height:1.25em;
	margin:0em;
	padding:0em;
	margin:0.313em 0em 0.313em 0em;
}

li.datenschutz {
	color: WhiteSmoke;	
	font-family: Verdana, Arial, Helvetica , Sans-serif; 
	font-size: 0.95em;
	
}

img {
	width:80%;
	height:auto;
	max-width:100%;
	background:#FFFFFF;
	padding: 0;
}



/* On Top Bar */
#menubar {
	display:block;
	margin: 0em 0em 0em 0em;
	background:#d0d0d0;
} 
#menubar ul {
	display:block;
	width:2em;
	padding:0.3em;
}
#menubar ul li {
	display:inline;
}
#menubar ul li a.menubutton {
	display:none;
}




/* Footer */ 
footer {
	display:block;
	color: WhiteSmoke;
	text-align:center;
	border-top: 0.0625em solid WhiteSmoke; 
}

footer ul {
	display:block;
	width:100%;
	max-width:980px;
	text-align:right;
	margin:0px auto;
}

footer ul li {
	display:inline;
	font-size:0.8em;
	line-height:1.8em;
	color:WhiteSmoke;
	
}
footer ul li a {
	color:WhiteSmoke;
	padding: 0.125em;
}

footer ul li a:hover {
	border-top: 0.0625em solid #aa0000;   	
}

/* media query 1 */

@media screen and (min-width:768px) {
	
	  body {
	        padding: 0 6%;
	       }
	
	  nav.nav {
		      display:block !important;                    /* Hier wird das Bild f�r das responsive Men� angezeigt */
		      
	          }	
	
	
	  h1 {
	     font-size: 1.5em;
	     }  
  
	  h2 {
		  margin: 0; 
		  font-size: 1.2em;  
		  font-weight: normal;
	     }
  
  	  p {
        font-size: 1.05em;
        }	
}

@media screen and (max-width:895px) {
	

	body {
		font-size:90%;
		padding: 0 6%;
	}
	#menubar ul li a.menubutton {
		display:block;
		background-image: none;
	}	
	nav {
		display:none;
		height:auto;
	}
	nav ul li {
		display:block;
		margin:0.3em 0em 0.3em 0em;
		font-size: 1.175em;
	}
	
	
	h1 {
    font-size: 1.5em;
  }
  
  h2 {
    font-size: 1.0em;
     font-weight: 500;
  }
  p {
    font-size: 1.05em;
  }
  
  nav {
   font-size: 0.95em;
  }	
	
}


/* media query 3 */
@media only screen and (min-width: 1130px) {
  
  body {
	    padding: 0 5%;
	    }
  
  h1 {
    font-size: 1.5em;
  }
  
  h2 {
    font-size: 1.125em;
    font-weight: 500;
  }
  
  p {
    font-size: 1.05em;
  }
  
   nav {
   font-size: 1.175em;
  }
 
 #main article_ganzeBreite figure img {
	width: 20%;
    }
  
}

/* media query 4 */
@media only screen and (min-width: 1400px) {
  
  body {
	    padding: 0 10%;
	    }
 
  h1 {
    font-size: 1.85em;
  }
  
  h2 {
    font-size: 1.2em;
  }
  
   p {
    font-size: 1.125em;
  }  
  
  #main article_ganzeBreite figure img {
	width: 15%;
  }
  
  
}