
/* ipads & Co (+landscape) */
@media only screen 
	and (min-device-width: 768px) 
	and (max-device-width: 860px) 
	and (orientation: landscape),
only screen 
	and (min-width: 768px)
	and (max-width: 860px)
{   
	.textcontent { margin-top: 200px; }
	.visitenkarte	{ margin-top: 240px;}
}

/* ipads & Co (+portrait) */
@media only screen 
	and (min-device-width: 600px) 
	and (max-device-width: 860px)
	and (orientation: portrait),
only screen 
	and (min-width: 600px) 
	and (max-width: 860px)
{
	.slick-prev:before, .slick-next:before { display: none; }
	.slick-prev, .slick-next { left: 0px; }
}


/* mobile phones generally */

@media only screen 
	and (min-device-width: 200px) 
	and (max-device-width: 767px),
only screen 
	and (min-width: 200px) 
	and (max-width: 767px)
	
	{
	.respon {display: inherit;}
	.respoff {display: none;}

	.logo 		{ margin-top: 10px; position: fixed; z-index: 300; border: 0px solid red;}
	.logo img	{ max-width:60%; height: 33px;}

	.landauswahl	{ margin-top: 60px; }
	 select 		{ max-width: 270px;  width: 80%;}
 
	.textcontent { max-width: 80%;  margin-top: 110px; }

	.nav-wrapper	{ background-color: rgba(0,0,0,.7); border-bottom: 1px solid #F77E00; }
	.nav-toggle 	{ -webkit-transform: scale(.7); -ms-transform: scale(.7); transform: scale(.7); } 
	.navicon 		{ margin: 16px 7px 12px 0;}

	.overlay nav 				{ top: 55%; }
	.overlay .row 				{ width: 300px; }
	.overlay ul li 				{ margin-right: 15px; }
	.overlay ul li i 			{ margin-bottom: 10px; font-size: 30px; }
	.overlay ul li a 			{ padding: 22px 0; min-width: 100px; font-size: 11px;}
	.overlay ul li a.impressum 	{ padding-bottom: 20px;}	
	.overlay ul li a img		{ height: 35px; margin-top: -5px; }
	.overlay ul li:last-child 	{ margin-bottom: 0px; }

	.work img 			{ width: 100%;  max-width: 340px; outline: 0px solid red; }

	.visitenkarte		{ margin-top: 200px; outline: 0px solid red; }
	.visitenkarte a img	{ margin-top: -10px; max-width: 95%; outline: 0px solid red; }


	.klickentext 					{ top: 22px; border: 0px solid red;}
	.schattenlinks, .schattenrechts	{ display: none; }

	.sliderMega { outline: 0px solid green; top: 35%; translateY(-35%); bottom: inherit; }
	.sliderDiv 								{ width: 100%; }
	.slick-dots 							{ bottom: -5px;}
	.slick-dots li 							{ margin: 0 1px; width: 11px; height: 11px;}
	.slick-dots li button 					{ width: 100%; height: 100%; }
	.slick-dots li button:before 			{ font: 7px/11px 'slick'; }
	.slick-prev, .slick-next 				{ left: 0px; }
	.slick-prev:before, .slick-next:before 	{ display: none; }
	.slick-slider img 						{ width: 220px; }

.slick-slider img.soldout { width: 110px;  margin: 109px 0 0 109px; }
.slick-center img.soldout { margin: 115px 0 0 115px; }


	.slick-slider-twoslides { width: 480px; }


	#modalbox #Formular 	{ border: 0px solid white; width: 80%;  padding-top: 0px; }
	#Formular label			{ border: 0px solid green; ,padding: 0; min-width: 100%; }
	#Formular .labelextra 	{ margin-bottom: 0px; }
	#Formular .linkespalte	{ min-width: 90%; margin: 0; border: 0px solid black; padding: 10px 0 5px 0; }

	#Formular .linkespalte.schritt	{ padding-top: 30px; padding-bottom: 0px;}
	#Formular .rechtespalte			{ padding: 0px; width: 100%; text-align: left;}
	#Formular .schrittrechts		{ padding-top: 0px;}
	#Formular .rechtespaltenormal	{ max-width: 100%; padding-bottom: 40px; padding-top: 10px;}

	#Formular input		{ min-width: 100%; 	font-size: 16px;}
	#Formular textarea	{ min-width: 100%;  font-size: 16px;}
	#Formular select	{ min-width: 100%; 	font-size: 16px;}
	#Formular .submit	{ margin-left: 0px; margin-top: 15px; font-size: 16px;} 

	#Formular .error { margin-left: 0; margin: 0 auto; width: 100%, }

	#closebutton 		{ top: 0px; right: 0px; position: absolute; }
	#closebutton a		{ padding-top: 10px; font-size: 300%; font-weight: 400;	}
	a.closebuttonvideo	{ top: 2px; right: 3px; -webkit-transform: scale(.7); -ms-transform: scale(.7); transform: scale(.7);}

}
	
/* less high phones  */
@media only screen and (max-device-height: 560px), only screen and (max-height: 560px)
{
	.sliderMega { outline: 0px solid green; top: auto; bottom: 0; }
}



/*************************
special smartphones landscape, without ios bars (html height)
**************************/
@media only screen 
	and (min-device-width: 200px) 
	and (max-device-width: 767px)
	and (orientation:landscape),
only screen 
	and (min-width: 200px) 
	and (max-width: 767px)
	and (orientation:landscape)
{
	html { height: 100.1%; }
	.sliderMega 	{ top: 50%; transform: translateY(-51%); bottom: inherit; }
	.nav-wrapper	{ display: none; }
	.landauswahl	{ display: none; }
	.klickentext	{ display: none; }

}


/*************************
ONE and TWO slides, for smartphones portrait
**************************/
@media only screen 
	and (min-device-width: 200px) 
	and (max-device-width: 540px)
	and (orientation:portrait),
only screen 
	and (min-width: 200px) 
	and (max-width: 540px)
	and (orientation:portrait)	
{
	.slick-slider-twoslides {
		outline: 0px solid green;
		margin: 0 auto;
		width: 100%;
		padding: 0;
	}
	.slick-slider-twoslides .twoslides-fixed {
		outline: 0px solid blue;
	 	padding-left: 0;
	}
	.twoslides-fixed img {						
		-webkit-transform: scale(.9);
				transform: scale(.9);
		margin-bottom: inherit;					
	}
	.slick-slider-twoslides .slick-center img {
		-webkit-transform: scale(1);
				transform: scale(1);
	
		-webkit-box-shadow: 0px 0px 12px #000;
		   -moz-box-shadow:	0px 0px 12px #000;
			-ms-box-shadow:	0px 0px 12px #000; 
			 -o-box-shadow:	0px 0px 12px #000;
				box-shadow:	0px 0px 12px #000;
	}

	.slick-slider-oneslide .oneslide-fixed {
		outline: 0px solid blue;
		transform:translate(-50%,0)
	}
}

/*************************
two slides only, fixed for smartphones landscape
**************************/
@media only screen 
	and (min-device-width: 200px) 
	and (max-device-width: 568px)
	and (orientation:landscape),
only screen 
	and (min-width: 200px) 
	and (max-width: 568px)
	and (orientation:landscape)
{
	.slick-slider-twoslides  {
		outline: 0px solid green;
		width: 540px;
		padding-left: 37px;
	}
	.slick-slider-twoslides .twoslides-fixed {
		outline:  0px solid blue;
	}

}


	
