body 	{ margin:0; padding:0; border:0; color: #000000;  
	font-size:8pt;		
	font-weight: normal;
	font-family: Verdana, Arial, Helvetica, sans-serif;	


	
	SCROLLBAR-FACE-COLOR:	#ffffff; 
	SCROLLBAR-HIGHLIGHT-COLOR:	#888888; 
	SCROLLBAR-SHADOW-COLOR:	#888888; 
	SCROLLBAR-ARROW-COLOR:	#888888; 
	SCROLLBAR-DARKSHADOW-COLOR:	#ffffff; 
	SCROLLBAR-3DLIGHT-COLOR:	#ffffff; 
	SCROLLBAR-TRACK-COLOR:	#ffffff; 
	background:			#ffffff;
}
a		{ text-decoration: none; color: #000000; } 
a:hover	{ text-decoration: underline; } 
a:focus 	{ outline: none; } 	

h1,h2,h3,h4,h5 { font-weight: normal; }             				
h1 		{ font-size: 11pt; margin: 0 0 16px 0; color: #316ac5; }
h2 		{ font-size: 10pt; margin: 0 0 12px 0; color: #316ac5; }
h3		{ font-size:  9pt; margin: 0 0  8px 0; color: #316ac5; }
h4		{ font-size:  8pt; margin: 0 0  9px 0; color: #316ac5; } 
h5		{ font-size:  7pt; margin: 0 0  8px 0; color: #316ac5; }
p 		{		     margin: 0 0  4px 0; }


.negrita		{ font-weight: bold; }
.enfatizado		{ color: #ff0000; } 			
.seleccionado		{ background-color: #d0d0ff; } 	
.seleccion		{ background-color: #d0d0ff; } 
.difuso		{ color: #888888; }			
.seccion		{ color: #888888; font-weight: bold; }	
.cabecera		{ color: #000000; }	
.centro		{ text-align: center; }
.derecha		{ text-align: right; }
.izquierda		{ text-align: left; }
.justifica		{ text-align: justify; } 
.cuerpo		{ font-size: 9pt; }
.pie 			{ font-size: 8pt; }
.letra_minima		{ font-size: 9px; line-height: 100%; } 
/*.entrada 		{ font-size: 11px; border: 0; width:110px; padding:2px 4px 2px 2px; } 	*/
.rotulo		{ color: #888888; }				
.boton			{ border: 1px solid #888888; padding:10px; margin:10px; }


table		{ border-spacing: 0px; border-collapse: collapse; } 
tr 		{ vertical-align:top; } 
td		{ padding: 2px 4px 2px 4px; } 
th		{ padding: 2px 4px 2px 4px; color: #000000; font-weight: normal; }  	

table.capitulo			{ width:100%; border-bottom: 1px solid #888888; } 
table.capitulo tr			{ border-top: 1px solid #888888;  padding: 0; vertical-align: center; }  
table.capitulo td.imagen		{ width: 90px; text-align: right; padding: 8px; }  
table.capitulo td.icono		{ width: 16px; text-align: right; padding: 0px; } 
table tr:has(> td:first-child:empty) {
  display: none;
}

td.raya 				{ padding: 0; height: 1px; background-color: #888888; font-size: 1pt; } 

table.publi  				{ width:100%; } 
table.publi tr 			{ } 
table.publi td 			{ padding:0; border: 1px solid #888888; } 
table.publi td.publi2 		{ width:159px; text-align: right; } 






table.conborde td, table.conborde th	{ border: 1px solid #888888; }



table.propiedades				{ border: 0px solid #888888; width: 100%; } 
table.propiedades td				{ border: 1px solid #888888; }
table.propiedades td.rotulo			{ width: 38%; text-align: right; color: #888888; } 
table.propiedades td.valor			{  } 


table.busqueda				{ border: 0px solid #888888; }  
table.busqueda th				{ border: 1px solid #888888; text-align: center; color:#888888; }
table.busqueda td				{ border: 1px solid #888888; text-align: center; font-size: 9px; line-height:100%; }
table.busqueda img				{ vertical-align: bottom; }
table.tesauro					{ width:100%; border-bottom: 1px solid #888888; }

table.tesauro td				{ border-top: 1px solid #888888; line-height:100%; padding: 0px 8px; }
table.tesauro td.uno				{ font-size:120%; padding-right: 64px; }


table.decampos				{ width: 100%; } 
table.decampos td, table.decampos th	{ border: 1px solid #888888; }
table.decampos td.sinderecha		{ border-right: 0; padding-right: 0; }
table.decampos td.sinizquierda		{ border-left: 0; } 
table.decampos tr.abierto1			{ font-weight: bold; }
td.debins					{ padding: 1px 1px 1px 1px; }


div.param 			{ width:100%; height:128px; overflow:auto; } 

table.param 			{ border-bottom: 1px solid #888888; width:100%; }
table.param th		{ border-top: 1px solid #888888; valign:middle; text-align: left; } 
table.param td		{ border-top: 1px solid #888888; valign:middle; text-align: left; } 
table.param td img		{ padding-right:8px; }  
table.param td.normal	{ cursor:hand;     color: #000000; } 			
table.param td.difusa	{ cursor:pointer;  color: #888888; } 		
table.param td.selec		{ cursor:hand;     color: #316ac5; }  		


table.descom 			{ width:100%; } 
table.descom th		{ border-top: 1px solid #888888;} 
table.descom td		{ border-top: 1px solid #888888; } 



#ingra_map_rot		{ white-space: nowrap; }

.ingra_mapa_marca		{ border:2px solid #ff00ff; }	
.ingra_mapa_editable		{ color: #000000; }		
.ingra_mapa_novisible	{ color: #888888; }		



#ingra_pista_tex 		{ border: 1px solid #888888; margin: 15px 0px 0px 15px; background-color: #d0d0ff; font-size: 7pt; padding: 1px; } 
#ingra_pista_img 		{ border: 1px solid #888888; margin: 1px 0px 0px 15px; }
.pista_ayuda 		{ border: 1px solid #888888; margin: 20px 0px 0px 0px; background-color: #d0d0ff; font-size: 7pt; padding: 8px; } 


#ingra_raiz	 		{ position:relative; top:10px;  left:0px;   width:1000px; background:#ffffff; height:1000px; margin:auto; }
#ingra_banner	 		{ position:absolute; top:0px;   left:0px;   width:1000px; height:131px; margin:auto; }
#ingra_pista   	 	{ position:absolute; top:0px;   left:0px;   visibility:hidden; z-index:100; } 

#ingra_publi	 		{ position:absolute; top:155px; left:858px; width: 134px; background:#ffffff; padding:0; } 
#ingra_cuerpo	 		{ position:absolute; top:155px; left:220px; width: 606px; background:#ffffff; padding:0 8px 0 16px;
				  margin: 0 8px 0 0px; border-left:1px solid #888888; border-right:1px solid #888888; } 
#ingra_lateral 		{ position:absolute; top:155px; left:0px;   width: 204px; background:#ffffff; padding:0 8px; } 
/*
#ingra_busca			{ padding: 0; height: 40px; background-color: #c0c0c0; font-size: 1pt;} 		
#ingra_busca a		{ font-size: 6.5pt; color: #000000} 
#ingra_busca img		{ vertical-align: middle; border:0; }
*/

#ingra_indice  		{ overflow: hidden; } 
#ingra_indice ul 		{ margin:0; padding:0; list-style:none; } 
#ingra_indice ul ul 		{ padding-left:12px; }
#ingra_indice ul ul ul 	{ padding-left:12px; }
#ingra_indice ul ul ul ul	{ padding-left:12px; }
#ingra_indice ul li a		{ display:block; padding: 2px 2px 4px 2px; color: #000000; white-space:nowrap; font-weight:normal; }
#ingra_indice .indice_seleccion 	{ color: #316ac5; } 
#ingra_indice .indice_separador 	{ margin-top: 10px; }



.ingra_imagenes		{}  						
.ingra_imagenes table	{ border-collapse: collapse; }
.ingra_imagenes td		{ text-align: center; } 			
.ingra_imagenes table td	{ border: 0px solid #888888; padding:0; }
.ingra_imagenes_media	{ } 						
.ingra_imagenes_separa	{ } 						
.ingra_imagen			{ } 						
.ingra_imagenes_minis		{ width:100%; vertical-align:middle; } 				


#ingra_pie a			{ color: #000000; font-size: 6.5pt; }
#ingra_pie .separa		{ font-size: 4px; }
.ingra_debug			{ }


* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body{
	width: 100%;
	background-color: rgba(240, 240, 240, 1);
	padding: 0px;
	margin: 0px;
	font-size: 15px !important;
	line-height: 1.5em;
}

p{

}

#ingra_raiz{
	display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto 1fr; 
  /* ↑ fila 1 banner, fila 2 relacionado, fila 3 cuerpo */
	width: 100%;
	max-width: 1200px;
	padding: 0px;
	margin: auto;
	height: 100%;
	min-height: 100vh;
	position: relative;
	top: 0px;
	
	
	grid-column-gap: 20px;
	grid-row-gap: 20px;
	background-color: rgba(240, 240, 240, 1);
	padding: 20px;

}

#ingra_banner{
	grid-area: 1 / 1 / 2 / 3;
	margin-left: auto !important;
	margin-right: auto !important;
	position: relative !important;
	top: initial !important;
	left: initial !important;
	height: initial !important;
	width: 100% !important;
	background-color:white;
	/*background: blue !important;*/
	margin-top: 0px;
	border-radius: 10px;
	display: flex;
	justify-content: space-between;
}

@media only screen and (max-width: 550px) {
  #ingra_banner{
  	display: flex;
  	flex-direction: column;
  }
}

#ingra_banner .logo{
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 5px;
}

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

	#ingra_banner .logo{
		order: 2;
	}
	#ingra_banner .logo img{
		width: 100%;
		height: auto;
	}
}

#ingra_banner .publicidad{
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 5px;
}

#ingra_banner .info{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 5px 10px;
}

@media only screen and (max-width: 550px) {
	#ingra_banner .info{
		order: 1;
	}
}

#ingra_banner .info .banner_base_fisica{
	background-color: #cc441f;
	color: white;
	border-radius: 10px;
	
}

#ingra_banner .info .banner_base_fisica a{
	color: white;
	display: flex;
	width: 100%;
	height: 100%;
	flex-direction: column;
	text-decoration: none;
	position: relative;
	overflow: hidden;
	text-align: center;
	
	font-weight: bold;
	padding: 10px 20px;
	padding-right: 100px;
}

#ingra_banner .info .banner_base_fisica a svg{
	position: absolute;
	right: -10px;
	top: -10px;
	width: 100px;
	opacity: 0.25;

}

#ingra_banner .info .banner_base_fisica a svg path{
	fill: white;
}

#ingra_banner .menu{
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 5px;

}

@media only screen and (max-width: 550px) {
	#ingra_banner .menu a br{
		display: none;
	}
}

#ingra_banner .menu a{
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 5px 10px;
}

#ingra_banner table{}

#ingra_banner table tr{}

#ingra_banner table td{
	padding: 0px;
}

#ingra_lateral{
	grid-area: 2 / 1 / 4 / 2;
	position: relative !important;
	top: 0px !important;
	left: initial !important;
	width: initial !important;
	/*background: red;*/
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 0px !important;
	margin-bottom: 110px;
	border-radius: 10px;
	border: 0px;
	overflow: hidden;
	background-color: transparent; !important;
}

	#ingra_indice{
		background-color: white !important;
		border-radius: 10px;
		padding: 10px;
	}

	

	#ingra_indice .indice_seleccion{
		color: #e55126;
	}

	#ingra_indice > ul{}

	#ingra_indice > ul > li{
		padding-bottom: 10px;
	}

	#ingra_indice > ul > li a{
		font-size: 20px;
		font-weight: bold;
	}

	#ingra_indice > ul > ul{}

	#ingra_busca{
		background-color: white !important;
		display: flex;
		justify-content: space-between;
		font-size: 20px;
		border-radius: 10px;
	}

	#ingra_busca .entrada:focus {
  outline: none; /* elimina el contorno azul por defecto */
  border: 2px solid #e55126; /* borde azul al enfocar */
  /*box-shadow: 0 0 5px #e55126; /* sombra suave */
  background-color: #ffffff; /* fondo ligeramente azul */
}

	#ingra_busca .entrada{
		border-radius: 10px;
		font-size: 18px;
		padding: 5px;
		font-size: 18px;
		border: 0px;
		flex-grow: 2;
	}

	#ingra_busca a{
		background-color: #e55126;
		color: white;
		text-transform:uppercase;
		border-radius: 10px;
		text-decoration: none;
		padding: 5px 10px;
		font-size: 17px;
		display: flex;
		justify-content: center;
		align-items: center;
	}

#ingra_cuerpo{
	grid-area: 3 / 2 / 4 / 3; /* misma columna, fila siguiente */
	position: relative !important;
	top: 0px !important;
	left: initial !important;
	width: initial !important;
	width: 100% !important;
	flex-grow: 2;
	/*zbackground: pink;*/
	display: flex;
	flex-direction: column;
	padding: 20px;
	margin: 0px;
	margin-bottom: 110px;
	border-radius: 10px;
	border: 0px;
}



#contenedor-relacionado{
	grid-area: 2 / 2 / 3 / 3; /* misma celda que antes usaba #ingra_cuerpo */
	position: relative !important;
	top: 0px !important;
	left: initial !important;
	width: initial !important;
	width: 100% !important;
	flex-grow: 2;
	/*zbackground: pink;*/
	display: flex;
	flex-direction: column;
	padding: 0px;
	margin: 0px;
	margin-bottom: 0px;
	border-radius: 10px;
	border: 0px;
	background-color: white;
}

#contenedor-relacionado:empty {
  display: none;
}

#contenedor-relacionado .bloque-relacionado{
	padding: 20px;
	display: grid;
  grid-template-columns: 1fr auto; /* col1 más estrecha, col2 más ancha */
  grid-template-rows: auto auto;  /* dos filas */
  gap: 1rem;
  align-items: start;
	border-radius: 10px;
}

#contenedor-relacionado .bloque-relacionado h1{
	color: inherit;
	font-size: 25px;
	font-weight: 400;
}

#contenedor-relacionado .bloque-relacionado img{
	grid-column: 1;
  grid-row: 1;
	
	max-width: 150px;
	height: fit-content;
	max-height: 75px;
}

#contenedor-relacionado .bloque-relacionado .contenido{
	grid-column: 2;
  grid-row: 1 / span 2; /* ocupa las dos filas */
}

#contenedor-relacionado .bloque-relacionado > a{
	color: inherit;
	text-decoration: underline;
	grid-column: 1;
  grid-row: 2;
  align-self: end; /* opcional: empuja hacia abajo */
}


#contenedor-relacionado:empty + #ingra_cuerpo {
  margin-top: -20px; /* quita separación si no existe */
}

#ingra_cuerpo_restringido{
	grid-area: 2 / 2 / 3 / 3;
	position: relative !important;
	top: 0px !important;
	left: initial !important;
	width: initial !important;
	width: 100% !important;
	flex-grow: 2;
	/*zbackground: pink;*/
	display: flex;
	flex-direction: column;
	padding: 20px;
	margin: 0px;
	margin-bottom: 110px;
	border-radius: 10px;
	border: 0px;
}



#ingra_cuerpo:has(.mensaje) {
  
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

#ingra_cuerpo .mensaje{
	width: 100%;
	max-width: 50%;
	padding: 20px;
}

#ingra_cuerpo .mensaje h2{
	color: #e55126;
	font-size: 20px;
	font-weight: bold;
}

#ingra_cuerpo .mensaje p{
	padding-bottom: 10px;
}

#ingra_cuerpo .mensaje p a{
	color: #e55126;
	font-weight: bold;
	text-decoration: underline;
}

#ingra_cuerpo .mensaje{}

#ingra_cuerpo .formulario{
	width: 100%;
	max-width: 50%;
	padding: 20px;
}

