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

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

/*--------*/

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

.colum_02f {width: 100%; margin: 50px auto; display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 20px; }

@media (max-width:1181px) {
	.colum_04 { width: 90%; grid-template-columns: repeat(2, 1fr);}	
}
@media (max-width:1024px) {
	.colum_05 { width: 90%; grid-template-columns: repeat(3, 1fr);}	
}
@media (max-width:420px) {
	.colum_02 { width: 90%; grid-template-columns: repeat(1, 1fr);}
	.colum_03 { width: 90%; grid-template-columns: repeat(1, 1fr);}
	.colum_04 { width: 90%; grid-template-columns: repeat(1, 1fr);}
	.colum_05 { width: 90%; grid-template-columns: repeat(2, 1fr);}
	
	
	.colum_item:nth-child(1) { grid-column-start: span 2;}
}

.img_ajuste {
	width: 100%; 
	height: 100% ;
	object-fit: cover;
} 

.textos { 
	width: 100%; 
	max-width: 93%; 
	margin: auto; 
	padding: 20px 50px; 
	box-sizing: border-box; 
	border-top: 1px solid black; 
	border-bottom: 1px solid black;
}
.textos h2 { width: 100%; margin: auto; padding: 15px 0; box-sizing: border-box; text-align: center;}
.textos p { width: 100%; margin: auto; padding: 15px 0; box-sizing: border-box; text-align: center;}

@media (max-width:420px) {
	.textos { width: 100% !important; padding: 15px; box-sizing: border-box;}
	.textos p { text-align: justify; }
	.textos h2 { width: 90%; text-align: center; }
}
/*--menu--*/

.logotipo_PN {
	position: fixed;
	margin: 10px 5% 0 80%;
	width: 15%;
	z-index: 999;
}
.logotipo_PN img { width: 100%; }
@media (max-width:1024px) {
	.logotipo_PN { width: 25%; margin: 10px 5% 0 70%; }
}
@media (max-width:768px) {	
	.logotipo_PN { width: 25%; margin: 20px 5% 0 70%; }
}
@media (max-width:420px) {
	.logotipo_PN { width: 35%; margin: 20px 5% 0 250px; }
}

/*menu*/
/*espacio*/
.espacio {height: 100px !important;}
/*espacio*/

/*slider*/
.sli_img { width: 100%; height: 450px; display: flex; align-items: end;}
.sli_img img { width: 100%; height: 100%; object-fit: cover; object-position: left;}
.sli_img .teja {object-position: right bottom !important;}
.sli_img_cont img { width: 100%;}
@media (max-width:1181px) {.sli_img {height: 340px;}}
@media (max-width:1024px) {.sli_img {height: 300px;}}
@media (max-width:420px) {
	.sli_img {height: 200px;}
	.sli_img_cont {height: 200px;}
	.sli_img_cont img {height: 100%; object-fit: cover;}
}
/*slider*/


.text_slider {
	width: 100%;
	position: absolute;
	margin-top: -30px;
	text-align: justify;
	z-index: 776;
}
.text_slider div {
	width: 80%;
	margin: auto;
	padding: 50px;
	box-sizing: border-box;
	background-color: white;
	border: 1px solid black;
}
.tit_01 {
	padding: 20px 0;
	box-sizing: border-box;
	margin: 30px 0 0 5%;
	display: flex;
}
.tit_01 h1 {
	font-weight: 100;
	font-size: 2.5em;
	padding: 10px;
	border-top: 1px solid black;
	border-bottom: 1px solid black;
}
.tit_01 h2 {
	font-weight: 100;
	padding: 25px 10px 10px 0;
	border-top: 1px solid black;
	border-bottom: 1px solid black;
}
.tit_01 a {color: red; text-decoration: none;}
.tit_01 a:hover {color: green; border-bottom: 1px solid green;}
.tit_02 {
	width: 90%;
	margin: 20px auto ;
	border-bottom: 1px solid lightgray;
}
.tit_02 h3 { font-size: 1.5em; font-weight: 300;}

