/* ==== Meine Styles: ===========================================================================================================================*/

* { 
 box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;

  margin:0;
  padding:0;
  font-weight:normal;
  font-style:normal;
  text-align:left;
 }
 

h1, h2, h3, h4, h5, h6{
  
  font-family: 'Georgia', Times, Serif;
}

h1{

  font-size: 3em;
  font-weight:bold;
  text-align: center;
  color: #333;
  text-shadow: 0px 3px 6px #fff;
  margin-bottom:50px;
  }

h2{  
	
  font-size:25px;
  font-weight: bold;
  font-style:italic;
  text-align: left;
  margin: 0 auto 50px auto;
  color: #333;
  text-decoration: underline;
  } 
  
 h2.index{
  	margin-bottom: 10px;
  	margin-top: 50px;
  }

h3{
	
  font-size: 1.2em;
  font-weight: bolder;
  font-style:italic;
  letter-spacing: 0px;
  margin: 0px auto 20px 15px;
  color: #858585;
  }

h4{
  
  font-size: 1.3em;
  font-weight:bold;	
  border-bottom:1px solid;
  }

h5{
     
  font-size: 1.3em;
  font-weight:bold;
  text-decoration:underline;
  color:black;
  margin-bottom: 10px;
} 

h6{
	
  font-size: 9pt;
  color:#666;
  }

/* GENERELL --------------------------------------------------*/	
     
p{
  font-size: 18px;
  line-height: 23px;
  color: black;
  }	

li{
  color: black;
  }
	
a{
  text-decoration:none;
  }

ul{}


	
	
label{
  font-size:16px;
  margin-top:0px;
  font: 1.05em georgia,Trebuchet MS, Verdana,sans-serif;
  font-weight:bold;
  }
  
  
  .textbox{
    width:auto;
    height:auto;
    padding:2%;
  	background-color:white;
  	border-radius: 10px;
  	-webkit-box-shadow:  inset 1px 1px 5px #555;
  	-moz-box-shadow: inset 1px 1px 5px #555;
  	box-shadow: inset 1px 1px 5px #555;
  	-moz-border-radius: 10px;
  	overflow: auto;
  	position: relative;
  	z-index: 50;
  }
  
  .clear{
  	clear: both;
  	width: 100%;
  }
				
/*header =======================================================================================================*/


body{	
  width:100%;
  background-color:#1a1b1a;
  background: url(../img/wood_pattern3.jpg) repeat;
  font-family: 'Georgia', Times, Serif;
  color: black;
  }

		
header{	
  top:0;
  width:100%;
  min-width:960px;
  height:auto;
  background: url(../img/panorama.jpg) no-repeat;
  background-size:cover;
  background-origin:content-box;
  background-position: center;
  box-shadow:  0px 0px 10px 1px white;
  }


#logo{
  display: block;
  width: 14%;
  height:auto;
  margin:0 36%;
  position:relative;
  z-index:150;
  cursor:pointer;
  }  
  
    		
/*content =======================================================================================================*/ 

#main_wrapper{
	width:90%;
	min-width: 960px;
	margin:2% auto;
	overflow:visible;
	padding:0 0 0 1%;
}

#content{	
    width:79%;
    float:left;
    position:relative;
    padding: 2%;
    z-index:20;
	background:  
	url(../img/content_bg_head.jpg) no-repeat,
	url(../img/content_bg_c.jpg) repeat-x,
	url(../img/content_bg.jpg) repeat-y,
	url(../img/content_bg_b.jpg) repeat,
	#ebdab7;	
	
	-moz-box-shadow: 2px 5px 10px 5px #000;
	-webkit-box-shadow: 2px 5px 10px 5px #000;
	box-shadow: 2px 5px 10px 5px #000;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	color: #ebdab7;
}


span.hidden{
  display:none;
  }
	
