/* ============================================================================================================================= */
/* ========== ZAPATI ASTRA ========== */
/* ============================================================================================================================= */	

@media only screen and (min-width:1024px) {

	#zapati-nadpis
	{
		position: relative;
		margin: 25px auto 15px auto;
		color: white;
		text-align: center;
		font-size: 24px;
		font-weight: 800;
		font-style: bold;
	}


	#zapati-popis
	{
		line-height: 24px;
		position: relative;
		margin: 0 auto 25px auto;
		color: white;
		text-align: center;
		font-size: 16px;
		font-weight: 600;
		font-style: bold;
	}
}

@media only screen and (min-width:375px) and (max-width:1023px) {

	#zapati-nadpis
	{
		position: relative;
		margin: 15px auto 10px auto;
		color: white;
		text-align: center;
		font-size: 21px;
		font-weight: 800;
		font-style: bold;
	}


	#zapati-popis
	{
		line-height: 20px;
		position: relative;
		margin: 0 auto 15px auto;
		color: white;
		text-align: center;
		font-size: 15px;
		font-weight: 600;
		font-style: bold;
	}
}

@media only screen and (min-width:0px) and (max-width:374px) {
	#zapati-nadpis
	{
		position: relative;
		margin: 15px auto 8px auto;
		color: white;
		text-align: center;
		font-size: 19px;
		font-weight: 800;
		font-style: bold;
	}


	#zapati-popis
	{
		line-height: 18px;
		position: relative;
		margin: 0 auto 15px auto;
		color: white;
		text-align: center;
		font-size: 14px;
		font-weight: 600;
		font-style: bold;
	}
}




/* ============================================================================================================================= */
/* ========== KONTAKTY ========== */
/* ============================================================================================================================= */	


.kontakt-telefon			{ background-image: url("../kontakty/soubory/telefon.svg"); }
.kontakt-mail				{ background-image: url("../kontakty/soubory/mail.svg"); }
.kontakt-adresa				{ background-image: url("../kontakty/soubory/adresa.svg"); }


.kontakt-telefon,
.kontakt-mail,
.kontakt-adresa
{
	background-repeat: no-repeat;
	background-position: left 0;
	background-size: 24px 24px;
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-ms-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
}



@media only screen and (min-width:1024px) {

	.nadpis-showroom
	{
		width: 100%;
		position: relative;
		margin: 25px auto 0 auto;
		text-align: left;
		font-size: 21px;
		font-weight: 600;
		font-style: bold;
		color: #000000;
	}



	.kontakt-polozka-box
	{
		width: 33.333%;
		position: relative;
		margin: 35px 0 0 0;
		display: table;
		float: left;
	}



	.kontakt-polozka
	{
		margin: 0 10px;
	}



	.kontakt-jmeno,
	.kontakt-popis,
	.kontakt-telefon,
	.kontakt-mail,
	.kontakt-adresa
	{
		width: 100%;
		position: relative;
		display: table;
	}



	.kontakt-jmeno
	{
		font-size: 17px;
		font-weight: 600;
		font-style: bold;
		color: #000000;
		margin: 0 0 10px 0;
	}



	.kontakt-popis
	{
		font-size: 14px;
		font-weight: 400;
		font-style: normal;
		color: #333333;
		margin: 0 0 25px 0;
	}



	.kontakt-telefon,
	.kontakt-mail,
	.kontakt-adresa
	{
		line-height: 24px;
		font-size: 15px;
		font-weight: 500;
		font-style: bold;
		color: #000000;
		margin: 0 0 20px 0;
		padding: 0 0 0 34px;
	}



	.kontakt-telefon a,
	.kontakt-mail a,
	.kontakt-adresa a
	{
		color: #000000;
	}



	p.kontakt-data
	{
		width: 100%;
		position: relative;
		display: table;
	}



	#kontaktadresa
	{
		margin: 0 0 26px 0;
	}



	#g-mapa-box
	{
		width: 100%;
		position: relative;
		margin: 5px auto 0 auto;
	}



	#g-mapa
	{
		width: 100%;
		height: 400px;
		position: relative;
		margin: 0 auto;
	}



	#g-mapa iframe
	{
		width: 100%;
		height: 400px;
		position: relative;
		margin: 0 auto;
	}	

}


