/********************************************************************************************************************************************
 														A		(genéricos)	 
*********************************************************************************************************************************************/
img,video,canvas { overflow: hidden !important; }

/***************CABECERAS Y MAIN**************/
/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px) {

#wrapper>header {
	justify-content:flex-start; /*space-between;*/
}

/*CABECERAS ESPECÍFICAS*/

/*la estrecha. Es la más usable. La definición general de header (arriba) hace referencia a ella- Tan sólo atribuirle el fijado en interfaz */
#wrapper>header#Hc {
	position: sticky; 
	
	top:0; 
	z-index: 10001;
}
#wrapper>header#Hc h1 a::before {
	font-size:calc(1rem + var(--ancho));
}

#wrapper>header#Hx {
	position: absolute; 
	/*overflow:visible; */
	height: 0;
	background: none;	
	min-height: 0;
	color: var(--bkB_f);
	box-shadow: none;
}
#wrapper>header#Hx > h1 {
	z-index: 10001;
}
#wrapper>header#Hx.pretrans > h1 {	
	padding-top: calc(var(--alto) * 1.5);
}	
/*#wrapper>header#Hx>.menuBut  {
	text-shadow: 0 0 10px #666;
	color:var(--bkB_bg);
}*/
/*#wrapper>header#Hx :is(a:link,a:visited,[onclick]) {
	color:var(--bkB_bg);
}*/
#wrapper>header#Hx.pretrans :is(a:link,a:visited,[onclick]) { color:var(--bkB_f); }
/*#wrapper>header#Hx.pretrans :is(a,[onclick]):hover { color:var(--high); }*/



#wrapper>header#Hx h1 a::before {
	text-shadow: 0 0 10px #666;
	font-size:calc(2rem + var(--ancho));
}

#wrapper>header#Hc>h1{
	padding:0 var(--ancho);
}
#wrapper>header#Hx.pretrans {
	top:0;
	z-index: 10001;
	max-height: 1px;
	position: sticky;
	align-items: flex-start;
}
#wrapper>header#Hx.pretrans :is(.menuBut, h1 :is(a,[onclick]))::before {
	/*anulo esto si la trans flotante va con mismo esquema de colores q cabecera*/
	/*color: var(--bk_bg);
	text-shadow: 0 0 10px #FFF;*/
	/*y añado color como cabecera*/
	color: var(--bk_f);
}
#wrapper>header#H {
	min-height: calc(10rem + var(--ancho));
}
#wrapper>header#H h1 a::before{
	font-size:calc(4rem + var(--ancho));
}


#wrapper>header#Hf {
	max-height: 80vh;
	display: grid;
	justify-content:center;
	overflow: hidden;
	align-items: start;
	grid-template-columns: 100%;
	
}
	

#wrapper>header#Hf h1 a::before{
	font-size:calc(6rem + 4vw);
	text-shadow: 5px 5px 10px #000;
}





#wrapper>header#Hf>*{
	grid-row:1;
	grid-column:1;
}
#wrapper>header#Hf>h1 {
	z-index: 1;
	align-self: center;
	justify-self:center;
	flex-flow:column nowrap;
	padding: 4vh 0;
}
#wrapper>header#Hf>picture {
	z-index: 0;
	/*max-width: 1600px;*/
	overflow: hidden;
	justify-self: center;
	/*width: 100%;
				height: 100%;*/
	display: flex;
}
 #wrapper>header#Hf>picture img {
 	opacity:1; object-fit: cover;
}

#wrapper>header#Hf>.menuBut {
	justify-self: start;
}

.menuBut {
	display: block;
	z-index:10003; 
	margin:var(--alto) calc(var(--ancho) * 2); 
	cursor:pointer; 
	color:#FFF; 
	font-size: 0;	
	background: none;
	border:none;
	min-width:48px;
	min-height:48px;
}
#wrapper>header>.menuBut {
	order:1;
}
.menuBut::before {
	font-size:calc(2rem + var(--ancho));
	/*content: "\02630";*/
	content: "menu";
   font-weight: normal;
   font-family: "materiales";
}
.menuBut:hover { background: rgba(150,150,150,.5); border-radius:50%; color: var(--high); }
#wrapper>header>nav {
	order:2;
	overflow:hidden; 
	flex-grow:4; 
}
#wrapper>header>.menuBut[status="1"]::before {
 content: "close";
}
#menu { 
	position:absolute; 
	z-index:10000; 
	height:100vh; 
	top:0; 
	left:0px;
	background: var(--bk_bg); 
	text-align: left;
}
#menu  :is(a:link,a:visited) { color: var(--bk_f) !important; }
#wrapper>header>nav ul {
	 width:100%; 
	 margin:0; 
	 font-size:0; 
	 list-style:none; 
	 text-indent:0; 
	 padding:0; 
	 overflow:hidden; 
	 text-align:center; 
}
#wrapper>header>nav li {
	display:inline-block; 
	width:auto; 
	height:calc(100% - 1rem);
	margin:0 .5rem;
	padding:.5rem 0;
}
#wrapper>header>nav li a::before { font-size:calc(2rem + calc(var(--ancho) * 2)); } 
#wrapper>header>nav :is(li.ov, li:hover) a { color: var(--high); }
#menu>nav li a::before { 
	font-size:calc(1rem + calc(var(--ancho) / 2)); 
	margin-right:var(--ancho); 
} 
#menu.menu_off { display:block; opacity:0; overflow: hidden; width: 0px; /*transition: fadein 2s;*/ }
#menu.menu_on { 
	display: block;
	opacity:1; 
	width:100%; 
	max-width:800px !important; 
	-moz-animation: fadein 2s linear 0 1 normal;
   -o-animation: fadein 2s linear 0 1 normal;
   -webkit-animation: fadein 2s linear 0 1 normal;
 	animation: fadein 2s linear 0 1 normal;
	overflow-x: hidden;
	overflow-y: auto; 
	box-shadow: 0 0 10px 10px rgba(100,100,100,0.3);
}
#menu ul li { 
	display:inline-block; 
	font-size:calc(0.8rem + calc(var(--ancho) * 0.3));
	width:90%; 
	overflow:hidden; 
	padding: var(--alto) var(--ancho); 
	border-bottom:1px solid var(--bk_f); 
} 
#menu  ul li ul { 
	margin: var(--alto) var(--ancho) calc(var(--alto) * 2) var(--ancho); 
	border-left:2px solid var(--bk_f);  
}	
#menu  ul li ul li { 
	border-bottom: 0; 
	margin-left:0; 
	font-size:90%; 
}
#menu .ti { 
	margin:0;
	width: calc(100% - 4vw);
	padding: 0 2vw; 
	font-size: calc(0.7rem + 0.3vw); 
	color: var(--bk_f); 
	text-align:right; 
	border-bottom:2px solid var(--bk_f); 
	background:rgba(255,255,255,0.3);
	line-height:6em;
	vertical-align:middle; 
}
#menu  ul li.ov ul { border-left:2px solid var(--high);  }
#menu  ul a.ov { font-weight: var(--bold); color: var(--high); }
#menu>#underHead { margin: calc(var(--alto) * 2) var(--alto); border-top:1px dashed #FFF; padding-top:calc(var(--alto) * 2); }
#wrapper>header > #underHead{ position:absolute; top:0; right:5px; width:calc(1.2rem + var(--ancho)); height:calc(1.5rem + var(--ancho)); overflow:hidden; transition: width 1s, top 1s, border-radius 1s; }
#wrapper>header > #underHead:hover{ width:auto; height:auto; } 
#wrapper>header > #underHead::before{ font-family:"Materiales"; content:"share"; color:#FFF; font-size:calc(1.2rem + var(--ancho)); padding-top:5px; } 
#underHead > .redifusion { 
	font-size:0px; 
	display:flex; 
	flex-flow:row no-wrap; 
	gap:var(--ancho); 
	justify-content:space-around;
	align-items: center;
} 
#underHead > .redifusion [data-icono]::before {
	color:#FFF;
	opacity: 0.7; 
	cursor:pointer;
	font-size:calc(1.2rem + var(--ancho));
}
#underHead > .redifusion [data-icono]::before:hover {
	opacity:1;
}
#wrapper>header > #underHead > .redifusion { float:right; margin: 0; }
#underHead >  #buscar { width : 98%; margin : var(--alto) 1%;  padding : 0; overflow:hidden; }
#underHead >  #buscar .gsc-control-cse { background:none; }


/*ROW 2: cuerpo */
main {
	grid-row:3;
	width:100%; 
	height: auto;
	position: relative;
	
	/*padding-top: 4vh;*/ /*vamos a darle espacio al header flotante*/
}


}

@media screen and (min-width: 768px){
	#wrapper>:is(header#H,header#Hf) h1 span  { font-size: calc(0.7rem + calc(var(--ancho) / 2)); }
	#wrapper>header#Hc h1 span  { font-size: calc(0.6rem + 0.3vw); }
}







	 /**********************
	 	TRANSVERSAL y TEMAS
	 ***********************/