@media (max-width:1181px) { }
@media (max-width: 1024px) {
	.text_slider {
		position: relative;
		margin: none;
		margin-top: 20px !important;
	}
}
@media (max-width:420px) {
	.text_slider {
		position: relative;
		margin: none;
		margin-top: 20px !important;
	}
	.tit_01 { 
		flex-direction: column; 
		width: 90%;
	}
	.tit_01 h1 { 
		text-align: center;
		border: none;
		border-top: 1px solid black;
	}
	.tit_01 h2 { 
		text-align: center;
		border: none;
		border-bottom: 1px solid black;
		margin: -20px 0 0 0;
		padding: 0 0 10px 0;
	}
	.tit_02 {width: 90%;}
	.tit_02 h3 {text-align: center;}
}
/*--contenido_index--*/
.cont_0 {margin-top: 200px;}
.cont_0 .video {width: 90%; margin: auto; place-items: center;}
.cont_0 div {width: 100%; position: relative;}
.cont_0 iframe {width: 120%; height: 560px;}
.cont_0 .video .videot {
	padding: 50px;
	box-sizing: border-box;
	background-color: white;
	border: 1px solid black;
}
.cont_0 a {text-decoration: none; color: red;}
.cont_0 a:hover {color: red; font-weight: bold;} 


.cont_2 {
	width: 80%;
	margin: 50px auto;
	padding: 40px;
	box-sizing: border-box;
	text-align: justify;
	border-top: 1px solid black;
	border-bottom: 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;}

/*-------------*/

.hidro div {width: 100%; position: relative;}
.hidro h1 {font-size: 3.5em; font-weight: 100; padding-top: 20px; box-sizing: border-box;}
.hidro h2 {font-size: 1.3em;}
.hidro h3 {font-size: 1.3em; text-align: center;}
.hidro p {padding: 12px 0; box-sizing: border-box; text-align: justify;}
.hidro figure {width: 100%; overflow: hidden; height: 300px;}
.hidro img {width: 100%; object-fit: cover;}
.hidro figcaption {
	position: absolute;
	padding: 15px;
	box-sizing: border-box;
	background-color: rgba(0, 0, 0, 0.7);
	width: 100%;
	bottom: 0;
	text-align: right;
}
.hidro a {color: white; text-decoration: none;}
.hidro a:hover {color: yellow;}





.content__img { width: 100%; height: 350px; }
.content__img--cover {
	margin: 0 0 -5px 0;
	object-fit: cover;
	object-position: center;
}
.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;}

.novac { background-color: white; width: 100% !important; padding: 30px 0; box-sizing: border-box;}
.novac h1 { padding: 10px 0 0 0; box-sizing: border-box; font-size: 3em; font-weight: 100;}
.novac p {padding: 15px 0 0 0; box-sizing: border-box; text-align: justify;}
.novac img {width: 100%;}
.novac a {color: red; text-decoration: none;}
.novac a:hover {font-weight: bold;}

@media (max-width:1024px) {
	.novac h1 { padding: 20px 20px 0 20px; box-sizing: border-box;}
	.novac h2 { padding: 0px 20px; box-sizing: border-box;}
	.novac p {padding: 20px; box-sizing: border-box;}
}
@media (max-width:820px) {
	.mezcla {grid-template-columns: repeat(4, 1fr);}
	.item-1:nth-child(1) {grid-column-start: span 4;}
}
@media (max-width:420px) {
	.mezcla {grid-template-columns: repeat(2, 1fr);}
	.item-1:nth-child(1) {grid-column-start: span 2;}
}

/*-------------*/

