* {
	text-decoration: none !important;
}

.page-holder {
	width: 1200px;
	position: absolute;
	left: 50%;
	margin-left: -600px;
}

body.touch {


}

.no-touch .claim {
display: none;
}

.kontakt-info {
	display: block;
	float: right;
	padding-right: 10px;
}

.col-3 {
	width: 30%;
	float: left;
}

.col-6 {
	width: 70%;
	float: left;
}

.kontakt-info span {
	display: inline-block;
	padding-left: 20px;
	font-size: 16px;
	margin-top: 50px;
	font-family: 'metric_regular';
}

.cleared {
	clear: both;
}

.footer-info-holder {
	padding: 25px;
	
}

.footer-info-holder p, .footer-info-holder ul li {
	font-family: 'metric_regular';
	}

 .footer-info-holder ul {
 	margin-left: 25px;
 }	

.footer-info-holder h2 {
	font-family: 'metric_bold';
	color: #09a2df;
}	

.footer-info-holder p strong {
	font-family: 'metric_bold';
}


.kontakt-info span, .kontakt-info span a {
	color: black;
}

.kontakt-info span a:hover {
	color: #09a2df;
	}

.kontakt-info span strong {
	font-family: 'metric_bold';
}

.header {
	height: 105px;
}

.footer {
	padding-bottom: 20px;
}

.footer-item {
	display: inline-block;
	float: left;

	font-family: 'metric_regular';
	text-transform: uppercase;
	color: black;
	padding-right: 25px;
	padding-top: 20px;
	padding-left: 20px;
}


.closeTouch {
	height: 50px;
	right: 20px;
	position: absolute !important;
	width: 50px;
	top: 20px;
	border: 1px solid red;
	z-index: 15000 !important;
	background-color: white;

}

.closeTouch.nissan {

	left: 20px;

}

.footer-info {
	display: none;
	opacity: 0;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 0.4s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out;
}

.footer-info.open {
display: block;
opacity: 1;
-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 0.4s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out;
	}

.footer-item.right {
	padding-right: 20px;
	float: right;
}

.footer-item a, .footer-item span {
	color: black;
	font-size: 18px;
	}

.footer-item a:hover, .footer-item span:hover {
	color: grey;
	cursor: pointer;
}

.button a:hover div span {
	color: grey;
}

.header .logo {
	float: left;
	width: 220px;
	margin-left: 40px;
	height: 100%;
}

.header .logo img {
	width: 100%;
	top: 50%;
	position: relative;
	-webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 04s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out;    
}

.header .logo img:hover {
	opacity: 0.8;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 0.4s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out;
}

.header .kontakt {
	float: right;
	width:600px;

	
	height: 100%;
}

.open-wrapp {
	width: 600px;

}

.open-wrapp.open .adress-col {
		opacity: 1;

}


.adress-col {
	width: 33%;
	opacity: 0;
	float: left;
}

.adress-col span:nth-of-type(1) {
	margin-left: 20px;
}

.adress-col span {
	display: block;
	padding: 20px;
	color: white;
	font-family: 'metric_regular';
}

.adress-col span strong {
		font-family: 'metric_bold';
	}

.close-wrapp {
	width: 180px;
	float: right;
	height: 100%;
	
}

.close-wrapp:hover
{
	cursor: pointer;
} 

.close-wrapp.open span {
		color: white;
	}

.close-wrapp span {

		text-align: center;
		display: block;
		color: #09a2df;
		line-height: 110px;
		font-family: 'metric_bold_italic';
		text-transform: uppercase;
		font-size: 20px;
	}

.header .kontakt.open {
	background-color: #09a2df;
}

.crossroad {
	height: 500px;
}

.holder {
	height: 350px;
	width: 390px;
	position: absolute;
}

.holder.opel {
	
	background-color: #f7ff14;
	left: 0px;
	}

.holder.nissan {
	
	background-color: #c6133d;
	 right: 0px;
	}

  .holder.toyota {
	
	background-color: #FF7900;
	
	}


.cross-holder section {
	transform: scale(1);
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 04s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out;  
}




