/* Test */

*/@font-face {
  font-family: 'Comic Neue';
  src: url('../fonts/ComicNeue-Light.eot');
  src: url('../fonts/ComicNeue-Light.eot?#iefix') format('embedded-opentype'),
       url('../fonts/ComicNeue-Light.woff2') format('woff2'),
       url('../fonts/ComicNeue-Light.woff') format('woff'),
       url('../fonts/ComicNeue-Light.ttf')  format('truetype');
  font-weight: 300;
}
@font-face {
  font-family: 'Comic Neue bold';
  src: url('../fonts/ComicNeue-Bold.eot');
  src: url('../fonts/ComicNeue-Bold.eot?#iefix') format('embedded-opentype'),
       url('../fonts/ComicNeue-Bold.woff2') format('woff2'),
       url('../fonts/ComicNeue-Bold.woff') format('woff'),
       url('../fonts/ComicNeue-Bold.ttf')  format('truetype');
  font-weight: 900;
}

#header {
          /*width:1024px;*/
          width:100%;
          height:250px;
          display:block; 
}

#header_haus{
          width: 241px;
          height:245px;
          position:relative;
          float:left;
          margin: -10px 0px 0px -20px;
          background: url(../Layout/hauslogo.gif) no-repeat left top;
}

#header_schriftzug{
          width: 600px;
          height:133px;
          position:relative;
          float:left;
/*	font-family:"comic_reliefregular";*/
	/*font-family:"Comic Sans MS";*/
		font-family: 'Comic Neue bold';
          color:#860202;
          font-weight:bold;
          text-shadow:  2px  2px 2px #FFF,
                  		2px -2px 2px #FFF,
                 	   -2px  2px 2px #FFF,
 	                   -2px -2px 2px #FFF,
 	                   black 0.1em 0.1em 0.2em;  
          margin: 30px 0px 0px -30px;
          z-index:2;
       }
#Ueberschrift{          
          /*font-size:54px;*/
          font-size:64px;          
         }
#Untertitel{          
          font-size:24px;
          margin-left:50px;
         }

#header_logo{
          width: 183px;
          height:133px;
          position:relative;
          float:right;
          margin: 10px 20px 0px 0px;
          background: #FFFFFF url(../Layout/Logo2.jpg) no-repeat left top;
       }

#Hauslogo {
          float:left;
          margin: -5px 0px 0px -10px;
		  -webkit-transform: rotate(-10deg);  /* Saf3.1+, Chrome */
		  -moz-transform: rotate(-10deg);  /* FF3.5+ */
		  -o-transform: rotate(-10deg);  /* Opera */
		  transform: rotate(-10deg);
		  -moz-box-shadow: 0 0 5px 2px #ccc;
		  -webkit-box-shadow: 0 0 5px 2px #ccc;
		  box-shadow: 0 0 5px 2px #ccc;
		  background:#ffffff;
		  padding:5px;
		  z-index:1;
}

body {
        margin:0em;
        padding:0em;
        background:#FDDb79;
        font-family:Verdana;
        /*font-size:12px;*/
        color:#000000;
        overflow-y:scroll;
        font-size:100%;
       }
#all {
        max-width:1024px; 
        margin: 1.875em auto 1.25em auto;
        background:#F8E8C4;
       }

#haupt {
		float: left;
		position:relative;
		width:100%;
        margin:0px;
		background-color:#F8E8C4;
	}

#textteil {
		float:right;
		width:76%;
		position:relative;
		/*max-width:784px;*/
		margin-top: -60px;
		padding-bottom: 3.125em;
		background-color:#fbf2dd;
		border-top-left-radius:3.75em;
		padding-left:20px;
		padding-right:20px;
		font-family:Verdana, Geneva, Tahoma, sans-serif;
		font-size:0.75em;
		line-height: 1.5;
}

#textteil h1{
	font-family: 'Comic Neue bold';
	font-size:200%;
	font-weight:bold;
	text-align:center;
	color: #860202;
}

#textteil h2{
	font-family:Verdana, Geneva, Tahoma, sans-serif;
	font-size:125%;
	text-align:center;
	font-weight:normal;
}

#textteil h3{
	font-family: 'Comic Neue bold';
	font-size:150%;
	font-weight:bold;
	text-decoration:underline;
	font-style:italic;
	color: #860202;	
	text-indent:1.875em;
}

#textteil img {
		margin: 20px;
		  /*-moz-box-shadow: 0 0 5px 20px #ccc;
		  -webkit-box-shadow: 0 0 5px 20px #ccc;
*/		  box-shadow: 10px 10px 10px #a6a6a6;
		  -webkit-transition: all 0.4s ease-out;  /* Saf3.1+, Chrome */
		  -moz-transition: all 0.4s ease-out;     /* FF3.5+ */
		  -o-transition: all 0.4s ease-out;  /* Opera */
		  transition: all 0.4s ease-out;
		  border-radius: 5px;
}

#textteil img.rauszoomen:active {
		  opacity:1;
		  padding:0;
		  position:relative;
		  z-index:1;
		  -moz-box-shadow: 2px 2px 2px #888;
		  -webkit-box-shadow: 2px 2px 2px #888;
		  box-shadow: 2px 2px 2px #888;
		  -webkit-transform: rotate(0deg) scale(2.5); 
		  -moz-transform: rotate(0deg) scale(2.5);  
		  -o-transform: rotate(0deg) scale(2.5);  
		  transform: rotate(0deg) scale(2.5);
}