.product {width: 100%; overflow: hidden;}
.product div div {border: 1px solid lightgray; height: auto;}
.product img {width: 100%; height: 100%; object-fit: cover;}
.product .ajus_img {width: 70%; margin: auto; padding: 15px; box-sizing: border-box;}
.product .ajimg {margin-top: -5px;}
.product h2 {font-size: 1.8em; padding: 5px 15px; box-sizing: border-box; font-weight: 100;}
.product h3 {font-size: 1.1em; padding: 0px 15px; box-sizing: border-box;}
.product h2 i {font-size: 0.7em; color: red;}
.product p {
	position: relative; 
	width: 100%; 
	height: 40px; 
	overflow: hidden; 
	background-color: #DCDCDC; 
	display: flex; 
	align-items: center; 
	justify-content: center;
}
.product a {
	position: absolute; 
	width: 100%; 
	height: 100%; 
	display: flex; 
	align-items: center; 
	justify-content: center; 
	background-color: lightgray;
	color: black;
	text-decoration: none;
	transition: 0.5s;
	font-size: 15px;
	text-align: center;
}
.product a:hover {background-color: #555; color: white;}

/*aparentes*/

.product div div div {
	position: relative; 
	width: 100%;
	height: 40px;
	overflow: hidden; 
	display: grid; 
	grid-template-columns: repeat(4, 1fr); 
	font-size: 1em;
	background-color: #dcdcdc;
	border: 0px !important;
}
.product div div p {height: 30px; background-color: #555; color: white;} 


.product .descrip { 
	width: 100%;
	background-color: #fff; 
	color: black; 
	height: 140px; 
	padding: 5px 15px; 
	box-sizing: border-box;
	display: flex;
	align-items: start;
	justify-content: left;
	text-align: justify;
}

/*fachaletas*/
.product .colum2 {grid-template-columns: repeat(2, 1fr);}
/*fachaletas*/

.product_ini {
	width: 100%; 
	max-width: 90%;
	margin: auto;
	display: grid;
	grid-template-columns: 3fr 1fr;
	gap: 20px;
}
.product_ini div {height: 400px;}
.product_ini .ajini figure {width: 100%; height: 100%;}

.product_00 {width: 100%; max-width: 90%; margin: auto; position: relative; height: 450px; overflow: hidden;}
.product_00 img {position: absolute; width: 100%; height: 100%; object-fit: cover;}

@media (max-width:1919px) {
	.product .colum_04 {grid-template-columns: repeat(3, 1fr);}
	.product_ini {grid-template-columns: 2fr 1fr;}	
	.product_ini div {height: 385px;}
	.product a {font-size: 14px;}
}
@media (max-width:1024px) {
	.product_ini div {height: 345px;}
}
@media (max-width:820px){
	.product .colum_03 {grid-template-columns: repeat(2, 1fr) !important;}
	.product .colum_04 {grid-template-columns: repeat(2, 1fr) !important;}
	.product_ini {grid-template-columns: 1fr 1fr;}
}
@media (max-width:420px) {
	.product h2 {font-size: 1.3em;}
	.product .colum_03 {grid-template-columns: repeat(1, 1fr) !important;}
	.product .colum_04 {grid-template-columns: repeat(1, 1fr) !important;}
	.product_ini {grid-template-columns: 1fr;}
	.product_ini div {height: auto;}
	.product_ini .ajcolum {display: none;}
	.product_00 {height: 350px;}
}
@media (min-width:1920px) {
	.product .colum_04 {grid-template-columns: repeat(4, 1fr);}
}

.uno { width: 70%; }
.dos {
	width: 30%;
	padding: 0 0 0 20px;
	box-sizing: border-box;
}

.dos ul { width: 100%; }
.dos ul li {
	width: 100%; 
	margin: 1px 0 -1px 0;
	padding: 10px; 
	box-sizing: border-box;
	border: none; 
	background-color: #DCDCDC;
	font-size: 1em;
	letter-spacing: 1px;
}
.video_nova { width: 100%; }
.video_nova div {
	width: 50%;
	height: 50%;
	margin: auto;
	margin-bottom: 15px;
	position: relative;
	padding-bottom: 26.25%;
	overflow: hidden;
}
.video_nova iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



@media (max-width:1024px){
	.cont_0 {margin-top: 40px;}
	.hidro h1 { font-size: 2.5em;}
}
@media (max-width:768px) {
	.cont_0 .colum_02 {grid-template-columns: repeat(1, 1fr);}
	.cont_0 iframe {width: 100%;}
}	
@media (max-width:420px) {
	.cont_0 iframe {height: 300px;}

	.cont_2 { width: 96%; margin-top: 50px; }
	.hidro ul { flex-direction: column; }
	.hidro li { width: 100%;}
	.hidro h2 { width: 100%; padding: 10px;}
	.hidro p { padding: 10px;}
	.dos { padding: 10px 0 0 0; box-sizing: border-box;}
	.video_nova div {
		width: 90%;
		height: 100%;
		padding-bottom: 56.25%;
	}
	.video_nova iframe { width: 100%; height: 100%;	}
}	

/*---Galeria---*/
.galeria { width: 100%; }
.galeria ul {
	width: 94%;
	margin: auto;
	list-style: none;
	display: flex;
	background-color: white;
}
.galeria ul li { width: 50%; margin: 15px; }
.galeria ul li div { width: 100%; }
.galeria .container ul { width: 100%; }
.galeria .container ul li { width: 100% !important; }


ul.slider {
	position: relative;
	width: 100%;
	height: 350px;
}
ul.slider li {
	position: absolute;
	margin: 0 !important;
	left: 0;
	top: 0;
	width: inherit;
	height: inherit;
	opacity: 0;
	transition: opacity 0.5s;
}
ul.slider li img {
	width: 100%;
	height: 350px;
	object-fit: cover;
}
ul.slider li:first-child { opacity: 1; }
ul.slider li:target { opacity: 1; }


/*-----*/

.galeria .menusli { width: 100%; }

.galeria .menusli ul {
	width: 100%;
	margin: auto;
	display: flex;
	flex-wrap: wrap;
	flex-grow: 1;
}

.galeria .menusli ul li {
	width: 20%;
	margin: 3px 0 !important;
	list-style: none;
}

.galeria .menusli ul li img { width: 100%; }

.galeria .tit_tec { width: 100%; display: flex;	}

@media (max-width:420px) {
	.galeria ul {flex-direction: column;}
	.galeria ul li{width: 90%;}
	.galeria .menusli ul {flex-direction: row !important; margin: auto;}
	.galeria .menusli ul li {width: 30% !important;}
}

/*---Galeria---*/

/*----pie---*/

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; 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;}
}