/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px) {
	
	#TRANS { 
		width: auto;
		overflow: hidden;
		font-size : 1em; 
		/*font-weight : var(--bold);*/
		display:flex;
		flex-flow: row wrap;
		/*justify-content: center;*/
		align-items: center;
		column-gap: var(--ancho);
		row-gap:calc(var(--alto) * 3);
		background: var(--bkB_bg);
		color: var(--bkB_f);
		box-shadow: 0 2px 20px 10px rgba(100,100,100,0.2);
		margin: 0 0 calc(var(--alto) * 2) 0;
		padding: 0;
	}

	#TRANS [class^=indice]::before {
		content: "\01f521";
		font-size: 3em;
		cursor: pointer;
		color: red;
	}
	#TRANS .indice_less::before {
		content: "\023CF \0FE0F";
	}
	#TRANS nav { 
		order:3;
		flex-grow: 4;
		display: flex;
		flex-flow:row wrap;
		justify-content: center;
		align-content: center; 
		row-gap: var(--alto);
		column-gap: var(--ancho); 
		margin: var(--alto) calc(var(--ancho) * 2);
	}
	#TRANS nav#navAP { font-family:var(--ffamH); } 
	#TRANS nav a { 
		display:inline-flex; 
		text-align:center; 
		padding:calc(var(--alto) / 2) calc(var(--ancho) * 2); 
		/*font-size:calc(1em + 0.3vw);*/
		text-indent:0; 
		/*box-shadow: 0 0 2px rgba(150,150,150,0.5);*/
		color: var(--bkB_f);
		border: 1px solid var(--bkB_f); 
		border-radius: 1em;
		opacity:0.7;
	}
	#TRANS nav :is(a:hover, a.selected) { 
		background: var(--bk_bg); 
		color: var(--bk_f); 
		opacity: 1; 
		border-color: var(--high); 
	}
	
	
	/*cambiamos esquema de color en caso de TRANS haciendo de cinto de cabecera*/
	header#Hx + main >  #TRANS { 
		background: linear-gradient(var(--bkB_f),var(--bk_bg),var(--bkB_f) );
		color: color: var(--bk_f)
	}
	header#Hx + main > #TRANS nav a { 
		color: var(--bk_f);
		border: 1px solid var(--bk_f);
	}
	header#Hx + main > #TRANS nav :is(a:hover, a.selected) { 
		background: var(--bk_f); 
		color: var(--bk_bg); 	
	}
	
	/*header:not(#Hx) + main >  #TRANS { background: rgb(39, 51, 26); border-top:1px solid #999; }*/
	/*header#Hf + main >  #TRANS { justify-content: center; }*/	
	
	
	#TRANS nav a[data-icono] {
		line-height: 2em;
		vertical-align: middle;	
	}
	#TRANS nav a[data-icono]::before {
		font-size: 2em;
	}
	.TRANSin p.Home { 
		font-size:1.6em; 
		text-indent:2%;
		margin:0; 
		padding:0;
	}
	#TRANS>:is(form,fieldset) { 
		order: 4;
		width:auto; 
		min-width: calc(var(--min) - var(--ancho));
		margin:0 var(--ancho) 0 0; 
		justify-self: flex-end; 
		border:0; 
		padding:0; 
		display: grid;
		grid-template-rows: 100%;
		grid-template-columns: 100%;
		justify-items:flex-start;
		align-items: center;
		gap:0;
	}
	#TRANS fieldset {
		border:0; 
		padding:0;
	}
	#TRANS :is(input, button,select) { 
		margin : 0; 
		padding: 0; 
		height:3em;
		vertical-align:middle; 
		color :var(--bkB_f); 
		border: 1px solid var(--bkB_f);
		border-radius:1em;  
		font-size: 1em; 
		text-indent:.3em; 
		grid-row:1;
		grid-column:1;
	}
	#TRANS > select {
		order:2;	
	}
	#TRANS > select#navAP_sel {
		/*width: calc(100% - calc(var(--ancho) * 2)); */
		margin: var(--alto) var(--ancho);
		order: 4;	
	}
	#TRANS > label.navAP_lab {
		order: 3;
	}

	#TRANS input {
		z-index: 1;
		width: 100%;	
	}
	#TRANS button {
		z-index:2;
		justify-self:end; 
		background:transparent; 
		border : none; 
		cursor : pointer; 
		font-size:0px; 
	}
	#TRANS>form [data-icono]::before{
		font-size:calc(2rem + calc(var(--ancho) / 2));
	}
	#TRANS select { 
		float:right; 
	}
	.TRANSon { position:fixed; width:auto; height:auto; left:250px; right:0; overflow:hidden; background:none; color:#666; font-size:.9em;  }
	.TRANSon a:link, .TRANSon a:visited { color:#666; }
	.TRANSon H1 { float:left; font-size:1em; } 
	.TRANSon H1 span { display:none; }
	.TRANSon:hover H1 span { display:inline; }
	.TRANSon nav { opacity:0; transition:opacity 1s; }
	.TRANSon:hover nav { opacity:1; background:linear-gradient(rgba(255,255,255,.5),rgba(255,255,255,1)); padding:3px; }
	.TRANSon:hover { width:auto; height:auto; }
	.TRANSon p.Home { display:none; }

	:is(main,#TRANS)>:is(#breadcrumbs,h2) {
		display: flex;
		flex-flow:row wrap;
		justify-content: center;
		align-items: center;
		/*gap: calc(var(--ancho) / 2);*/	
	}
	/*:is(main,#TRANS)>#breadcrumbs > * {
		font-size: 1em;	
	}*/
	#TRANS>:is(h2,#breadcrumbs) {
		order:1;
		margin-left: var(--ancho);
		margin-right: calc(var(--ancho) * 2);
	}
	:is(main,#TRANS)>#breadcrumbs h2 {
		order:2;
	}
	:is(main,#TRANS,#breadcrumbs)>h2 { 
		font-size: calc(0.6rem + calc(var(--ancho) / 2));
		line-height: 2em;
		vertical-align: middle;
		font-family: var(--ffamH); 
		word-wrap:break-word;	
		background: none; 
	}
	#TRANS > h2 { margin-top: var(--alto); }
	main>:is(#breadcrumbs,h2) { 
		position:absolute;  
		margin: 0;
		padding: 0 var(--ancho);
		top: calc(2rem + calc(var(--alto) * 4));
		left: 0; 
		justify-content:center;
		text-align: center;		
		width: calc(100% - calc(var(--ancho) * 2));
	}
	
	/*ocultamos el "portada principal"*/
	/*main.home > #TRANS > h2 { display:none !important; } */
	:is(main,#TRANS)>#breadcrumbs nav {
		width: auto;
		padding: 0;
		margin: 0;
		flex-grow:0;
		order: 1;
	}
	:is(main,#TRANS)>#breadcrumbs nav p {
		display: flex; 
		line-height: 2em;
		vertical-align: middle;
		margin: 0; /*calc(var(--alto) / 2) var(--ancho);*/
		align-items: center;
		font-family: var(--ffamH); 
		word-wrap:break-word;
		gap:5px;
	}
	:is(main,#TRANS)>#breadcrumbs nav a {
		border:none;
		padding: 0;	
		box-shadow: none;	
	}
	:is(main,#TRANS)>#breadcrumbs nav a:hover {
		background: none;
		color: var(--high);	
	}
	main>:is(h2,#breadcrumbs) :is(a:link, a:visited) {
		color: var(--bk_f);	
	}
	main>:is(h2,#breadcrumbs) a:hover {
		color: var(--high);	
	}
	:is(main,#TRANS)>:is(h2,#breadcrumbs)> * {
		display: inline-flex; 
	}
	:is(main,#TRANS)>#breadcrumbs nav a.sec { line-height: calc(1rem + var(--ancho)); vertical-align: middle; }
	:is(main,#TRANS)>:is(h2,#breadcrumbs) [data-icono]::before { font-size:calc(1rem + var(--ancho)); vertical-align: middle; }
	:is(main,#TRANS)>#breadcrumbs.largo { top: 5vh; }
	/*#TRANS>h2 > span:first-of-type::before {	
		content: none;
		padding: 0;
	}*/
	:is(main,#TRANS)>#breadcrumbs :is(nav a, h2) {
		white-space: nowrap;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    display:inline-block;
	    max-width : 20vw; 
	}
	/*:is(main,#TRANS)>nav#breadcrumbs a:first-child {
		font-size: 0;
	}*/
	:is(main,#TRANS)>#breadcrumbs :is(h2,p,nav) { margin:0; padding:0; }
	:is(main,#TRANS)>#breadcrumbs :is(nav,h2) a:not(.sec)::before {
				content: "/";/*"\02734";*/ 
				padding-right: 5px;
	}
	:is(main,#TRANS)>#breadcrumbs nav + h2 { margin-left: 5px; max-width: 200px; color: var(--bk_f); }
	/*los span internos de los enlaces de crumbs se ocultan (ver función textuales->titulo, nuevo modo 2) */
	:is(main,#TRANS)>:is(h2,#breadcrumbs) a > span { display: none; }
	:is(#Hx,#Hc)+main { margin-top: 0; padding-top: 0; }
	#Hx+main > #TRANS {
		/*padding: calc(2.5rem + calc(var(--ancho) * 2)) 0 var(--alto) 0;*/
		top: 0;
		position: sticky;
		z-index: 10000;
		justify-content:center;
		padding-top: calc(2.5rem + calc(var(--alto) * 3));
		padding-bottom: var(--alto);
	}
	#Hx+main > #TRANS > * {
		margin: 0; 	
	}
	/*#Hx+main > h2 {
		position: absolute;
		margin: 0;
		top: 4vh;
		left: calc(4rem + 6vw);
	}*/
	/*#Hx+main>#TRANS.largo { padding-top: calc(2.5rem + calc(var(--ancho) * 2)); padding-left:0; }*/
	/*main>#breadcrumbs.largo { top: calc(2.5rem + var(--ancho)); left:var(--ancho); right: var(--ancho); }*/
	#Hx+main > #TRANS :is(h2,#breadcrumbs,nav, select), main > :is(#breadcrumbs,h2) {
		z-index: 103;
	}

	#temas {width:100%; padding:0; text-align:center; float:left; font-size:1em; }
	#temas ul { float:right; width:auto; list-style:none; margin:0 4% 0 0; padding:5px 0; }
	#temas li { float:left; padding:0; font-size:15px; line-height:30px; vertical-align:top; margin-left:20px; } 
	#temas li.aa { font-weight:var(--bold); }
	#temas li.aa:after { content:"\3014"; font-size:30px; margin-left:10px; font-weight:normal; vertical-align:baseline; }
	#temas ul:after { content:"\3015"; float:right; font-size:30px; margin-left:10px; font-weight:normal; vertical-align:top; }
}
/*etiqueta para envolver, quitar en producción*/

/*@media screen and (min-width: 540px){
	main>:is(#breadcrumbs,h2):not(.largo) { 
		top: calc(var(--alto) * 2);
		left: calc(4rem + calc(var(--ancho) * 5));
		right: calc(var(--ancho) * 4);
		padding:0;
		width: auto;
		justify-content: flex-start !important;  
	}		
}*/
/*@media screen and (min-width: 600px){
#TRANS > select#navAP_sel {
	width: auto;
}
}*/
@media screen and (max-width: 767px){
	:is(main,#TRANS)>#breadcrumbs nav a.sec { font-size: 70%; }
}
@media screen and (min-width: 800px){
			
			/*:is(main,#TRANS)>#breadcrumbs nav a.sec { font-size: 1em; }*/
			
			:is(main,#TRANS)>#breadcrumbs nav + h2 { max-width: 800px; }
									
			/*info textual de las secciones en crumbs*/	
			:is(main,#TRANS)>h2 > span:first-child a {
				font-size: inherit;
				padding-right: var(--ancho);
			}
			#Hx+main>#TRANS {
				/*width: calc(100% - calc(4rem + calc(var(--ancho) * 4)));
				padding: var(--alto);
				padding-right: 0;
				padding-left: calc(4rem + calc(var(--ancho) * 4));	*/
				justify-content: flex-start;
				padding: calc(var(--alto) * 2.5) calc(var(--ancho) * 2); 
			}	
		/*	#Hx+main>#TRANS>#breadcrumbs{
				margin: var(--alto) 0 var(--alto) calc(4rem + calc(var(--ancho) * 4)); 	
			}
			#Hx+main>#TRANS>h2{
				margin: var(--alto) 0 var(--alto) calc(4rem + calc(var(--ancho) * 4)); 			
			}*/
			
			/*#Hx+main>#TRANS>*:last-child {
				margin-right: calc(var(--ancho) * 4);
			}*/

main>:is(#breadcrumbs,h2) {
			left: calc(4rem + calc(var(--ancho) * 12)) !important;
			right: var(--ancho) !important;
			top: calc(var(--alto) * 2.5) !important;
			padding:0;
			width: auto;
					
		}
/*main>h2 { top: calc(var(--alto) * 2) !important; }
main>#breadcrumbs {
	top: var(--alto) !important;
}*/

:is(main,#TRANS)>:is(#breadcrumbs,h2) { 
	justify-content: flex-start !important;
}
		/*#Hx+main > #TRANS {
			justify-content:flex-start;
		}*/
		/*#Hx+main > #TRANS >:is(h2,#breadcrumbs){
			margin-left: calc(4rem + calc(var(--ancho) * 5));	
		}*/

#Hx+main>#TRANS>*:first-child { 
		margin-left: calc(4rem + calc(var(--ancho) * 10))  !important; 
		max-width: calc(100% - calc(4rem + calc(var(--ancho) * 11)));   
}
}



/**********************
		CUERPOS
***********************/

/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px) {
	[id^="cuerpo"] {
		width: 100%; 
		/*max-width: var(--max); */
		min-width:var(--min); 
		display:grid; 
		margin: var(--alto) auto;
		grid-template-columns: 100%;
		grid-auto-rows: minmax(min-content, max-content);
		gap: 0;
		justify-content:stretch;
	
	}
	
#Hx+main > [id^=cuerpo] {
	margin-top: 0;
}
#Hx+main > [id^=cuerpo].canon > [id^=col] {	
	margin-top: 10vh;
}
#Hx+main > [id^=cuerpo].canon > #contenidos { margin: 0; }

#Hx.pretrans+main > [id^=cuerpo].canon > :is([id^=col], #contenidos) {
	margin-top: calc(var(--alto) * 2);	
}	



	/*ROW 2 -> ROW2 body del main main */
		[id^="cuerpo"]> header{
			grid-row: 1;
			grid-column: 1;
		}
		#contenidos, #colI, #colD { 
				height:auto; 
				margin : 0 calc(var(--ancho) * 2); 
				padding : 0; 
				overflow : hidden; 
				/*width: calc(100% - 4vw);*/
				grid-column: 1; 
				grid-row: 3; 
		} 	
		#colI { grid-row: 4;   } 
		#colD { grid-row: 5; } 

		#cuerpo #contenidos { margin: 0 calc(var(--ancho) * 2); }

	[id^="cuerpo"] > aside#banner5 { grid-column: 1 / 4; grid-row: 2;  }
	
	
	/*vamos a mandar el placeholder del GDPR de google abajo del todo cuando se meta en cuerpo*/
	[id^="cuerpo"] > .google-revocation-link-placeholder {
		grid-row:7;
		grid-column: 1 / 4;
	}
	
	