section:hover {
	cursor: pointer;
}

.claim.opel {
	color: black;
	top: 20px;
	right: 20px;
}

.claim.nissan {
	color: white;
	top: 20px;
	left: 20px;
}

.claim.toyota {
	color: white;
	top: 20px;
	left: 20px;
}


.claim {
	position: absolute;
	font-family: 'metric_bold_italic';
	
	font-size: 21px;
	line-height: 21px;
}

.claim span {
	font-family: 'metric_light_italic';
	font-size: 33px;
	}


div.submenu {
	display: block;
	width: 300px;
	height: 350px;
	overflow: hidden !important;
	position: absolute;
}

div.submenu.opel {
	left: 0px;
	}

div.submenu.nissan {
	right: 0px;
	}
  
  div.submenu.toyota {
	right: 0px;
	}

ul.sub {
	width: 350px;
	list-style-type: none;
	margin: 0;
	padding: 0;
	position: absolute;
	left: 30px;
	top: 30px;
}


ul.sub.opel {
	left: -350px;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 04s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out; 
	
}



ul.sub.nissan {
left: 700px;
	width: 350px;
	
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 04s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out; 
	
}

ul.sub.toyota {
	left: 350px;
	width: 350px;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 04s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out; 
	
}

/***************************************************** ANIMACE - ONLY DESKTOP *****************************************************/

@media (min-width: 1024px) and (max-width: 2500px) {

			.cross-holder section.open div.submenu ul.sub.opel {
				left: 35px;
				-webkit-transition: all 0.4s ease-in-out;
				-moz-transition:all 04s ease-in-out;
				-o-transition:all 0.4s ease-in-out;
				transition:all 0.4s ease-in-out;
				transition-delay: 0.2s;
			}

			.cross-holder section.open div.submenu ul.sub.nissan {
				left: 30px;
				-webkit-transition: all 0.4s ease-in-out;
				-moz-transition:all 04s ease-in-out;
				-o-transition:all 0.4s ease-in-out;
				transition:all 0.4s ease-in-out;
				transition-delay: 0.2s;
			}
      
      .cross-holder section.open div.submenu ul.sub.toyota {
				left: 30px;
				-webkit-transition: all 0.4s ease-in-out;
				-moz-transition:all 04s ease-in-out;
				-o-transition:all 0.4s ease-in-out;
				transition:all 0.4s ease-in-out;
				transition-delay: 0.2s;
			}


			.cross-holder section.small {
				transform: scale(0.5);
				opacity: 0.7;

				-webkit-transition: all 0.4s ease-in-out;
				-moz-transition:all 04s ease-in-out;
				-o-transition:all 0.4s ease-in-out;
				transition:all 0.4s ease-in-out;  
					z-index: -500;
					
				
			}

			.cross-holder section.open div.carlogo.opel {
				left: -150px;
				-webkit-transition: all 0.4s ease-in-out;
				-moz-transition:all 04s ease-in-out;
				-o-transition:all 0.4s ease-in-out;
				transition:all 0.4s ease-in-out;
			}

			.cross-holder section.open div.carlogo.nissan {
				 left: 600px;
				-webkit-transition: all 0.4s ease-in-out;
				-moz-transition:all 04s ease-in-out;
				-o-transition:all 0.4s ease-in-out;
				transition:all 0.4s ease-in-out;
			}
      
      .cross-holder section.open div.carlogo.toyota {
				left: 300px;
				-webkit-transition: all 0.4s ease-in-out;
				-moz-transition:all 04s ease-in-out;
				-o-transition:all 0.4s ease-in-out;
				transition:all 0.4s ease-in-out;
			}


			.cross-holder section.open div.car-opel {
				right: -320px;
				bottom: -60px;


			}


			.cross-holder section.open div.car-nissan {
				left: -320px;
				bottom: -60px;


			}
      
      .cross-holder section.open div.car-toyota {
				left: -320px;
				bottom: -60px;


			}
      
      .holder.toyota {
	
	left: 405px;
	}



	}

