@import url('https://fonts.googleapis.com/css2?family=Rajdhani&display=swap');

* { margin: 0; padding: 0; font-family: 'Rajdhani', sans-serif;}

body { display: grid; min-height: 100dvh; grid-template-rows: auto 1fr auto;}


/* colors */
.naranja { background-color: #EC812C;}
.rojo { background-color: #C34732;}
.verde { background-color: #54953d;}
.azul { background-color: #0099d9;}
.grisclaro { background-color: #f1f1f1;}
.gris { background-color: #333;}

/* FASCINO */
.verdea { background-color: #1A6169 ;}
.morado { background-color: #8D1B5F ;}



.esp_menu { height: 100px; }
.esp_contenido { position: relative; }

.colum_00 {width: 100%;} .colum_00 img {width: 100%;}
.colum_01 {width: 90%; max-width: 1800px; margin: 50px auto; display: grid; grid-template-columns: repeat(1, 1fr); grid-gap: 10px; }
.colum_02 {width: 90%; max-width: 1800px; margin: 50px auto; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 20px; }
.colum_03 {width: 90%; max-width: 1800px; margin: 50px auto; display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 20px; }
.colum_04 {width: 90%; max-width: 1800px; margin: 50px auto; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 20px; }
.colum_05 {width: 90%; max-width: 1800px; margin: 50px auto; display: grid; grid-template-columns: repeat(5, 1fr); grid-gap: 20px; }

@media (min-width:768px) and (max-width:1279px) {
	.colum_04 {width: 90%; max-width: 1800px; margin: 50px auto; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 20px; }
	.colum_05 {width: 90%; max-width: 1800px; margin: 50px auto; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 20px; }

	
	.item-1:nth-child(1) {grid-column-start: span 2;}
}
@media (max-width:767px) {
	.colum_04 {width: 90%; max-width: 1800px; margin: 50px auto; display: grid; grid-template-columns: repeat(1, 1fr); grid-gap: 20px; }
	.colum_05 {width: 90%; max-width: 1800px; margin: 50px auto; display: grid; grid-template-columns: repeat(1, 1fr); grid-gap: 20px; }
}


.col02 { display: grid; grid-template-columns: repeat(2, auto); }
.col03 { display: grid; grid-template-columns: repeat(3, auto); }
.col04 { display: grid; grid-template-columns: repeat(4, auto); }

.text_slider {
	width: 100%;
	position: relative;
	margin-top: -40px;
	text-align: justify;
	z-index: 776;
}
.text_slider div {
	width: 80%;
    max-width: 1800px;
	margin: auto;
	padding: 50px;
	box-sizing: border-box;
	background-color: white;
	border: 1px solid black;
}


.cont_3 figure { overflow: hidden;}
.cont_3 img {
	width: 100%;
	height: 100%;
	transition: .3s;
}
.cont_3 img:hover {transform: scale(1.1);}
.cont_3 figcaption {
	padding: 20px 10px;
	box-sizing: border-box;
	text-align: justify;
}
.cont_3 h1{ padding: 0 0 5px 0; box-sizing: border-box;}
.cont_3 a {color: red; text-decoration: none;}
.comt_3 a:hover {font-weight: bold;}


.kit { width: 90%; max-width: 1800px; margin: auto;}
.kit .logokit { width: 40% ; margin: auto;}
.kit .logokit img { width: 100%; filter: drop-shadow( 2px 1px 2px gray);}

.kit article { 
	position: relative;
	width: 100%;
	max-width: 1800px;
	margin: 20px auto;
}
.kit .bannerInd figure:nth-child(1) { 
	position: absolute; 
	width: 100%;
	max-width: 800px; 
	height: 100%; 
	max-height: 356px; 
	top: 80px;
	left: 50px;
	overflow: hidden; 
	z-index: 2;
}
.kit .bannerInd figure:nth-child(1) img { width: 100%;}

.kit .bannerInd figure:nth-child(2) { 
	width: 100%; 
	max-width: 1800px; 
	height: 500px; 
	overflow: hidden; 	
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 75% 100%, 0% 70%);
	z-index: 1;
}
.kit .bannerInd figure:nth-child(2) img { 
	width: 100%; 
	display: grid; 
	place-items: center;
}

.kit .bannerInd figure:nth-child(3) { 
	position: absolute; 
	width: 100%;
	max-width: 800px; 
	height: 100%; 
	max-height: 356px; 
	top: 100px;
	right: 50px;
	overflow: hidden; 
	z-index: 3;
}
.kit .bannerInd figure:nth-child(3) img { width: 100%;}

.kit .bannerInd figcaption {
	width: 100%;
	padding: 20px;
	box-sizing: border-box;
	font-size: 45px;
	text-align: center;
	font-weight: bold;
	color: white;
}

.elkit {
	width: 100%;
	max-width: 1800px;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
}
.elkit section { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid lightgray;}

.elkit section div h2 { padding: 15px 15px 0 15px; box-sizing: border-box; font-size: clamp(30px, 4vw, 15px);}
.elkit section div h3 { padding: 0 15px 10px 15px; box-sizing: border-box;}
.elkit section div h4 { padding: 15px; box-sizing: border-box; color: white; font-size: clamp(30px, 4vw, 20px);}
.elkit section div h4 b { color: yellow; }
.elkit section div p { padding: 0 15px; box-sizing: border-box; text-align: justify; }
.elkit section div figure { width: 100%; max-width: 445px; height: 100%; display: grid; place-items: center;}
.elkit section div figure img { width: 100%; object-fit: cover; }
.elkit section div a { text-decoration: none; color: red; font-weight: 600;}
.elkit section div a:hover { color: green; font-weight: 600;}

.barrier { 
	width: 90%; 
	max-width: 1800px; 
	margin: 50px auto; 
	display: grid; 
	grid-template-columns: 1fr 2fr;
	border: 1px solid gray;
}
.barrier h1 { padding: 0 0 0 15px; box-sizing: border-box;}
.barrier span { padding: 0 0 0 15px; box-sizing: border-box; font-weight: 600;}
.barrier p { padding: 15px; box-sizing: border-box; text-align: justify;}
.barrier figure { width: 100%; }
.barrier figure img { width: 100%; height: 100%; object-fit: cover;}
.barrier .imgbarrier figure { width: 100%; height: 100%;}
.barrier .imgbarrier figure img { width: 100%; height: 100%; object-fit: cover;}
.barrier a { text-decoration: none; color: red; font-weight: 600;}
.barrier a:hover { color: green; font-weight: 600;}

/* @media (min-width:1281px) and (max-width:1368px) {	
	.kit .bannerInd figure:nth-child(1) { width: 45%; left: 10px; }
	.kit .bannerInd figure:nth-child(2) { height: auto; }
	.kit .bannerInd figure:nth-child(3) {  width: 45%; right: 10px; }

} */
@media (min-width:821px) and (max-width:1368px) {	
	.kit .bannerInd figure:nth-child(1) { width: 45%; left: 10px; }
	.kit .bannerInd figure:nth-child(2) { height: auto; }
	.kit .bannerInd figure:nth-child(3) {  width: 45%; right: 10px; }

}
@media (min-width:720px) and (max-width:820px) {
	.kit .bannerInd figcaption { font-size:30px ;}
	.kit .bannerInd figure:nth-child(1) { width: 330px; left: 10px; }
	.kit .bannerInd figure:nth-child(2) { height: auto; }
	.kit .bannerInd figure:nth-child(3) {  width: 330px; right: 10px; }
	.elkit {  grid-template-columns: 1fr; }

	.barrier { grid-template-columns: 1fr;}
}

@media (max-width:719px) {
	.text_slider { margin-top: 30px; }
	.kit .bannerInd figcaption { font-size:20px ;}
	.kit .bannerInd figure:nth-child(1) { width: 80%; top: 80px; left: 10%; }
	.kit .bannerInd figure:nth-child(2) { height: 300px; }
	.kit .bannerInd figure:nth-child(3) { width: 80%; top: 190px; right: 10%; }

	.elkit {  grid-template-columns: 1fr; }
	.elkit section {  grid-template-columns: 1fr;}

	.barrier { grid-template-columns: 1fr;}
}





.mezcla {width: 90% !important;}
.mezcla h1 {font-size: 2.5em; font-weight: 100;}
.mezcla p {padding: 20px 0; box-sizing: border-box; text-align: justify;}
.mezcla img {width: 100%;}
.mezcla a {cursor: pointer; color: red; text-decoration: none;}
.mezcla a:hover { font-weight: bold;}
.mezcla a:hover img { opacity: 0.5;}

/*----footer---*/

footer { 
	width: 100%; 
	padding: 30px 0 80px 0;
	box-sizing: border-box;
	background-color: black;
	color: white;
	display: grid;
	grid-template-columns: 2fr 5fr;
	place-content: center;
	gap: 20px;
}
footer div {text-align: center;}
footer figcaption {padding: 15px 20px; box-sizing: border-box; font-size: 0.9em; text-align: justify;}
footer p { 
	width: 35%; 
	margin: auto; 
	padding: 10px; 
	box-sizing: border-box; 
	border: 1px solid white;
	border-radius: 10px;
	background-color: #555;
}
footer img {width: 60%; border-radius: 10px;}
footer a {color: white; text-decoration: none;}
footer a:hover { color: yellow;}
footer .fooprod { width: 100%; display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px;}
footer .fooprod h2 { text-align: left !important; padding: 10px 0 10px 10px; box-sizing: border-box; font-size: 1.2em; font-weight: 100; }
footer ul {text-align: left; font-size: 0.9em;}
footer li {margin-left: 15px;}

@media (max-width:820px) {
	footer {grid-template-columns: 1fr; padding: 30px 0 120px 0;}
	footer img { width: 40%;}
	footer figcaption {width: 70%; margin: auto;}
	footer p { margin-bottom: 30px;}
	footer .fooprod { width: 80%; margin: auto; grid-template-columns: repeat(3, 1fr);}
}

@media (max-width:420px) {
	footer .fooprod { grid-template-columns: 1fr 1fr;}
}

/*----footer---*/
/*--contacto--*/
.wt {
	position: fixed;
	bottom: 20px;
	right: 50px;
	width: 222px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	place-content: center;
	gap: 10px;
	z-index: 999;
}
.wt div {
	width: 74px;
	height: 74px;
	padding: 12px 12px;
	box-sizing: border-box;
	border-radius: 50%;
	box-shadow: 0 0 5px 3px rgba(0,0,0,0.15);
}
.wt_telefono { background: #bf360c;  background: linear-gradient(20deg, #bf360c  45%, #ff6f00 100%); }
.wt_mail { background: rgb(255,165,0); background: linear-gradient(45deg, rgba(158,112,64) 45%, rgba(255,165,0) 100%); }
.wt_whatsapp { background: rgb(9,121,44); background: linear-gradient(340deg, rgba(9,121,44) 45%, rgba(0,182,54,1) 100%); }

@media (max-width:420px) { 
	.wt {right: 25px;}
}

.contacto { width: 100%; }
.contacto h2 {
	width: 80%;
	margin: auto;
	text-align: center;
	padding: 30px 0;
}
.contacto form { width: 50%; margin: 0 auto 30px auto;}
.contacto input {
	width: 100%;
	margin-bottom: 15px;
	padding: 10px;
	box-sizing: border-box;
}
.contacto textarea {
	width: 100%;
	height: 300px;
	margin-bottom: 15px;
	padding: 10px;
	box-sizing: border-box;
}
.contacto button {width: 100%; padding: 5px; box-sizing: border-box;}
@media (max-width:1200px) {	
	.contacto form {width: 80%;}
}




/*nuevas secciones*/

.slider__principal { width: 100%; height: 500px; background-color: #3f2a1f; }
.slider__principal article { max-width: 1200px; width: 90%; height: 500px; margin: auto; display: grid; grid-template-columns: 2fr 1fr; }
.slider__principal article div:nth-child(1) { position: relative; display: grid; place-items: center; }
.slider__principal article div:nth-child(1) span { width: 100%; padding: 20px; box-sizing: border-box; text-align: right; color: white;}
.slider__principal article div:nth-child(1) h1 { width: 100%; font-size: 3em; font-weight: 100; letter-spacing: 8px; line-height: 45px; }
.slider__principal article div:nth-child(1) h1 b { font-weight: 600; color: #c7b299; }
.slider__principal article div:nth-child(1) p { padding: 20px 0; box-sizing: border-box; }

.slider__principal article div:nth-child(2) figure { width: 100%; height: 500px; background-color: yellow;}
.slider__principal article div:nth-child(2) figure img { width: 500px; height: 500px; background-color: yellow;}



.titulo__seccion { max-width: 1200px; width: 90%; height: 100px; margin: 30px auto; text-align: center; }
.titulo__seccion h1 { font-size: 2.8em; font-weight: 100; color: #3f2a1f;}
.titulo__seccion p { font-size: 2em; font-weight: 600; color: gray;}


.ico__pisos { width: 90%; max-width: 800px; margin: 0 auto 30px auto; display: grid; grid-template-columns: repeat(4 ,1fr);}
.ico__pisos figure { width: 150px; height: 150px; border: 1px solid lightgray; border-radius: 15px; box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.1); }
.ico__pisos figure img { width: 100%; }


.pisos { width: 90%; max-width: 1800px; margin: 30px auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }

.pisos figure { width: 100%;}
.pisos img { width: 100%; margin-top: -6px; }
.pisos .ft { 
	position: relative;
	width: 100%; 
	display: grid; 
	grid-template-columns: 2fr 1fr; 
	margin-top: -6px; 
	padding: 15px; 
	box-sizing: border-box; 
	background-color: #ccc; 
}
.pisos .ft h2 {	font-weight: 100;}
.pisos .ft a { background-color: gray; color: white; display: grid; place-items: center; text-decoration: none; }

.pisos div:nth-child(5) { grid-column: 1 / span 2; border: 1px solid blue;}


/* DISTRIBUIDORES */

.slider__distribuidores { width: 100%; height: 600px; margin: 0 auto 30px auto; background: linear-gradient(to bottom, #005085, #0099d9, #005085); overflow: hidden; position: relative;}

.slider__distribuidores article:nth-child(1) { width: 100%; height: 600px; position: absolute; z-index: 1; }
.slider__distribuidores article:nth-child(1) img { width: 100%; position: absolute; width: 100%; top: -2000px; filter: blur(5px); opacity: 0.3; }

.slider__distribuidores article:nth-child(2) { 
	position: relative;
	z-index: 2; 
	width: 90%; max-width: 1800px; height: 600px;
	margin: auto;
	display: grid; grid-template-columns: 1.5fr 2fr;
}

.slider__distribuidores article:nth-child(2) div:nth-child(1) figure { width: 100%; height: 600px; display: grid; place-items: center; }
.slider__distribuidores article:nth-child(2) div:nth-child(1) figure img { width: auto; height: 600px; object-fit: cover; }

.slider__distribuidores article:nth-child(2) div:nth-child(2) { position: relative; width: 100%; }
.slider__distribuidores article:nth-child(2) div:nth-child(2) h1 { font-size: 4em; padding: 30px 0 20px 20px; box-sizing: border-box; color: white; text-shadow: -1px 1px 2px black;}
.slider__distribuidores article:nth-child(2) div:nth-child(2) ul { font-size: 1.5em; padding-left: 60px; box-sizing: border-box; color: white; text-shadow: -1px 1px 2px black;}

.slider__distribuidores article:nth-child(2) div:nth-child(2) div { position: absolute; bottom: 20px;  width: 100%; padding: 0 20px; box-sizing: border-box; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.slider__distribuidores article:nth-child(2) div:nth-child(2) div p { width: 100%; height: 80px; display: grid; place-items: center; font-size: 1.2em; font-weight: 600; color: white; background-color: #ff6f00; border-radius: 5px; }



.productos_distribuidor { width: 90%; max-width: 1800px; margin: auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.productos_distribuidor article { width: 100%; height: 500px; border: 1px solid green;}
.productos_distribuidor article figure { width: 100%; height: 450px; background-color: lightblue;}
.productos_distribuidor article a { width: 100%; height: 50px; text-decoration: none; font-weight: 600; display: grid; place-items: center; transition: 0.5s; color: white; background-color: gray;}
.productos_distribuidor article a:hover { background-color: #ff6f00; color: white;}


.contacto_distribuidor { width: 100%; height: 350px; margin: 30px auto 100px auto; background: linear-gradient(to bottom, #057e0e, #3fde3d, #057e0e); }
.contacto_distribuidor article { width: 70%; max-width: 1200px; margin: auto; position: relative; display: grid; grid-template-columns: 1fr 1fr; }

.contacto_distribuidor article div:nth-child(1) figure { width: 100%; height: 400px;  }
.contacto_distribuidor article div:nth-child(1) figure img { width: auto; height: 100%; padding: 5%; box-sizing: border-box; filter: drop-shadow(-15px 15px 4px rgba(0,0,0,0.3)); }

.contacto_distribuidor article div:nth-child(2) { position: absolute; width: 50%; height: 200px; margin: 50px 0 50px auto; right: 0; }
.contacto_distribuidor article div:nth-child(2) h2 { font-size: 4em; letter-spacing: 5px; color: yellow; line-height: 55px; text-shadow: -1px 1px 2px black; }
.contacto_distribuidor article div:nth-child(2) p { font-size: 2em; font-weight: 100; line-height: 30px; color: white; text-shadow: -1px 1px 2px black; padding: 10px 0 20px 0; }
.contacto_distribuidor article div:nth-child(2) a { font-size: 1.5em; text-decoration: none; color: white; background-color: #ff6f00; padding: 10px 20px; box-sizing: border-box; border-radius: 5px; box-shadow: -3px 3px 4px rgba(0,0,0,0.3);}




.gradient01 { background: linear-gradient(to bottom, #a25b36, #ed7532, #a25b36);}
.gradient02 { background: linear-gradient(to bottom, #5d6459, #838b88, #5d6459);}
.gradient03 { background: linear-gradient(to bottom, #42352a, #957f6f, #42352a);}
.gradient04 { background: linear-gradient(to bottom, #a25b36, #ed7532, #a25b36);}
.gradient05 { background: linear-gradient(to bottom, #a25b36, #ed7532, #a25b36);}
.gradient06 { background: linear-gradient(to bottom, #a25b36, #ed7532, #a25b36);}

.slider__secc { width: 100%; height: 500px; margin: 0 auto 30px auto; overflow: hidden; position: relative;}

.slider__secc article:nth-child(1) { width: 100%; height: 500px; position: absolute; z-index: 1; }
.slider__secc article:nth-child(1) img { width: 100%; position: absolute; width: 100%; top: 0px; filter: blur(5px); opacity: 0.3; }

.slider__secc article:nth-child(2) { 
	position: relative;
	z-index: 10; 
	width: 90%; max-width: 1800px; height: 500px;
	margin: auto;
}

.slider__secc article:nth-child(2) .empresa { 
	position: absolute; 
	bottom: 50px; 
	right: 30px; 
	width: 420px; 
	height: 180px; 

	display: grid;
	align-items: place;
}
.slider__secc article:nth-child(2) .empresa img { height: 180px; margin: auto; border-radius: 10px;}
.slider__secc article:nth-child(2) div figure { width: 100%; height: 500px; display: grid; place-items: center; }
.slider__secc article:nth-child(2) div figure img { width: 100%; height: 500px; object-fit: cover; }

.slider__secc article:nth-child(2) h1 { position: absolute; bottom: 30px; right: 20px; width: 35%; font-size: 2em; text-align: center; border-radius: 5px 15px; padding: 20px; box-sizing: border-box; background-color: rgba(0,0,0,0.35); color: white; text-shadow: -1px 1px 2px black; z-index:11; border: 1px solid white;}


.productos { width: 90%; max-width: 1800px; margin: 30px auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.productos_esm { width: 90%; max-width: 1800px; margin: 30px auto; display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; }
.productos_pre { width: 90%; max-width: 1800px; margin: 30px auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

.productos div { box-shadow: -3px 3px 4px rgba(0,0,0,0.3); border-radius: 5px; overflow: hidden; }


.productos div figure { width: 100%; height: 250px; position: relative; overflow: hidden; }
.productos_esm div figure { position: relative; }
.productos div figure img { width: 250%; position: absolute; left: -30px; top: -20px; }/* zoom */
.productos_esm div figure img { width: 253%; position: absolute; left: -277px; top: -47px; }
.productos_pre div figure img { width: 140%; position: absolute; left: -40px; top: -70px; }
.productos div figcaption { width: 100%; height: 40px; font-size: 1.2em; font-weight: 600; text-align: center; display: grid; place-items: center; }
.productos_esm div figcaption { width: 100%; height: 50px; font-size: 1em; font-weight: 600; text-align: center; display: grid; place-items: center; }
.productos div a { width: auto; height: 40px; background-color: #005085; font-size: 0.9em; text-align: center; text-decoration: none; color: yellow; display: grid; place-items: center; transition: 0.3s; }
.productos div a:hover { background-color: rgba(0, 0, 0, 0.1); color: #005085; }
.productos div p { width: auto; height: 40px; background-color: rgba(0, 0, 0, 0.1); color: gray; display: grid; place-items: center; }

.productos .ajusteImg { grid-column: span 2; grid-row: span 2; overflow: hidden; }
.productos .ajusteImg_esm { grid-column: span 3; /* grid-row: span 2; */ overflow: hidden; }
.productos .ajusteImg figure { height: 680px; }
.productos .ajusteImg_esm figure { width: 100%; height: 340px; }
.productos .ajusteImg img { width: 100%; height: 100%; object-fit: cover; left: 0px; top: 0px;  }
.productos .ajusteImg_esm img { width: 100%; height: 100%; left: 0px; top: 0px; object-fit: cover; }




@media (min-width: 767px) and (max-width:1024px) {
	
	.slider__secc article:nth-child(2) h1 { width: 50%;}
	
	.productos_esm { grid-template-columns: repeat(4, 1fr); }
	.productos div figure { height: 120px;}
	.productos div figcaption { height: 50px; font-size: 1em; place-items: center; }
	.productos .ajusteImg_esm { grid-column: span 2; grid-row: span 2; }
	.productos .ajusteImg figure { height: 440px; }
	.productos .ajusteImg_esm figure { height: 440px; }

}

@media (max-width:767px) {

	.slider__secc { height: 400px; }
	.slider__secc article:nth-child(1) { height: 400px; }
	.slider__secc article:nth-child(2) { height: 400px; }
	.slider__secc article:nth-child(2) h1 { width: 90%; font-size: 1.5em; right: 5%; padding: 10px; }
	.slider__secc article:nth-child(2) div figure { height: 400px; }
	.slider__secc article:nth-child(2) div figure img { height: 400px; }

	
	.slider__secc article:nth-child(2) .empresa { width: 90%;  right: 5%; bottom: 15px;}
	.slider__secc article:nth-child(2) .empresa img { width: 90%; height: auto; left: 5%; }

	.productos { grid-template-columns: 1fr; }
	.productos_esm div figcaption { height: 40px; place-items: center; }
	.productos .ajusteImg { grid-column: span 1; grid-row: span 1; }
	.productos .ajusteImg_esm { grid-column: span 1; grid-row: span 1; }
	.productos .ajusteImg figure { height: 400px; }
	
}



.f01 { 
	width: 90%; max-width: 50%; margin: 30px auto; 
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
}
.f02 { 
	width: 90%; max-width: 37%; margin: 30px auto; 
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
}
.f03 { 
	width: 90%; max-width: 25%; margin: 30px auto; 
	display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px;
}

.f01 div:nth-child(1) { 
	text-align: center; font-size: 2em; font-weight: 600; 
	grid-column: span 4;
	border-bottom: 1px solid gray;
}
.f02 div:nth-child(1) { 
	text-align: center; font-size: 2em; font-weight: 600; 
	grid-column: span 3;
	border-bottom: 1px solid gray;
}
.f03 div:nth-child(1) { 
	text-align: center; font-size: 2em; font-weight: 600; 
	grid-column: span 2;
	border-bottom: 1px solid gray;
}

.format figure { display: grid; place-items: center; }
.format figcaption { width: 100%; text-align: center; letter-spacing: 2px; padding: 5px; box-sizing: border-box; color: white; background-color: #005085; }
.format img { width: 50%; }

@media (max-width:768px) {
	.f01 { max-width: 90%; }
	.f02 { max-width: 90%; }
}

@media (max-width:450px) {
	.f01 { grid-template-columns: repeat(2, 1fr); }
	.f02 { grid-template-columns: repeat(2, 1fr); }

	.f01 div:nth-child(1) { grid-column: span 2; }
	.f02 div:nth-child(1) { grid-column: span 2; }
}





/* FASCINO */
.expe { width: 100%; height: 80px; background-color: #1d0b3e; color: white; margin-top: -30px; display: flex; justify-content: center; align-items: center; }
.expe h2{ width: 90%; margin: auto; text-align: center;}

.banner01 { width: 90%; max-width: 1800px; margin: 0 auto 30px; }
.banner01 div { width: 100%; height: 105px; display: flex; justify-content: center; align-items: center; border-top-left-radius: 10px; border-top-right-radius: 10px;} 
.banner01 div p { font-size: 2.5em; font-weight: bolder; text-align: center; color: white; } 
.banner01 div p span { color: #FFCC33;} 

.banner01 figure { width: 100%;}
.banner01 figure img { width: 100%;}



.sellador { width: 90%; max-width: 1800px; margin: 0 auto 30px auto; position: relative; }
.sellador article:nth-child(1) { display: grid; grid-template-columns: 1fr 1fr; z-index: 1;}
.sellador article:nth-child(1) div img { width: 100%; height: 100%; object-fit: cover;}


.sellador article:nth-child(2) { 
	width: 100%; height: 100%;
	display: grid; grid-template-columns: repeat(3, 1fr); 
	position: absolute; top: 0; z-index: 2;
}

.sellador article:nth-child(2) div p:nth-child(1) { width: 100%; height: 80%; display: grid; place-items: center; }
.sellador article:nth-child(2) div p:nth-child(2) { width: 100%; height: 20%; display: grid; place-items: center; }
.sellador article:nth-child(2) div img { width: 85%; }
.sellador article:nth-child(2) div a { 
font-size: 1.2em; 
text-align: center; 
color: black; 
padding: 8px 30px; 
box-sizing: border-box; 
text-decoration: none; 
background-color: #FFCC33; 
transition: 0.3s;	
}

.sellador article:nth-child(2) div:nth-child(2) { padding-top: 65px; box-sizing: border-box; }
.sellador article:nth-child(2) div:nth-child(2) h2 {
	 width: 100%;
	 font-size: 1.9em; text-align: center; padding: 15px; box-sizing: border-box; color: white;
}
.sellador article:nth-child(2) div:nth-child(2) h2 span { color: #FFCC33; }
.sellador article:nth-child(2) div:nth-child(2) p { 
	width: 100%;
	font-size: 1.5em; text-align: justify; padding: 15px; box-sizing: border-box; color: white;
}




.promo { width: 100%; height: 300px; margin: 0 auto 30px auto; background: linear-gradient(#2E3192, #46B3B1); }
.promo .promo_colum { width: 90%; max-width: 1800px; height: 100%; margin: auto; display: grid; grid-template-columns: 3fr 2fr; justify-content: center; align-items: center; }
.promo .promo_colum p:nth-child(1) { text-align: center; font-size: 3em; line-height: 45px; color: #FFCC33 ; font-weight: bolder; }
.promo .promo_colum p:nth-child(2) { text-align: center; font-size: 1.8em; line-height: 55px; color: white ; font-weight: normal; margin-top: -10px; }
.promo p span { text-align: center; font-size: 1em !important; font-weight: normal; color: white; }

.promo .promo_colum div:nth-child(2) { width: 100%; height: 100%; position: relative; display: flex; justify-content: center; align-items: center;

}
.promo .promo_colum div:nth-child(2) img { height: 70%;}
.promo .promo_colum div:nth-child(2) a { 
	width: 250px; 
	height: 50px; 
	position: absolute; 
	display: flex; 
	justify-content: center; 
	align-items: center; 
	text-decoration: none; 
	font-size: 1.5em;
	font-weight: bolder;
	color: yellow; 
	z-index: 2;
	background: linear-gradient(340deg, rgba(9,121,44) 45%, rgba(0,182,54,1) 100%);
	border-radius: 10px;
	transition: 0.3s;
}
.promo .promo_colum div:nth-child(2) a:hover { background: linear-gradient(340deg, rgba(0,182,54,1) 45%, rgba(9,121,44) 100%); color:white; }

.promo .promo_colum div:nth-child(2) {  clip-path: polygon(0% 0%, 0% 100%, 100% 100%, 100% 0%); }
.promo .promo_colum div:nth-child(2) figure { position: absolute; top: -450px; z-index: 1; }
.promo .promo_colum div:nth-child(2) figure img { width: 100%; }

@media (min-width: 769px) and (max-width:1181px) {
	.banner01 div { height: 70px;}
	.banner01 div p { font-size: 1.5em;}

	.promo { height: 200px;}
	.promo .promo_colum p:nth-child(1) { font-size: 2em;}
	.promo .promo_colum p:nth-child(2) { font-size: 1em;}
	
	.promo .promo_colum div:nth-child(2) figure { top: 0; }
	.promo .promo_colum div:nth-child(2) a { width: 150px; font-size: 1em; }
}

@media (max-width: 768px) {
	.banner01 div { height: 40px;}
	.banner01 div p { font-size: 0.8em;}

	.promo { height: 300px;}
	.promo .promo_colum { grid-template-columns: 1fr; }
	.promo .promo_colum p:nth-child(1) { font-size: 1.6em;}
	.promo .promo_colum p:nth-child(2) { font-size: 1em; margin-top: -5px;}
	
	.promo .promo_colum div:nth-child(2) figure { top: -300px; }
	.promo .promo_colum div:nth-child(2) a { width: 150px; font-size: 1em; }
}


@media (min-width:1025px) and (max-width:1367px) {
	.sellador article:nth-child(2) div:nth-child(2) { padding-top: 45px;}
	.sellador article:nth-child(2) div:nth-child(2) h2 { font-size: 1.5em;}
	.sellador article:nth-child(2) div:nth-child(2) p { font-size: 1.3em;}
}
@media (min-width:821px) and (max-width:1024px) {
	.sellador article:nth-child(2) div:nth-child(2) { padding-top: 25px;}
	.sellador article:nth-child(2) div:nth-child(2) h2 { font-size: 1.2em;}
	.sellador article:nth-child(2) div:nth-child(2) p { font-size: 1.1em;}

	.sellador article:nth-child(2) div a { font-size: 0.8em; padding: 5px 30px;}
}
@media (min-width:768px) and (max-width:820px) {	
	.sellador article:nth-child(2) div:nth-child(2) { padding-top: 15px;}
	.sellador article:nth-child(2) div:nth-child(2) h2 { font-size: 0.9em;}
	.sellador article:nth-child(2) div:nth-child(2) p { font-size: 0.8em;}

	.sellador article:nth-child(2) div a { font-size: 0.8em; padding: 5px 30px;}
}
@media (min-width:100px) and (max-width:767px) {
	.sellador article:nth-child(1) { grid-template-columns: 1fr;}
	.sellador article:nth-child(2) { grid-template-columns: 1fr;}

	.sellador article:nth-child(2) div:nth-child(2) { padding-top: 1px; }
	.sellador article:nth-child(2) div:nth-child(2) h2 { font-size: 1em; padding: 15px 10px 5px 10px;}
	.sellador article:nth-child(2) div:nth-child(2) p { font-size: 0.8em; padding: 0 20px;}

	.sellador article:nth-child(2) div img { width: 40%; padding: 20px 0; box-sizing: border-box;}
	.sellador article:nth-child(2) div a { font-size: 0.8em; padding: 0 30px;}
}