/*ROW 3: pie */
#wrapper>footer { 
	grid-row:5;
}

.estructura, .hide, hr, .hideout { display: none !important; }

				.tsize-A { font-size:calc(10.2px + calc(var(--ancho) * 0.3)) !important; } 	/*1*/
				.tsize-B { font-size:calc(12.2px + calc(var(--ancho) * 0.3)) !important; } 	/*2*/
				.tsize-C { font-size:calc(14.2px  + calc(var(--ancho) * 0.3)) !important; } 		/*3*/
				.tsize-D { font-size:calc(16.2px  + calc(var(--ancho) * 0.5)) !important; } 		/*4*/
				.tsize-E { font-size:calc(18.2px + calc(var(--ancho) * 0.5)) !important; } 		/*5*/
				.tsize-F { font-size:calc(20.2px + calc(var(--ancho) * 0.7)) !important; } 		/*6*/
				.tsize-G { font-size:calc(20.2px + calc(var(--ancho) * 0.9)) !important; } 		/*7*/
				.tsize-H { font-size:calc(22.2px + calc(var(--ancho) * 1.1)) !important; } 		/*8*/
				.tsize-I { font-size:calc(24.2px + calc(var(--ancho) * 1.3)) !important; } 		/*9*/
				.tsize-J { font-size:calc(26.2px + calc(var(--ancho) * 1.5)) !important; } 		/*10*/








/*los textos adaptables se activan a partir de los 768 px de pantalla (ver en C)*/
/*.tsize-A { font-size: 12.5px !important;  }
.tsize-B { font-size: 14.3px !important; }
.tsize-C { font-size: 16px !important; }
.tsize-D { font-size: 17.8px !important; }
.tsize-E { font-size: 19.5px !important;}
.tsize-F { font-size: 21.3px !important;}
.tsize-G { font-size: 23.1px !important; } 
.tsize-H,
.tsize-I,
.tsize-J { font-size: 24.9px !important; } 
*/






/*article,aside,audio,canvas,details,figcaption,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,summary,time,video { display:block; margin:0; padding:0; }*/

















/*ROW 3: pieCuerpo */
	#banner18 {
		display: block;
		margin: var(--alto) var(--ancho);
	}


/*ROW 3: pie */
#wrapper>footer { 
	width: 100%;
	overflow : hidden; 
	padding-bottom: 20px; 
	text-align : center; 
	border-top:var(--alto) solid var(--bkB_bg); 
	background:linear-gradient(var(--bk_bg),var(--bkB_f));
	color: var(--bk_f);
}

#banner20 {
		display: block;
		margin: var(--alto) var(--ancho);
		grid-column: 1;
		grid-row: 5;
	}











/*pie de página */
footer aside {
	width: 96%;
	height: auto;
	margin: var(--alto) 0;
}


footer#foot nav {
	display:flex;
	flex-flow: row wrap;
	justify-content:center;
	align-items: center;
	margin: calc(var(--alto) * 2) 0;
	min-width: 90%;
	gap: calc(var(--ancho) * 2);
}
footer#foot nav a {
	display:block; 
	color: var(--bk_f);
	padding: .1rem;
	text-align: center;
	vertical-align: middle;
	font-size: calc(0.9em + 0.3vw);
}
footer#foot nav a[data-icono] {
	font-size: 0;
	width: calc(2.2rem + calc(var(--ancho) * 2));
	height: calc(2.2rem + calc(var(--ancho) * 2));
}

footer#foot nav a:hover {
	opacity: 0.7;	
}
footer#foot nav a::before {
	font-size: calc(2rem + calc(var(--ancho) * 1.5));
	display:block;
}















}
/*etiqueta para envolver, quitar en producción*/

/********************************************************************************************************************************************
 														INTRO		(común a portadas y doculevel)	 
*********************************************************************************************************************************************/
/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px) {
	
#Intro { 
	width: calc(100% - calc(var(--ancho) * 4));
	height:auto; 
	margin:0 calc(var(--ancho) * 2) calc(var(--alto) * 2) calc(var(--ancho) * 2);
	padding: calc(var(--alto) * 2) 0; 
	overflow: hidden;
	font-weight:normal; 
	display: grid;
	grid-template-columns: 2vw auto auto 2vw; 
	grid-template-rows: repeat(7, auto);
	row-gap: 0;  
	align-items: center;
	justify-items: center;
	background: linear-gradient(var(--bkB_f),var(--bk_bg),var(--bkB_f) );
	
}
#Intro.img { background: #000; }


#Intro > * { 
		grid-column: 2 / 4;
		align-self: start;
		justify-self:stretch; 
		z-index: 2;
}



#Intro> #TRANS {
position: static;
grid-row: 1;
/*font-size: calc(0.6em + 0.3vw);*/
background: none;
box-shadow: none;
min-height: auto;
z-index:20;
color: #FFF;
/*justify-self:flex-start;
justify-content:flex-start;*/

}


#Intro> #TRANS h2 {
	background: none;
	box-shadow: none;
	justify-content:center;
	
}

#Intro> :is(.as,.bis) {

	grid-row: 2;

	display:flex;
	flex-direction: column;
	justify-content:flex-start;
	align-content:flex-start;
	height: auto;
	gap: var(--alto);
	color: #FFF;
	/*text-shadow: 0 0 6px #000;*/ 
	padding: var(--alto) var(--ancho);
	font-size: calc(0.5rem + calc(var(--ancho) / 2));
}
#Intro.img> :is(.as,.bis) {
	/*align-self: bottom;*/
	/*padding: calc(var(--alto) * 2) calc(var(--ancho) * 2);
	background: rgba(var(--bk_bg_rgb),0.5);*/
}

#Intro> .bis {
	grid-row: 3;
}

#Intro aside {
	z-index: 2;
}
#Intro aside#banner4 {
	grid-row: 3;
	max-width: 410px;
	justify-self: center;
}
#Intro aside#banner4 + .bis {
	grid-row: 4;
}

#Intro aside#banner5 {
	grid-row: 6;
	background-color: #FFF;
	/*align-self: start;*/
}
#Intro> .navs {
	display:flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items:stretch;
	padding: var(--alto) 0;
	gap: calc(var(--ancho) * 2);
	grid-row: 5;
	font-family: var(--ffamH);
}
#Intro> .navs label {
	display: flex-item;
	color: var(--bk_f);
	align-self: center;	
}
#Intro aside#banner4 + .bis + .navs {
	grid-row: 5;
}

#Intro fieldset { border:none; display: flex; gap: var(--ancho); }
#Intro fieldset label { display: none; /*se activan a partir de 600*/ }
#Intro nav {

	display:flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items:center;
	height: auto;
	gap: calc(var(--ancho) / 2);
	font-weight: var(--bold);
}

	
#Intro :is(select,input, form) {
	/*align-self: stretch;*/
	justify-self:center;
	/*grid-row: 5;*/	
	color: var(--bkB_f);
	font-size: calc(0.8em + calc(var(--ancho) * 0.3));
	
	max-width: 90%;
	
} 
#Intro :is(select,input){ height: 2.2em; align-self: center; }

/*#Intro> :is(select,input, form) + :is(select,input, form) { 
		grid-row: 6;		
}*/

#Intro >.foto {
	justify-self:center;
	align-self:stretch;
	/*aspect-ratio: 1 / 1;*/
	width: 100%;
	z-index: 0;
	/*aspect-ratio: auto;*/
	/*width: 100%;
	height: auto;
	max-height: 100vh;*/
	grid-column: 1 / 5;
	grid-row: 1 / 6;
	/*z-index: 3;*/
	background: #000;
	display: flex;
	/*border-radius:50%;*/
	overflow: hidden;
	opacity:0.5;
	/*border: 2px solid rgb(178, 201, 156);*/ 
	position:relative;
  }

#Intro >.foto picture :is(img,source) {
	object-fit: cover;
}

#Intro nav a { 
	display: block; 
	border: 1px solid rgb(240,240,240); 
	border-radius: 1em; 
	padding:10px 1em; 
	font-size: 1em; 
	opacity:0.7; 
	color: var(--bk_f); 
}
#Intro nav a:hover { 
	opacity: 1; 
	border-color: var(--high); 
	background: var(--bk_f); 
	color: var(--bk_bg);  
}

#Intro nav a.selected { opacity: 1; font-weight: var(--bold); background-color: rgba(255,255,250,0.7); color: var(--high); }

#Intro .foto picture {
	grid-column: 1; 
				grid-row:1;
				width: 100%;
				height: 100%;
				display: flex;
}
 #Intro .foto :is(picture img, video) {
 	object-fit: cover;
 	/* Add the blur effect */
  filter: blur(12px);
  -webkit-filter: blur(12px)
}

 #Intro .foto > span { 
  		position:absolute; 
  		display:block; 
  		left:var(--ancho); 
  		bottom: var(--alto); 
  		font-size:calc(0.6rem + calc(var(--ancho) * 0.3)); 
  		color:#FFF; 
  		font-weight:var(--bold); 
		text-shadow:0 0 5px #000;  		
  		}
	#Intro .foto > span::before { font-family:"Materiales"; content: "copyright"; vertical-align:middle; font-size:120%; } 



#Intro > .as > p { 
	height: auto;
	margin: 0;
	padding: 0;
	text-align: center;
	text-shadow: 0 0 5px 5px #CCC;
}

#Intro > :is(h2, h3), #Intro > .as > .ti { 
	font-size: calc(1.2rem + var(--ancho)); 
	font-family: var(--ffamH);
	font-weight: var(--bold); 
	word-wrap:break-word; 
	flex-basis: 90%;
	text-align: center;
	color: #FFF;
	margin: 0;
	align-self: center;
	z-index: 3;
	
}
#Intro>:is(h2,h3,.as) {
	grid-row:2;
	/*padding-top: calc(var(--alto) * 4);*/
}

 #Hx:not(.pretrans) + main > [id^="cuerpo"] > #Intro {
	width: 100%;
	padding: 0; 
	margin: 0 0 calc(var(--alto) * 2) 0; 
 }

#Hx:not(.pretrans)+main>[id^="cuerpo"]>#Intro:first-child {
	padding-top: calc(var(--alto) * 12);
}

#Intro > :is(.as, .bis) > .sti {
	order:2; 
	font-size:calc(.8rem + calc(var(--ancho) / 2)); 
	font-style:italic; 
	font-weight:var(--bold);
	font-family:var(--ffamH);
}
#Intro  > :is(.as, .bis) >  .t {  
	order: 3;
	font-size:calc(0.8rem + calc(var(--ancho) / 2)); 
	text-align:justify; 
	margin-top: 0;
	
}
#Intro  > :is(.as, .bis) >  p {
	margin: 0;
	padding: 0;
	text-indent: 0;	
}



#Intro  > :is(.as,.bis) >  .int {  
	order: 3;
	font-size:1em; 
	text-align:center; 
	
}
#Intro> :is(h2,h3,.as,.bis) :is(a:link, a:visited) {
	color: var(--bk_f);	
} 
#Intro> :is(h2,h3,.as,.bis) a:hover {
	color: var(--high);	
}



}

