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

*{
    box-sizing: border-box;
}
img{
    display: block;/*por defecto las img no son block*/
    width: 100%;
    max-width: 100%;
}
body{
    font-family: 'open sans', sans-serif;background-color:#f2f5f7;    
    margin: 0;/*por defecto el navegador le da un margen al body, por eso se pone cero*/
    }
.main-container{
    margin: auto;
    padding: 0;
	padding: 0px 3px 0px 3px;
    width:100%;
	max-width: 900px;
	background-color:#fff;
}
h1,h2,h3,h4,h5,h6{
    letter-spacing: 1.5px;
}
.contenedor {
    width: 100%;
    margin: auto;
 
}
/****Estilos del header ****************/

.main-header{
    margin: auto;
    text-align: center;
}
header .contenedor{ 
    width: 100%;
    margin: auto;	
	max-width:auto;
    height: auto;
    background: #FCE016;    
}

.logo{
    width: 100%; 
    max-width: 100%;
    object-fit: cover;
    border: 4px solid #FCE016;
}

h3.nombre-etapa{
    width: 100%;
    margin-top: 2px;
    margin-bottom: 5px;
    padding: 2px;
    text-align: center;
    font-size: 0.9em;
    font-weight:400;
    background: #171796;
    color:#FCE016;
}
/********Estilos de ETAPAS**************/

div.etp-items{
   /*display: flex;
    flex-wrap: wrap;*/
    width: 100%;   
    margin: 0px 0px 5px 0px ;
   padding: 0px 0px 0px 0px;
       
}
ul.etapas{
    display: inline-flex;
    flex-wrap: wrap;
   margin: 0px 0px 0px 5px ;
   padding: 0px 0px 0px 0px;
    font-size: 0.8em;
   list-style-type: none;
    line-height: 1.4em;
}
ul.etapas li{
    margin:  0px 0px 0px 10px;
   padding: 0px 0px 0px 5px;
}
 a:link, a:visited, a:active {
	text-decoration: none;
}
 a.dia-link {
	color: blue; 
	text-decoration: underline;
}
a.dia-link:hover {
	color:#fff; 
	text-decoration: underline; 
	background-color: #219D3B;
}
a.linkw:hover {
	color: green; text-decoration: underline;position: relative;top: 2px;
}

/********Estilos de DESCARGA**************/

#descarga{
    margin: auto;
    padding: 1px 1px;width: 100%;   
}

.pico-datos{
    margin: auto;
	margin-bottom:5px;
	padding-bottom:3px;        
    display: flex;   
    flex-wrap: wrap;
    width: 100%;
	border-bottom:2px green solid;
}

.datos_columna50{
    width: 100%;
    padding-left: 5px;
}
.pico_columna50{
    width: 100%;
    margin-bottom: 5px;
}
.pico{
    width: 100%; 
    max-width: 100%;
    object-fit: cover;   
}
ul.lista-datos{
    font-size: 0.8em;
    padding-left: 5px;
    margin-left: 10px; 
    width: 100%; 
}
ul.lista-datos li{
    padding-right: 0px;
	padding-left: 0px;
	margin: 0px 0px 3px 0px;
    line-height: 1.2em;
	padding-top: 0px;
	}
li.wiki{
  padding-right: 0px;
	padding-left:0px;
	padding-bottom: 15px;
	margin: 0px 0px 5px 5px;
    line-height: 1.5em;
	padding-top: 0px;  
    background: none;
  
}

span.gmaps{
    font-weight: 700;
    color:#214dd7;
}
/****************Estilos seccion Mapa *****************/
.icon-location, .icon-location-1{	
	font-size: 1.5em;
	color: red;
}
p.mapa_txt{
    margin: 0;
    padding: 0;
    padding-bottom: 10px;
    font-size: 0.9em;
    font-weight:600;
    color:#214dd7;
}
.ampliar{
    font-size: 0.6em;
    font-weight:600;
    color:#214dd7;
}
.mapa{ 
    margin: auto;
    height: auto;
    text-align: left;   
    max-width: 555px;     
    padding-top: 0px;
    margin-top: 5px;
    margin-bottom: 10px;
}

.img1{
     width: 100%;max-width: 100%;
    height: auto;    
}
.buscar-gmaps{
font-size:1.5em; color:#214dd7;
	
/*font-weight:bold;*/	
}