/*-NAVIGATION ==========================================================================================================*/		
		
			
#main_nav{
  margin-top: 3%;
  width:21%;
  float:right;
  position:relative;
  z-index: 10;
  }
		
     
	.reiter_wrapper{
	    display: block;
		width:300px;
		height:120px;
		margin: 5px 0 5px -180px;

       -webkit-border-radius:5px;
       -moz-border-radius:5px;

       -webkit-box-shadow: 10px 8px 15px #000;		
       -moz-box-shadow: 10px 8px 15px #000;

       -webkit-transition:All 0.6s ease;
       -moz-transition:All 0.6s ease;
       
	    }
	    
	
  nav ul{
  display: block;
  width: auto;
  float: left;
  margin-top: 25px;
  text-align: left;
  }
  
   
   

   .topic{
	 font-size: 1.2em;
	 font-weight:bold;
	 text-decoration:none;
	 list-style-type:none;
	 color:black;
	 margin-bottom: 7px;
     }


#reiter_0{	
  /*font-size:0.9em; 
  background: url(../img/link_icon.png) no-repeat 210px 32px #adc55a; */
  background-color: white;
  }

#reiter_1{
  font-size:13px; 
  background: url(../img/home_icon.png) no-repeat 207px 28px #5ea7e0;
  }
  
 #reiter_2{
  background: url(../img/kontakt_icon.png) no-repeat 205px 32px #fcdf6a;
  }

#reiter_3{
  background: url(../img/map_icon.png) no-repeat 210px 16px #B0925F;
  }

#reiter_4{	
  font-size:0.9em; 
  background: url(../img/link_icon.png) no-repeat 210px 32px #adc55a;
  }
  
  
			
#reiter_0:hover, #reiter_1:hover, #reiter_2:hover, #reiter_3:hover, #reiter_4:hover{
  z-index:25;
  -webkit-transform: rotate(4deg) scale(1) skew(1deg) translate(180px);
  -moz-transform: rotate(4deg) scale(1) skew(1deg) translate(180px);
  }
  
  
 
/* FOOTER ===================================================================================================================*/

footer{		
  clear:both;
  overflow: auto;	
  width:100%;
  margin:0;
  padding:2%;
  background-color:black;
  box-shadow: 0px -1px 3px #000, 0px 1px 3px #fff;
  }
  
footer ul{
float: left;
list-style-type:circle;
margin-left:2%;
}

footer a:hover{
	color: green;
	font-weight: bold;
}

footer a, footer li{
color: white;
font-size: 18px;
}

footer h3{
margin-left:2%;	
}

/*index.html ======================================================================================================================================================================*/	

#text_logo{
  width:80%;
  height:auto;
  margin:0px 10% 50px 10%;
  }
  
#einleitungstext{
  width:auto; 
  }
  
  
  #index_h1{
  	margin-bottom: 0px;
  }

   
  #einleitungstext strong{
  	font-weight: bold;
  	font-style:italic;
  	font-size: 20px;
  	color: green;
  	margin:0 5px 0 5px;
  }
  
  #ps{
  	font-weight: bold;
  	margin-top: 50px;
  	color: black;
  	border-top: 1px solid gray;
  }
  
  #ps span{
  	font-size: 30px;
  	font-weight: bold;
  	font-style: italic;
  	margin-top: 10px;
  	display: block;
  	color:#5ea7e0 ;
  }
   
		
/*wohnungen.html======================================================================================================================================================================*/


 #wohnungen_nav{
 width: 100%;
 overflow: visible;
 margin: 0 auto;
 position: relative;
 z-index: 40;
	}
		
#wohnungen_nav a{
float: left;
width: 31.33%;
margin: 0 1%;
display: block;
border-top-left-radius:5px;
-webkit-border-left-radius:5px;
-moz-border-left-radius:5px;

border-top-right-radius:5px;
-webkit-border-right-radius:5px;
-moz-border-right-radius:5px;

box-shadow: 0px 0px 10px #111;
}

#wohnungen_nav h2{
	text-align:center;
	margin-top: 20px;
	text-decoration: none;
}

		
#button_wg{
	background-color: #6ea9d7;
}

#button_wm{
	background-color: #adc55a;
}

#button_wk{
	background-color: #fcdf6a;
	z-index: 2;
}


#grosse_wohnung{
border-top:15px solid #6ea9d7; 
}