/*@media screen and (min-width: 540px){
	#Hx:not(.pretrans)+main>[id^="cuerpo"]>#Intro:not(.foto)>:is(h2,h3) {
		padding-top: calc(var(--alto) * 4);
	}
	#Hx:not(.pretrans)+main>.largo+[id^="cuerpo"]>#Intro:not(.foto)>:is(h2,h3) {
		padding-top: calc(var(--alto) * 6);
	}
}*/

@media screen and (min-width: 600px){
	
	#Intro { grid-template-columns: calc(var(--ancho) * 2) auto auto calc(var(--ancho) * 2); }
	#Intro fieldset label { display: flex; }
}

@media screen and (min-width: 768px){
	#Intro>[class^="as"]{
		padding-top: 0; background: none; align-self: end;
	}
}

@media screen and (min-width: 800px){	
	/*#Intro > :is(h2, h3), #Intro > .as > .ti { 
		text-align: left;
		align-self: start;
	}*/
	#Intro > .as > p {
		text-align: left;
	}
	#Intro aside#banner4 { 
	justify-self: start;
	}
	#Intro aside#banner4 + .bis {
		grid-row: 3;
		max-width: calc(100% - 420px - calc(var(--ancho) * 2) );
		justify-self: end;
	}
	
	#Hx:not(.pretrans) + main > [id^="cuerpo"] > #Intro:first-child {
    padding-top: calc(var(--alto) * 8);
  	}
}
@media screen and (min-width: 1280px){
	#Intro aside#banner4 { grid-row: 3 / 5; }
	#Intro aside#banner4 + .bis + .navs {	
		max-width: calc(100% - 420px - calc(var(--ancho) * 2) );
		justify-self: end;
		grid-row:4
	}
}

@media screen and (min-width: 2600px){	
		#Intro aside#banner4 + .bis, #Intro aside#banner4 + .bis + .navs { max-width: 2000px; justify-self:start; padding-left: 440px; }
}
/*___________________________________________________________________________________________________________________________________________
 														Bp		(específicos de portadas y BOXER)	 
--------------------------------------------------------------------------------------------------------------------------------------------*/
/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px) {

.contenedor { 
	justify-self: stretch;
	display:flex; 
	flex-direction: row; 
	flex-wrap: wrap; 
	justify-content: stretch; 
	align-items: stretch;
	overflow: hidden;
	gap: var(--ancho);
}
.asides { 
	display:flex; 
	flex-flow: row wrap;
	justify-content: stretch;
	align-items: flex-start;
	align-content: flex-start;
	overflow: hidden;
	gap: var(--ancho);
}


/*columnas contenedoras de varias cajas. Comportamiento:*/ 
.contenedor [class^="columna"]:not(.Bbox){
	display:flex;
	flex-flow: column wrap;
	row-gap: calc(var(--alto) * 2);

}



/*--------------_________________________________________CAJAS_________________________________________--------------*/







/*----------------------------_____________________ESTILOS DE CUERPO_____________________----------------------------*/
 
 
 	/*por defecto las cajas son FLEX (en columnas) */
	.Bbox, .Bbox .INbox {  
		overflow:hidden; 
		position:relative; 
		display: flex;
		flex-flow: column wrap;
		color:#444; 
	} 
	.Bbox:not([class*="columna"]), .Bbox:not([class*="columna"]) .INbox {
		/*max-width: 100%;*/
		width: 100%;	
	}
	/*variante color para las cajas*/
	.Bbox.painted {
			background: var(--bkB_bg);
			color: var(--bkB_f);
			padding: var(--ancho);	
		}



	/* Variantes GRILLA de las cajas: inlay, carro (box-[A-B] (mod 3) se activa a partir de los 600px de pantalla )
		Estudiar ese inbox del carro, que lo veo raro
	*/
	.Bbox:is(.inlay,.carro,[class*="box-"]), .Bbox:is(.inlay,.carro,[class*="box-"]) .INbox {
			display: grid;
			grid-template-columns: 100%;		
			/*justify-items: center;*/		
		}
			
	.Bbox:is(.inlay,.carro)>*, .Bbox:is(.inlay,.carro) .INbox>*{
			grid-column:1;
	}
	



	/*SE ACTIVAN LOS TRES ESTADOS DEL OVERPRINT (vertical)*/
	/*:is(.Bbox,.carro.Bbox):is(.inlay,.inlay.painted,.painted):is(.In-A, .In-A .INbox) { */
	.Bbox:is(.In-A, .In-A .INbox) {
		align-items: start;
	}
	/*:is(.Bbox,.carro.Bbox):is(.inlay,.inlay.painted,.painted):is(.In-B, .In-B .INbox) { */ 
	.Bbox:is(.In-B, .In-B .INbox) {						
		align-items: end;
	}
	/*:is(.Bbox,.carro.Bbox):is(.inlay,.inlay.painted,.painted):is(.In-C, .In-C .INbox) {*/
	.Bbox:is(.In-C, .In-C .INbox) {  
		align-items: center;
	}
	.Bbox:is(.In-D, .In-D .INbox) {  
		align-items: stretch;
	}
	.Bbox:is(.In-A, .In-A .INbox)>*:not(.foto,.Hbox,.manta) { align-self: start; }
	.Bbox:is(.In-B, .In-B .INbox)>*:not(.foto,.Hbox,.manta) { align-self: end; }
	.Bbox:is(.In-C, .In-C .INbox)>*:not(.foto,.Hbox,.manta) { align-self: center; }
	.Bbox:is(.In-D, .In-D .INbox)>*:not(.foto,.Hbox,.manta) { align-self: stretch; }

	
	/*las columnas, los anchos y los altos se activan a partir de 600px (ver en C) */
	[class^="columna"], .box96 { 
		width : 100%;
		min-width: var(--min);
		padding : 0; 
		overflow : hidden; 
		align-self: stretch;
	} 
	.asides > [class^="columna"] {
		min-width: var(--minC);	
	}
	
	[class^="columna"].Bbox {
		align-self: flex-start;
	}
				
}
/*etiqueta para envolver, quitar en producción*/


/*Elementos de cajas. Valores específicos*/
/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px){



				/* ________________________________________________________________________
												ELEMENTOS DE CUERPO DE CAJA
				___________________________________________________________________________*/
		
		:is(.Bbox, .Bbox .INbox)>*:not(.INbox,.foto,.fichas,.manta){
			z-index: 10;
		}
		.Bbox:is(.inlay,[class*="box-"]) .foto {
			z-index: 1;	
			align-self: stretch;
			width:100%;	
		}	
		.Bbox[class*="box-"]:not(.inlay) .foto {
			opacity: 0.1;		
		}
		
		.Bbox.inlay .manta{
				justify-self:stretch;
				align-self: stretch;
				margin: 0;
				background: linear-gradient(rgba(var(--bk_bg_rgb),0.6), rgba(var(--bk_bg_rgb),0.8));
				z-index: 2;
		}	
		.Bbox.inlay.In-C .manta{
			margin: 0 calc(var(--ancho) / 2);
		}
	
		/*----------------------------____________________ESTILOS DE CABECERA____________________----------------------------*/


	.Hbox { 
		min-height:calc(var(--alto) * 2); 
		overflow : hidden; 
		display:flex; 
		column-gap: calc(var(--ancho) / 2); 
		align-items:center; 
		z-index: 10;
		justify-content:flex-start;
		margin: 0;
		padding: 0;
		text-indent: 0;
		width: 100%;
	}
	.Hbox.align-right {  justify-content:flex-end; }
	.Hbox.align-center { justify-self:center; justify-content:center; }
	.Hbox.align-justify { justify-content:stretch; }

	.Hbox [data-icono]{ order: 1; font-size: 0; }
	.Hbox [data-icono]::before { 
		font-size:calc(1rem + calc(var(--ancho) * 0.6)); 
		padding: 0; 
	}
	.Hbox .line{  
		font-size:calc(0.7rem + calc(var(--ancho) * 0.2)); 
		order: 2; 
		margin:0; 
		padding:0; 
		text-indent:0; 
		font-weight:normal; 
		font-family:var(--ffamH); 
	}
	
	.Bbox:not(.painted) .Hbox:not(.overlay) {
				border-bottom: 1px dashed var(--bkB_f);
				padding-bottom: calc(var(--ancho) / 2);	
				margin-bottom: var(--ancho);
	}

	
	.Bbox:not(.inlay,.carro,[class*="box-"] ) .Hbox {
			/*width: calc(100% - calc(var(--ancho) * 2));*/
			flex: 2 1 inherit;
			align-self: flex-start;
	}
	
	.Bbox:is(.inlay,.carro, [class*="box-"] ) .Hbox {
			justify-self:start;
			grid-row: 1;
			align-self: start;
	}
	
	.Bbox:is(.inlay,.carro, [class*="box-"] ) .align-left { justify-self:start; }
	.Bbox:is(.inlay,.carro, [class*="box-"] ) .align-right { justify-self:end; }
	.Bbox:is(.inlay,.carro, [class*="box-"] ) .align-center { justify-self:center; }
	.Bbox:is(.inlay,.carro, [class*="box-"] ) .align-justify { justify-self:stretch; }
			
	/*.Bbox.inlay.In-A .Hbox {
		width: 100%;
		margin: 0;
		border-radius:0;	
	}  */
				
				

		 :is(.Bbox, .Bbox .INbox)>:is(.ti, .int, .sti, .dat, .extra) {
			/*text-align: left;*/
			text-indent:0;
			font-weight: normal;
			/*word-wrap:break-word;*/ 
			word-wrap: inherit;
			margin:var(--alto) 0;
			max-width: 1600px;
		}
		:is(.Bbox, .Bbox .INbox)>.ti { 
			/*margin:0 2%*/; 
			font-family: var(--ffamH); 
			font-weight: normal;
		
		} 
		:is(.Bbox:not(.painted), .Bbox.inlay.painted, .Bbox .INbox)>:is(.ti, .int, .sti, .dat, .extra) {
			margin:calc(var(--alto) / 2) var(--ancho);
		}
				
				/*SUBTÍTULO */
				.Bbox .sti:is(.bold,.cursiva) {
					font-family: var(--ffamH);
				}			
				
				/*ENTRADILLA*/
				.Bbox p.int { 
					-webkit-hyphens: auto;
					-moz-hyphens: auto;
    				-ms-hyphens: auto;
    				hyphens: auto;
				}
				.Bbox .clamp {
					overflow: hidden;
   				text-overflow: ellipsis;
  					display: -webkit-box;
  					-webkit-box-orient: vertical;
   				/*
   				las órdenes  clamp vienen dadas en el html:
   					-webkit-line-clamp: en el html inline; 
           			line-clamp: en el html inline; recuerda q attr(data-lineas) NO funciona. attr se puede usar SÓLO CON STRINGS; */
				 }
				 
				
				.Bbox .dat {
					color: var(--bkB_f);
					font-weight:var(--bold);				
				}
				/* FECHA-AUTOR*/
				/*.Bbox .dat span { 
					font-weight:bold; 
				}*/
				.Bbox .dat :is(time,span.f,span.u)::before {
					font-family:"Materiales"; 
					content: "edit";
					/*font-size:80%;*/ 
					opacity:0.8;
					vertical-align:middle;
					padding:0 calc(var(--ancho) * 0.2) 0 0;
					 
				}
				.Bbox .dat :is(time,span.f):before { 
					content: "date_range"; 
				}
				/*.Bbox p.dat {
					margin-top: var(--alto);
					margin-bottom: 0;				
				}		*/		
				.Bbox .dat :is(time,span.f) + span.u { padding-left: var(--ancho);  }				
				
				
				.Bbox span.dat { 
					
					margin-top:0; 
					/*max-width:70%; */
					overflow:hidden;
					font-size:80%;
					padding: 0 calc(var(--ancho) * 2) 0 0;
					/*display: -webkit-box;
				  	-webkit-box-orient: vertical;
			  	 	-webkit-line-clamp: 1; 
				  	max-lines: 1;  */
				}
				.Bbox span.dat[class^="lineas"] { padding-right: 0; display: block;  }


			
			
				
				
				
			/*FOTO*/
			.Bbox .foto { 
				margin:0 auto; 
				float:none; 
				overflow:hidden; 
				padding:0; 
				background: linear-gradient(var(--bkB_f),var(--bk_bg), var(--bkB_f) );
				color: #FFF;  
				display:grid;
				grid-template-columns: 100%;
				grid-template-rows: 100%;
				grid-gap: var(--ancho); 
				align-items: center;
				overflow: hidden;
			}
			

			:is(.Bbox, .Bbox[class^=box-]) .foto { 
				margin: 0; 
				width: 100%; 
			} 
			
			
			
			
					
  			
			.Bbox .foto :is(picture,video) { 
				grid-column: 1; 
				grid-row:1;
				width: 100%;
				height: 100%;
				display: flex;
			}
			.Bbox .foto :is(picture img,video) {
				object-fit: cover;
				overflow: hidden;
			} 	
			/*.Bbox.inlay .foto :is(picture img,video) {	
				opacity: 0.3; 	
			} 	*/
				
			
		
				
		

			/* OVERLAY */
			
			.Hbox.overlay { 
				margin: 0; 
				background: linear-gradient(rgba(0,0,0,0.4), rgba(0,0,0,0.7) ); 
				padding: calc(var(--ancho) / 2) var(--ancho); 
				width: calc(100% - calc(var(--ancho) * 2)); 
			}

			.Bbox.inlay:not(.In-A,.In-D,.carro) .Hbox.overlay {
				grid-row: 2;
			}
			.Bbox.inlay.In-C:not(.carro) .Hbox.overlay {
				margin: 0 calc(var(--ancho) / 2);
				width: calc(100% - calc(var(--ancho) * 3));
			}

			/*ELEMENTOS DEL INLINE -DEFECTO: */	
			.Bbox .overlay {
				color: var(--bk_f) !important;
				text-shadow: 0 0 0.2em var(--bk_bg);
			}
			.Bbox .overlay a:is(:link,:visited) {
				color: var(--linkB) !important;
				text-shadow: 0 0 0.2em var(--bk_bg);
			}
			.Bbox .overlay a:hover {
				color: var(--high) !important;	
			}	
			.Bbox :is(.dat.overlay, .overlay span.dat) { 
					color:var(--highB);/*#F5F89E;*/ 
			}
			/*.Bbox .extra.overlay { 
				width: 90%;
				padding: var(--alto) 4%;
				background: rgba(255,255,255,0.3);	
			}*/
			:is(.Bbox:not(.In-C) , .Bbox:not(.In-C) .INbox)>:is(.ti, .int, .sti, .dat, .extra).last {	
				margin-bottom: calc(var(--alto) * 2);			
			}	
			



	
	.Bbox .extra {
		height: auto;
		overflow: hidden;	
	}


.Bbox .lista { 
	display: flex;
	flex-flow: column nowrap;
}
.Bbox .lista>div { margin: var(--ancho); box-shadow:0 0 var(--ancho) #f1f1f1; } 


.br100, .br75, .br50, .br25 { float:left; margin:0; padding:0; width:99%; border:0; } 




/* ¿?¿?¿?¿*/
/*.Cbox { width : 100%; min-height : auto; overflow : hidden; float:left; border-radius: 20px 20px 0 0; }
#portada article[class^="L"] { margin-top: 1em; }
#portada .listbreak { width:100%; display: block; clear: both; }*/

				[class^=bancho-]{ 
					width: 100%;
				}
				/*los elementos inferiores a media pantalla van en principio a un cuarto de pantalla de móvil, 
					se supone q a esos tamaños traen ya flotado, por lo q conviene :\ 
				*/
				.Bbox:not(.inlay) .foto:is(.bancho-A, .bancho-B, .bancho-C,.bancho-D) { width: 35%; }
				 
				.Bbox.inlay .foto { justify-self: stretch; } 
				
				
				[class^=balto-]{ 
					height: auto;
				}
				
		

}
/*etiqueta para envolver, quitar en producción*/


/*SE ACTIVAN LOS ALTOS*/
/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px){
				.balto-A { height: calc(var(--alto) * 10);  }
				.balto-B { height: calc(var(--alto) * 10.5); }
				.balto-C { height: calc(var(--alto) * 20); }
				.balto-D { height: calc(var(--alto) * 20.5); }
				.balto-E { height: calc(var(--alto) * 30); }
				.balto-F { height: calc(var(--alto) * 30.5); }
				.balto-G { height: calc(var(--alto) * 40); }
				.balto-H { height: calc(var(--alto) * 40.5); }
				.balto-I { height: calc(var(--alto) * 50); }
				.balto-J { height: calc(var(--alto) * 50.5); }
				.balto-K { height: calc(var(--alto) * 60); }
				.balto-L { height: calc(var(--alto) * 60.5); }
				.balto-M { height: calc(var(--alto) * 70); }
				.balto-N { height: calc(var(--alto) * 70.5); }
				.balto-O { height: calc(var(--alto) * 80); }
				.balto-P { height: calc(var(--alto) * 80.5); }
				.balto-Q { height: calc(var(--alto) * 90); }
				.balto-R { height: calc(var(--alto) * 90.5); }
				.balto-S { height: calc(var(--alto) * 100); }
}
/*etiqueta para envolver, quitar en producción*/