@media only screen and (max-width:1023px) {

	.nadpis-showroom
	{
		width: 100%;
		position: relative;
		margin: 25px auto 0 auto;
		text-align: left;
		font-size: 21px;
		font-weight: 600;
		font-style: bold;
		color: #000000;
	}



	.kontakt-polozka-box
	{
		width: 100%;
		position: relative;
		margin: 35px 0 0 0;
		display: table;
		float: left;
	}



	.kontakt-polozka
	{
		margin: 0 10px;
	}



	.kontakt-jmeno,
	.kontakt-popis,
	.kontakt-telefon,
	.kontakt-mail,
	.kontakt-adresa
	{
		width: 100%;
		position: relative;
		display: table;
	}



	.kontakt-jmeno
	{
		font-size: 17px;
		font-weight: 600;
		font-style: bold;
		color: #000000;
		margin: 0 0 10px 0;
	}



	.kontakt-popis
	{
		font-size: 14px;
		font-weight: 400;
		font-style: normal;
		color: #333333;
		margin: 0 0 25px 0;
	}



	.kontakt-telefon,
	.kontakt-mail,
	.kontakt-adresa
	{
		line-height: 24px;
		font-size: 15px;
		font-weight: 500;
		font-style: bold;
		color: #000000;
		margin: 0 0 20px 0;
		padding: 0 0 0 39px;
	}



	.kontakt-telefon a,
	.kontakt-mail a,
	.kontakt-adresa a
	{
		color: #000000;
	}



	p.kontakt-data
	{
		width: 100%;
		position: relative;
		display: table;
	}



	#kontaktadresa
	{
		margin: 0 0 26px 0;
	}



	#g-mapa-box
	{
		width: 100%;
		position: relative;
		margin: 5px auto 0 auto;
	}



	#g-mapa
	{
		width: 100%;
		height: 400px;
		position: relative;
		margin: 0 auto;
	}

	

	#g-mapa iframe
	{
		width: 100%;
		height: 400px;
		position: relative;
		margin: 0 auto;
	}	

}





/* ============================================================================================================================= */
/* ========== CARUSEL KATALOG ========== */
/* ============================================================================================================================= */	

