
/*--------------------LETRA - OPEN SANS--------------------*/

@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');


body{
    width: 100%;
    font-family: 'Open Sans', sans-serif;
	/*COLOR DE FONDO*/
	background-color: #C8F7C5; 
    text-align: justify;
    font-size: 80%;
    margin: 0;
}

h1{
	font-size: 1.5em; 	
}

h2{
	font-size: 1.3em;  
}

p{
	color: #033016;
	font-weight: bolder;
	width: 100%;
}

hr{
	height: 1px;
	background-color: #114c2A;
  }
 
header{
    width: 99.9%;  
}

.enlace1{
	font-size: 1.3em;
    margin:2%;
	color: #114c2A;
}

.enlace2{
	font-size: 0.8em;
    margin:2%;
	color: #114c2A;
}

.enlace3{
	font-size: 1em;
	margin: 2%;
}


/* estilos para imagen central caminos del naranco */
.bloquelogo {
	width: 70%;
	margin-top: 0%;
	margin-bottom: 2%;
	padding-top: 11%;
	margin-left:28%; 
}


/* estilos para listas desordenadas. color en franjas */
ol {
	list-style: none;
	}
ol li {
	padding: 8px 10px;
	color: #111;
	}		
ol li:nth-child(odd) { /* filas pares */
	background-color: #f5f5f5;
	}
ol li:nth-child(even) { /* filas impares */
	background-color: #ece0e0;
	}

/*fin de estilos para listas desordenadas. color en franjas */



/********************************/
/* usado en fichas de fauna     */
/********************************/

/* nombre del animal o arbol */
.titulo_animal{
	margin: 0;
	padding:0;
	font-weight: bolder;
	font-size: 1.5em; 
	color:  #008000;
	text-align:center;
}

/* como mostrar foto de fauna o flora */
.animal_foto
  {
	width: 60%; 
	margin-top:5%;
	margin-left:1%;
	padding:0px;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
   }

/* fila de fauna o flora */
.animal_fila {
	width: 100%;
	margin: 0%;
	padding:2%;
  }

/* columna para la foto de fauna o flora */
.animal_columna1{
	width: 40%;
	margin:0%;
	display: inline-block;
}

/* columna para el nombre de cada especimen de fauna o flora*/
.animal_columna2{
	width: 49%;
	margin: 0;
	display: inline-block;
}

/* columna para la foto de fauna o flora*/
.animal_columna3{
	width: 99%;
	margin: 0%;
	display: inline-block;
}

