/* 
Estilos_cuerpo css
Para las paginas que llama la pagina de portada 
Ver 2.0 Noviembre 2016
Ver 2.1 Marzo 2017
Vidal Lasa 
Esto es el curpo vacio de contenio: la cabecera con el menu y el pie de pagina;
*/
:root {
  --c_fondo_pag: #FFFFFF;
  --c_fondo_contacto_2: #000000;
  --bg_contacto_ini: #9ABB95;
  --bg_contacto_fin: #58A153;
}

html {
  width:100%; 
  height:100%;
}
/*
___________________________________________________________________________________________________________
Marzo 18                                                                body (aqui dentro va todo lo demás)
Si le añades margenes a lo que contiene (header, footer, etc) amplían el tamaño del body 
*/
body
{
  height: 99.8%; 
  min-height: 99.8%;
  width: 100%;
  min-width: 100%;
  margin: 0px;
  padding: 0px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 100%;
  overflow: hidden;
}
/*
______________________________________________________________________________________________________________________________________
                                                                                                                      menu
El menu tiene muchas chorradas: 
1.- ul tiene por defecto margin y padding, sino lo quitas de entrada te volverá loco
2.- defines width y height al 100%, asi se coloca "encima" del contenedor que le has puesto
3.- Pones un contenedor para llevar al centro el menu. Dado que tiene una imagen, ésta va de por libre respecto al las opciones de menu que se ven en letras
*/