/*----pie---*/

/*--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%;}
}
/*--contacto--*/
/*empresa*/
.emp01 { 
	width:100%; 
	max-width: 90%; 
	height: 350px;
	margin: 40px auto; 
	display: grid; 
	grid-template-columns: 1fr 1fr 2fr; 
	gap: 20px;
}
.emp01 div {width: 100%; height: 100%; overflow: hidden; text-align: justify;}
.emp01 p {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: top;
	border: 1px solid lightgray;
	padding: 20px;
	box-sizing: border-box;
	text-align: justify;
	background-color: white;
	font-size: 1.15em;
}
.emp01 figure {width: 100%;}
.emp01 img {width: auto; height: 100%; object-fit: cover;}
.emp01 h2 {font-size: 1.8em; font-weight: 100; padding: 0 0 20px 0; box-sizing: border-box;}

.emp02 {width: 100%;}
.emp02 .colum_02 {place-content: center;}
.emp02 h2 {font-size: 1.8em; font-weight: 100; padding: 0 0 20px 0; box-sizing: border-box;}
.emp02 figure {width: 100%; height: 100%; overflow: hidden;}
.emp02 img {width: 100%; height: 100%; object-fit: fill;}

.emp03 {width: 100%; max-width:90%; margin: auto; columns: 200px 2; column-gap: 20px; padding: 30px 0; box-sizing: border-box;}
.emp03 p {padding: 10px 0; box-sizing: border-box; text-align: justify;}
.emp03 img {padding: 10px 0; box-sizing: border-box; text-align: center;}