/***************************************************** ANIMACE - ONLY DESKTOP *****************************************************/




.cross-holder section div.carlogo.opel {
	left: 15px;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 04s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out;
	transition-delay: 0.4s;
}




.cross-holder section div.carlogo.nissan {
	
  right: 20px;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 04s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out;
	transition-delay: 0.4s;
}

.cross-holder section div.carlogo.toyota {
	
   left: 40px;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 04s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out;
	transition-delay: 0.4s;
}




ul.sub li {
	 font-family: 'metric_medium';
	display: block;
	position: relative;
	padding-top: 3px;
	padding-bottom: 3px;
	margin-top: 3px;
	margin-bottom: 3px; 
}

ul.sub li.redirect {
	background-color: white;
	margin-top:20px;
	padding-left:10px;
	padding-right: 10px;
	margin-left: -10px;

	font-family: 'metric_light';
	display: inline-block;


}

ul.sub li.redirect span.upper {
	text-transform: uppercase;
	font-family: 'metric_light';
	}

ul.sub.nissan li.redirect, ul.sub.toyota li.redirect {
	background-color: white;
}


ul.sub.nissan li.redirect a, ul.sub.toyota li.redirect a {
	color: black;
}



ul.sub li.redirect a span {
	font-family: 'metric_bold';
	}

ul.sub li a  {
	color: black;
	font-size: 21px;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	-o-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
}

ul.sub.nissan li a, ul.sub.toyota li a  {
	color: white;
}

ul.sub li:hover.redirect {

	background-color: black;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	-o-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
}

ul.sub li:hover.redirect a {

	color: white;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition:all 0.2s ease-in-out;
	-o-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
}

.cleared {
	clear: both;
}



ul.sub li a:hover  {
	color: white;
	text-decoration: none;

}

ul.sub.nissan li a:hover , ul.sub.toyota li a:hover  {
	color: black;
	text-decoration: none;

}



ul.sub.nissan li.redirect a:hover, ul.sub.toyota li.redirect a:hover  {
	color: white;
	text-decoration: none;

}

.cross-holder section div.car-opel {
	position: absolute;
	width: 500px;
	height: 239px;
	z-index: 1000 !important;
	right: -70px;
	bottom: -80px;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 04s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out; 
}





.car-nissan {
	position: absolute;
	width: 500px;
	height: 239px;
	z-index: 998;
	left: -20px;
	bottom: -60px;
		-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 04s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out; 
}

.car-toyota {
	position: absolute;
	width: 500px;
	height: 239px;
	z-index: 999;
	left: -20px;
	bottom: -60px;
		-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 04s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out; 
}




.car-opel img, .car-nissan img, .car-toyota img, .carlogo.opel img, .carlogo.nissan img, .carlogo.toyota img {
	width: 100%;
}	


.carlogo.opel {
	position: absolute;
	width: 130px;
	top: 15px;
}

.carlogo.nissan {
	position: absolute;
	width: 130px;
	top: 15px;
}

.carlogo.toyota {
	position: absolute;
	width: 130px;
	top: 15px;
}

.button {
	display: block;
	width: 20%;
	height: 140px;
	float: left;
}

.button-wrapp {
	background-size: cover;
	background-color: grey;
	height: 100%;
	border-right: 10px solid white; 
	background-size: 102%;
		-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 0.4s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out; 
}

.button-wrapp:hover {
	cursor: pointer;
	background-size: 115%;
	
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 0.4s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out; 
	
}

.button-wrapp.last {
	border-right: 0px solid white; 
}	

.button-wrapp.no1 {
	background-image: url(../img/no1.png);
}

.button-wrapp.no2 {
	background-image: url(../img/no2.png);
}


.button-wrapp.no3 {
	background-image: url(../img/no3.png);
}


.button-wrapp.no4 {
	background-image: url(../img/no4.png);
}


.button-wrapp.no5 {
	background-image: url(../img/no5.png);
}



.button .button-wrapp span {
	font-family: 'metric_bold';
	color: black;
	font-size: 21px;
	line-height: 22px;	
	display: block;
	padding-left: 15px;
	padding-top: 15px;
	text-decoration: none !important
}