/*ORDEN DE ELEMENTOS DE CAJA */		
/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px){
		.Bbox .row1 {
			grid-row: 1;
		}
		.Bbox .row2 {
			grid-row: 2;
		}
		.Bbox .row3 {
			grid-row: 3;
		}
		.Bbox .row4 {
			grid-row: 4;
		}
		.Bbox .row5 {
			grid-row: 5;
		}
		.Bbox .row6 {
			grid-row: 6;
		}
		.Bbox .row7 {
			grid-row: 7;
		}
		.Bbox .row8 {
			grid-row: 8;
		}
		.Bbox .row9 {
			grid-row: 9;
		}
		
		.Bbox .row_i1 {
			grid-row-start: 1;
		}
		.Bbox .row_i2 {
			grid-row-start: 2;
		}
		.Bbox .row_i3 {
			grid-row-start: 3;
		}
		.Bbox .row_i4 {
			grid-row-start: 4;
		}
		.Bbox .row_i5 {
			grid-row-start: 5;
		}
		
		.Bbox .row_f1 {
			grid-row-end: 1;
		}
		.Bbox .row_f2 {
			grid-row-end: 2;
		}
		.Bbox .row_f3 {
			grid-row-end: 3;
		}
		.Bbox .row_f4 {
			grid-row-end: 4;
		}
		.Bbox .row_f5 {
			grid-row-end: 5;
		}
		.Bbox .row_f6 {
			grid-row-end: 6;
		}
		.Bbox .row_f7 {
			grid-row-end: 7;
		}
		.Bbox .row_f8 {
			grid-row-end: 8;
		}
		.Bbox .row_f9 {
			grid-row-end: 9;
		}
		
		.Bbox .ord1 {
			order: 1;
		}
		.Bbox .ord2 {
			order: 2;
		}
		.Bbox .ord3 {
			order: 3;
		}
		.Bbox .ord4 {
			order: 4;
		}
		.Bbox .ord5 {
			order: 5;
		}
		.Bbox .ord6 {
			order: 6;
		}
		.Bbox .ord7 {
			order: 7;
		}
		.Bbox .ord8 {
			order: 8;
		}
		.Bbox .ord9 {
			order: 9;
		}
	
}
/*etiqueta para envolver, quitar en producción*/



/* CAJA SLIDER: botonera */
/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px){
.carro.Bbox {
	row-gap: 0;
}
.carro.Bbox>.fichas {
	grid-row: 3 / 6;
	z-index: 1;
}
/*.carro.Bbox.painted>.fichas {
	grid-column: 2;	
}*/

.carro.Bbox>.overlay + .fichas {
	grid-row: 1 / 6;
	align-self: stretch;
}

.carro.Bbox>.botonera { 
	grid-row: 6;
	z-index: 11;
	align-self: end;
	justify-self:center;
	margin:0 var(--ancho);
	padding: var(--alto) 0;
	 
	text-align:center;*/ 
	overflow:hidden; 
	display: flex;
		flex-flow: row wrap;
		justify-content: center;
		align-items: center;
		gap: calc(var(--ancho) * 0.5);
	} 
	
/*.carro.Bbox.inlay.painted>* { grid-column: 2 / 5; }*/	

	
	
/*variantes verticales:
	por defecto es abajo, fuera de overlay
*/
/*arriba, fuera de overlay (si no hay box Q, con .overlay)*/
.carro.Bbox .botonera.vA { 
	grid-row: 2;
	align-self: start;
}
/*Las tres en superposición: Abajo, Centrada y Arriba*/ 
.carro.Bbox .botonera.vB { 
	grid-row: 5;
	align-self: end;
}
.carro.Bbox .botonera.vC { 
	grid-row: 4;
	align-self: center;
}
.carro.Bbox .botonera.vD { 
	grid-row: 3;
	align-self: start;
}
.carro.Bbox>.overlay ~ .botonera.vD {
	grid-row: 2;
}
.carro.Bbox>.overlay ~ .botonera.vC {
	grid-row: 3;
}

/*variantes horizontales
	por defecto es botonera centrada
*/
/*izquierda*/
.carro.Bbox .botonera.hA{ /*:is(.botonera.hA, .botonera[class^=v].hA){*/
	justify-self:start;
	justify-content: flex-start;
	
}
/*derecha*/
.carro.Bbox .botonera.hB { /*:is(.botonera.hB, .botonera[class^=v].hB){*/
	justify-self:end;
	justify-content: flex-end;
	
}
/*justificado*/
.carro.Bbox .botonera.hC { /*:is(.botonera.hC, .botonera[class^=v].hC){*/
	justify-self:center;
	width: 100%;
	justify-content: space-between;
	
}



/*.carro.Bbox .prenext.botonera {
	width: 100%;
	justify-content: space-between;
	align-self: center;
}*/


.botonera div[onclick] {
	text-align:center; 
	vertical-align:middle; 
	padding: 0;
	text-indent: 0;
	text-decoration:none; 
	cursor:pointer; 
	overflow:hidden;
	color:var(--bk_f);
	background : var(--bk_bg);
} 




.botonera.numeric div[onclick] {
	width:calc(1.2rem + calc(var(--alto) / 2)); 
	height:calc(1.2rem + calc(var(--alto) / 2));  
	border: 1px solid var(--bkB_f);
	border-radius:50%; 
	font-size:calc(.6rem + calc(var(--alto) / 2));
	line-height: calc(1.2rem + calc(var(--alto) / 2)); 	
}
/*.botonera.prenext div[onclick] { 
 	background: none;
 	color: var(--linkB);
 	border-radius:0;
 }*/
.botonera.titular div[onclick] {
	max-width: 340px;
}

.botonera :is(div[onclick].on, div[onclick]:hover){ 
	color: var(--bk_bg);
	background : var(--bk_f);
} 
.botonera :is(div[onclick].n.on, div[onclick].n:hover){
	background:var(--bkC_bg);
} 
.botonera div[set-icono]{
	font-size: 300%;

	width: auto;
	height: auto;
	margin:0;
	padding: 0;
	vertical-align: top;
}
.botonera div[onclick]::before {
 	vertical-align: top;
 }

/*.botonera div[onclick].control{
	background: none;
	color: rgba(200,210,200,0.5);
}*/
.botonera div[onclick].control::before {
	content: "carro_pause";
}
.botonera div[onclick].control.stop::before {
	content: "carro_loop";
}

.botonera.prenext div[onclick].prev::before {
	content: "carro_prev";
}
.botonera.prenext div[onclick].next::before {
	content: "carro_next";
}
.botonera.prenext div[onclick], .botonera div[onclick].control {
	color: var(--bk_f);
	background: none;
}



/*quitamos el botón central de control del modo prenext (flechas) cuando estamos en botonera 
justificada en horizontal (hC => space-between).
Este tipo de botonera es una de las más básicas y funcionales, y el botón de control en el centro queda muy feo.
Una opción sería mandarlo a un lateral con aling-self. Por ahora se oculta
*/
.carro.Bbox .botonera.prenext.hC div[onclick].control {
	display:none;
}
/*quiamos control del tipo numérico. Queda horrible. */
.carro.Bbox .botonera.numeric div[onclick].control {
	display:none;
}

.carro.Bbox .botonera.prenext.vC.hC div[onclick] {
	font-size: calc(4rem + calc(var(--ancho) / 2));
	width: 1em;
	opacity: 0.3;
}
.carro.Bbox .botonera.prenext.vC.hC div[onclick]:hover {
	opacity:1;	
}
.carro.Bbox .botonera.prenext.vC.hC div[onclick]::before{
	font-size: 1em;
	line-height: 2em;
	
}
.carro.Bbox .botonera.prenext.vC.hC div[onclick].prev::before {
	content: "carro_prev_long";
	
}
.carro.Bbox .botonera.prenext.vC.hC div[onclick].next::before {
	content: "carro_next_long";
}




.carro.Bbox .botonera.titular {
	background: rgba(255,255,255,0.3);
	padding: var(--alto) var(--ancho);
} 
.carro.Bbox .botonera.titular div {
	padding: calc(var(--alto) / 2) var(--ancho);
}

.carro.Bbox .botonera.titular div:is(.n,.on){
	border:1px solid #000;
}



.inlay .botonera.numeric:is(.vB,.vC,.vD) div[onclick] {
	background : var(--bkB_f);
	color:var(--bkB_bg);	
	opacity: 0.8;
}
.inlay .botonera.prenext:is(.vB,.vC,.vD) div[onclick] {
	background : none;
	color:var(--bk_f);	
	opacity: 0.8;
}
.inlay .botonera:is(.vB,.vC,.vD) :is(div[onclick].on, div[onclick]:hover){ 
	opacity: 1;
}

.inlay .botonera div[onclick].control {
	color: color:var(--bk_f);
}


}
/*etiqueta para envolver, quitar en producción*/