.emp04 {width: 100%; max-width: 90%; margin: auto;}
.emp04a {display: grid; grid-template-columns: 1fr 2fr; column-gap: 20px; padding: 30px 0; box-sizing: border-box; text-align: justify;}
.emp04a ul {padding: 15px 15px 0 20px; box-sizing: border-box;}
.emp04a img {width: 100%;}

.emp_sub {width: 100%;}
.emp_sub h2 {
	width: 100%; 
	max-width: 90%;
	margin: 30px auto;
	text-align: center;
	border-top: 1px solid black;
	border-bottom: 1px solid black;
	padding: 20px 0;
	box-sizing: border-box;
	font-size: 2em;
}
.bgcgris { background-color: #eee;}

@media (max-width: 820px) {
	.emp01 {grid-template-columns: repeat(2, 1fr); width: 100%; height: 100%;}
	.emp01 .tres {grid-column-start: 1; grid-column-end: 3;}
	.emp01 img {width: 100%;}

	.emp02 img {object-fit: cover;}

	.emp03 img {width: 100%;}

	.emp04a {grid-template-columns: 1fr;}
	.emp04a div {padding: 20px; box-sizing: border-box;}
	.emp04a figure {width: 100%;  text-align: center;}
	.emp04a img {width: 60%; padding-bottom: 20px; box-sizing: border-box;}
}

@media (max-width: 420px) {
	:is(.emp01, .emp02, .emp03) {width: 80%; margin: auto;}
	:is(.emp01, .emp02, .emp03) h2 {font-size: 1.5em; text-align: justify;}	

	.emp01 {grid-template-columns: repeat(1, 1fr); width: 100%; max-width: 80%; margin-top: 40px;}
	.emp01 .tres {grid-column-start: 1; grid-column-end: 1;}
	.emp04a img {width: 100%; padding-bottom: 5px;}

}
/*empresa*/

.stampa {
	width: 100%;
	max-width: 90%;
	margin: 40px auto;
	text-align: center;
}
.stampa div {position: relative;}
.colum_item:nth-child(2) { grid-column-start: span 2;}
.stampa figure {position: absolute; top: 30%;}
.stampa img {width: 100%;}
.stampa_mas {
	width: 350px;
	margin: 60px auto;
	background-color: black;
	padding: 10px;
	box-sizing: border-box;
	border-radius: 10px;
}
.stampa_mas h2 {
	font-weight: 100;
	color: white;
	text-align: center;
}
.stampa_mas a {color: white; text-decoration: none;}
.stampa_mas a:hover { color: yellow;}
.stampa_text {
	background-color: white;
	text-align: justify;
	padding: 50px;
	box-sizing: border-box;
	border: 1px solid black;
}
.stamp01 {
	width: 100%;
	margin: 50px auto;
	text-align: center;
}
.stamp01 figcaption {
	padding: 15px;
	box-sizing: border-box;
	font-size: 1.5em;
	font-weight: bold;
	color: white;
	border-top: 1px solid black;
	border-right: 1px solid black;
	border-left: 1px solid black;
	background-color: black;
	margin-top: -6px;
}
.stamp01 img {width: 100%;}


.img-cir img {border-radius: 50%;}
.img-cir figcaption {
	background-color: rgba(0,0,0,0);
	border: none;
	color: black;
	font-size: 1em;
	padding: 5px;
	box-sizing: border-box;
}

@media (max-width:420px) {
	.stampa { width: 90%;}
	.stampa figure {position: relative !important; margin-bottom: 30px; top: 1%;}
	.stampa img { width: 100%;}
	.stampa_text { width: 100%;}
}

.line {
	width: 96%;
	margin: auto;
	border-top: 1px solid lightgray;
}
.novaconcreto { margin-bottom: 50px; padding-bottom: 20px; box-sizing: border-box; border-bottom: 1px solid lightgray;}
.novaconcreto h1 { font-size: 3.5em; font-weight: 100; }
.novaconcreto p {padding: 25px 0; box-sizing: border-box; text-align: justify;}
.novaconcreto img {width: 100%;}


/*AJUSTES*/
.cuatro li { width: 23% !important;}
.cuatro div { height: 80px !important;}