#textteil a {
		color: #860202;
		text-decoration:none;
}

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

#menubar {
		display:block;
		background:#860202;
		margin:0em;
}

#menubar ul{
		display:block;
		width:2em;
		padding:0em;
		margin:0em;
}
#menubar ul li{
		display:inline;
}
#menubar ul li a.menubutton{
		display:none;
}

#nav{
	display:none;
	/*height:2em;*/	
	background:#E5E5E5; /*Hintergrundfarbe Mobil-Navigation*/
	text-align:center;
	/*font-family:"Comic Sans MS";*/
	font-family: 'Comic Neue bold';
}

#nav ul{
	display:block;
}
#nav ul li{
	display:inline;
	margin:0em;
	padding:0.2em;
}
#nav ul li a{
	color:#860202;	/* Schriftfarbe mobil-Nav*/
	height:0.125em;
	transition:background 0.2s;
	-webkit-transition:background 0.2s;
}

#nav ul li a.impressum{
	color:#BCBCBC;	/* Schriftfarbe mobil-Nav*/
	text-decoration:none;
}
#nav ul li a:hover{
	background:#CCCCCC;
	border-bottom: 0.1em solid #860202;
}
#nav ul li a:active{
	border-bottom: 0.1em solid #860202;
}

#footer {
		width:90%;
		clear:both;
		/*position: absolute;*/
		bottom: 0px;
		text-align:center;
		font-family: Verdana;
		font-size:11px;
		font-weight:bold;
		color: #860202;
		margin:20px auto 0px auto;
		padding:20px 0px 5px 0px;
}

#galerie {
	width:80%;
}

#galerie img {
		box-shadow: 0px 0px 0px #a6a6a6;
		  border-radius: 5px;
}

#navigation {
		position:relative;
		/*width:180px;*/
		width:18%;
		background-color:#F8E8C4;
		float:left;
		padding-left:20px;
		padding-bottom: 100px;
		/*height:auto;*/
}

#navi-footer {
		position: absolute;
		bottom: 0px;
		font-size: 11px;
}

#impressum{
		color: #860202;	
}

#impressum a {
 	    text-decoration:none;
		color: #860202;		    
}

#impressum a:visited {
		color: #860202;	
 	    text-decoration:none;
}


/* Mobile style */
@media screen and (max-width:1032px) {
	#textteil {
		width:74%;
		border-top-left-radius:0em;
		/*background:aqua;*/
	}

}
@media screen and (max-width:1020px) {
	#body{
		font-size:0,65em;
	}
	#navigation{
		display:none;
	}
	#menubar ul li a.menubutton{
		display:block;
	}
	#nav{
		display:none;
		height:auto;
	}
	#nav ul li{
		display:block;
		margin:0em 0em 0.3em 0em;
	}
	#textteil {
		width:95%;
		margin-top: -30px;
		border-top-left-radius:0em;
	}

}
@media screen and (max-width:991px) {
	#header_logo{
		display:none; 
	}
}

@media screen and (min-width:960px) {
	#nav.nav{
		display:none; /*important*/
	}
}

@media screen and (max-width:960px) {
	#navigation{
		display:none;
	}
}

@media screen and (max-width:800px) {
	#body{
		font-size:0,65em;
	}
	#navigation{
		display:none;
	}
	#menubar ul li a.menubutton{
		display:block;
	}
	#nav{
		display:none;
		height:auto;
	}
	#nav ul li{
		display:block;
		margin:0em 0em 0.3em 0em;
	}
	#textteil {
		width:94%;
	}

	#Hauslogo {
		z-index:2;
}
	#header_schriftzug{
          width: 455px;
          height:133px;
          margin: 30px 0px 0px -50px;
          z-index:3;
     }
	#Ueberschrift {          
          font-size:44px;  
     }
	#Untertitel {          
          font-size:19px;
          margin-left:50px;
     }
/*	#header_logo{
		display:none; 
	}*/    
	#footer{
			display:none;
	}

}

@media screen and (max-width:623px) {
	#header_schriftzug{
          width: 400px;
          height:133px;
          margin: 30px 0px 0px -50px;
          z-index:2;
     }
	#Ueberschrift {          
          font-size:39px;  
     }
	#Untertitel {          
          font-size:17px;
          margin-left:50px;
     }
	#textteil {
		width:92%;
	}
     
}

@media screen and (max-width:570px) {
	#Hauslogo {
		display:none;
}
	#header{
		height:150px;
		/*geändert: ursprünglich 150px*/
}
	#header_schriftzug {
        margin: 1px auto 1px 20px;
    }
	#Ueberschrift {          
          font-size:34px;        
    }
	#Untertitel {          
          font-size:15px;
          margin-left:50px;
    }
    
	#textteil h3{
		text-indent:0em;
	}

}

@media screen and (max-width:500px) {
	#textteil {
		width:90%;
	}
	
	#textteil img {
		max-width:100%;
		height:auto;
		display:block; 
		margin: auto;
		/*margin-left: 50px;
		margin-right: 50px;*/	
}

@media screen and (max-width:400px) {
	#body{
		font-size:0,65em;
	}
	#footer{
		display:none;
	}
	#textteil img {
		max-width:100%;
		height:auto;
		display:block;
		float:inherit; 
		margin: 20px;
		/*margin-left: 50px;
		margin-right: 50px;*/	    
}