/**************600px**********************/
/*
SE ACTIVAN LOS ANCHOS. Hasta aquí todos son bancho-J (100%)
SE ACTIVA VARIANTE NO OVERLAY DE GRID (columna doble)
*/
@media screen and (min-width: 600px) {

				/*limpiamos valores previos establecidos en Bp para elementos inferiores a media pantalla, (float no).*/
				/*.Bbox .foto:is(.bancho-A, .bancho-B, .bancho-C,.bancho-D) { margin-right: inherit; }*/
				
				.bancho-A { width: 10% !important; }
				.bancho-B { width: 20% !important; }
				.bancho-C { width: 30% !important; }
				.bancho-D { width: 40% !important; }
				.bancho-E { width: 50% !important; }
				.bancho-F { width: 60% !important; }
				.bancho-G { width: 70% !important; }
				.bancho-H { width: 80% !important; }
				.bancho-I, .columna9 { width: 90% !important; }
				/*POR DEFECTO => .bancho-J { width: 100%; } */

	


				
	
		
		/******CAJAS**********/
			
	
				
		
			
				
			/*SE ACTIVA VARIANTE NO OVERLAY DE GRID: distribuye el grid en 2 columnas. Para Flotar las imágenes */
				.Bbox[class*="box-"]:not(.carro,.inlay), .Bbox[class*="box-"]:not(.inlay) .INbox {

					display: grid;
					column-gap: calc(var(--ancho) * 2);

				}
				.Bbox[class*="box-"].doble5:not(.carro,.inlay), .doble5:not(.inlay) .INbox {
					grid-template-columns: calc(50% - var(--ancho)) calc(50% - var(--ancho));
				}
				.Bbox.box-A.doble4:not(.carro,.inlay), .doble4:not(.inlay) .INbox {
					grid-template-columns: calc(40% - var(--ancho)) calc(60% - var(--ancho));
				}
				.Bbox.box-B.doble4:not(.carro,.inlay), .doble4:not(.inlay) .INbox {
					grid-template-columns: calc(60% - var(--ancho)) calc(40% - var(--ancho));
				}
				.Bbox.box-A.doble3:not(.carro,.inlay), .doble3:not(.inlay) .INbox {
					grid-template-columns: calc(30% - var(--ancho)) calc(70% - var(--ancho));
				}
				.Bbox.box-B.doble3:not(.carro,.inlay), .doble3:not(.inlay) .INbox {
					grid-template-columns: calc(70% - var(--ancho)) calc(30% - var(--ancho));
				}
				.Bbox.box-A.doble2:not(.carro,.inlay), .doble2:not(.inlay) .INbox {
					grid-template-columns: calc(20% - var(--ancho)) calc(80% - var(--ancho));
				}
				.Bbox.box-B.doble2:not(.carro,.inlay), .doble2:not(.inlay) .INbox {
					grid-template-columns: calc(80% - var(--ancho)) calc(20% - var(--ancho));
				}
				
				.Bbox[class*="box-"]:not(.inlay) .Hbox {
					grid-column: 1;
				}
				.Bbox[class*="box-"]:not(.inlay) .Hbox.align-right {
					grid-column: 2;
				}
				.Bbox[class*="box-"]:not(.inlay) .Hbox:is(.align-center,.align-justify) {
					grid-column: 1 / 3;
				}							
				
				.Bbox[class*="box-"] .colF {
					grid-column: 1 / 3;
					
				}
				.Bbox[class*="box-"] .colF + .colT {
					margin-top: var(--alto);	
				}
				.Bbox[class*="box-"] .colF ~ .colM {
					margin-top: var(--alto);	
				}
				
				.Bbox[class*="box-"] .extra.colM {
					z-index: 9;	
					background: rgba(var(--bkB_bg_rgb), 0.5);
					padding: var(--ancho);
					width: auto;
				}
				
				/*.Bbox[class*="box-"]:not(.carro,.inlay) .Hbox {
					grid-column: 1 / 3;							
				}*/
				/*.Bbox[class*="box-"] .foto {
					width: auto;
					margin: 0; 
				}*/
				.Bbox.box-A:not(.inlay) .colM  {
					grid-column: 1;
				}
				
				.Bbox.box-A:not(.inlay) .colT {
					grid-column: 2;
					margin: var(--ancho) calc(var(--ancho) * 2) var(--ancho) 0;
				}
				
				.Bbox.box-B:not(.inlay) .colM {
					grid-column: 2;
				}
				.Bbox.box-B:not(.inlay) .colT  {
					grid-column: 1;
					margin: var(--ancho) 0 var(--ancho) calc(var(--ancho) * 2);
				}
				
				/*En overlay el box- se usa para justificar elementos */
				.Bbox.inlay.box-A, .Bbox.inlay.box-B .INbox {
					justify-items: start;
				}
				.Bbox.inlay.box-B, .Bbox.inlay.box-C .INbox {
					justify-items: end;
				}
				.Bbox.inlay.box-D, .Bbox.inlay.box-D .INbox {
					justify-items: stretch;
				}
				
				.Bbox[class*="box-"]:not(.inlay) .foto[class*="balto-"]  {
					align-self: stretch;
					/*height: auto;*/
				}
				.Bbox[class*="box-"]:not(.inlay) .foto {
					opacity: 1;		
				}
			
		
					
		/*SE ACTIVAN LAS COLUMNAS*/
			
			/*flex: none | [ <'flex-grow'> <'flex-shrink'>? || <'flex-basis'> ]*/
			

				.columna100, .columna10 { 
					flex: 1 1 100%;  
				} 
				/*columna9 en banchos */
				
				/*
					Oct 22 
					
					columnas 80,75 y 60 se reunifican en 3/4 (sigue llamándose 75)					
					columna 40 desaparece. Obsoleta.
					
					Explicación de la fórmula (errónea):
						tomamos el valor base del ancho de la columna hermana, en este caso columna20
							x = calc(20% - 2vw)
						lo restamos al valor mínimo de todas las cajas. Si min es superior sale negativo
							a = calc(x - var(--min))
						restamos el resultado al valor base del ancho deseado 
							b = calc(calc(80% - 2vw) + a) 
						NOTAS:
									No funciona cuando el valor es superior al min
									recuerda que el max-width NO se puede usar

					*/
		
				.columna60, .columna6, .columna75, .columna7, .columna80, .columna8  { 
					flex: 1 4 calc(60% - calc(var(--ancho) * 4));  
				} 
				.columna50, .columna5 { 
					flex: 2 2 calc(50% - calc(var(--ancho) * 4)); 
				} 
				
				.columna40, .columna4 { 
					flex: 4 1 calc(40% - calc(var(--ancho) * 4));
					min-width:300px; 
				} 
				.columna33, .columna3 { 
					flex: 3 1 calc(33.3% - calc(var(--ancho) * 4));
					min-width:300px; 
				} 
				.columna25, .columna2 { 
					flex: 1 2 calc(25% - calc(var(--ancho) * 4));
					min-width:300px;
				} 
				.columna20, .columna1 { 
					flex: 1 2 calc(20% - calc(var(--ancho) * 4)); 
					min-width:300px;
				}
		
		/*se activa el tamaño específico de los break internos de columnas*/
		.br75 { width:74%; } 
		.br50 { width:49%; } 
		.br25 { width:24%; } 	
		
}





/* menu de familias en cajas */
/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px){
.Hbox .menuFA::before { 
	 
    font-family: 'Materiales';
    content: "menu";
    font-size: 150%;
    line-height: 1em;
    vertical-align: middle;
    padding: 0 calc(var(--ancho) / 2);
 }
.Bbox nav { 
		display: flex;
		flex-flow: row wrap;
		align-items: stretch;
		justify-content: center; 		
		font-size:calc(1rem + calc(var(--ancho) / 2));
		margin: var(--alto) auto;
		background:var(--bkB_bg);
		column-gap: calc(var(--ancho) * 2);
}
.Bbox nav a { display: block; min-width:calc(50% - calc(var(--ancho) * 2)); text-align:center; padding: calc(var(--alto) / 2) 0; border-bottom:1px solid var(--bkB_f)  } 
}
/*etiqueta para envolver, quitar en producción*/