a:hover.button .button-wrapp span {
	text-decoration: none !important;
}

.navigation {
	display: none;
}


.button-wrapp.no3:hover .no3-hide{
	
		
	display: none;

}

.button-wrapp.no3 .no3-show{


	font-family: 'metric_light';
		font-size: 21px;


	width: 100%;
	height: 100%;
	display: none;
	text-align: center;
	color: white;
	position: relative;
	height: 100%;
	background-color: rgba(0,0,0,0.5);
}

.button-wrapp.no3 .no3-show div {
	display: block;
	border: 0px solid red;
	padding-top: 50px;

}

.button-wrapp.no3 .no3-show a {
	color:white;
		font-family: 'metric_bold';
			font-size: 21px;
	line-height: 22px;
	display: inline-block;

}

.button-wrapp.no3 .no3-show a:hover {
	text-decoration: underline !important;
	color: #03a0de;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition:all 0.4s ease-in-out;
	-o-transition:all 0.4s ease-in-out;
	transition:all 0.4s ease-in-out;
}


.button-wrapp.no3:hover .no3-show {

	display: block;
}

/************************************************************************************* MOBILE ***************************************************************************************/

@media (min-width: 240px) and (max-width: 719px) {
				 .page-holder {
					width: 100%;
					position: relative;
					left: auto;
					margin-left: 0;
					
				}



.button-wrapp.no3 .no3-hide.open {
	display: none;
}


.button-wrapp.no3 .no3-show.open {
	display: block;
}




.button-wrapp.no3 .no3-show div {

	padding-top: 35px;

}


.button-wrapp:hover {

	background-size: cover;

}

				.no-touch .claim {
display: block;
}

				.col-3 {
	width: 100%;
	float: left;
}

.col-6 {
	width: 100%;
	float: left;
}

 .footer-info-holder ul {
 	margin-left: -20px;
 }	

 .nbsp {
 	display: none;
 }


				.button {
					width: 100%;
					margin: 0px;
					margin-bottom: 10px;
					height: 100px;
					
				}
				.button-wrapp {
					background-position: center center;
				}

				.buttons {
					position: relative;

				}

				.button-wrapp {
					border: 0px;
					border-left: 10px solid white;
					border-right: 10px solid white; 
				}

				.button-wrapp.last {
					border-left: 10px solid white;
					border-right: 10px solid white;  
				}

				.footer {
					position: relative;
					height: auto !important;

					padding: 0px;
				}

				.footer-item {
					width: 100%;
					position: relative;
					margin: 0 auto;
					
					height: 40px;
					padding: 0px;
					text-align: center;

				}

				.crossroad {
					width: 100%;
					position: relative !important;
					padding-top: 0px;
				}



				.cross-holder {
					margin-top: 0px;
					border: 0px solid red;
					top: 0px;
				}

				.header {
					width: 100%;
					height: 90px;
				}

				.footer-item a, .footer-item span, .footer-item.last a {
					font-size: 12px;
					padding-bottom: 15px;
					position: relative;
					
					width: 100%;
					display: block !important;
					line-height: 40px;
					margin: 0 auto;
					}

				.footer-item.right {
					height: 50px;
					padding: 0px;
					
					

				}

				.holder.opel, .holder.nissan, .holder.toyota {
					width: 100%;
					
					margin-bottom: 0px;
					position: relative;
					overflow: hidden;
					border: 0px solid red;
					-webkit-transition: all 0s ease-in-out;
					-moz-transition: all 0s ease-in-out;
					-o-transition: all 0s ease-in-out;
					transition: all 0s ease-in-out;
					height: 100px;
				}

				.car-opel, .car-nissan, .car-toyota {
					display: none;
				}


				.holder.opel.mopen, .holder.nissan.mopen, .holder.toyota.mopen {
					min-height: 65px !important;
					-webkit-transition: all 0s ease-in-out;
					-moz-transition: all 0s ease-in-out;
					-o-transition: all 0s ease-in-out;
					transition: all 0s ease-in-out;
					height: auto;
					
			
				
				}

				.cross-holder section div.carlogo.opel, .cross-holder section div.carlogo.nissan, .cross-holder section div.carlogo.toyota {
					transition-delay: 0s;
					-webkit-transition: all 0s ease-in-out;
					-moz-transition: all 0s ease-in-out;
					-o-transition: all 0s ease-in-out;
					transition: all 0s ease-in-out;
				}


				.holder.opel.mopen div.carlogo.opel, .holder.nissan.mopen div.carlogo.nissan, .holder.nissan.mopen div.carlogo.toyota {
					/* width: 100px;*/
					transition-delay: 0s;
				}

				.header .logo {
					float: left;
					width: 150px;
					margin-left: 15px;
					height: 100%;
				}

				.crossroad {
					height: auto;
					padding-left: 10px;
					padding-right: 10px;
				}

				.cross-holder section div.carlogo.opel, .cross-holder section div.carlogo.nissan, .cross-holder section div.carlogo.toyota {
						left: auto;
						right: auto;
						left: 50%;
						margin-left: -40px; 
						top: 20px !important;
							position: absolute;
							width: 80px;

					}

					
						
						.header .kontakt {
						    float: right;
						    width: 100%;
						    height: 80px;
						}
										


						.kontakt-info {
							display: block;
						position: relative;
							height: 50px;
						 width: 100%;

						}

						.kontakt-info span {
						float: left;
						display: block;
						text-align: center;
						width: 100%;
							
						}

						.kontakt-info span {
							float: left;
							display: inline-block;
							padding-left: 0px;
							font-size: 14px;
							margin-top: 10px;
							font-family: 'metric_regular';
						}




					.submenu.opel, .submenu.nissan, .submenu.toyota  {
						width: 100%;
						position: relative;
					}


					ul.sub.opel, ul.sub.nissan, ul.sub.toyota {
						display: none; 
						width: 100%;
						position: relative !important;
						top: 120px;
						left: auto;
						right: auto;
						margin: 0 auto;
						padding-left: 15px;
						padding-right: 30px;
						background-color: none;
					padding-left: 30px;
					height: auto;
					}

					.holder.mopen ul.sub li {
							height: 25px;
							text-align: center;
					}
					.holder.mopen ul.sub li.redirect {
							height: 30px;
					}

					ul.sub li.redirect {
						margin-left: 0px !important;
						width: 100%;

					}

					.holder.mopen ul.sub {
							display: block;
					}

					ul.sub.opel li a, ul.sub.nissan li a {
						font-size:18px;
						
					}

						ul.sub.opel li a:hover, ul.sub.nissan li a:hover, ul.sub.toyota li a:hover {
							color: auto;
						}


				.claim.opel, .claim.toyota {
						color: black;
						top: 23px;
						right: auto;
						left:20px;
						text-align: left;
						font-size: 23px;
						line-height: 18px;
					}

					.claim span {
						font-size: 23px;
						line-height: 25px;
						margin-left: -2px;
						padding-left: 10px;
						display: block;
					}

		

					.claim br {
						display: none;

					}


					.holder.opel.mopen .claim::before, .holder.nissan.mopen .claim::before, .holder.toyota.mopen .claim::before {
		
						    transform: rotateZ(180deg);
						    	-webkit-transition: all 0.4s ease-in-out;
							-moz-transition:all 0.4s ease-in-out;
							-o-transition:all 0.4s ease-in-out;
							transition:all 0.4s ease-in-out; 
					}

					.claim::before {
						    font-family: FontAwesome;
						    content: "\f107";
						    display: block;
						    position: absolute;
						    right: 0px;
						    display: none;
						 
							-webkit-transition: all 0.4s ease-in-out;
							-moz-transition:all 0.4s ease-in-out;
							-o-transition:all 0.4s ease-in-out;
							transition:all 0.4s ease-in-out; 
					}

					.claim.nissan {
						color: white;
						top: 23px;
						left: auto;
						font-size: 23px;
						line-height: 18px;
						text-align: left;
						left: 20px;
					}

					.navigation {
						font-family: 'metric_light_italic';
						color: white;
						display: block;
						margin-bottom: 10px;
						padding-left: 0px;
						padding-right: 0px;
					}



					.navigation-wrapp {
							height: 40px;
							width: 100%;

						background-color: #2eafe2;
						display: block;
					}

					.navigation-wrapp:hover {
						cursor: pointer;
					}

					.navigation-wrapp .navico {
						float: right;
						margin-top: 9px;
						margin-right: 25px;
						width: 25px;
						height: 25px;
					}

					.navigation-wrapp .navico.open img {
						transform: rotateZ(90deg);
						-webkit-transition: all 0.4s ease-in-out;
							-moz-transition:all 0.4s ease-in-out;
							-o-transition:all 0.4s ease-in-out;
							transition:all 0.4s ease-in-out;

					}

						.navigation-wrapp .navico img {
							width: 100%;
							-webkit-transition: all 0.4s ease-in-out;
							-moz-transition:all 0.4s ease-in-out;
							-o-transition:all 0.4s ease-in-out;
							transition:all 0.4s ease-in-out;
						}

					.navigation-wrapp span {
						height: 40px;
						padding-left: 25px;
						font-size: 18px;
						line-height: 40px;

					}

					.navigation-wrapp.nav
					{
						background-color: #2a91b9;
						display: none;
					}

					.navigation-wrapp.nav.open {
						display: block;
					}

					.navigation-wrapp.nav span {
						font-family: 'metric_regular';
						text-transform: none;
						font-size: 14px;
					}

					.header {
						height: 150px;
					}

					.header .logo {
height: 80px;
					}

					.navigation-wrapp.nav span a {
						color: white;
					}
					.navigation-wrapp.nav span a:hover {
						text-decoration: underline !important;
					}

					.navigation-wrapp.nav span:nth-of-type(1) {
						padding-left: 25px;
					}


}