#mittlere_wohnung{
border-top:15px solid #adc55a;	
}

#kleine_wohnung{
border-top:15px solid  #fcdf6a; 
}


#grosse_wohnung, #mittlere_wohnung{
	
	
position:relative;
z-index:50;
box-shadow:0;
}

 #grosse_wohnung ul, #mittlere_wohnung ul{
 margin-bottom: 50px;
}
 
 
#grosse_wohnung li{
	  margin:10px 0 8px 0;
	  border-bottom:solid 1px #999;
}

.neu{
	background-color:#15c02c;
	border-radius: 50px;
	padding:0px 10px 0px 10px;
}

#galerie_wohnung_gross{
  width:100%;
  height:auto;
  overflow:auto;/* bewirkt bei gefloateten Elementen das gleiche, wie : Float=clear!!!*/
   margin-bottom:50px;
  }
  
#grosse_wohnung a, #mittlere_wohnung a{
  width:150px;
  height:112px;
  overflow: hidden;
  float:left;
   margin-right:43px;
   margin-bottom:30px;
  display:block;
  border-radius: 5px;
border: 2px solid gray;
 
  }

img.galeriebild{
width:150px;
height:auto;
}
  

#mittlere_wohnung li{
	margin:10px 0 8px 0;
	  border-bottom:solid 1px #999;	
}


.panorama_wrap{
float:left;
width:440px;
padding:25px;
}

.panorama_container{
width:100%;	
overflow:auto;
}

.probleme_button{
border:1px solid gray;
background-color:red;
font-size:1.0em;
border-radius:1000px;
-moz-border-radius:1000px;
-webkit-border-radius:1000px;
width:220px;
cursor:pointer;
padding-left:20px;
font-style:italic;
color:white;
}

.anleitung{
display:none;
padding:20px;
margin:20px 0 30px 0;
border:2px dashed green;
}

.panorama_container iframe{
 width:100%;
 height:300px;
 border:0;
 border-radius: 10px;
}



/*kontakt.html======================================================================================================================================================================*/	


#kontakt_wrapper{
	padding:50px;
	overflow:auto;
	background: url(../img/kork_bg.jpg) repeat;

}

#kontakt_wrapper li{
	margin:10px 0 8px 0;
	list-style-type:none;
	font-family:Georgia;
	font-style:italic;
    }

#kontakt_wrapper .bold{
	font-weight:bold;
	font-size:18px;
	font-style:italic;
    }


#post_it{
width:100%;
padding:70px 15px 15px 15px;
margin-bottom:  2%;
box-shadow: -2px 2px 10px #000;
background:url(../img/pin.gif) no-repeat, #fcdf6a;
background-position: center 0;
overflow: auto;
}

#post_it ul{
	margin-bottom: 30px;
	float: left;
	border-right:  1px dashed gray;
	padding: 0 2%;
}

#email_link{
 font-size:15px;
 color:blue;
 font-style:italic;
 }
 
#formular{
display:none;
width:100%;
margin: 0 auto;	
padding: 2%;
background-color: rgba(255, 255, 255, 0.5);
border-radius: 5px;
box-shadow: -2px 2px 10px #000;
}

#formular table{
  width:100%;
  margin-top:5%;
  border-top: 1px dashed black;
  }


#formular h2{
margin-bottom:5px;
}


#formular table td{
 padding:5px;
 border-bottom: 1px dashed black;
}

#formular strong{
	color: black;
}

#formular .required{
  width: 100%;
  font-size:16px;
  color:#333;
  margin: 5px 0;
  padding:3px 10px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 20px;
  -webkit-box-shadow:  inset 3px 3px 3px #e2e2e2;
  -moz-box-shadow:  inset 3px 3px 3px #e2e2e2;
  box-shadow: inset 3px 3px 3px 2px #e5e5e5;
  border:solid #999 1px;
  text-align:center;
  font-family:courier;
  }