/*LISTADOS*/
/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px){
	
.LA, .LB, .LC { margin-top:10px; float:left; width:100%; } 
.LA .foto, .LB .foto, .LC .foto, .LD .foto { float:left; margin: 0 10px 0 0; }


/* LISTADOS: ESQUEMA Y NAVEGACIONES */
.vermas { width : 98%; height : 40px; float : right; margin:20px 1%; border:1px solid #DDE7D3; background:rgba(232,235,216,.7); border-radius:20px; cursor:pointer; line-height:40px; text-align:center; font-size:30px; color:#B1CDC5; }
.vermas:hover { background:rgba(159,184,84,1);  }

.vermas:before { content:"\f10a"; font-size:50px; float:left; color:#CCC; font-weight:bold; background:inherit; border-radius:25px; padding:5px; }

.LSh, .LStouch { 
	width : 100%; 
	height: fit-content;
	font-size : calc(0.5em + 0.3vw); 
	font-weight : var(--bold); 
	color : var(--bkB_f); 
	margin : 0; 
	padding : calc(var(--alto) / 2) 0; 
	overflow : hidden; 
	background:var(--bkB_bg); 
	display: flex;
	flex-flow: row wrap;
	column-gap:calc(var(--ancho) * 2);
	justify-content: center;
	align-items: center;
}



.LSh > * {
	min-width: var(--min);
}

.LSh p {
	order: 1;
	margin-left: var(--ancho);
	text-align: center; 
}
.LSh p.m {
	order: 4;
}
.LSh p:first-of-type>span {
	
	font-size: 200%;
	font-weight: var(--bold);	
	
}
.LSh p.m span {
	font-size: 140%;
	font-weight: var(--bold);
}

.LSh form {
	order: 3;
	margin-right: var(--ancho);
}


/*.LSh .LshLat { width:100%; float:left; margin:0 0 10px 0; }
.LSh .LshBut { text-align : center; margin:10px auto 0 auto; padding:0 0 10px 0;  }

.LSh .LshLat p { margin: 0 2%; font-size : 1.2em; text-indent:0; top:0; left:0; z-index:2; float:left; }
.LSh .LshLat p.m { font-size:1em; font-style:oblique; margin:.4em 0 0 .2em;  }
.LSh .LshLat p span { display:inline; float:none;  font-size:1.8em; font-weight:bold; }
.LSh .LshLat select { margin:.5em 1%; font-size:1.4em; color:#999999; float:right; }*/

.LSh div {
	order:2;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.2rem;
}

.LSh div a {
	display: inline-flex;
	font-size: 1.5em;
	text-align: center;
	border:1px solid var(--bkB_f);
	padding: 0.5rem 1rem;
	font-weight: var(--bold);
	color: var(--bkB_f);
	opacity: 0.8;
	background: #FFF;	
}	
.LSh div a span { display: none; }

.LSh div a:hover {
	background: var(--bk_bg);
	color: var(--bk_f);	
}
.LSh div :is(a.von,a.von:hover) {
	background: var(--bk_bg);
	color: var(--bk_f);
	opacity: 1;
}







.LSh .prev,.LSh .prevon { display:inline-block; width:40px; height:40px; background:rgba(80,80,80,.5); border:1px solid #333; border-radius:10px; margin:0 5px 0 0; font-size:2.5em; line-height:40px; text-align:center; font-weight: var(--bold); color:#DDE0DA; box-shadow: #666 1px 1px 4px 4px;  }
.LSh .prev span,.LSh .prevon span { display:none; }
.LSh .prevon { background:var(--bkC_bg); color:var(--bkC_f); } 
.LSh .prev:hover { color:#E4E7CF; background:#888; }
.LSh .last { margin-left:40px; }
.LSh .last::before{ content:" ..."; }
.LSh .one { margin-right:40px; }
.LSh .one::before{ content:" ..."; }




#Intro .LSh {
	color: var(--bk_f);
	background: none;
	justify-content: center;
}
#Intro .LSh>p {
	margin: 0;
	padding: 0;	
}
#Intro .LSh>p:not(.m) {
	text-align: right;		
}
#Intro .LSh>p.m {
	text-align: left;
}















/*Modo listado */
.lister li { margin:10px; text-indent:0; font-size:1.4em; text-align:left; list-style:circle; }
.lister li span { font-size:.8em; font-style:oblique; }

}
/*etiqueta para envolver, quitar en producción*/

@media screen and (max-width: 1110px) { 
	/*.LSh .LshLat { width:140px; float:left; font-size:.8em;  } */
	.LSh .prev,.LSh .prevon { width:50px; height:50px; line-height:50px;  font-size:3em; }
}
@media screen and (max-width: 980px) { 
	.LSh .LshLat { width:140px; float:left; font-size:.8em;  }
	.LSh .prev,.LSh .prevon { width:40px; height:40px; line-height:40px;  font-size:2em; }
}
@media screen and (max-width: 800px) { 
	.LSh .prev,.LSh .prevon { width:30px; height:30px; line-height:30px;  font-size:2em; }
	.LSh .LshLat p { display: none; }
}
@media screen and (max-width: 680px) { 
	.LSh .LshLat { display:none; }
}
/*(fin) LISTADOS*/


/*____________________________________ (fin) Bp		(específicos de portadas y BOXER)___________________________________________*/





/*___________________________________________________________________________________________________________________________________________
 														Bp		(específicos de de doculevel)	 
--------------------------------------------------------------------------------------------------------------------------------------------*/

/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px) {
 
#plantillero { width : 96%; max-width:1000px; margin: var(--alto) auto; font-family: 'Open Sans', sans-serif; } 
#plantillero p { text-align:justify; text-indent: 1em; margin:0 0 1em 0; min-width:200px; padding:0;  } 
#plantillero :is(p,ol,ul,table,label,legend,input,select,button) {
font-family: 'Open Sans', sans-serif; line-height:1.5em; font-size:calc(1rem + 0.3vw);
}
 
#plantillero ul, #plantillero ol{ margin: 0 1em 1em 1em; padding:0; } 
#plantillero li{ margin:0 4% 1em 4%; padding:0; list-style-type: inherit; font-weight: inherit; } 
#plantillero h4 { font-size:calc(1.2rem + calc(var(--ancho) / 2)); color:#777; font-family: var(--ffamH); margin:2em 0 .3em 0; text-indent:0; } 
/*#plantillero div { overflow:hidden; }*/ 
#plantillero a:link, #plantillero a:visited { font-weight:var(--bold); border-bottom:1px dashed #86930D; /*color:#86930D;*/ padding-bottom:2px; } 
#plantillero a:hover { border-bottom:1px dashed #FFCC00; /*color:#FFCC00;*/ } 
#plantillero blockquote { width:240px; float:left; margin: 0 10px 10px 0; padding:5px; font-size:1.1em; background-color:#666666; color:#FFFFFF; } 
#plantillero .piefoto { margin : 0; width : auto; padding : 0; padding-bottom:5px; background:var(--bkB_bg); color :#666; border-radius:0; min-width:60px;  } 
#plantillero .piefoto p { margin: 5px 3%; padding:0; text-indent:0; font-size:1em; } 
#plantillero .piefoto .fotoTi { font-size : 1.1em; width : 96%; float : right; text-indent : 0; margin:5px 2%; padding:0; font-family: 'Open Sans', sans-serif; } 
#plantillero .piefoto font { width : 96%; float : left; font-size : 0.9em; margin : 5px 2%; border-top : 0.1em solid #cc9933; padding-top : 0.2em; text-align : right; font-weight : var(--bold); } 

#plantillero table { width: 100%; margin-top:calc(var(--alto) * 2) 0; border-collapse: collapse; }
#plantillero table :is(th,td){ border:1px solid #999; }
#plantillero figure {

	width: 100%;
	height: auto !important;
	overflow:hidden;
	margin: 0 auto 1em auto;
	display: grid;
	place-items: center;
		background: rgba(0,0,0,0.5);
	grid-template-rows: auto auto;
}

/*filtro para evitar que fotos con anchos asignados rompan el layout*/
#plantillero figure[class^="css"] {
	max-width: 100% !important;
	min-width: 100% !important; /*activar anchos de foto a partir de 768px*/	
}

#plantillero figure>picture {
	z-index:1;
	grid-column: 1 / 2;
	grid-row: 1 / 2;
	width: 100%;
	display: flex;
	flex-direction: row;
	justify-content:center;
	align-content:center;
				
}
#plantillero figure.figB>picture {
	grid-row: 1 / 3;
}

/*#plantillero figure>div picture { 
	height: auto;
	width: 100%;
	align-self: center;
	flex-shrink: 3;
	flex-grow:5;

}*/
#plantillero figure>picture>img {
	width: 100%;
	height: auto;
	object-fit: cover;
}

#plantillero figure>figcaption {
	z-index:2;
	grid-column: 1 / 2;
	grid-row: 2 / 3;
	justify-self:stretch;
	align-self:end;
	background: var(--bkB_bg);
	display:flex;
	flex-flow: row wrap;
	justify-content:flex-start;
	align-items: flex-end;
	row-gap: var(--alto);
	padding-bottom: var(--alto);
}
#plantillero figure.figB>figcaption{
	background: rgba(240,240,230,0.5);
}
#plantillero figure>figcaption > * {
margin: 0 4%;
}
#plantillero figure>figcaption h6 {
	font-size: calc(0.9rem + 0.3vw);
	color: #666;
	order:2;
}
#plantillero figure>figcaption div {
	font-size: calc(0.6rem + 0.3vw);
	color: #777;
	line-height: 2em;
	order:1;
}
#plantillero figure>figcaption>div>span::before {
	font-size: 110%;
	vertical-align: middle;
	padding-right: 0.3vw;
	padding-left: var(--ancho); 
}
#plantillero figure>figcaption p {
	font-size: calc(0.7rem + 0.3vw);
	text-align: justify;
	text-indent: 0;
	line-height: 1.5em;
	color: #555;
	order:3;
}
/*#plantillero form  {
	display: block;
	width: 100%;
	height: auto;
	margin:0;
	padding:0;
	overflow:hidden; 	
}*/
#plantillero fieldset  {
	width: calc(96% - calc(var(--ancho) * 2));
	margin: var(--alto) 2%;
	border:0;
	background: var(--bkB_bg);  
	overflow: hidden;
	padding: 0 var(--ancho);
}

#plantillero fieldset > * {
	display: block;
	width: 100%;
	margin: var(--alto) 0;
}

#plantillero fieldset > legend  {
	width: auto;
	border:0;
	padding: calc(var(--alto) / 2) var(--ancho);
	margin: 0 0 calc(var(--alto) * 2) var(--ancho); 
	background: var(--bk_bg); /*rgb(128, 128, 0);*/ 
	color: #FFF;
	font-weight: var(--bold);
}


#plantillero fieldset > label {

	display: flex;
	flex-flow: row nowrap;
	column-gap: calc(var(--ancho) * 0.2);
	align-items:stretch;
	justify-items:flex-start;
}

#plantillero fieldset>label>span{
	padding: calc(var(--alto) / 2) calc(var(--ancho) / 2); 
	background: rgb(225, 225, 208);
	flex: none 3;
	min-width: 25%;
}
#plantillero fieldset>label> :is(input,select){
	flex: 2 2;
	text-indent: 0.5em;
}
#plantillero fieldset>label> :is(input[type="radio"], input[type="checkbox"]){
	flex: 0 0;
	margin-left: 5%;
	text-indent: 0;
}
#plantillero fieldset>label> :is(input,select):required{
	border-color: var(--bk_bg);	
}

#plantillero fieldset>button{
	color: var(--link);
	background: none;
	width: auto;
	padding: calc(var(--alto) / 2) var(--ancho);
	text-align:center;
	align-self: center;
	justify-self: flex-end; 
}

.date { font-size : calc(0.7rem + .3vw); text-align:left; margin-top:20px; } 
/*span.dat { font-size:1em; }*/

				/* FECHA-AUTOR*/
				.date span { 
					font-weight:var(--bold);
					padding:var(--alto) 0; 
				}
				.date span:first-of-type {
					padding-right: var(--ancho);	
				} 
				.date span.fecha + span.firma { padding-left: 0; }
				.date span::before {
					font-family:"Materiales"; 
					content: "edit";
					opacity:0.8;
					vertical-align:top;
					padding:0 0.3vw;
					font-size : calc(1rem + .3vw); 
				}
				.date span.fecha::before { 
					content: "date_range"; 
				}

#Intro .date { background: rgba(40,77,0,0.5); color:#FFF; align-self: flex-start;  } 
#Intro .right, #Intro .left { background-color:#FFFFFF; } #Intro .right { padding-left:10px; } #Intro .left { padding-right:10px; } 