#ingra_cuerpo .formulario p{}

#ingra_cuerpo .formulario > p:first-child{
	color: #e55126;
	font-size: 20px;
	font-weight: bold;
}

#ingra_cuerpo .formulario > p:last-child{
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px solid black;
}

#ingra_cuerpo .formulario p:last-child a{
	color: #e55126;
	font-weight: bold;
	text-decoration: underline;
}

#ingra_cuerpo .formulario form{ 
	border-radius:10px;
	padding: 10px;
	border: 1px solid black;
	margin-top: 20px;
}

#ingra_cuerpo .formulario form p{
	display: flex;
	flex-direction: column;
}

#ingra_cuerpo .formulario form p label{}

#ingra_cuerpo .formulario form p input{
	    border-radius: 5px;
    font-size: 18px;
    padding: 5px;
    font-size: 18px;
    border: 0px;
    flex-grow: 2;
    background-color: rgba(0, 0, 0, 0.1);
}

#ingra_cuerpo .formulario form p input[type=submit]{
	background-color: #e55126;
	color: white;
	font-weight: bold;
}

#ingra_cuerpo .enlace-registro{
	/*background-color: pink;*/
	width: 100%;
	flex-grow: 2;
	height: 100%;
	height: -webkit-fill-available;
}

#ingra_cuerpo .breadcrumb{}

