@charset "utf-8";
/* CSS Document */

@import url("http://fonts.googleapis.com/css?family=Open+Sans");
@import url("http://fonts.googleapis.com/css?family=Open+Sans:700");
@import url("http://fonts.googleapis.com/css?family=Open+Sans:400italic");

/*index*/
@charset "utf-8";
/* CSS Document */

@import url("http://fonts.googleapis.com/css?family=Open+Sans");
@import url("http://fonts.googleapis.com/css?family=Open+Sans:700");
@import url("http://fonts.googleapis.com/css?family=Open+Sans:400italic");

/*index*/



/*fondos*/
body{
	font: normal 14px/20px 'Open Sans', sans-serif;
	color: #000;
 background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color: #fff;
}

/*Imagen de fondo */
.fondo_inicio{
  background-image: url(../img/fondos/001_portadas.jpg);
}

#descarga{display:block; width:200px; clear:both; font-weight: 700; background-color: #008149; padding:20px; text-align: center;-webkit-border-radius: 10px;
border-radius: 10px;color:#FFF;}


/*generales*/
#contenido{
	overflow: hidden;
	margin: 0 auto;
	padding-bottom: 30px;
	width: 952px;
	min-height: 502px;
	_height: auto;
  position: relative;
  /*background-color: #FFF;*/
}
ul li{list-style-type:none;}

img{
 border:0;
}

.limpia{
float:none;
display:block;
clear:both;
}
	
  h1{margin-top: 55px; width:300px; float:left; }
  
h1.inicio{ visibility: hidden;}
  
  #idiomas{
 		position: absolute;
    right: 0;
    top: 0;
  }
  
  	#idiomas li{
   		float: left;   
      margin-left: 6px;
    }
    
    	#idiomas li a{
        background: url(../img/fondo-idiomas.png) no-repeat bottom right;
        padding: 4px 8px;
        display: block;
        color: #000;
        text-transform: uppercase;
        font-size: 10px;
        font-weight: bold;
        font-family: 'Open Sans', sans-serif;
        line-height: 15px;
        text-decoration: none;
      }
      
      	#idiomas li a:hover,
        #idiomas li.activo a{
         background: url(../img/fondo-idiomas-activo.png) no-repeat bottom right;
          color: #FFF;
        }

/* NAV UTIL */
		
		#navutilities{ background: url(../img/header.png) no-repeat top right;-webkit-border-radius: 10px 10px 0 0;
border-radius: 10px 10px 0 0;
    height: 50px;
			margin-right: 0;
      margin-top: 110px;
			text-transform: uppercase;
			overflow: hidden;
      width: 200px;
      float: right;
		}	
		
			#navutilities ul{
				float: left;margin-left: 28px;margin-top: 15px;
			}
			
				#navutilities ul li {
					float: left;
					margin-right: 12px; 
					padding: 0;
				}
				
					#navutilities ul li a{
						padding: 0;
						text-decoration: none;
						overflow: hidden;
						display: block;
            width: 31px;
            height: 31px;
						text-indent: -1000px;
					}
					
         #nav_mapa-web a{background: url(../img/nav_mapa-web.png) no-repeat 0 0;}
          
          #nav_pdf a{background: url(../img/nav_pdf.png) no-repeat 0 0;}

          #nav_salir a{background: url(../img/nav_salir.png) no-repeat 0 0;}
          
        /*  #nav_print a{background: url("images/nav_print.png") no-repeat 0 0;}*/
          
					#navutilities ul li a:hover{
						opacity: .6;
          }
			#navutilities ul li img:hover{
						opacity: .6;
          }
			
						
/*menu*/
.menu {
    position: relative; clear:both;
}
.menu nav {
    display: block;
    background: #008149;
    overflow: hidden;
    height: 77px;
	-webkit-border-radius: 10px 0 0 0;
border-radius: 10px 0 0 0;
}
.menu nav > a {
    float: left;
    color: #fff;
    padding: 2em;
    border-right: 1px solid #fff;
    transition: background .2s;
    display: block;
}
.menu nav > a:hover {
    background: rgba(255,255,255,0.4);
}
.menu nav > a.ultima { border-right:none;
}
/*botón*/
.menu .drop {
    color: #fff;
    padding: 2em;
    background: rgba(255,255,255,0.5);
    cursor: pointer;
    display: none; /*ocultamos el botón*/
}
.menu .drop svg {
    fill: #000;
    vertical-align: middle;
}

/*TEXTOS*/


#textos{padding:30px; min-height:500px; background-color: #FFF; }

#iz{}
#drch{}
#logo-ayto{}






@media only screen and (max-width: 768px) {
    .menu {background: rgba(255,255,255,1);}
    .menu .drop {display: inline-block;}/*volvemos a mostrar el botón*/
    .menu nav {/*ahora nuestro menú es una lista flotante*/
        position: absolute;
        z-index: 600;
        background: #fff;
        min-width: 20rem;
        display: none;
        top: 100%;left: 0;
    }
    .menu nav > a {/*y los ítems se alinean verticalmente*/
        float: none;
        border: 0 none;
    }
		#contenido{
	overflow: hidden;
	margin: 0 auto;
	padding-bottom: 30px;
	width: 95%;
	height: auto;
  position: relative;
  /*background-color: #FFF;*/
}
	#navutilities{ 
    height: 50px;
			margin-right: 0;
      margin-top: 10px;
			text-transform: uppercase;
			overflow: hidden;
      width: 200px;
      float: right;
		}	
	 h1{margin-top: 10px; width:300px; float:left; }
}
/*if => open*/
.menu nav.open {
    display: block;/*el menu aparece*/
    background: #008149;
    height: auto;
}
.menu .drop.open {
    background: rgba(255,255,255,0.65);/*el boton cambia de color*/
}









  
h1.inicio{ visibility: hidden;}
  
 
/*TEXTOS*/


#textos{padding:30px; min-height:500px; }


#textos.inicio{background: #fff;}

#textos.inicio h2 {
    float: left;
    font-size: 47px;
    line-height: 52px;
    width: 450px;
    border-bottom: 0;
	margin-bottom: 50px;
  color: #008149;
}
#textos.inicio img {float:right;}
#textos.inicio a.programa{clear:both; display: block; width: 240px; border:2px solid #CCC; padding:20px; background-color: #FFF; margin-top:140px; text-align: center; }
#textos.inicio a.programa img{padding-left: 10px; padding-top: 10px; float: none; }



@media only screen and (max-width: 768px) {
   
#textos.inicio img {float:none; width:100%;}
#textos.inicio a.programa{clear:both; display: block; width: 220px; border:2px solid #CCC; padding:20px; background-color: #FFF; margin-top:30px; text-align: center; }
#textos.inicio a.programa img{padding: 10px; float: none; width:36px;}
}