ul#menu2 { width:96%; float:left; margin:0 2%; }
ul#menu2 li { width:100px; float:left; height:50px; margin:10px 20px 10px 0; text-indent:0; text-align: center; list-style:none; color:var(--bkC_f); background-color: var(--bkC_bg); font-weight: var(--bold); font-size:11px; border-radius:15px; 	
}
ul#menu2 li:hover, ul#menu2 li.activelink  {  background-color: #DDDDDD; }
ul#menu2 li a, ul#menu2 li span { width:96px; height:50px; display:table-cell;  vertical-align:middle; text-align:center; margin-left:2px; }
ul#menu2 li a:link { color:#FFFFFF; } 
ul#menu2 li a:visited { color:#F5F5F5; }
ul#menu2 li a:hover { color:var(--bkC_bg); }
ul#menu2 li.activelink { color:#999999; }
h3.pantalla { font-size:2em; color:#666666; margin:20px 2% 10px 2%; text-indent:20px; padding-bottom:3px; border-bottom:1px dashed #666666;  }
#plantillero .botonera a { border-bottom:0; padding-bottom:0;} 

.boldI { font-weight: var(--bold); font-style:oblique; } 
.italic {font-style:oblique; } 
#plantillero .refTi { font-weight: var(--bold); margin:20px 20px 0 20px; border-radius:10px 10px 0 0; padding:5px 10px 0 10px; background-color:#CFCFCF; text-indent:0; color:#666666; } 
#plantillero .ref, #plantillero .refEnd { margin:0 20px; padding:5px 10px; background-color:#DFDFDF; font-size:12px; text-indent:0; } 
#plantillero .refEnd { border-radius: 0 0 10px 10px; margin-bottom:20px; } 
#plantillero .ref .refTi, #plantillero .refEnd .refTi { font-style:oblique; text-decoration:underline; font-weight: var(--bold); margin:0; padding:0; border-radius:0; background:none; font-size:1.1em; color:#990033; } 
#plantillero .spell, #plantillero .spellD { font-size:1.5em; text-align:center; text-indent:0; color:#999999; padding:10px; width:200px; line-height:1.5em; } 
#plantillero .spell { float:left; margin:0 10px 10px 0; } 
#plantillero .spellD { float:right; margin:0 0 10px 10px; }
#plantillero .urlExternas a, #plantillero .readMore a { border-bottom:none; line-height:40px; vertical-align:middle; padding:0 5px; color:#003300; border:1px solid #003300; }
#plantillero .urlExternas a:hover, #plantillero .readMore a:hover { color:#FFCC00; border:1px solid #FFCC00; } 

#plantillero .banfull { margin:10px 2%; padding:0; width:96%; }
#plantillero .banfull a:link, #plantillero .banfull a:hover, #plantillero .banfull a:visited { border-bottom:none; }




}
/*etiqueta para envolver, quitar en producción*/

@media screen and (min-width: 768px) {
	
			/* Se activan los anchos de foto en cuerpo de texto*/
			#plantillero figure[class^="css"] {
				min-width: auto !important; 	
			}
}
/*___________________________________(fin) B	(específicos de doculevel)_____________________________________________*/




/*___________________________________________________________________________________________________________________________________________
 														CLASES DE EDICIÓN	 
--------------------------------------------------------------------------------------------------------------------------------------------*/

/*etiqueta para envolver, quitar en producción*/
@media screen and (min-width: 100px){
/* las tsize-X están en A.css */

.cursiva { font-style: italic !important; } /* ¿no creamos oblícua por si no hay variante itálica de fuente? NO. Esto se define a nivel proyecto. AQUÍ. */
.bold { font-weight: var(--bold) !important; } /*nada de bolder, thin, */

.underline { text-decoration: underline !important; }
.overline { text-decoration: overline !important; }
.tachado { text-decoration: line-through !important; }
.entrelineas { text-decoration: underline overline !important; }

.valign-sub { vertical-align: sub !important; }
.valign-super { vertical-align: super; !important; }
.valign-middle { vertical-align: middle !important; }
.valign-bottom { vertical-align: bottom !important; }
.valign-top { vertical-align: top !important; }


.align-left { text-align: left !important; }
.align-right { text-align: right !important; }
.align-center { text-align: center !important; }
.align-justify { text-align: justify !important; }

.float-left { float: left; !important;  margin-right:var(--ancho) !important; }
.float-right { float: right; !important; margin-left:var(--ancho) !important; }
.float-center { margin-right: auto !important; margin-left: auto !important; }



.font-serif { font-family: 'Libre Baskerville', serif !important; }
.font-sans { font-family: 'Open Sans', sans-serif !important; }
.font-cursiva { font-family: cursive !important; }
.font-display { font-family: 'Courier New', Courier, monospace !important; }

.margintop-on { margin-top:calc(var(--alto) * 2) !important; }
.margintop-extra { margin-top:4vh !important; }
.margintop-off { margin-top:0 !important; }

.marginbottom-on { margin-bottom:calc(var(--alto) * 2) !important; }
.marginbottom-extra { margin-bottom:4vh !important; }
.marginbottom-off { margin-bottom:0 !important; }
}
/*etiqueta para envolver, quitar en producción*/

@media screen and (min-width: 640px) {
	.width-70 { width:calc(70% - var(--ancho)) !important; }
	.width-50 { width:calc(50% - var(--ancho)) !important; }
	.width-30 { width:calc(33% - var(--ancho)) !important; }

	.columnas-dos {
		-webkit-column-count: 2; /* Chrome, Safari, Opera */
    	-moz-column-count: 2; /* Firefox */
    	column-count: 2;
	}
	.columnas-tres {
		-webkit-column-count: 3; 
    	-moz-column-count: 3; 
    	column-count: 3;
	}

}
/*_________________________________________(fin) CLASES DE EDICIÓN_____________________________________________________________*/





/*******************************************
		FLUJO DE ANCHOS
********************************************/

@media screen and (min-width: 768px) {
	
			/*SE ACTIVAN LOS TAMAÑOS DE TEXTO ADAPTABLES*/ 	
				/*.tsize-A { font-size:calc(10.2px + 0.3vw) !important; } 	
				.tsize-B { font-size:calc(12.2px + 0.3vw) !important; } 
				.tsize-C { font-size:calc(14.2px  + 0.3vw) !important; } 	
				.tsize-D { font-size:calc(16.2px  + 0.5vw) !important; } 	
				.tsize-E { font-size:calc(18.2px + 0.5vw) !important; } 		
				.tsize-F { font-size:calc(20.2px + 0.7vw) !important; } 		
				.tsize-G { font-size:calc(20.2px + 0.9vw) !important; } 		
				.tsize-H { font-size:calc(22.2px + 1.1vw) !important; } 		
				.tsize-I { font-size:calc(24.2px + 1.3vw) !important; } 		
				.tsize-J { font-size:calc(26.2px + 1.5vw) !important; } 	*/	
				
			#cuerpo1 { grid-template-columns: minmax(calc(var(--minC) + calc(var(--ancho) * 4)),35%) 1fr; column-gap:var(--ancho); } /* sólo columna izquierda */
			#cuerpo3, #cuerpo2 { grid-template-columns: 1fr minmax(calc(var(--minC) + calc(var(--ancho) * 4)),35%); column-gap:var(--ancho); } /* sólo columna derecha */	
			
			#contenidos, #colI, #colD {
				margin: 0;
				
			}	
			#colI, #colD {
				justify-content: stretch;
			}	
			:is(#colI, #colD)>:is([class^=columna], .Bbox:not([class^=columna])) { flex: 2 1 100%; }	
			#contenidos {
				margin-left: var(--ancho);			
			}
			#cuerpo1 > #contenidos {
					grid-column: 2;
					margin-left:0;
			}
			:is(#cuerpo1, #cuerpo2,#cuerpo3) > #contenidos { grid-row: 3 / 6; }
			
			:is(#cuerpo2,#cuerpo3) > :is(#colI, #colD) { 
				grid-column: 2;
				margin-right: var(--ancho); 		
			}
			
			
			:is(#cuerpo1, #cuerpo2,#cuerpo3) > :is(#colI,#colD) {
				grid-row: 3;
			}
			:is(#cuerpo1, #cuerpo2,#cuerpo3) > #colI + #colD {
				grid-row: 4;
			}

			
			:is(#cuerpo1, #cuerpo2)> header{
					grid-column: 1 / 3;
			}			
			#cuerpo3 > header {
					grid-column: 1 / 4;
			}							
}


@media screen and (min-width: 1000px) {
	:root{
		--ancho: 1vw;
	}
}
@media screen and (min-height: 1000px) {
	:root{
		--alto: 1vh;
	}

}

/*activamos las tres columnas*/	
@media screen and (min-width: 1280px) {



		#cuerpo1 { grid-template-columns: calc(25% - var(--ancho)) 1fr; column-gap:var(--ancho); } /* sólo columna izquierda */
		#cuerpo2 { grid-template-columns: 1fr calc(25% - var(--ancho)); column-gap:var(--ancho); } /* sólo columna derecha */	
		#cuerpo3 { grid-template-columns: minmax(calc(var(--minC) + calc(var(--ancho) * 4)),25%) 1fr minmax(calc(var(--minC) + calc(var(--ancho) * 4)),25%); column-gap:var(--ancho); }
		#cuerpo3 > header{
					grid-column: 1 / 4;
		}
		[id^="cuerpo"]> #contenidos { grid-row: 3; }
		:is(#cuerpo3,#cuerpo1) > #contenidos { grid-column: 2; }
		
		#cuerpo3 > #colI { grid-column: 1; grid-row: 3; }
		#cuerpo3 > #colD { grid-column: 3; grid-row: 3; }
		#cuerpo3 > #colI + #colD { grid-row: 3; }
		#colI, #colD { position: sticky; top:0px; }
		
		#cuerpo3 > #contenidos { margin: 0; }
		#cuerpo2 > #contenidos { margin: 0 0 0 var(--ancho); }
		#cuerpo1 > #contenidos { margin: 0 var(--ancho) 0 0; }			
		:is(#cuerpo1, #cuerpo3) > #colI { margin: 0 0 0 var(--ancho); }	
		:is(#cuerpo2, #cuerpo3) > #colD { margin: 0 var(--ancho) 0 0; }	
		
		
}


/*SE FIJAN LOS TAMAÑOS DE TEXTO ADAPTABLES*/
/*@media screen and (min-width: 1920px) {

				.tsize-A { font-size:16px !important;  } 	
				.tsize-B { font-size:18px !important; } 	
				.tsize-C { font-size:20px !important; } 		
				.tsize-D { font-size:26px !important; } 		
				.tsize-E { font-size:28px !important; } 		
				.tsize-F { font-size:32px !important; } 		
				.tsize-G { font-size:37.5px !important; } 		
				.tsize-H { font-size:44px !important; } 		
				.tsize-I { font-size:49px !important; } 		
				.tsize-J { font-size:55px !important; } 		
				
				.Hbox .line { font-size: 15px; }
}*/

@media screen and (min-width: 2000px) {
	:root{
		--ancho: 20px;
	}
}
@media screen and (min-height: 2000px) {
	:root{
		--alto: 20px;
	}
}

@media screen and (min-width: 2260px) {
		[id^="cuerpo"] { column-gap:20px; }
		#cuerpo { grid-template-columns: auto var(--max) auto;  }
		#cuerpo1 { grid-template-columns: auto 480px 1800px auto;  } /* sólo columna izquierda */
		#cuerpo2 { grid-template-columns: auto 1800px 480px auto; } /* sólo columna derecha */	
		#cuerpo3 { grid-template-columns: auto 450px 1310px 450px auto; }
		
		:is(#cuerpo1,#cuerpo2) > aside#banner5 { grid-column: 2 / 4; }
		#cuerpo3 > aside#banner5 { grid-column: 2 / 5; }		
		
		[id^="cuerpo"] :is(#colI,#colD, #contenidos){
			margin: 0;
		}
		#cuerpo > header{
					grid-column: 1 / 4;
		}
		:is(#cuerpo1,#cuerpo2) > header{
					grid-column: 1 / 5;
		}
		#cuerpo3 > header{
					grid-column: 1 / 6;
		}
		:is(#cuerpo,#cuerpo2) > #contenidos { grid-column: 2; }
		:is(#cuerpo1,#cuerpo3) > #contenidos { grid-column: 3; }
		
		:is(#cuerpo1,#cuerpo3)> #colI { grid-column: 2; }
		
		#cuerpo2 > #colD { grid-column: 3; }
		#cuerpo3 > #colD { grid-column: 4; }
		
}