#nachricht{
  font-family:Arial, Tahoma, Helvetica, sans-serif;
  padding:10px;
  width:100%;
  height: 300px;	
  border-radius: 10px;
  border:1px solid white;
  box-shadow: inset 0px 0px 5px 1px #222;
  font-family:courier;
  }

 #senden_button{
 cursor:pointer;
 width:100%;
 height:50px;	
 font-size:15px;
 font-weight: bold;
 text-align:center;
 border-radius: 10px;
 background-color: white;
 border: 1px solid black;
 box-shadow: 0px 3px 5px #444;
 }
 
 #senden_button:active{
 box-shadow: inset 0px -3px 5px #444;
 }


/*dynamische Validierungs-Nachrichten*/

  
.validierung_overlay{
width:100%; 
height:100%;  
color: black; 
background-color: rgba(0, 0, 0, 0.7); 
position: fixed; 
z-index: 1000000; 
top:0; 
bottom: 0; 
left: 0; 
right: 0;
}

.validierung_overlay .textbox{
	width: 50%;
	height: auto;
	margin: 15% auto 0 auto;
}

.validierung_overlay p{
  text-align:center;
  }
  
 .validierung_overlay img{
 display: block; 
 width:100px; 
 height:100px; 
 float: left; 
 margin:2%
 }
 
 .validierung_overlay h1{
 text-align: center;
 }
 
 .validierung_overlay a{
 font-weight: bold; 
 display: block; 
 width:  auto; 
 padding:20px; 
 border:1px solid green; 
 border-radius:  10px; 
 margin: 1% auto; 
 text-align: center;
 }
 
 
 
 /*anfahrt.html===============================================================================================================================================================================*/

#map_canvas{
  width:auto;
  height:500px;
  margin:0 auto 50px auto;
  border: 2px solid black;
  }
  

#anfahrt_adresse h3{
	margin-top:0;
	margin-bottom:20px;
	padding:0;
}

#routenplanung_text{
	color:#42abe9;
	text-align:left;
	line-height:25px;
	font-style:italic;
	display:block;
	height:auto;
	width:300px;
}


#anfahrt_adresse,  #routenplanung{
	width:320px;
	height:auto;
	float:left;	
}

#routenplanung{
	
	width:auto;
	height:auto;
	padding-left:30px;
}

#google_link{

	margin:0 auto 0 auto;
	cursor:pointer;
	border:1px solid gray;
	border-radius: 20px;
	background-color:white;
	padding:5px;

}

/*links.html============================================================================================================================================================================*/						
				
#link_liste{
  width:100%;
  }

#link_liste a{
  display:block;
  margin-bottom:0%;
  text-align:center;
  text-decoration: none;

  }  
   


.link{
	width:220px;
} 

#link_liste img{
  margin-top:40px;
  width:100%;
  
  -moz-box-shadow:0px 0px 9px 1px blue;
  -webkit-box-shadow:0px 0px 9px 1px blue;

  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;

  -webkit-transition:All 0.4572s ease-out;
  -moz-transition:All 0.4572s ease-out;
  -o-transition:All 0.4572s ease-out;
  -webkit-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);
  -moz-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);
  -o-transform: rotate(0deg) scale(1) skew(0deg) translate(0px);
  }

#link_liste img:hover{
  -webkit-transform: rotate(360deg) scale(1.3) skew(0deg) translate(0px);
  -moz-transform: rotate(360deg) scale(1.3) skew(0deg) translate(0px);
  -o-transform: rotate(360deg) scale(1.3) skew(0deg) translate(0px);
  z-index:1;
  }
    
#link_liste .galeriebild{
  height:130px;
  width:300px;
  }

#link_liste .text{
  height:auto;
  width:auto;
  }
	
		
/*Impressum =======================================================================================================*/	

#impressum_container{
	font-family:courier;
	}	


#impressum_container a{
	color:blue;
	font-size:15px;
}

#impressum_container h1{
	color:black;
	text-shadow:0 0 0;
	border-bottom: 1px solid gray;
	font-weight: normal;
	font-style: italic;
	padding-bottom: 30px;
}	

#impressum_container h2{
text-shadow:0 0 0;	
color:black;
text-decoration:underline;
margin-top:50px;
font-weight:normal;
}