#ingra_cuerpo .breadcrumb .indice_padres{}

#ingra_cuerpo .breadcrumb .indice_padres a{
	padding: 5px 10px;
	border-radius: 5px;
	border: 1px solid black;
}

#ingra_cuerpo h1{
	font-size: 25px;
	line-height: 1.5em;
	margin-bottom: 0px;
	padding-top: 20px;
	padding-bottom: 10px;
	color: #e55126;
}

	#indice_padres{}

	#indice_padres a{}

	h1{}

	h2{}

#ingra_cuerpo h3{
	font-size: 20px;
	margin-bottom: 0px;
	padding-top: 20px;
	padding-bottom: 10px;
	color: #e55126;
}

	p{}

	.capitulo{} /*TABLA*/

	.param{} /*TABLA*/

	#param_idder{}

	#param_idder h2{
		font-size: 20px;
		margin-bottom: 0px;
		padding-top: 20px;
		padding-bottom: 10px;
		color: #e55126;
	}

	#param_idder .descom{}/*TABLA*/

	.ingra_imagenes{} /*TABLA*/

	.ingra_imagenes .ingra_imagenes_media{}

	.ingra_imagenes .ingra_imagenes_media div.ingra_imagen{}

	.ingra_imagenes .ingra_imagenes_media div.ingra_imagen img.ingra_imagen{} 

	.ingra_imagenes .ingra_imagenes_minis{}



