/* Responsive */
@media only screen and (max-width: 1200px) {
	#wrapper { width:100%; margin-top:0 }
	main { width:80%; }
	#leiste { width:20%; overflow:hidden }
	.termin_tag { width:20% }
	.termin_programm { width:30% }
	.termin_venue { width:30% }
	.termin_tickets { width:20% }
}	
@media only screen and (max-width: 1150px) {
	#detail_container { width:350px }
}	
@media only screen and (max-width: 950px) {
	#detail_container { width:250px }
}	
@media only screen and (max-width: 900px) {
	#detail_container { width:100% }
}		

@media only screen and (max-width: 640px) {
	label { float:none  }
	.submit { margin-left:0;}	
	#detail_container {  float:left; width:100% }
}


@media only screen and (max-width: 570px) {
	#leiste { display:none }
	main { width:100%; }
	.termin_tag { width:100%; border-top: 1px solid #2D2D2D; border-bottom: 1px solid #ABABAB }
	.termin_programm { clear:both; width:40% }
	.termin_venue { width:40% }
	.termin_tickets { width:20% }
	
	#slider { position:relative }
	.mobile  { display:block;  }
	.mobile #logo { font-size:1.5em; letter-spacing:0.1em; position:absolute; right:20px; bottom:5px; padding:15px; text-align:center; background-color:#000; color:#F4F4F4; z-index:100; overflow:visible }


	
	#navitoggle_container {
		display:block; text-align:center; width: 100%; margin: 0 auto;  padding: 5px 0 0 0; 
		background-color: #EBEBEB;
		background: -webkit-gradient(linear, left top, left bottom, from(#EBEBEB), to(#D7D7D7));
		background: -webkit-linear-gradient(top, #EBEBEB, #D7D7D7);
		background: -moz-linear-gradient(top, #EBEBEB, #D7D7D7);
		background: -ms-linear-gradient(top, #EBEBEB, #D7D7D7);
		background: -o-linear-gradient(top, #EBEBEB, #D7D7D7);
		background: linear-gradient(top, #EBEBEB, #D7D7D7); 
		box-shadow: 0 3px 3px rgba(0,0,0,0.7);
		border-radius: 0 0 10px 10px 
	}
	#navitoggle { display:block; cursor:pointer }
	#navi { 
	  display: block; 
	  width: 98%; 
	  margin: 0 auto; 
	  box-shadow: 0 3px 3px rgba(0,0,0,0.7);
	  text-align:center;
	}
	
	#navi li { margin:0 }
	
	#navi > li > a { 
	  display: block; 
	  padding: 12px 0;
	  font-size: 0.9em;
	  font-weight: bold;
	  color: #d4d4d4;
	  text-decoration: none;
	  border-bottom: 1px solid #212121;
	  background-color: #343434;
	  background: -webkit-gradient(linear, left top, left bottom, from(#343434), to(#292929));
	  background: -webkit-linear-gradient(top, #343434, #292929);
	  background: -moz-linear-gradient(top, #343434, #292929);
	  background: -ms-linear-gradient(top, #343434, #292929);
	  background: -o-linear-gradient(top, #343434, #292929);
	  background: linear-gradient(top, #343434, #292929); 
	  white-space:normal;
	}
	#navi > li > a:hover, #navi > li > a.open, #navi > li > a.aktiv { 
	  color: #000;
	  font-weight: bold;
	  border-bottom-color: #8a615c;
	  background-color: #b09895;
	  background: -webkit-gradient(linear, left top, left bottom, from(#b09895), to(#8a615c));
	  background: -webkit-linear-gradient(top, #b09895, #8a615c);
	  background: -moz-linear-gradient(top, #b09895, #8a615c);
	  background: -ms-linear-gradient(top, #b09895, #8a615c);
	  background: -o-linear-gradient(top, #b09895, #8a615c);
	  background: linear-gradient(top, #b09895, #8a615c);
	}
	#navi .facebook, #navi .facebook:hover { 
	  color: #d4d4d4;
	  font-weight: bold;
	  border-bottom-color: #153f71;
	  background-color: #325d91;
	  background: -webkit-gradient(linear, left top, left bottom, from(#325d91), to(#153f71));
	  background: -webkit-linear-gradient(top, #325d91, #153f71);
	  background: -moz-linear-gradient(top, #325d91, #153f71);
	  background: -ms-linear-gradient(top, #325d91, #153f71);
	  background: -o-linear-gradient(top, #325d91, #153f71);
	  background: linear-gradient(top, #325d91, #153f71);
	}
	#navi .facebook:hover { 
	  color: #000;
	}
}