@media only screen and (min-width:1024px) {

	#carusel
	{
		width: 100%;
		max-width: 1500px;
		position: relative;
		margin: 0 auto;
		display: table;	
	}



	#carusel-container-box
	{
		margin: 25px 10px 50px 10px;
		position: relative;
		display: table;	
	}



	#carusel-container
	{
		width: 66.666%;
		float: left;
		position: relative;
	}



	.carusel-slideshow-container
	{
		position: relative;
		margin: 10px;
		border-radius: 6px;
		background-color: white;
		box-shadow: rgba(0,0,0,0.20) 0 8px 24px;
		-webkit-transition: all .4s ease;
		-moz-transition: all .4s ease;
		-ms-transition: all .4s ease;
		-o-transition: all .4s ease;
		transition: all .4s ease;
		overflow: hidden !important;
	}



	.caruselmySlides 
	{
		display: block;
		float: left;
	}



	.caruselmySlides img
	{
		width: 100%;
		vertical-align: middle;
		object-fit: cover;
		border-radius: 6px;
		overflow: hidden;
	}



	.fade
	{
		animation: fade 5s ease-in-out;
	}

	@keyframes fade {
	0% { transform: translateX( 100% ); }
	5% { transform: translateX( 0 ); }
	95% { transform: translateX( 0 ); }
	100% { transform: translateX( -100% ); }
	}



	.dot-conteiner
	{
		height: 30px;
		position: absolute;
		bottom: 0px;
		left: 10px;
		right: 10px;
		padding-top: 15px;
		text-align: center;
		-webkit-backdrop-filter: saturate(180%) blur(24px);
		backdrop-filter: saturate(180%) blur(24px);
		border-radius: 0 0 6px 6px;
	}



	.dot
	{
		height: 15px;
		width: 15px;
		margin: 0 2px;
		background-image: linear-gradient(180deg, #E0E0E0 0%, #C2C2C2 100%);
		border-radius: 50%;
		display: inline-block;
		transition: background-image 0.6s ease;
		box-shadow: rgba(0,0,0,0.25) 0 1px 1px;	
	}



	.active
	{
		background-image: linear-gradient(180deg, #FF5469 0%, #E0001B 100%);
	}



	#carusel-container2
	{
		width: 33.333%;
		float: left;
		position: relative;
	}



	.carusel-mrizka
	{
		width: 50%;
		float: left;
	}



	.carusel-mrizka-obrazek
	{
		margin: 10px 10px 25px 10px;
		border-radius: 6px;
		background-color: white;
		box-shadow: rgba(0,0,0,0.20) 0 8px 24px;
		-webkit-transition: all .4s ease;
		-moz-transition: all .4s ease;
		-ms-transition: all .4s ease;
		-o-transition: all .4s ease;
		transition: all .4s ease;
		overflow: hidden;
	}


	.carusel-mrizka img
	{
		width: 100%;
		vertical-align: middle;
		-webkit-transition: all .2s ease;
		-moz-transition: all .2s ease;
		-ms-transition: all .2s ease;
		-o-transition: all .2s ease;
		transition: all .2s ease;
	}


	
	.carusel-mrizka-obrazek:hover
	{
		box-shadow: rgba(0,0,0,0.25) 0 12px 36px;
		scale: 1.075;
	}


	
	.carusel-mrizka img:hover
	{
		scale: 1.075;
	}
}




@media only screen and (min-width:768px) and (max-width:1023px) {

	#carusel
	{
		width: 100%;
		max-width: 1480px;
		position: relative;
		margin: 0 auto;
		display: table;	
	}



	#carusel-container-box
	{
		margin: 0px 0 50px 0;
		position: relative;
		display: table;	
	}



	#carusel-container
	{
		width: 100%;
		float: left;
		position: relative;
	}



	.carusel-slideshow-container
	{
		position: relative;
		margin: 20px;
		border-radius: 6px;
		background-color: white;
		box-shadow: rgba(0,0,0,0.20) 0 8px 24px;
		-webkit-transition: all .4s ease;
		-moz-transition: all .4s ease;
		-ms-transition: all .4s ease;
		-o-transition: all .4s ease;
		transition: all .4s ease;
		overflow: hidden !important;
	}



	.caruselmySlides 
	{
		display: block;
		float: left;
	}



	.caruselmySlides img
	{
		width: 100%;
		vertical-align: middle;
		object-fit: cover;
		border-radius: 6px;
		overflow: hidden;
	}



	.fade
	{
		animation: fade 5s ease-in-out;
	}

	@keyframes fade {
	0% { transform: translateX( 100% ); }
	5% { transform: translateX( 0 ); }
	95% { transform: translateX( 0 ); }
	100% { transform: translateX( -100% ); }
	}



	.dot-conteiner
	{
		height: 30px;
		position: absolute;
		bottom: 0px;
		left: 20px;
		right: 20px;
		padding-top: 15px;
		text-align: center;
		-webkit-backdrop-filter: saturate(180%) blur(24px);
		backdrop-filter: saturate(180%) blur(24px);
		border-radius: 0 0 6px 6px;
	}



	.dot
	{
		height: 15px;
		width: 15px;
		margin: 0 2px;
		background-image: linear-gradient(180deg, #E0E0E0 0%, #C2C2C2 100%);
		border-radius: 50%;
		display: inline-block;
		transition: background-image 0.6s ease;
		box-shadow: rgba(0,0,0,0.25) 0 1px 1px;	
	}



	.active
	{
		background-image: linear-gradient(180deg, #FF5469 0%, #E0001B 100%);
	}



	#carusel-container2
	{
		width: 100%;
		float: left;
		position: relative;
		margin-top: 5px;
	}



	.carusel-mrizka
	{
		width: 25%;
		float: left;
	}



	.carusel-mrizka-obrazek
	{
		margin: 35px 20px 0px 20px;
		border-radius: 6px;
		background-color: white;
		box-shadow: rgba(0,0,0,0.20) 0 8px 24px;
		-webkit-transition: all .4s ease;
		-moz-transition: all .4s ease;
		-ms-transition: all .4s ease;
		-o-transition: all .4s ease;
		transition: all .4s ease;
		overflow: hidden;
	}


	.carusel-mrizka img
	{
		width: 100%;
		vertical-align: middle;
		-webkit-transition: all .2s ease;
		-moz-transition: all .2s ease;
		-ms-transition: all .2s ease;
		-o-transition: all .2s ease;
		transition: all .2s ease;
	}


	
	.carusel-mrizka-obrazek:hover
	{
		box-shadow: rgba(0,0,0,0.25) 0 12px 36px;
		scale: 1.075;
	}


	
	.carusel-mrizka img:hover
	{
		scale: 1.075;
	}

}








@media only screen and (min-width:0px) and (max-width:767px) {

	#carusel
	{
		width: 100%;
		max-width: 1480px;
		position: relative;
		margin: 0 auto;
		display: table;	
	}



	#carusel-container-box
	{
		margin: 0px 0 35px 0;
		position: relative;
		display: table;	
	}



	#carusel-container
	{
		width: 100%;
		float: left;
		position: relative;
	}



	.carusel-slideshow-container
	{
		position: relative;
		margin: 10px;
		border-radius: 6px;
		background-color: white;
		box-shadow: rgba(0,0,0,0.20) 0 8px 24px;
		-webkit-transition: all .4s ease;
		-moz-transition: all .4s ease;
		-ms-transition: all .4s ease;
		-o-transition: all .4s ease;
		transition: all .4s ease;
		overflow: hidden !important;
	}



	.caruselmySlides 
	{
		display: block;
		float: left;
	}



	.caruselmySlides img
	{
		width: 100%;
		vertical-align: middle;
		object-fit: cover;
		border-radius: 6px;
		overflow: hidden;
	}



	.fade
	{
		animation: fade 5s ease-in-out;
	}

	@keyframes fade {
	0% { transform: translateX( 100% ); }
	5% { transform: translateX( 0 ); }
	95% { transform: translateX( 0 ); }
	100% { transform: translateX( -100% ); }
	}



	.dot-conteiner
	{
		height: 30px;
		position: absolute;
		bottom: 0px;
		left: 10px;
		right: 10px;
		padding-top: 15px;
		text-align: center;
		-webkit-backdrop-filter: saturate(180%) blur(24px);
		backdrop-filter: saturate(180%) blur(24px);
		border-radius: 0 0 6px 6px;
	}



	.dot
	{
		height: 15px;
		width: 15px;
		margin: 0 2px;
		background-image: linear-gradient(180deg, #E0E0E0 0%, #C2C2C2 100%);
		border-radius: 50%;
		display: inline-block;
		transition: background-image 0.6s ease;
		box-shadow: rgba(0,0,0,0.25) 0 1px 1px;	
	}



	.active
	{
		background-image: linear-gradient(180deg, #FF5469 0%, #E0001B 100%);
	}



	#carusel-container2
	{
		width: 100%;
		float: left;
		position: relative;
		margin-top: 10px;
	}



	.carusel-mrizka
	{
		width: 50%;
		float: left;
	}



	.carusel-mrizka-obrazek
	{
		margin: 10px 10px 10px 10px;
		border-radius: 6px;
		background-color: white;
		box-shadow: rgba(0,0,0,0.20) 0 8px 24px;
		-webkit-transition: all .4s ease;
		-moz-transition: all .4s ease;
		-ms-transition: all .4s ease;
		-o-transition: all .4s ease;
		transition: all .4s ease;
		overflow: hidden;
	}


	.carusel-mrizka img
	{
		width: 100%;
		vertical-align: middle;
		-webkit-transition: all .2s ease;
		-moz-transition: all .2s ease;
		-ms-transition: all .2s ease;
		-o-transition: all .2s ease;
		transition: all .2s ease;
	}


	
	.carusel-mrizka-obrazek:hover
	{
		box-shadow: rgba(0,0,0,0.25) 0 12px 36px;
		scale: 1.05;
	}


	
	.carusel-mrizka img:hover
	{
		scale: 1.05;
	}

}





.prev,
.next
  {
    margin-top: -20px !important;
  }