#ingra_publicidad {
	background-color: rgba(240, 240, 240, 1);
  position: fixed !important;
  bottom: 0px;
  padding-top: 20px;
  padding-bottom: 20px;
  width: calc(1200px - 0px); /* o simplemente 1200px */
  margin-left: auto;
  margin-right: auto;

  display: flex;
  flex-direction: row;
  justify-content: center;
  align-content: center;
  flex-wrap: nowrap;
  gap: 18px;

  overflow-x: auto; /* ← scroll horizontal si hace falta */
  overflow-y: hidden;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;

  border-radius: 10px;
  /* background: red !important;  opcional para debug */
}

#ingra_publicidad .publi3 {
  flex: 0 0 auto; /* ← cada anuncio mantiene su tamaño */
}

#ingra_publicidad div{
	border-radius: 10px;
	overflow: hidden;
	background-color: white;
	border: 1px solid black;
}

.publi3{
	display: flex;
}

.publi3 a{
	display: flex;
}

.publi3 a img{
	display: flex;
}

#ingra_pista{

}


.breadcrumb .indice_padres a::before {
  content: "Volver a: ";
}

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

	#ingra_publicidad {
  width:100vw;
  padding-bottom: 0px;
  padding-top: 0px;
  background-color: rgba(240, 240, 240, 1);

  justify-content: flex-start;
  bottom: 0px;

}