/************************************************************************************* TABLET ***************************************************************************************/


@media (min-width: 720px) and (max-width: 1024px)  {
				 .page-holder {
					width: 100%;
					position: relative;
					left: auto;
					margin-left: 0;
					
				}
.button-wrapp.no3 .no3-hide.open {
	display: none;
}


.button-wrapp.no3 .no3-show.open {
	display: block;
}




.button-wrapp.no3 .no3-show div {

	padding-top: 67px;

}





.button-wrapp:hover {

	background-size: cover;

}

.no-touch .claim {
display: block;
content: ' ';
}

				.header .kontakt {
				    float: right;
				    width: auto;
				  
				}

				.open-wrapp {
				    width: 550px;
				}			

				.close-wrapp {
				    width: 150px;
				    float: right;
				    height: 100%;
				}

				.adress-col span:nth-of-type(1) {
				    margin-left: 0px;
				}

				.crossroad {
				    height: 410px;
				}

				.button {
				  
				    height: 100px;
				   
				}

				.buttons {
					padding-left: 10px;
					padding-right: 10px;
				}

				.crossroad {
					padding-left: 10px;
				}

				.holder {
        
			    height: 600px;
			    width: 100%;
			    position: absolute;
			}

			.holder.opel {
     
				width: 100%;
				left: 10px;
			}

			.holder.nissan {
     
				width: 100%;
				left: 10px;
			}
      
      .holder.toyota {
     
				width: 100%;
				right: 10px;
			}

			.cross-holder section div.car-opel {
			    position: absolute;
			    width: 300px;
			    height: 300px;
			    z-index: 1000 !important;
			    right: -45px;
			    bottom: -60px;
			    -webkit-transition: all 0.4s ease-in-out;
			    -moz-transition: all 04s ease-in-out;
			    -o-transition: all 0.4s ease-in-out;
			    transition: all 0.4s ease-in-out;
			}

			.header {
				padding-right: 10px;
			}

			.car-nissan {
			    position: absolute;
			    width: 300px;
			    height: 300px;
			    z-index: 998;
			    left: -20px;
			    bottom: -80px;
			    -webkit-transition: all 0.4s ease-in-out;
			    -moz-transition: all 04s ease-in-out;
			    -o-transition: all 0.4s ease-in-out;
			    transition: all 0.4s ease-in-out;
			}
      
      
      
      .car-toyota {
			    position: absolute;
			    width: 300px;
			    height: 300px;
			    z-index: 998;
			    left: -20px;
			    bottom: -80px;
          z-index: 999;
			    -webkit-transition: all 0.4s ease-in-out;
			    -moz-transition: all 04s ease-in-out;
			    -o-transition: all 0.4s ease-in-out;
			    transition: all 0.4s ease-in-out;
			}

			.cross-holder section.small {
			
				opacity: 0.2;
		

				-webkit-transition: all 0.4s ease-in-out;
				-moz-transition:all 04s ease-in-out;
				-o-transition:all 0.4s ease-in-out;
				transition:all 0.4s ease-in-out;  
					z-index: -500;
					
				
			}



}