/****************Estilos Seccion Fotos ******************/
p.txt{
     font-size: 0.8em;
        padding: 0;
        margin: 0;
    }  

article.lasfotos{
   background-color: #f2f5f7;
}
.conte-fotos{
  background-color:/*#f2f5f7;*/#333;
    z-index: 100;
}

p.parra-foto{
    width: 100%;
    margin: auto;
    margin:15px 0px 0px 0px;
    padding:1px 0px 6px 0px;
    height: auto;
    font-size: 0.8em;     
    line-height: 110%;
    background-color:white;        
    z-index: 1000;
}
.estilo-foto{
    margin-bottom: 5px;
    
}
.icon-down{
	font-size:1.2em;	
	line-height:0px;
	color:/*#219D3B;*/ red;
}
.icon-circle-down{
	font-size:1.2em;	
	line-height:0px;
	color:/*#219D3B;*/ red;
}
.icon-sync{
	font-size:1.2em;	
	line-height:0px;
	color:#000;

}
/*-----------------Estilos de footer-----------------*/

.footer {
  background: #333;
  color: #fff;
  padding: 10px;
  text-align: center; 
    margin-bottom: 5px;
	max-height: 70px;
}

.footer .social [class^="icon-"] {
  display: inline-block;
  color: #333;
  text-decoration: none;
  font-size:15px;
  padding: 5px;
  background: white;
  border-radius: 50%;
  width: 25px;
  height: 25px;
  line-height: 0px;
}
.contenedor_footer{
    width: 100%;
    height: auto;
  
}
.copy{
	padding-bottom: 10px;padding-top: 0px;font-size: 1em;
}
@media (min-width:480px){
    
   .pico-datos{
    	display: flex;   
    	justify-content:  space-between;
    	width: 100%;
}    
    ul.lista-datos{list-style: none;
        font-size: 0.8em;
        padding-left: 10px;
        margin-left: 0;margin-top: 0px;
        width: 100%;
    }
    ul.lista-datos li{
    	padding-right: 0px;margin-left: 0;
		padding-left: 0px;	    	
	}
 	.datos_columna50{
    	width: 45%;
     	padding-top: 23px;
}
	.pico_columna50{
    	width: 55%; 
   }
	img.pico{
		width: 100%;
		height: 100%;
    max-width: 100%;
    object-fit: cover;    	
		margin: 0;padding: 0;
	}
	
	
}
@media (min-width:768px){
    .main-container{
          margin: auto;
       max-width: 900px;
    } 
	h3.nombre-etapa{
    width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
    padding: 4px;
    text-align: center;
    font-size: 1.1em;
    font-weight:400;   
}
    .pico-datos{
        margin: auto;
    display: flex;   
    justify-content: center;
    width: 100%;
} 
    .pico_columna50{
    width: 50%;
    margin-bottom: 5px;
}
    .datos_columna50{
    width: 50%;
    padding-left: 10px;
}
	 ul.lista-datos{ 
		 list-style: disc;
        font-size: 0.9em;
        padding-left: 25px;
		 margin: 0px 0px 25px 0px;       
        width: 100%;
    }
}
@media (min-width:900px){
    .main-container{
          margin: auto;
       max-width: 900px;
    }
	h3.nombre-etapa{
    width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
    padding: 4px;
    text-align: center;
    font-size: 1.3em;
    font-weight:400;   
}
    .pico-datos{
        margin: auto;
    display: flex;   
    justify-content: center;
    width: 100%;
} 
    .pico_columna50{
    width: 50%;
    margin-bottom: 5px;
}
    .datos_columna50{
    width: 50%;
    padding-left: 10px;
}
	ul.etapas{
    font-size: 0.9em;
  
}
	 ul.lista-datos{ 
		 list-style: disc;
        font-size: 0.9em;
        padding-left: 25px;line-height: 2em;
       
    }
	ul.lista-datos li{
   
    line-height: 1.5em;
	padding-top: 0px;
	}
	p.txt{
     font-size: 0.9em;
        padding: 0;
        margin: 0;
    }  
	p.parra-foto{
    width: 100%;
    margin: auto;
    margin:15px 0px 0px 0px;
    padding:1px 0px 6px 0px;
    height: auto;
    font-size: 0.9em;     
    line-height: 110%;
    background-color:white;        
    z-index: 1000;
	}
}