#ingra_publicidad .publi3 {
  flex: 0 0 auto; /* impide que se encogen o rompan de línea */
}

	.loy-ads{
		display: none;
	}

	#ingra_raiz{
		display: flex;
		flex-direction: column;
		padding: 10px;
		    grid-column-gap: 10px;
    grid-row-gap: 10px;
	}
	#ingra_lateral{
		margin-bottom: 10px;
		order: 2;
		gap: 10px;
	}

	.indice_padres{
		width: 100%;
	}

	#ingra_cuerpo .breadcrumb .indice_padres a{
		width: 100%;
		display: block;
	}

	#ingra_banner .info .banner_base_fisica{
		width: 100%;
	}

	#ingra_banner .info .banner_base_fisica a{
		padding: 5px;
	}

	#contenedor-relacionado .bloque-relacionado{
		display: flex;
		flex-direction: column;
	}

	#ingra_cuerpo{
		margin-bottom: 10px;
		padding: 10px;
	}
	#ingra_cuerpo:has(.mensaje){
		flex-direction: column;
		margin-bottom: 20px;
	}
	#ingra_cuerpo .mensaje, #ingra_cuerpo .formulario{
		max-width: 100%;
		padding: 0px;
	}

	.ingra_imagenes > thead {
    display: none;
  }

  .ingra_imagenes > tbody > tr {
    display: block;
    margin-bottom: 1rem;
    border: 1px solid #ccc;
  }

  .ingra_imagenes > tbody > tr > td {
    display: flex;
    justify-content: space-between;
    padding: 10px;
    border: none;
    border-bottom: 1px solid #eee;
  }

  .ingra_imagenes > tbody > tr > td::before {
    content: attr(data-label);
    font-weight: bold;
  }

  /* No tocar las tablas anidadas */
  .ingra_imagenes td table,
  .ingra_imagenes td table * {
    all: unset;
    display: revert;
  }

  @media screen and (max-width: 768px) {
  table.descom {
    border: 0;
    width: 100%;
  }

  table.descom thead {
    display: none;
  }

  table.descom tr {
    display: block;
    margin-bottom: 1rem;
    border: 1px solid #ccc;
    padding: 0.5rem;
  }

  table.descom td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /*padding: 6px 10px;*/
    border-bottom: 1px solid #eee;
  }

  /* Alineación y espaciado del label */
  table.descom td::before {
    font-weight: bold;
    margin-right: 1rem;
    text-align: left;
    flex: 1;
  }

  /* Contenido alineado a la derecha */
  table.descom td {
    text-align: right;
  }

  table.descom tr:first-child {
    display: none;
  }

  /* Labels por posición */
  table.descom td:nth-child(1)::before { content: "Código"; }
  table.descom td:nth-child(2)::before { content: "Cantidad"; }
  table.descom td:nth-child(3)::before { content: "Ud"; }
  table.descom td:nth-child(4)::before { content: "Descripción"; }
  table.descom td:nth-child(5)::before { content: "Precio"; }
  table.descom td:nth-child(6)::before { content: "Importe"; }

  /* Fila de total con colspan */
  table.descom td[colspan="6"] {
    display: block;
    text-align: right;
    font-weight: bold;
    border-top: 2px solid #000;
  }

  
}

}