@media (min-width: 720px) and (max-width: 1024px) and (orientation:portrait)  {
				.page-holder {
					width: 100%;
					position: relative;
					left: auto;
					margin-left: 0;
					
				}


.button-wrapp:hover {

	background-size: cover;

}
				.header .kontakt {
				    float: right;
				    width: 500px;
				  
				}

				.header .logo {
			    float: left;
			    width: 180px;
			    margin-left: 20px;
			    height: 100%;
			}

				.open-wrapp {
				    width: 380px;
				}			

				.close-wrapp {
				    width: 100px;
				    float: right;
				    height: 100%;
				    padding-right: 10px;
				    text-align: right;
				}

			.crossroad {
	
					padding-left: 10px;
					padding-right: 10px;
					height: 880px;

				}


					.holder {
			    height: 270px;
			    width: 50%;
			    position: relative;
			}

						.holder.opel {
						width:100%;
					padding: 0px;
					margin: 0px;
					left: 0px;
					}



					.cross-holder section div.car-opel {
					    position: absolute;
					     width: 500px;
						    height: 300px;
					    z-index: 1000 !important;
					    right: 0px;
					    bottom: -90px;
					    -webkit-transition: all 0.4s ease-in-out;
					    -moz-transition: all 04s ease-in-out;
					    -o-transition: all 0.4s ease-in-out;
					    transition: all 0.4s ease-in-out;
					}

							.car-nissan {
						    position: absolute;
						    width: 520px;
						    height: 300px;
						    z-index: 999;
						    left: 40px;
						    bottom: -80px;
						    -webkit-transition: all 0.4s ease-in-out;
						    -moz-transition: all 04s ease-in-out;
						    -o-transition: all 0.4s ease-in-out;
						    transition: all 0.4s ease-in-out;
						}
            
            .car-toyota {
						    position: absolute;
						    width: 520px;
						    height: 300px;
						    z-index: 999;
						    right: 0px;
						    bottom: -80px;
						    -webkit-transition: all 0.4s ease-in-out;
						    -moz-transition: all 04s ease-in-out;
						    -o-transition: all 0.4s ease-in-out;
						    transition: all 0.4s ease-in-out;
						}


							.cross-holder section.open div.car-opel {
								
							width: 400px;


							}


							.cross-holder section.open div.car-nissan {
								
						width: 400px;


						}
            
            	.cross-holder section.open div.car-toyota {
								
						width: 400px;


						}


									.cross-holder section.open div.carlogo.opel {
								left: -150px;
								-webkit-transition: all 0.4s ease-in-out;
								-moz-transition:all 04s ease-in-out;
								-o-transition:all 0.4s ease-in-out;
								transition:all 0.4s ease-in-out;
							}

							.cross-holder section.open div.carlogo.nissan {
								left: 300px;
								-webkit-transition: all 0.4s ease-in-out;
								-moz-transition:all 04s ease-in-out;
								-o-transition:all 0.4s ease-in-out;
								transition:all 0.4s ease-in-out;
							}
              
              .cross-holder section.open div.carlogo.toyota {
								left: -150px;
								-webkit-transition: all 0.4s ease-in-out;
								-moz-transition:all 04s ease-in-out;
								-o-transition:all 0.4s ease-in-out;
								transition:all 0.4s ease-in-out;
							}


						.carlogo.opel {
							position: absolute;
							width: 150px;
							top: 80px;
						}

						.carlogo.nissan {
							position: absolute;
							width: 150px;
							top: 80px;
							left: 100px;
						}
            
            .carlogo.toyota {
							position: absolute;
							width: 150px;
							top: 80px;
							
						}


						.cross-holder section div.carlogo.opel {
						    left: 120px;
						    -webkit-transition: all 0.4s ease-in-out;
						    -moz-transition: all 04s ease-in-out;
						    -o-transition: all 0.4s ease-in-out;
						    transition: all 0.4s ease-in-out;
						    transition-delay: 0.4s;
						}

					.holder.nissan {
						width: 100%;
						padding: 0px;
						margin-top: 10px;
						left: 0px;
					}
          
          .holder.toyota {
						width: 100%;
						padding: 0px;
						margin-top: 10px;
						left: 0px;
					}


			.cross-holder section.open div.submenu ul.sub.opel {
				left: 35px;
				-webkit-transition: all 0.4s ease-in-out;
				-moz-transition:all 04s ease-in-out;
				-o-transition:all 0.4s ease-in-out;
				transition:all 0.4s ease-in-out;
				transition-delay: 0.2s;
			}

			.cross-holder section.open div.submenu ul.sub.nissan {
				left: 30px;
				-webkit-transition: all 0.4s ease-in-out;
				-moz-transition:all 04s ease-in-out;
				-o-transition:all 0.4s ease-in-out;
				transition:all 0.4s ease-in-out;
				transition-delay: 0.2s;
			}
      
      .cross-holder section.open div.submenu ul.sub.toyota {
				left: 30px;
				-webkit-transition: all 0.4s ease-in-out;
				-moz-transition:all 04s ease-in-out;
				-o-transition:all 0.4s ease-in-out;
				transition:all 0.4s ease-in-out;
				transition-delay: 0.2s;
			}


			ul.sub li a  {
				
				font-size: 18px;

			}


			.sub.opel .redirect {
				margin-top: 5px;
			}


			.adress-col span {
				display: block;
			padding: 15px;
			font-size: 12px;
			line-height: 14px;
			color: white;
			font-family: 'metric_regular';
			}

			.adress-col span strong {
				width: 80%;
				display: inline-block;
			}


			.adress-col span strong {
					font-family: 'metric_bold';
				}



				.button {
					width: 20%;
					margin: 0px;
					margin-bottom: 10px;
					height: 170px;
					
				}

				.button-wrapp {
					background-repeat: no-repeat;
					background-size: cover;
					background-position: center;
				}

				.button-wrapp span {
					font-size: 16px !important;
					line-height: 16px !important;
				}
}

/************************************************************************************* TABLET ***************************************************************************************/


@media (min-width: 1025px) and (max-width: 1200px) {
				.page-holder {
				    width: 100%;
				    position: relative !important;
				    left: auto;
				    margin: 0 auto !important;
				}

					.holder.opel {
					width: 48.333333%;
					left: 10px;
				}

				.holder.nissan {
					width: 48.333333%;
					right: 10px;
				}

					.cross-holder section div.car-opel {
				    position: absolute;
				    width: 550px;
				    height: 300px;
				    z-index: 1000 !important;
				    right: -70px;
				    bottom: -100px;
				    -webkit-transition: all 0.4s ease-in-out;
				    -moz-transition: all 04s ease-in-out;
				    -o-transition: all 0.4s ease-in-out;
				    transition: all 0.4s ease-in-out;
				}


				.header .kontakt {
				    float: right;
				    width: 600px;
				    height: 100%;
				}


				.header {
				    height: 105px;
				    padding-right: 10px;
				}

				.buttons {
					padding-left: 10px;
					padding-right: 10px;
				}

				div.car-nissan {
					width: 520px;
    				bottom: -80px;

				}
	}