/* caballero perdedor ESTILOS COMUNES */
* { box-sizing: border-box; }

/* evita la molesta franja derecha que aparece en iOS tras hacer zoom en un campo de formulario */
html, body { width: 100%; min-height: 100%; margin: 0 !important; padding: 0; overflow-x: hidden; font-family: Georgia, "Times New Roman", serif; }
@font-face { font-family: 'Lato-Bold'; src: url('/fuentes/Lato-Bold.woff2') format('woff2'); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: 'Lato-Black'; src: url('/fuentes/Lato-Black.woff2') format('woff2'); font-weight: normal; font-style: normal; font-display: swap; }
#cabecera, #secundarios { width: 70%; margin: auto; padding-top: 15px; }
#secundarios { margin-bottom: 2em; padding-left: 1em }
#contenido { width: 70%; margin: auto; }
.entradas { margin: auto }
#link_del_fondo { width: 60%; margin: auto; text-align: right;}
#contenedorfaldon { background-color: royalblue; width: 100%; margin-top: 4em; }
#faldon { width: 60%; margin-top: 20px; margin: auto; padding: 10px; padding-bottom: 20px; color: white; }
#faldon a:visited { color: royalblue; }
.tagline { font-size: 0.8em; background-color: royalblue; color: white; margin-top: 0.7em; margin-left: -7px; padding: 2px; padding-left: 4px; }
.tagline h1 { font-size: 1.2em; font-weight: normal; margin-left: 0px; margin-top: 0.4em; line-height: 0.8em; }
h1 { font-size: 2em; margin-left: -5px; margin-top: 10px; line-height: 0.8em; }
.titulo { font-family: Lato-Black; font-size: 2em; font-weight: bolder; margin-left: -5px; margin-top: 10px; line-height: 0.8em; }
h2 { font-size: 1.6em; margin-left: -5px; /*margin-top: 15px;*/
margin-top: 2em; line-height: 0.8em; }
h3 { font-size: 1.4em; padding-top: 1.4em; line-height: 0.7em; }
h4 { font-size: 1.1em; padding-top: 1.4em; line-height: 0.7em; }
p { margin-top: 1em; }
h2 + p { margin-top: 0.4em; }
ul { list-style-type: circle; margin-left: 2em; margin-bottom: 1em;}
li { margin-top: 0.6em; font-size: 1em }
ul.horizontal { list-style-type: none; margin: 0; padding: 0; overflow: hidden; }
ul.horizontal li { float: left; margin-left: 5px; display: inline-block; background-color: white; margin-right: 5px; padding: 5px; border-radius: 3px; }
ul.horizontal li > a:hover { background: yellow;}
ul.horizontal li.especial { float: left; margin-left: 5px; display: inline-block; background-color: white; margin-right: 5px; padding: 5px; padding-bottom: 2px; border-radius: 3px; border: 3px solid gold; vertical-align: sub; }
ul.horizontal li.especial > a:hover { background: green;}
ol { margin-left: 2em; margin-bottom: 1.7em }
blockquote { margin-left: 1em; padding: .6em; background-color: #EEE; border-radius: 3px; }
td { font-size: .7em; font-family: verdana; sans-serif; }
table.listado { width: 100% }
table.listado td { border-bottom: 1px dotted #999; padding: .2em }
table.listado th { border-bottom: 1px dotted #999; padding: .2em; font-size: .8em }
.banderola { display: block; width: 200px; margin-left: auto; margin-right: auto; margin-top: 10px; }
#rsfaldon { font-size: .9em;display: inline-block; color: white; float: right; }
#rsfaldon img { vertical-align: middle;}
#rsfaldon a { color: white }
#rsfaldon a:visited { color: white }
.separador { width: 6%; margin-left:47% }
#copyleft { color: white; font-size: .6em; margin: auto; text-align: center;}
.izquierda { float: left }
.autor { display: none; font-size: .7em; color: gray; }
.fechaarticulo { display: none; font-size: .7em; color: gray; }
.autor { font-size: .7em; color: gray; }
.fechaarticulo { font-size: .7em; color: gray; }

.voladizo { display: none }
.movil-block { display: none }

code { background-color: #ddd; color: darkred; }
code pre { background-color: #eee; color: darkred; padding-left:1em; margin: .2em 0 1em 0  }
.procedimiento { padding-left: 2em; }

 /*** FIN DE REGLAS COMUNES ***/

/** AJUSTES ESPECÍFICOS 600 px y menos **/
/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) 
{ 
 /* 14px body, 16 px safe for most fonts. iOS 16 px for input field so iOS does not zoom on focus */
	body { font-size: 22px; line-height: 1.2em; }
	#cabecera, #secundarios { width: 90%; }
	#contenido { width: 90%; }
	#faldon { width: 100%; }
	#link_del_fondo { width: 90%; }	
	.tagline { }
	.tagline h1 { font-size: 1.0em; font-weight: normal; margin-left: 0px; margin-top: 0.4em; line-height: 0.8em; }
	.titulo { font-family: Lato-Bold; font-size: 1.3em; font-weight: bold; margin-left: -5px; margin-top: 10px; line-height: 0.8em; }
	#secundarios { margin-bottom: 1em; }
	#navmovil { display: block; width: 90%; text-align: right; margin-right: 10%}
	#entradas{ font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; margin-top: 2em;}
	h1 { font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; display:inline }
	h2 { font-family: Lato-Bold, Helvetica, arial, sans-serif; }
	h3 { font-size:1.1em;font-family: Lato-Bold, Helvetica, arial, sans-serif; line-height: 1.3em}	
	h3 a { font-size:1.1em;font-family: Lato-Bold, Helvetica, arial, sans-serif; text-decoration: none; line-height: 1.3em}
	#esenciales { display: none}
	.intro, .entrada { margin-top: 1.4em; font-family: Georgia, "Times New Roman", serif; line-height: 1.3em;}
	.entrada p { margin:.6em 0 1em .2em; font-size: .8em; }
	.sigueleyendo{ line-height: 0em; padding-right: 20%; display: inline;}

}


/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) 
{
	body { font-size: 22px; line-height: 1.2em; }
	#cabecera, #secundarios { width: 90%; }
	#contenido { width: 90%; }
	#faldon { width: 100%; }
	#link_del_fondo { width: 90%; }		
	.tagline { }
	.banderola { max-width: 90%; }
	#secundarios { margin-bottom: 1em; }
	#navmovil { display: block; width: 90%; text-align: right; margin-right: 10%}
	#entradas{ font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; margin-top: 2em;}
	h1 { font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; display:inline }
	h2 { font-family: Lato-Bold, Helvetica, arial, sans-serif; }
	h3 { font-size: font-family: Lato-Bold, Helvetica, arial, sans-serif; }	
	h3 a { font-size:1em;font-family: Lato-Bold, Helvetica, arial, sans-serif; text-decoration: none; line-height: .1em}
	#esenciales { display: none}
	.intro, .entrada { margin-top: 1.4em; font-family: Georgia, "Times New Roman", serif; line-height: 1.3em;}
	.entrada p { margin:.6em 0 1em .2em; font-size: .8em; }
	.sigueleyendo{ line-height: 0em; padding-right: 20%; display: inline;}
}


/* Medium devices (landscape tablets, teléfonos apaisados, 768px and up) */
@media only screen and (min-width: 768px) 
{ 
	/* zona segura en iPhones con pantallas irregulares */
	@supports(padding: max(0px)) 
	{
	 #faldon, #cabecera, #contenido { padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
	}
	/* fin zona segura iPhones */
	body { background-color: white; font-size: 18px; }
	.tagline { font-size: 0.7em; padding: 6px; padding-left: 4px; }
	.tagline h1 { font-size: 1.8em; vertical-align: middle; }
	#secundarios { margin-bottom: 1em; }
	#navmovil { display: block; width: 90%; text-align: right; margin-right: 10%}
	#entradas{ font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; margin-top: 2em;}
	h1 { font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; display:inline }
	h2 { font-family: Lato-Bold, Helvetica, arial, sans-serif; }
	h3 { font-family: Lato-Bold, Helvetica, arial, sans-serif; }	
	h3 a { font-size:1em;font-family: Lato-Bold, Helvetica, arial, sans-serif; text-decoration: none; line-height: .1em}
	#esenciales { display: none}
	.intro, .entrada { margin-top: 1.4em; font-family: Georgia, "Times New Roman", serif; line-height: 1.5em;}
	.entrada p { margin:.6em 0 1em .2em; font-size: 1em; }
	.sigueleyendo{ line-height: 0em; padding-right: 20%; display: inline;}
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px)
{
	body { font-size: 18px; line-height: 1.2em; }
	#cabecera, #secundarios { width: 85%; }
	#contenido { width: 85%; }
	#link_del_fondo { width: 85%; }		
	#faldon { width: 90%; }
	.tagline { font-size: .8em; }
	.banderola { max-width: 90%; }
	#navmovil { display: block; width: 90%; text-align: right; margin-right: 10%}
	#entradas{ font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; margin-top: 2em;}
	h1 { font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; display:inline }
	h2 { font-family: Lato-Bold, Helvetica, arial, sans-serif; }
	h3 { font-family: Lato-Bold, Helvetica, arial, sans-serif; }	
	h3 a { font-size: 0.9em;font-family: Lato-Bold, Helvetica, arial, sans-serif; text-decoration: none; line-height: .1em; }
	#esenciales { display: none}

	.intro, .entrada { margin-top: 1.4em; font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; }
	.entrada p { margin:.6em 0 1em .2em } 
	.sigueleyendo{ line-height: 0em; padding-right: 20%; display: inline;}
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px)
{ 
	body { font-size: 20px; line-height: 1.4em; }
	#cabecera, #secundarios { width: 70%; }
	#contenido { width: 60%; }
	#link_del_fondo { width: 70%; }		
	#contenedorfaldon { width: 100%; }
	#faldon { width: 70%; }
	.tagline { font-size: 0.8em; }
	.tagline h1 { font-size: 1.2em; }
	#navmovil { display: none; }
	h1 { font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; display:inline }
	h2 { font-family: Lato-Bold, Helvetica, arial, sans-serif; }
	h3 { font-family: Lato-Bold, Helvetica, arial, sans-serif; }	
	h3 a { font-size: 0.9em;font-family: Lato-Bold, Helvetica, arial, sans-serif; text-decoration: none; line-height: .1em}
	#esenciales { display: inline;float: right; padding-right: 2em; color: white;}
	#esenciales > a, #esenciales > a:visited { color: white; line-height: 1.3em; }
	#esenciales > a:hover { color: royalblue; background: white;}
	#esenciales > a:active { color: royalblue; background: yellow;}

	#entradas { width: 70%; margin: auto; font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; margin-top: 2em;}

	.intro, .entrada { margin-top: 1.4em; font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; }
	.entrada p { margin:.6em 0 1em .2em }
	.imgentrada { display: block; margin: auto;  }
	.piedefoto { width: 650px; display: block;margin: auto !important; font-family: verdana, sans-serif; font-style: italic; font-size: .7em !important; text-align: center !important; margin-bottom: 2em !important; }


	.sigueleyendo{ line-height: 0em; padding-right: 20%; display: inline;}
	.voladizo { float:left; margin-left: -310px; display: inline-block;  }


/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (max-width: 1199px)
{
	.movil-block { display: inline-block }
}

}


/* Extra extra large devices (large laptops and desktops, 1600px and up) */
	@media only screen and (min-width: 1600px) 
	{ body { font-size: 20px; line-height: 1.2em; background-color: white; }
	#cabecera, #secundarios  { width: 70%; }
	#contenido { width: 70%; }
	#link_del_fondo { width: 60%; }		
	#contenedorfaldon { width: 100%; margin-top: 4em; }
	#faldon { width: 70%; }
	#navmovil { display: none; }
	#entradas{ font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; margin-top: 2em;}
	h1 { font-family: Georgia, "Times New Roman", serif; line-height: 1.3em; display:inline }
	h2 { font-family: Lato-Bold, Helvetica, arial, sans-serif; line-height: 1.3em;}
	h3 { font-family: Lato-Bold, Helvetica, arial, sans-serif; line-height: 1.3em;}	
	h3 a { font-size: 0.9em;font-family: Lato-Bold, Helvetica, arial, sans-serif; text-decoration: none; line-height: .1em}
	#esenciales { float: right; padding-right: 2em; color: white;}
	#esenciales > a, #esenciales > a:visited { color: white; line-height: 1.1em; }
	#esenciales > a:hover { color: royalblue; background: white;}
	#esenciales > a:active { color: royalblue; background: yellow;}
	
	.intro, .entrada { margin-top: 1.4em; font-family: Georgia, "Times New Roman", serif; line-height: 1.5em; }
	.entrada p { margin:.6em 0 1em .2em }
	.imgentrada { display: block; margin: auto;  }
	.piedefoto { width: 650px; display: block;margin: auto !important; font-family: verdana, sans-serif; font-style: italic; font-size: .7em !important; text-align: center !important; margin-bottom: 2em !important; }

	.sigueleyendo{ line-height: 0em; padding-right: 20%; display: inline;}
}