/* bloque para mostrar un elemento de fauna o flora */
.bloque_animal{
	text-align:center;
	width:90%;
	margin-top: 2%;
	margin-right:5%;
	margin-left:5%;
	margin-bottom:2%;
	padding: 0%;
	background-color: white; 
	border: 2px solid #114c2A;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

.bloque_animalT1{
	text-align:center;
	width:90%;
	margin-top: 0%;
	margin-right:5%;
	margin-left:5%;
	margin-bottom:2%;

	padding: 0%;
	background-color: red;
	border: 2px solid #114c2A;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

/* bloque para mostrar los elementos de la fauna autoctona*/
.ba_fondoflora_autoctona{
	text-align:center;
	width:90%;
	margin-top: 2%;
	margin-right:5%;
	margin-left:5%;
	margin-bottom:2%;
	padding: 0%;
	background-image:url("../img/flora/imagen1.png");
	background-repeat: no-repeat;
	background-size: cover;
	border: 2px solid #114c2A;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

/* bloque para mostrar los elementos de la fauna invasora*/
.ba_fondoflora_invasora{
	text-align:center;
	width:90%;
	margin-top: 2%;
	margin-right:5%;
	margin-left:5%;
	margin-bottom:2%;
	padding: 0%;
	background-image:url("../img/flora/imagen2.png");
	background-repeat: no-repeat;
	background-size: cover;
	border: 2px solid #114c2A;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

/* bloque para mostrar los elementos 1.MAMIFEROS*/
.ba_fondofauna1{
	text-align:center;
	width:90%;
	margin-top: 2%;
	margin-right:5%;
	margin-left:5%;
	margin-bottom:2%;
	padding: 0%;
	background-image:url("../img/fauna/imagen1.png");
	background-repeat: no-repeat;
	background-size: cover;
	border: 2px solid #114c2A;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

/* bloque para mostrar los elementos 2.RAPACES*/
.ba_fondofauna2{
	text-align:center;
	width:90%;
	margin-top: 2%;
	margin-right:5%;
	margin-left:5%;
	margin-bottom:2%;
	padding: 0%;
	background-image:url("../img/fauna/imagen2.png");
	background-repeat: no-repeat;
	background-size: cover;
	border: 2px solid #114c2A;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

/* bloque para mostrar los elementos 3.PAJAROS*/
.ba_fondofauna3{
	text-align:center;
	width:90%;
	margin-top: 2%;
	margin-right:5%;
	margin-left:5%;
	margin-bottom:2%;
	padding: 0%;
	background-image:url("../img/fauna/imagen3.png");
	background-repeat: no-repeat;
	background-size: cover;
	border: 2px solid #114c2A;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}
/* bloque para mostrar los elementos 4.AVES ACUATICAS*/
.ba_fondofauna4{
	text-align:center;
	width:90%;
	margin-top: 2%;
	margin-right:5%;
	margin-left:5%;
	margin-bottom:2%;
	padding: 0%;
	background-image:url("../img/fauna/imagen4.png");
	background-repeat: no-repeat;
	background-size: cover;
	border: 2px solid #114c2A;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

/* bloque para mostrar los elementos 5.REPTILES Y ANFIBIOS*/
.ba_fondofauna5{
	text-align:center;
	width:90%;
	margin-top: 2%;
	margin-right:5%;
	margin-left:5%;
	margin-bottom:2%;
	padding: 0%;
	background-image:url("../img/fauna/imagen5.png");
	background-repeat: no-repeat;
	background-size: cover;
	border: 2px solid #114c2A;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

/*******************************/
/*  fin de fichas de fauna     */
/*******************************/

/* usado en itinerarios para hacer un indice previo********************** */
.parrafo1{
	    background-color: #0e7d7d;
		text-align: left;
		color: white;
		height: auto;
		width: 95%;
		margin:5%;
		padding: 2%; 
		-webkit-border-radius: 12px;
		-moz-border-radius: 12px;
		border-radius: 12px;
} 

div.situacion{
    width: 100%;
	height: auto;
  }

  /* usado en imprescindibles: zona rural */
 div.situacion2{
    width: 90%; 
	height: auto;
	margin: 0%;
  }

div.situacion img.derecha{
    float: right;
	margin-top: 1%;
	padding:1%;
    width:10%;
	height:10%; 
  }

div.situacion img.izquierda{
    float: left;
  }
  
div.reset{
    clear: both;
  }




/*texto para la palabra Indice */
.textoIndice{
	font-size: 2em;
	margin: 2%;
}

.xparte{
  width: 100%;
  height: auto;
}

.xparte1
{
   width: 70%;
   height: auto;
   background-color: red; 
}

.xparte2
{
   width: 30%;
   height: auto;
   background-color: yellow; 
}


/* usado en index. html */
.bloqueTransparente{
	text-align:justify;
	width: 95%;
	margin:5%;
	padding: 2%;
}

/* usado en itinerarios */
.bloqueTransparente2{
	text-align:center;
	width: 95%;
	margin:5%;
	padding: 2%;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

/* enlace masmenos */
.masmenos{
	color: #033016;
	font-size: 0.95em; /* ojito con font-size, depende del tipo de pagina */
	font-weight: bold;
    background-image: linear-gradient( #033016, #033016);
	/* se le puede poner un color y un ancho a la caja donde aparece el texto Leer mas o menos */
	/* width:100px;
	height: 30px;
	background-color: red; */
}

.negrita 
{font-weight:bolder;}

.negrita_su{
	font-weight:bolder;
	text-decoration: underline;
}

/* aplicable a NEVEROS.HTML */

.subrayado
{
	text-decoration: underline;
}

.subrayado2
{
	font-size:medium;
	text-decoration: underline;
	font-weight:bolder;
}


.letramediana {
	font-size: medium;
	font-weight:bolder;
}

.italica
{
	font-style: oblique;
}

.textoIzquierda
{	text-align: left;}

.textoDerecha
{   text-align: right;}

.parte1
{
   width: 100%;
   height: auto;
   background-color: red; 
}

.parte2
{  
   width: 100%;
   height: auto;
   background-color: blue; 
}

/*usado en todos los temas de IMPRESCINDIBLES */
.textoExtraGrande 
{
	font-size: 2em;
	font-weight: bold;
	line-height: 2em;
	color:   #033016;
	text-align: center;
}

/* texto para index	*/ 
.textoGigante
{
	font-size: 4em;
	font-weight: bold;
	color:   #033016;
	text-align: center;
}

/* usado en index */
.textoCita
{
	font-size: 1.2em;
	font-weight:bolder;
	text-align:right;
}

.textoG4
{ 
	 font-size: 2em;
	 padding: 2%;
	 width: 95%;
	 text-align: justify;
}
.textocreditos
{ 
	 font-size: 2.2em;
	 padding: 2%;
	 width: 95%;
	 text-align: center;
	 line-height: 150%;
}

.Fotoizqda
{	float: left; }

.Fotodcha
{ float: right;}

/* usado en los elementos del menu : imprescindibles */


/* no lo uso de momento */
.bloque3{
	text-align:center;
	width: 100%;
	background-color: yellow;
}

/* no lo uso de momento */
.bloquePrincipal{
	background-color: blue;
	width: 90%;
	margin-left: 5%;
	margin-right: 5%;
	height:auto;
}

.bloqueImprescindibles{
	background-color: #C8F7C5;
	text-align:center;
	width:92%; 
	padding:2%;
	padding-top: 11%;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}



.bloqueRedondo{
	background-color: white;
	border: 1px solid #114c2A;
	text-align:center;
	width: 98%; /*98% */
	padding:2%;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

/* usado al mostrar los videos en cada itinerario */
.videobloque{
	background-color: none;
	text-align:center;
	width: 80%;
	margin-left: 10%;
	margin-right: 10%;
}


/* bloque redondo alineación a la izquierda */
.bloqueRedondoIzquierda{
	background-color: white;
	border: 1px solid #114c2A;
	text-align:left;
	width: 98%;
	/*margin-left:5%;
	margin-right:5%;*/
	padding:2%;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

/* bloque Redondo para mostrar fotos NO VALE ES IGUAL QUE EL ORIGINAL*/
.bloqueRedondoFotos{
	background-color: white;
	border: 1px solid #114c2A;
	text-align:center;
	width: 98%;
	/*margin-left:5%;
	margin-right:5%;*/
	padding:2%;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

.bloqueCentro{
	background-color: red; 
	width: 90%;
	margin-left: 0%;
	margin-right: 0%;
	height:auto;
}

/*usado en el carrusel del index.html */
.bloqueCartel2{
	text-align: center;
	background-color: white;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
	width: 90%;
	margin-left:5%;
    /*	height:auto; */
}

/*usado en el carrusel de manantiales*/
.bloqueCartel2{
	text-align: center;
	background-color: white;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
	width:95%;
	margin-left:5%;
    /*	height:auto; */
}

/* FIN DE LAS CLASES APLICABLES A NEVEROS. HTML */

/* index */

.contenedor1{
  
    text-align: center;
}

/****** inicio clases font awesone */


/* mapa*/
.fa-map{
	color: #008000;
}

/* arbol */
.fa-tree {
	color: #008000;
}

/* flecha abajo */
.fa-arrow-alt-circle-down
{
	color: #007FAA;
}

/* senderismo */
.fa-hiking
{
  color: #D43900;
}

/* hoja para medio ambiente */
.fa-pagelines
{
	color:#008000;
}


/* fin clases font awesone */
/********************************************************/
/* estilos para videos */
.bloqueVideo {
	position: relative;
    padding-bottom: 56.25%; /* proporción 16:9 */
    padding-top: 30px; height: 0; overflow: hidden;
}

.bloqueVideo iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; /* tamaño real del video */
    height: 100%; /* tamaño real del video */
}

.video {
    width: 95%;
    height:auto;
    padding:10px;
    margin: auto auto 0 auto; 
    margin-top: 3%;
    margin-bottom: 3%; 
	background-color: white;
}

.video:after {
    content: " ";
    display: block;
    height: 0;
    clear: both;
}  
/* fin estilos para videos */

/************************************/
/****INICIO DE TIPOS DE PAGINAS *****/
/************************************/
/* usada en pagina INDEX.HTML */
.pagina_index{
	width:90%;
    font-size: 0.8em; 
	line-height: 2.5em;  

	font-family: 'Open Sans', sans-serif;
    text-align:justify;
	color: #033016;
	margin-left:0%;
	margin-right: 2%;
	padding-top:0%;
	padding-bottom: 2%;
	padding-right: 2%;
}

/* usada en IMPRESCINDIBLES.HTML, RECURSOS.HTML */
/* ACTIVIDADES.HTML NATURALEZA.HTML Y EN CADA UNA DE LAS PAGINAS DE IMPRESCINDIBLES Y RECURSOS*/
.pagina{
	width:100%;
	font-size: 0.8em; line-height: 2.5em;
	font-family: 'Open Sans', sans-serif;
    text-align:justify;
	color: #033016;
	padding-top: 12%; /* 0*/
}



/* usada en itinerarios.html */
.pagina2{
	width:90%;
    font-size: 0.95em; 
	font-family: 'Open Sans', sans-serif;
    text-align:justify;
	color: #033016;
	padding-top: 1%; /* 0*/
	line-height: 2.6em;
}

/* usada en FLORA.HTML Y FAUNA.HTML */
.pagina3{
	width:100%;
    font-size: 0.8em; /* 0.95em */
	line-height: 1.2em;
	font-family: 'Open Sans', sans-serif;
    text-align:justify;
	color: #033016;
	margin-top: 0%;
}

/* usado en la tabla MIDE */
.interlineado1{
	line-height: 1em;
}

/* usada en cada itinerario */
.pagina_itinerario{
	    width:90%;
		font-size: 0.8em; 
		line-height: 2.5em;
		font-family: 'Open Sans', sans-serif;
		text-align:justify;
		color: #033016;
		margin-left:0%;
		margin-right: 1%;
		padding-top: 2%;
	}


.pagina_recursos{
	width:90%;
	font-size: 0.95em; 
	font-family: 'Open Sans', sans-serif;
	text-align:justify;
	color: #033016;
	line-height: 2.6em;
	margin-left:0%;
	margin-right: 5%;
	margin-top: 0%;
	padding-top: 0%;
}

/* galeria de fotos */
.pagina7{
	width:80%;

	font-size: 0.95em; 
	color: #033016;
	margin-left:10%;
	margin-right: 1%;

	padding-top: 12%; 
	padding-bottom: 2%;
	padding-right: 5%;

	line-height: 2.6em;

	font-family: 'Open Sans', sans-serif;
	text-align:left;
}

/**********************************/
/**** FIN DE TIPOS DE PAGINAS *****/
/**********************************/

/* INICIO clases comunes a los itinerarios */

/* usado en cada itinerario para separar los distitos temas */



.bloque2 {
	background-color: white; 
	text-align:center;
	width: 100%;
	padding-top: 4%;
	padding-bottom: 4%;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

.migaspan {
	text-align: left;
	font-weight: bolder;
	font-size: 1.5em;
	width: 95%;
    margin-top: 0%;
	margin-left: 5%;
}

.migaspan2 {
	text-align: left;
	font-weight: bolder;
	font-size: 1.5em;
	width: 95%;
    margin-top: 0%;
	margin-left: 1.2%;
}

.migaspan3 {
	text-align: left;
	font-weight: bolder;
	font-size: 1.5em;
	width: 50%;
    margin-top: 0%;
	margin-left: 7%;
}

/* aplicable al titulo de cada itinerario */
.bloqueTitulo {
	
	/*background-color: white;
	color: #008000;*/
	background-color: #005555;
	color: white;

	text-align: center;
	font-size: 2.2em;
	width: 95%;
    margin:5%;
	margin-bottom: 1px;
	margin-top: 12%;
	padding: 2%;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}

.bloqueTitulo2 {

	/*background-color: white;
	color: #008000;*/

	background-color: #005555;
	color: white;
	text-align: center;
	
	font-size: 2.2em;
	width: 80%;
	margin-left:8%;
	margin-top:0%;
	margin-bottom: 5%;


	padding: 2%;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}

.bloqueTitulo3 {
	/*background-color: white;
	color: #008000;*/
	text-align: center;
	background-color: #005555;
	color: white;
	font-weight: bolder;
	font-size: 2.2em;
	width: 80%;
	margin-left:10%;
	margin-top:2%;
	padding: 2%;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}

.bloqueTitulo4 {
	/*background-color: white;
	color: #008000;*/
	text-align: center;
	background-color: #005555;
	color: white;

	font-size: 2.2em;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
    margin-left:1%;
	width:96%; 
	padding:2%;
	text-transform: uppercase;
}


.bloqueTitulo5 {
	/*background-color: white;
	color: #008000;*/
	line-height: 2.6em;
	text-align: center;
	background-color: #005555;
	color: white;
	font-weight: bolder;
	font-size: 1.5em;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
    margin-left:6%;
	width:84%; 
	padding:2%;
}

.bloqueNuevo1 {
	text-align: center;
	background-color: white;
	color: #008000;
	font-weight: bolder;
	font-size: 1.5em;
	width: 92%;
	padding: 2%;
	padding-bottom:2%;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}

.bloqueNew {
	
	/*background-color: white;
	color: #008000;*/
	background-color: #005555;
	color: white;

	text-align: center;
	font-size: 2.2em;
	width: 95%;
    margin:5%;
	margin-bottom: 25px;
	margin-top: 10%;
	padding: 2%;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}


/* aplicable a titulo de recursos*/
.bloqueTituloRecursos {
	border: 2px solid;

	text-align: center;
	background-color: white;
	color: #008000;
	font-weight: bolder;
	font-size: 1.5em;
	width: 95%;
    margin-left: 5%; 
	margin-right: 5%;
	margin-top:0%;
	margin-bottom:0%;
	padding: 2%;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}

/*usado en RECURSOS */
.bloqueBorde {
	border: 2px solid;

	text-align: center;
	background-color: white;
	color: #008000;
	width: 95%;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
	width: 95%;
    margin-left: 5%; 
	margin-right: 5%;
	margin-top:0%;
	margin-bottom:0%;
	padding: 2%;
}


/* usado en flora y fauna */
.bloqueTituloAnimal {
	text-align: center;
	background-color: white;
	color: #008000;
	font-weight: bolder;
	font-size: 1.5em;
	width: 85%;
	margin:5%; 
	padding: 2%;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}

/* usado en flora y fauna */
.bloqueTituloAnimal2 {
	text-align: center;
	background-color:white;
	color: #008000;
	font-weight: bolder;
	font-size: 1.5em;
	width:40%;
	margin:5%; 
	padding: 2%;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}

/*clase usada en Datos técnicos y Descripción general */
.contenido1{
	width: 100%;
	text-align: justify;
}

/* usado en la cabecera de las paginas de IMPRESCINDIBLES */
.bloqueSubseccion {
	width: 100%;
/*	padding-left:5%;
	padding-right: 5%; */
}


/**** INICIO CLASES COMUNES A TODOS LOS ITINERARIOS ****/

/* usado en cada itinerario para separar los distitos temas */
.bloque {
	text-align: center;
	background-color: white;
	color: #008000;
	width: 95%;
	margin:0% 5% 5% 5%; 
	padding: 2%;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}




/* usado en accesibilidad y cookies */
.bloqueAC {
	text-align: center;
	background-color: white;
	color: #008000;
	
	width: 100%;
	
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}

/* usado en accesibilidad y cookies */
.bloqueTituloAC {

	text-align: center;
	background-color: white;
	color: #008000;
	font-weight: bolder;
	font-size: 1.5em;
	width: 90%;
	padding: 5%;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}

/*usada en accesibilidad y cookies */
.paginaAC{
	padding-top:5%;
	width:95%;
	margin-left:2%;
	font-size: 0.8em; line-height: 2.5em;
	font-family: 'Open Sans', sans-serif;
    text-align:justify;
	color: #033016;
}


.bloqueVideoPrincipal {
	text-align: center;
	background-color: none;
	width: 95%;
	margin:5%; 
	padding:2%;
}

/* clase aplicable a H1 */
.titulo1 { 
	margin: auto;
	font-weight: bolder;
	font-size: 2em;
	padding: 5%;
	color:  #008000;
	text-align:center;
}

/* aplicable a H2 en cada itinerario  y cada titulo de imprescindibles*/
.titulo2 { 
	margin: 0;
	padding:0;
	font-weight: bolder;
	font-size: 1.7em; 
	color:  #008000;
	text-align:center;
	background-color: white;
}


.tituloNuevo1 { 
	text-align: center;
	background-color: white;
	color: #008000;
	font-weight: bolder;
	font-size: 1.5em;
	width: 95%;
	margin-left:5%;
	padding:2%;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
}


/* aplicable a H1 SENDERISMO>>ITINERARIO */
.titulo3 { 
	padding-bottom: 2%;
	color: #005555;
	text-align:left;
}


/* clase para mostrar en los itinerarios la foto y el texto de cada punto de interés */
.foto2
{	
	width: 70%; 
	height: 30%; 
    margin: 1%;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
}


/* en cada itinerario, clase para mostrar los textos explicativos de cada punto de interés */
/* también usada en IMPRESCINDIBLES.HTML */
.textoG {
	padding: 1%;
	width: 95%;
	text-align: justify;
}

.textoG2 {
	padding: 2%;
	width: 95%;
	text-align: left;
}

.textoG3 {
	padding: 2%;
	width: 95%;
	text-align: left;
}

.textoG5{
	font-size: 1.5em;
	padding: 2%;
	width: 95%;
	text-align: justify;
}

/* usado en las fichas de FLORA Y FAUNA */
.textoG31
{	
	padding: 0%;
	width: 95%;
	text-align: left;
}

/* en cada itinerario zona donde se muestran los mapas */
.bloquemapa {
	width: 100%;	
}

/* inicio de zona de descargas de mapas */
#desca{
	line-height: 3;
	text-align: left;
}

.tabla{
	border:2px double #007A4B;
	width:30%;
}

.tabla2{
	border:1px double #007A4B;
	width:50%;
}

.ruta{
	border:3px solid #007A4B;
	width: 33%; 
	height: 10px;
	padding-top:1%; /*6% */
}

/********************/
/* tabla para MIDE  */
/********************/

.tabla1{
	line-height: 1em;
	border:2px double #007A4B;
	width:100%;
	color: #033016;
	font-size: 1em;
}

.ruta1{
	height: auto;
	border:1px solid #007A4B;
	padding:1px;
}

.mide{
	width:40%;
}

/*fin de zona de descarga de mapas */

/* clases para mostrar la galeria de puntos de interés */
.fila {
	width: 100%;
	height: auto; 
	margin: 0px;
	padding: 3px; /* 0px */
  }

.s4_columnas{
	width: 20%;
	height: auto;
	margin: 0px; 
	padding: 1px; 
	display: inline-block;
}

.foto {      /* también usada en lavanderas.html IMPRESCINDIBLES.HTML */ 
	background-color: rgb(250, 248, 248);
	color: rgb(36, 33, 33);
	position: float;
	width:100%; 
	
	border-radius: 12px;
  }

.foto1 /* también se usa en lavanderas.html, itinerarios.html, en IMPRESCINDIBLES.HTML */
  {
	/* border-radius 1px menos que el borde-radius de .foto */
	border-radius: 11px 11px 0px 0px; 
	width: 100%; /* 100% */
   }

   
.foto3 {  /* usada en lavanderas*/ 
	  width: 100%; 
	 }

/* clase para mostrar los textos pie de foto de la galería */
.textoFotog {
	margin:auto;
	width: 100%;
	padding: 2%;
	font-size: 1em; /*1em*/
}

.textoFotog2 { /* usada en IMPRESCINDIBLES.HTML itinerarios.html, NATURALEZA.HTML */
	margin:2px;
	width: 100%;
	text-align: center;
	font-size: 1.2em; /*1.5em*/
	font-weight: bolder;
}

/* al pasar sobre la galeria de fotos de los puntos de interes */
.s4_columnas:hover {
	animation-name: anis4;
	animation-duration:1s;
	animation-direction: alternate;
	animation-iteration-count: 2;
}

/* inicio efecto sobre la galeria de fotos de puntos de interes de un itinerario */
@keyframes anis4 {
	0%{
		opacity: 100%;
	}
	50%{
		opacity: 60%;
	}

	100%{
		opacity: 40%;
	}
}

/*fin de las clases para mostrar la galeria de puntos de interés */

/********** FIN CLASES COMUNES A TODOS LOS ITINERARIOS ****/
/**********************************************************/

/* usada en NEVEROS.HTML */
.tablaRecortes{
	border:2px double #007A4B;
	width:100%;
	height:50%;
}

/* para la página indice */
.bloque_index {
	background-color: white; 
	text-align:center;
	width: 100%;
	-webkit-border-radius: 24px;
	-moz-border-radius: 24px;
	border-radius: 24px;
}	

.fila_index {
	width:100%;
	height:50%;
	margin: 0px;
	padding: 0px;
}

/* 2 columnas con datos */
.pi2_columnas{
	height: 100%;
	width:  48%;
	display: inline-block;
}

/* 3 columnas con datos */
.pi3_columnas{
		height: 50%;
		width: 24%;

		display: inline-block;
}  

/*____________ FIN clases comunes a los itinerarios */

/* inicio de las clases para IMPRESCINDIBLES.HTML, ACTIVIDADES.HTML, RECURSOS.HTML */
.bloque1 {
	text-align:center;
	width: 100%;
}

.fila1 {
	width:100%;
	height:10%;
	margin: 0px;
	padding: 0px; 
}

.s1_columnas{
	width: 40%;
	margin: 0px;
	padding-left: 2%;
	padding-right: 2%;
	padding-bottom: 0.5%;
	padding-top: 0.5%;
	display: inline-block; 
}
	 
/* fin de las clases para IMPRESCINDIBLES.HTML, ACTIVIDADES.HTML, RECURSOS.HTML */



/* estilo para la cabecera de la página: senderismo.hmtl */
.h1izquierda
{
	text-align: left;
    font-weight: bold;
	color:#003399;
	background-color: white;
	margin:0;
	width: 100%;
}

/* inicio clases aplicables a la pagina: index.html */

#xbloque1
{
	width:100%;
	height:1em;
	padding: 2%;
}

#xbloque {
	width:100%;
	height: 14em; 
	padding: 4%;
	margin-top: 5%;
	background-color:white;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
}

#xtextoizqda {
	width: 45%;
	padding: 2%;
	background-color: white;
	float: left;
}

#xfotodcha {
	width: 45%;
	padding: 2%;
	background-color: white;
	float: right; 
}

#xfotoizqda {
	width: 50%;
	height: 400px;
	background-color: white;
	float: left;
}

#xtextodcha {
	width: 50%;
	height: 400px;
	background-color: white;
	float: right;
}



/* clases para centrar texto sobre una foto */
/* contenedor, contenedor2 y centradoTexto sirven para centrar un texto sobre una foto */
.contenedor{
    position: relative;
    display: inline-block;
    text-align: center;
	width: 100%;
}

.contenedor2{
    position: relative;
    display: inline-block;
    text-align: center;
	width: 100%;
}

.centradoTexto{
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 2.5em; /*3em*/
	line-height: 1em;
    font-weight: bold;
    color: 	#002A00;
    transform: translate(-50%, -50%);
}

/* aplicable a Subseccion */
.centradoTextoSubseccion{
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 3em; 
	line-height: 1em;
    font-weight: bold;   
	color: #073d3d;
	text-shadow: 2px 2px 0 white, 4px 4px 0 white, 
	-13px 9px 0px rgba(206,0,0,0), -20px 9px 0px rgba(206,0,0,0),
	-27px 9px 0px rgba(206,0,0,0);
	transform: translate(-50%, -50%);
}

/* fin  clases aplicables a la pagina: inicio.html */ 


/* inicio clases aplicables al titulo: Monte Naranco*/
#site-title {
	font: 38px, 'Ubuntu', sans-serif; /*font en pt*/
	color: #007A4B;
}
/*fin de las clases aplicables al titulo: Monte Naranco */




/*inicio de las clases aplicables a la pagina: itinerarios.html */

.todos /* aplicable a todos los itinerarios */
{
 width: 100%;
}

.fila_2n {
	width:100%;
	height:5%;
	margin: 2%;
  }


/* inicio de las clases aplicables itinerarios.html  */
.s2_columnas{
	height: 2%; 
	width: 25%;
    margin-right: 2%; 
	margin-left: 5%; /* 2%*/
	display: inline-block;
	}

.foto22 {       
		background-color: rgb(250, 248, 248);
		color: rgb(36, 33, 33);
		position: float;
		width:100%;
		
		border-radius: 12px;
		padding: 5%; 
}

/*titulo de cada uno de los elementos de IMPRESCINDIBLES */
textoFotog2. { /* también usada en IMPRESCINDIBLES.HTML */

	text-align: center;
	font-weight: bolder;
}

/* fin de las clases aplicables a itinerarios.html */


/* fin de las clases aplicables a la pagina: itinerarios.html */
.xfotodcha:hover{
	animation-name: anis4;
	animation-duration:2s;
	animation-direction: alternate;
	animation-iteration-count: 2;
}


/* estilos aplicables a la pagina de: itinerarios.html */
.todosItinerarios {
	color:#007A4B;
	font-weight:bolder;
}

.texto2 /* aplicable al texto de las fotos de los itinerarios */
{	color: #2A5547; }



@media screen and (min-width:300px){

	.bloqueTitulo {font-size:  0.8em;}
	.bloqueNew {font-size:  0.8em;}
	.bloqueTitulo2 {font-size: 0.8em;}
	.bloqueTitulo3 {font-size: 0.8em;}
	.bloqueTitulo4 {font-size: 0.8em;}
	.bloqueTitulo5 {font-size: 0.8em;}
	.migaspan      {font-size: 0.7em;}
	.migaspan2      {font-size: 0.7em;}
	.migaspan3      {font-size: 0.7em;}
	.textoIndice   {font-size: 1.2em;}

	.subrayado2{
	font-size:xx-small;
	text-decoration: underline;
	font-weight:bolder;
	}  
	.letramediana {
	font-size: xx-small;
	font-weight:bolder;
	}
	
	div.situacion img.derecha {width: 40%; height: 30%;	}
	.pagina { padding-top: 0%;}
	.pagina3 {padding-top: 0%;}
	.titulo2 {font-size:0.8em;}
	.tituloNuevo1 {font-size:0.8em;}
	.textoFotog2 { font-size: 0.7em;}
	.textoG {font-size: 0.8em;};
	/* tabla MIDE */
	.mide{width:100%;} .tabla1{font-size:0.40em;}

	.titulo_animal{	font-size:1em;}
	/* enlace masmenos usado en restaurantes.html*/
    .masmenos{font-size:0.7em; }

    /*inicio clases usadas en index.html */
	/*clase usada para el titular de la página index */
	.textoGigante {font-size: 1.5em;}
    /*clase para la frase inicial y la introduccion */
	.textoG4 	{ 	font-size: 1.2em;	}
	/*clase para la cita de la frase inicial */
	.textocreditos {font-size: 1.2em;}
	.textoCita 	{font-size: 0.8em;	}
	/*fin de clases usadas en index.html */

	.textoExtraGrande 
    {    font-size: 0.8em; line-height: 1em;   }
	.centradoTextoSubseccion{	font-size: 1.5em; }
	.textoFotog {
		padding: 0%;
		font-size:0.5em;
		font-weight: bold;
	} 
	.texto2n {	font-size: 0.7em;}
	.centradoTexto{ /*texto sobrepuesto sobre las imagenes del index.html */
		font-size: 1.3em; /* tamaño de la letra */
	}
	.texto1 { /* aplicable al texto explicativo de las fotos del index.html */ 
	   font-size: 0.7em;
     }
	#xbloque {height: 23em;	}
    #xtextoizqda{ height: 23em;	}
	#xfotodcha{	height: 23em; } 
	
	.bloquelogo {
	padding-top: 5%;
}

}

@media screen and (min-width:400px){
	.bloqueTitulo  {font-size: 0.9em;}
	.bloqueNew  {font-size: 0.9em;}
	.bloqueTitulo2 {font-size: 0.9em;}
	.bloqueTitulo3 {font-size: 0.9em;}
	.bloqueTitulo4 {font-size: 0.9em;}
	.bloqueTitulo5 {font-size: 0.9em;}
	.migaspan      {font-size: 0.7em;}
	.migaspan2      {font-size: 0.7em;}
	.migaspan3      {font-size: 0.7em;}
	.textoIndice   {font-size: 1.2em;}
	
	.subrayado2{
		font-size:x-small;
		text-decoration: underline;
		font-weight:bolder;
		}  
	.letramediana {
		font-size: x-small;
		font-weight:bolder;
		}
	div.situacion img.derecha {width: 40%; height: 30%;	}
	.titulo2 {font-size:0.8em;}
	.tituloNuevo1 {font-size:0.8em;}
	.textoFotog2 { font-size: 0.7em;}
	.textoG {font-size: 1em;};

	/* tabla MIDE */
	.mide{width:100%;} .tabla1{font-size:0.60em;}

	.titulo_animal{font-size: 1em;}
	/* enlace masmenos usado en restaurantes.html*/
    .masmenos{font-size:0.8em; }

    /*inicio clases usadas en index.html */
	/*clase usada para el titular de la página index */
	.textoGigante 	{	font-size: 2em;	}
    /*clase para la frase inicial y la introduccion */
	.textoG4 	{font-size: 1.2em;}
	/*clase para la cita de la frase inicial */
	.textocreditos 	{font-size: 1.2em;}
	.textoCita 	{font-size: 0.8em;}
	/*fin de clases usadas en index.html */

	.textoExtraGrande    {  font-size: 0.8em;	line-height: 1em;  }
	.textoFotog {
		padding: 0%;
		font-size:0.5em;
		font-weight: bold;
	}
	.texto2n {	font-size: 0.5em; 	}
	.centradoTextoSubseccion{ font-size: 1.6em;  }
	.centradoTexto{ /*texto sobrepuesto sobre las imagenes del index.html */
		font-size: 0.8em; /* tamaño de la letra */
	}
	.texto1 { /* aplicable al texto explicativo de las fotos del index.html */ 
	   font-size: 0.6em;
     }
	#xbloque { height: 23em;}
    #xtextoizqda{  height: 23em;}
	#xfotodcha{	height: 23em;}

	.bloquelogo {
	padding-top: 5%;
	}
}



@media screen and (min-width:500px){
	.bloqueTitulo  {font-size: 1em;}
	.bloqueNew  {font-size: 1em;}
	.bloqueTitulo2 {font-size: 1em;}
	.bloqueTitulo3 {font-size: 1em;}
	.bloqueTitulo4 {font-size: 1em;}
	.bloqueTitulo5 {font-size: 1em;}
	.migaspan      {font-size: 0.7em;}
	.migaspan2      {font-size: 0.7em;}
	.migaspan3      {font-size: 0.7em;}
	.textoIndice   {font-size: 1.2em;}


	.subrayado2{
		font-size:x-small;
		text-decoration: underline;
		font-weight:bolder;
		}  
	.letramediana {
		font-size: x-small;
		font-weight:bolder;
		}
	div.situacion img.derecha {width: 40%; height: 30%;	}
	.textoFotog2 { font-size: 0.8em;}
	.titulo2 {font-size:1em;}
	.tituloNuevo1 {font-size:1em;}
	.titulo_animal{	font-size: 2em;	}

	/* tabla MIDE */
	.mide{width:50%;} .tabla1{font-size:0.8em;}

    /*inicio clases usadas en index.html */
	/*clase usada para el titular de la página index */
	.textoGigante 	{	font-size: 2.5em;	}
    /*clase para la frase inicial y la introduccion */
	.textoG4 	{ 	font-size: 1.2em;	}
	/*clase para la cita de la frase inicial */
	.textocreditos 	{font-size: 1.2em;}
	.textoCita 	{font-size: 0.8em;	}
	/*fin de clases usadas en index.html */

	.textoExtraGrande     {     font-size: 0.9em;	 line-height: 1em;    }
	.centradoTextoSubseccion {font-size:2em;    }
	.textoFotog {		padding: 0%;		font-size:0.7em;	}
	.texto2n {	font-size: 0.7em;}
	.centradoTexto{ /*texto sobrepuesto sobre las imagenes del index.html */
		font-size: 1.3em; /* tamaño de la letra */
	}
	.texto1 { /* aplicable al texto explicativo de las fotos del index.html */ 
	   font-size: 0.7em;
     }
	#xbloque {height: 23em;	}
    #xtextoizqda{ height: 23em;	}
	#xfotodcha{	height: 23em; }

	.bloquelogo {
	padding-top: 5%;
}	
	
}

	
@media screen and (min-width:600px){
	.bloqueTitulo  {font-size: 1.2em;}
	.bloqueNew  {font-size: 1.2em;}
	.bloqueTitulo2 {font-size: 1.2em;}
	.bloqueTitulo3 {font-size: 1.2em;}
	.bloqueTitulo4 {font-size: 1.2em;}
	.bloqueTitulo5 {font-size: 1.2em;}
	.migaspan      {font-size: 0.8em;}
	.migaspan2      {font-size: 0.8em;}
	.migaspan3      {font-size: 0.8em;}
	.textoIndice   {font-size: 1.2em;}


	.subrayado2{
		font-size:x-small;
		text-decoration: underline;
		font-weight:bolder;
		}  
	.letramediana {
		font-size: x-small;
		font-weight:bolder;
		}
	div.situacion img.derecha {width: 40%; height: 30%;	}
	.textoFotog2 { font-size: 0.8em;}
	.titulo2 {font-size:1em;}
	.tituloNuevo1 {font-size:1em;}
	.titulo_animal{	font-size: 2em;	}
	
	/* tabla MIDE */
	.mide{width:40%;} .tabla1{font-size:0.9em;}

    /*inicio clases usadas en index.html */
	/*clase usada para el titular de la página */
	.textoGigante 	{	font-size: 3em;	}
    /*clase para la frase inicial y la introduccion */
	.textoG4 	{ 	font-size: 1.2em;	}
	/*clase para la cita de la frase inicial */
	.textocreditos 	{font-size: 1.2em;}
	.textoCita 	{font-size: 0.8em;	}
  	/*fin de clases usadas en index.html */

	.textoExtraGrande   {   font-size: 0.9em;	 line-height: 1em;    }
	.textoFotog { padding: 0%;	font-size: 0.8em;	}
	.texto2n {font-size: 0.8em;	}
	.centradoTexto{ /*texto sobrepuesto sobre las imagenes del index.html */
		font-size: 1.4em; /* tamaño de la letra */
	}
	.texto1 { /* aplicable al texto explicativo de las fotos del index.html */ 
	   font-size: 0.6em;
     }
	#xbloque {		height: 17em;	}
    #xtextoizqda{   height: 17em;	}
	#xfotodcha{		height: 17em;	}
	.texto2n {	font-size: 0.7em;}
	
	.bloquelogo {
	padding-top: 5%;
}
	
}

@media screen and (min-width:700px){
	.bloqueTitulo {font-size: 1.2em;}
	.bloqueNew {font-size: 1.2em;}
	.bloqueTitulo2 {font-size: 1.2em;}
	.bloqueTitulo3 {font-size: 1.2em;}
	.bloqueTitulo4 {font-size: 1.2em;}
	.bloqueTitulo5 {font-size: 1.2em;}
	.migaspan      {font-size: 0.8em;}
	.migaspan2     {font-size: 0.8em;}
	.migaspan3     {font-size: 0.8em;}
	.textoIndice   {font-size: 1.2em;}


	.subrayado2{
		font-size:x-small;
		text-decoration: underline;
		font-weight:bolder;
		}  
	.letramediana {
		font-size: x-small;
		font-weight:bolder;
		}
	div.situacion img.derecha {width: 40%; height: 30%;  }
	.textoFotog2 { font-size: 1em;}
	.titulo2 {font-size:1.2em;}
	.tituloNuevo1 {font-size:1.2em;}
	.titulo_animal{	font-size: 2em;	}
	/* tabla MIDE */
	.mide{width:40%;} .tabla1{font-size:1em;}
 
	.textoG {font-size: 1.1em;}
	/*inicio clases usadas en index.html */
	/*clase usada para el titular de la página */
	.textoGigante 	{	font-size: 3em;	}
    /*clase para la frase inicial y la introduccion */
	.textoG4 	{ 	font-size: 1.2em;	}
	/*clase para la cita de la frase inicial */
	.textocreditos 	{font-size: 1.2em;}
	.textoCita 	{font-size: 1em;	}
	/*fin de clases usadas en index.html */
	.centradoTextoSubseccion {font-size: 2em;}
	.textoFotog {padding: 1%; font-size: 0.92em;}

	.textoExtraGrande     { font-size: 0.9em; line-height: 1em; }
	.texto2n {font-size: 0.85em;}
	.centradoTexto{ /*texto sobrepuesto sobre las imagenes del index.html */
		font-size: 1.5em; /* tamaño de la letra */
	}
	.texto1 { /* aplicable al texto explicativo de las fotos del index.html */ 
	   font-size: 0.9em;
     }
	#xbloque {		height: 18em;	}
    #xtextoizqda{    height: 18em;	}
	#xfotodcha{		height: 18em;	}
	.titulo3 { 	padding-top: 0px;	}
	
	.bloquelogo {
	padding-top: 5%;
	}
}

@media screen and (min-width:800px){ 
	.bloqueTitulo  {font-size: 1.3em;}
	.bloqueNew  {font-size: 1.3em;}
	.bloqueTitulo2 {font-size: 1.3em;}
	.bloqueTitulo3 {font-size: 1.3em;}
	.bloqueTitulo4 {font-size: 1.3em;}
	.bloqueTitulo5 {font-size: 1.3em;}
	.migaspan      {font-size: 0.8em;}
	.migaspan2     {font-size: 0.8em;}
	.migaspan3     {font-size: 0.8em;}
	.textoIndice   {font-size: 1.3em;}


	.subrayado2{
		font-size:small;
		text-decoration: underline;
		font-weight:bolder;
		}  
	.letramediana {
		font-size: small;
		font-weight:bolder;
		}
	div.situacion img.derecha {width: 40%; height: 30%;  }
	.textoG {font-size: 1.2em;}
	.textoFotog2 { font-size: 1.2em;}
	.titulo2 {font-size:1.4em;}
	.tituloNuevo1 {font-size:1.4em;}
	
	/* tabla MIDE */
	.mide{width:40%;} .tabla1{font-size:1.2em;}

	.titulo_animal{	font-size: 3em;	}
	/*inicio clases usadas en index.html */
	/*clase usada para el titular de la página */
	.textoGigante 	{	font-size: 3em;	}
    /*clase para la frase inicial y la introduccion */
	.textoG4 	{ 	font-size: 1.2em;	}
	/*clase para la cita de la frase inicial */
	.textocreditos 	{font-size: 1.2em;}
	.textoCita 	{font-size: 1em;	}
 	/*fin de clases usadas en index.html */

	.textoExtraGrande 
    {     font-size: 1em;	 line-height: 1em;    }
	h1{	font-size: 1.6em;	}
	.texto2n {font-size: 0.9em;	}
	.centradoTexto{ /*texto sobrepuesto sobre las imagenes del index.html */
		font-size: 1.5em; /* tamaño de la letra */
	}
	.texto1 { /* aplicable al texto explicativo de las fotos del index.html */ 
	   font-size: 0.9em;
     }
	#xbloque {		height: 20em;	}
    #xtextoizqda{    height: 20em;	}
	#xfotodcha{		height: 20em;	}
	.titulo3 { 		padding-top: 0px;	}
	
	.bloquelogo {
	padding-top: 5%;
	}
	
}


	
@media screen and (min-width: 900px)
{
	.bloqueTitulo  {font-size: 1.3em;}
	.bloqueNew  {font-size: 1.3em;}
	.bloqueTitulo2 {font-size: 1.3em;}
	.bloqueTitulo3 {font-size: 1.3em;}
	.bloqueTitulo4 {font-size: 1.3em;}
	.bloqueTitulo5 {font-size: 0.9em;}
	.migaspan      {font-size: 1.3em;}
	.migaspan2      {font-size: 1.3em;}
	.migaspan3      {font-size: 1.3em;}
	.textoIndice   {font-size: 1.3em;}


	.subrayado2{
		font-size:small;
		text-decoration: underline;
		font-weight:bolder;
		}  
	.letramediana {
		font-size: small;
		font-weight:bolder;
		}
	div.situacion img.derecha {width: 40%; height: 30%;  }
	.textoG {font-size: 1.2em;}
	.titulo2 {font-size:1.4em;}
	.tituloNuevo1 {font-size:1.4em;}
	.titulo_animal{ font-size:3em;}

	/* tabla MIDE */
	.mide{width:30%;} .tabla1{font-size:1.2em;}

	/*inicio clases usadas en index.html */
	/*clase usada para el titular de la página */
	.textoGigante 	{	font-size: 2em;	}
	/*clase para la frase inicial y la introduccion*/
	.textoG4 	{ font-size: 1em;	}
	/*clase para la cita de la frase inicial */
	.textocreditos 	{font-size: 1em;}
	.textoCita 	{font-size: 1.2em;	}
   /*fin de clases usadas en index.html */

	.textoExtraGrande  {font-size: 1.2em; line-height: 1em;}    
	.centradoTextoSubseccion{  font-size: 2em; 	}
	.centradoTexto{ /*texto sobrepuesto sobre las imagenes del index.html */
		font-size: 1.5em; /* tamaño de la letra */
	}
	.texto1 { /* aplicable al texto explicativo de las fotos del index.html */ 
	   font-size: 1em;
     }
	#xbloque {height: 18em;	}
    #xtextoizqda{ height: 18em;	}
	#xfotodcha{	height: 18em;}
	.texto2n {font-size: 0.9em;	}
	.titulo3 { 	padding-top: 1%;}

	.bloquelogo {
	padding-top: 11%;
	}
}	

@media screen and (min-width:1000px){ 
	.bloqueTitulo  {font-size: 1.4em;}
	.bloqueNew  {font-size: 1.4em;}
	.bloqueTitulo2 {font-size: 1.4em;}
	.bloqueTitulo3 {font-size: 1.4em;}
	.bloqueTitulo4 {font-size: 1.4em;}
	.bloqueTitulo5 {font-size: 1.4em;}
	.migaspan      {font-size: 1em;}
	.migaspan2     {font-size: 1em;}
	.migaspan3     {font-size: 1em;}
	.textoIndice   {font-size: 1.4em;}


	.subrayado2{
		font-size:small;
		text-decoration: underline;
		font-weight:bolder;
		}  
	.letramediana {
		font-size: small;
		font-weight:bolder;
		}
	div.situacion img.derecha {width: 30%; height: 15%;  }

	/* tabla MIDE */
	.mide{width:30%;} .tabla1{font-size:1.2em;}

	.textoG {font-size: 1.2em;}
	.titulo2 {font-size:1.4em;}
	.tituloNuevo1 {font-size:1.4em;}

	/*inicio clases usadas en index.html */
	
	/*clase usada para el titular de la página */
	.textoGigante 	{	font-size: 4em;	}
	/*clase para la frase inicial y la introduccion*/
	.textoG4 	{ font-size: 1em;	}
	/*clase para la cita de la frase inicial */
	.textocreditos 	{font-size: 1em;}
	.textoCita 	{font-size: 1.2em;	}
   /*fin de clases usadas en index.html */

    .centradoTextoSubseccion{	font-size: 2.5em; }
	.titulo_animal{	font-size: 3em;	}

	h1{	font-size: 1.6em;	}   
	.texto2n {	font-size: 1em;	}
	.titulo3 { 	padding-top: 3%; }
	.centradoTexto{ /*texto sobrepuesto sobre las imagenes del index.html */
		font-size: 1.5em; /* tamaño de la letra */
	}
	.texto1 { /* aplicable al texto explicativo de las fotos del index.html */ 
	   font-size: 1em;
     }
	#xbloque {height: 12em;	}
    #xtextoizqda{ height: 12em;	}
	#xfotodcha{ height: 12em;}

	.bloquelogo {
	padding-top: 11%;
	}	

}
	

@media screen and (min-width:1200px){ 
	.bloqueTitulo  {font-size: 1.5em;}
	.bloqueNew  {font-size: 1.5em;}
	.bloqueTitulo2 {font-size: 1.5em;}
	.bloqueTitulo3 {font-size: 1.5em;}
	.bloqueTitulo4 {font-size: 1.5em;}
	.bloqueTitulo5 {font-size: 1.5em;}
	.migaspan      {font-size: 1.2em;}
	.migaspan2     {font-size: 1.2em;}
	.migaspan3     {font-size: 1.2em;}
	.textoIndice   {font-size: 1.5em;}


	.subrayado2{
		font-size:small;
		text-decoration: underline;
		font-weight:bolder;
		}  
	.letramediana {
		font-size: small;
		font-weight:bolder;
		}
	div.situacion img.derecha {width: 30%; height: 15%;  }
	.textoG {font-size: 1.4em;}
	.titulo2 {font-size:1.6em;}
	.tituloNuevo1 {font-size:1.6em;}

	/* tabla MIDE */
	.mide{width:30%;} .tabla1{font-size:1.2em;}

   /*inicio clases usadas en index.html */
	/*clase usada para el titular de la página */

	.textoGigante 	{	font-size:4em;	}
	/*clase para la frase inicial y la introduccion*/
	.textoG4 	{ font-size: 1.5em;	}
	/*clase para la cita de la frase inicial */
	.textocreditos 	{font-size: 1.5em;}
	.textoCita 	{font-size: 1.2em;	}
   /*fin de clases usadas en index.html */
   .centradoTextoSubseccion{	font-size: 2.5em; }

	.titulo_animal{	font-size: 3em;	}

	 h1{	font-size: 1.6em;}
	.centradoTexto{ /*texto sobrepuesto sobre las imagenes del index.html */
		font-size: 2em; /* tamaño de la letra */
	}
	.texto1 { /* aplicable al texto explicativo de las fotos del index.html */ 
	   font-size: 1em; /* 1.1 em */
     }
	#xbloque {	height: 14em;}
    #xtextoizqda{  height: 14em;}
	#xfotodcha{	height: 14em;}
	
	.bloquelogo {
	padding-top: 11%;
	}
}

@media screen and (min-width:1400px){ 
	.bloqueTitulo  {font-size: 1.5em;}
	.bloqueNew  {font-size: 1.5em;}
	.bloqueTitulo2 {font-size: 1.5em;}
	.bloqueTitulo3 {font-size: 1.5em;}
	.bloqueTitulo4 {font-size: 1.5em;}
	.bloqueTitulo5 {font-size: 1.5em;}
	.migaspan      {font-size: 1.2em;}
	.migaspan2     {font-size: 1.2em;}
	.migaspan3     {font-size: 1.2em;}
	.textoIndice   {font-size: 1.5em;}


	.subrayado2{
		font-size:small;
		text-decoration: underline;
		font-weight:bolder;
		}  
	.letramediana {
		font-size: small;
		font-weight:bolder;
		}
	.textoG {font-size: 1.5em;}
	.titulo2 {font-size:1.8em;}
	.tituloNuevo1 {font-size:1.8em;}
	.titulo_animal{	font-size: 3em; }
	/* tabla MIDE */
	.mide{width:30%;} .tabla1{font-size:1.4em;}

    /*inicio clases usadas en index.html */
	/*clase usada para el titular de la página */
	.textoGigante 	{	font-size:4em;	}
	/*clase para la frase inicial y la introduccion*/
	.textoG4 	{ font-size: 1.5em;	}
	/*clase para la cita de la frase inicial */
	.textocreditos 	{font-size: 1.5em;}
	.textoCita 	{font-size: 1.2em;	}
   /*fin de clases usadas en index.html */
   .centradoTextoSubseccion{	font-size: 3em; }

	h1{
		font-size: 2em;
	}
	.centradoTexto{ /*texto sobrepuesto sobre las imagenes del index.html */
		font-size: 1.5em; /* tamaño de la letra */
	}
	.texto1 { /* aplicable al texto explicativo de las fotos del index.html */ 
	font-size: 1em;
	}
	#xbloque{ height:15em;}
	
	.bloquelogo {
	padding-top: 11%;
	}	
}


@media screen and (min-width:1600px){ 
	.bloqueTitulo  {font-size: 1.5em;}
	.bloqueNew  {font-size: 1.5em;}
	.bloqueTitulo2 {font-size: 1.5em;}
	.bloqueTitulo3 {font-size: 1.5em;}
	.bloqueTitulo4 {font-size: 1.5em;}
	.bloqueTitulo5 {font-size: 1.5em;}
	.migaspan      {font-size: 1.2em;}
	.migaspan2     {font-size: 1.2em;}
	.migaspan3     {font-size: 1.2em;}
	.textoIndice   {font-size: 1.5em;}


	.subrayado2{
		font-size:medium;
		text-decoration: underline;
		font-weight:bolder;
		}  
	.letramediana {
		font-size: medium;
		font-weight:bolder;
		}
	.textoG {font-size: 1.5em;}
	.titulo2 {font-size:1.8em;}
	.tituloNuevo1 {font-size:1.8em;}
	/* tabla MIDE */
	.mide{width:30%;} .tabla1{font-size:1.4em;}

	.titulo_animal{	font-size: 3em;}

	/*inicio clases usadas en index.html */
	/*clase usada para el titular de la página */
	.textoGigante 	{	font-size:4em;	}
	/*clase para la frase inicial y la introduccion*/
	.textoG4 	{ font-size: 1.5em;	}
	/*clase para la cita de la frase inicial */
	.textocreditos 	{font-size: 1.5em;}
	.textoCita 	{font-size: 1.2em;	}
   /*fin de clases usadas en index.html */
   .centradoTextoSubseccion{	font-size: 4em; }

	.centradoTexto{ /*texto sobrepuesto sobre las imagenes del index.html */
		font-size: 1.5em; /* tamaño de la letra */
	}
	.texto1 { /* aplicable al texto explicativo de las fotos del index.html */ 
	   font-size: 1em;
     }
	#xbloque {	height: 18em;}
    #xtextoizqda{  height: 12em;}
	#xfotodcha{	height: 12em;}	

	.bloquelogo {
	padding-top: 11%;
	}
	
}