#menu {
  display:inline-block;
  width:99.2%;
  margin: 0.1% 0.4% 0.1% 0.4%;
  padding:0;

  text-align: center; 

  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  -webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.5);
  box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.5);
  background: #7D7E7D; 
  background: -webkit-gradient(linear, 0 0, 0 bottom, from(#7D7D7D), to(#0E0E0E));
  background: -webkit-linear-gradient(#7D7D7D, #0E0E0E);
  background: -moz-linear-gradient(#7D7D7D, #0E0E0E);
  background: -ms-linear-gradient(#7D7D7D, #0E0E0E);
  background: -o-linear-gradient(#7D7D7D, #0E0E0E);
  background: linear-gradient(#7D7D7D, #0E0E0E);
  -pie-background: linear-gradient(#7D7D7D, #0E0E0E);
  
}
#menu li {
  margin:10px;
  display: inline-block;
  list-style:none;
}

#menu a {
  font-size:18px;
  font-weight:400;
  color: #FFFFFF; 
  text-decoration:none;
  display:block;
  padding:8px 10px;
}

#menu li a:hover {
  color: #FFFFFF;

  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;   
  border-radius: 8px;
  -webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.5);   
  box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.5);
  background: #0E0E0E;
  background: -webkit-gradient(linear, 0 0, 0 bottom, from(#0E0E0E),to(#7D7E7D));
  background: -webkit-linear-gradient(#0E0E0E, #7D7E7D);
  background: -moz-linear-gradient(#0E0E0E, #7D7E7D);   
  background: -ms-linear-gradient(#0E0E0E, #7D7E7D);    
  background: -o-linear-gradient(#0E0E0E, #7D7E7D);     
  background: linear-gradient(#0E0E0E, #7D7E7D);        
  -pie-background: linear-gradient(#0E0E0E, #7D7E7D);                                       
}
#menu li:first-child a {
  height: 100%;
  color: transparent;
  background:  url(../images/comun/logo_trans.png) center center no-repeat;
  background-size: contain; /*al 45% como en el hover tambien queda bien */
}
#menu li:first-child a:hover {
  color: transparent;
  background: url(../images/comun/logo_trans.png) center center no-repeat, #0E0E0E; 
  background: url(../images/comun/logo_trans.png) center center no-repeat, -moz-linear-gradient(top, #0E0E0E 0%, #7D7E7D 100%); 
  background: url(../images/comun/logo_trans.png) center center no-repeat, -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0E0E0E), color-stop(100%,#7D7E7D)); 
  background: url(../images/comun/logo_trans.png) center center no-repeat, -webkit-linear-gradient(top, #0E0E0E 0%,#7D7E7D 100%); 
  background: url(../images/comun/logo_trans.png) center center no-repeat, -o-linear-gradient(top, #0E0E0E 0%,#7D7E7D 100%); 
  background: url(../images/comun/logo_trans.png) center center no-repeat, -ms-linear-gradient(top, #0E0E0E 0%,#7D7E7D 100%); 
  background: url(../images/comun/logo_trans.png) center center no-repeat, linear-gradient(to bottom, #0E0E0E 0%,#7D7E7D 100%); 
  filter: url(../images/comun/logo_trans.png) center center no-repeat, progid:DXImageTransform.Microsoft.gradient( startColorstr=#0E0E0E, endColorstr=#7D7E7D,GradientType=0 ); 
  background-size: 45%;
  
  border-radius:9px; 
  -moz-border-radius:9px;
  -webkit-border-radius:9px;
}
#menu a:active, #menu a:focus {
  border:0px;
  color: #FFFFFF;
  outline:0; 
}
/*
______________________________________________________________________________________________________________
                                                                      la parte de enmedio de la hoja
Debe tener la altura del documento menos la del menu si quieres que quede todo fijo y bien       
Ojo a la altura del menu, que si cambias los tamaños de letra, margenes y paddings ya no será el 10%                                                               
*/
.section_fija {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 10%;
  overflow: hidden;
  z-index: 10;
}
.section_movil {
  position: relative;
  width:99.2%;
  margin: 0.1% 0.4% 0.1% 0.4%;
  height: 100%;
  z-index: 10;
  overflow: scroll;
}
/*___________________________________________________________________________________________________________
                                                                                                pie de pagina
*/
footer {
  color: #FFFFFF; 
  text-align: center;
  
  line-height: 1.5;
  padding-bottom: 4px;
  
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;   
  border-radius: 8px;
  -webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.5);   
  box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.5);
  background: #959595;
  background: -webkit-gradient(linear, 0 0, 0 bottom, from(#959595),to(#0D0D0D));
  background: -webkit-linear-gradient(#959595, #0D0D0D);
  background: -moz-linear-gradient(#959595, #0D0D0D);   
  background: -ms-linear-gradient(#959595, #0D0D0D);    
  background: -o-linear-gradient(#959595, #0D0D0D);     
  background: linear-gradient(#959595, #0D0D0D);        
  -pie-background: linear-gradient(#959595, #0D0D0D);   
  
  z-index: 50;
}
footer a {
  color: #FFFFFF;
}
.footer_fijo {
  position: fixed;
  bottom: 0;
  width:99.2%;
  margin: 0.1% 0.4% 0.1% 0.4%;
}
.footer_movil {
  position: relative;
  float: left;
  width:100%;
  height: 8%;
  margin-bottom:4%;
}
/*
__________________________________________________________________________________________________________________
                                                                            Para las especiales
*/
/*========= La primera fila de cabecera =========================*/
.cab_fila1 { 
  width:100%;
  height:80px; 

  /*borde: */
  /*border: 1px solid #696;*/
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  /*Sombra*/
  -webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.5);
  box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.5);
  /*fondo */
  background: #00a551;
  background: -webkit-gradient(linear, 0 0, 0 bottom, from(#00a551), to(#066334));
  background: -webkit-linear-gradient(#00a551, #066334);
  background: -moz-linear-gradient(#00a551, #066334);
  background: -ms-linear-gradient(#00a551, #066334);
  background: -o-linear-gradient(#00a551, #066334);
  background: linear-gradient(#00a551, #066334);
  -pie-background: linear-gradient(#00a551, #066334);

  overflow:hidden;
  
  /*Para que funcione el z-index debe tener una position */ 
  position:relative; /*absolute;*/
  /*z-index:1;*/
}
.cab_naparlinex {

  width: 90%;
  height: 90%;
  margin: 0.3% 0 0 0.5%;
  position: absolute;
  /*z-index:1;*/
  
  background: url(../images/logo_transparente.png) no-repeat;
  background-size: contain;
  
}
.cab_info {
  float: right;
  height: 100%; 
  margin: 2.5% 5% 0 0;
  font-size:19px;
  
  /*position:absolute;*/
  /*z-index:2;*/
}
