@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;
	font-size: 0.9em; line-height: 1.8em;
}


a{ text-decoration: none;}
a:hover{text-decoration: none; /* border-bottom: 1px solid #666;*/}
strong{font-weight: 700;font-size: 1em;}
p{margin-bottom: 1.2em;}



/*Imagen de fondo */
.fondo_inicio{
  background-image: url(../img/fondos/Ciudadela.jpg);
}
.fondo_organizacion	{background-image: url(../img/fondos/autobuses.jpg);}
.fondo_memoria	{background-image: url(../img/fondos/Burgo-san-cernin.jpg);}
.fondo_balance	{background-image: url(../img/fondos/yamaguchi.JPG);}

.cuadro{width: 100%; }

/*generales*/
#contenido{
	overflow: hidden;
	margin: 0 auto;
	width: 902px;
	min-height: 500px;
	_height: auto;
  position: relative;
  /*background-color: #FFF;*/
}

#iz{width:140px; float:left; min-height: 500px;}
#drch{width:680px; float:right;padding-left: 20px;border-left: 1px solid #999;}
#logo-ayto{
    position: absolute;
    bottom: 40px;
    left: 0px;
	
}

#iz #submenu{margin-right: 0; padding-right: 0;width:140px;}


#iz a{ text-decoration: none; display:block;padding-bottom: 1em;}
#iz a:hover{text-decoration: none; padding-bottom: 1em; border-bottom: 1px solid #666; color:#D30205;font-weight: 700;}
#iz a.estoy{text-decoration: none; padding-bottom: 1em; border-bottom: 1px solid #666; color:#D30205;font-weight: 700;}
 

ul li{list-style-type:none;}
#contenido #drch ul li {
    background: url(../img/guion.png) no-repeat 0 9px;
    padding-left: 16px;
    padding-bottom: 3px;
}
#contenido #drch ul{margin-bottom: 20px;}

#submenu ul {
    padding-left: 0px;
}
#submenu ul li {
  /*   margin-top: 10px;
   margin-right: 10px;*/
}


#submenu ul ul {
    background-color: #E3E4E5;
    /*margin-top: 8px;*/
    padding-bottom: 6px;
    padding-left: 6px;
    padding-top: 5px;
	padding-right: 0;
	margin-bottom: 10px;
	/*-webkit-border-radius: 10px 0 0 10px;
border-radius: 10px 0 0 10px;*/

}
#submenu ul li.current > ul > li.current {
    background-color: #FFF;
	-webkit-border-radius: 10px 0 0 10px;
border-radius: 10px 0 0 10px;

}
#submenu ul ul li {
    margin-top: 0;
    margin-right: 0;
    padding-bottom: 0;
}
#submenu ul li a {
    font: bold 0.9em/1.5em 'Open Sans', sans-serif;
    text-decoration: none;
    color: #000;
    display: block;
    border-bottom: 2px solid #FFF;
    padding-bottom: 4px;
}
#submenu ul li a:hover {
    font: bold 0.9em/1.5em 'Open Sans', sans-serif;
    text-decoration: none;
    display: block;
    border-bottom: 2px solid #FFF;
    padding-bottom: 4px;
	background-color:whitesmoke;
}
#submenu ul li.current a {
    color: #CC3300;
    border-bottom: 2px solid #CC3300;
}
#submenu ul li ul li.current > a {
    font-weight: bold;
}
#submenu ul li.current > ul > li > a {
    color: #000;
    border-bottom: 0;
    font-weight: normal;
    padding: 5px 8px;
    /* border: 1px solid #E3E4E5; */
    /* border-right: 0; */
}
#submenu ul li.current > ul > li.current {
    background-color: #FFF;
    border-color: #ccc;
}

img{
 border:0;
}

.limpia{
float:none;
display:block;
clear:both;
}
	
  h1{margin-top: 55px; width:300px; float:left; }
h1 a:hover{border-bottom: 0px solid #FFF;}
h2{color:#000; font-size: 1.5em;padding: 0 0 1em 0; border-bottom: 2px solid #CCC;margin-bottom:1.2em; }
h3{font-variant:small-caps; margin: 20px 0; font-size: 1.1em; font-weight:bold;}
h4{font-weight:700; }

#drch table {
    width: 100%;
    margin-bottom: 30px;
    font: normal 12px/14px 'Open Sans', sans-serif;
    border-right: 1px solid #CCC;
    border-top: 1px solid #CCC;
    height: auto !important;
    border-spacing: 0;
    border-collapse: collapse;
}
tbody {
    display: table-row-group;
    vertical-align: middle;
    border-color: inherit;
}
table th{   padding: 6px 8px;
    background-color: #F5F5F5;
    border-bottom: 1px solid #CC3300;
    border-left: 1px solid #CCC;
    border-top: 1px solid #CCC;
    color: #333;
    font-weight: bold;
	text-align: left;
}
 table td {
    padding: 6px 8px;
    border-bottom: 1px solid #CCC;
    border-left: 1px solid #CCC;
}
p + strong {display: block; margin-top:20px; background-color: aqua; }
  
  #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; border-bottom: 0px solid #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: 140px;
			text-transform: uppercase;
			overflow: hidden;
      width: 170px;
      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_print a{background: url("images/nav_print.png") no-repeat 0 0;}*/
          
					#navutilities ul li a:hover{
						opacity: .6;border-bottom: 0px solid #FFF;
          }
			#navutilities ul li img:hover{
						opacity: .6;
          }
			
						
/*menu*/
.menu {
    position: relative; clear:both;
}
.menu nav {
    display: block;
    background: rgba(255,255,255,1);
    overflow: hidden;
	-webkit-border-radius: 10px 0 0 0;
border-radius: 10px 0 0 0;
}
.menu nav > a {
    float: left;
    color: #000;
    padding: 2em;
    border-right: 1px solid rgba(0, 0, 0, 0.35);
	border-bottom: 1px solid rgba(0, 0, 0, 0.35);
    transition: background .2s;
    display: block;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+74,000000+74,000000+74,7f7f7f+100&0+74,0.2+100 */
background: -moz-linear-gradient(top, rgba(0,0,0,0) 74%, rgba(127,127,127,0.2) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 74%,rgba(127,127,127,0.2) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(0,0,0,0) 74%,rgba(127,127,127,0.2) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#337f7f7f',GradientType=0 ); /* IE6-9 */

}

.menu nav > a:hover {
   color:#D30205;
	border-bottom: 1px solid rgba(0, 0, 0, 0);
	background:rgba(240,240,240,1); 
}
.menu nav > a.estoy {
    color:#D30205;font-weight: 700;
	border-bottom: 1px solid rgba(0, 0, 0, 0);
	background:rgba(255,255,255,1); 
}
.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;
}
#submenu ul li a.area{ color: #CC3300;
    border-bottom: 2px solid #CC3300;}
/*TEXTOS*/


#textos{padding:30px; min-height:500px; background-color: #FFF; }
#main {
				margin: 0 auto;
				padding: 30px;
				width: 844px;
				background-color: #FFF;
			}








@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: 170px;
      float: right;
		}	
	 h1{margin-top: 10px; width:300px; float:left; }
	
	#iz{width:95%; float:none; min-height: 20px;}
#drch{width:95%; float:none;padding-left: 20px;border-left: 1px solid #999;}
#logo-ayto{
    position: absolute;
    bottom: 40px;
    left: 0px;
	
}
	#main {
    width: 90%;
    margin: 0 auto;
    padding: 10px;
    /* width: 844px; */
    background-color: #FFF;
}
}
/*if => open*/
.menu nav.open {
    display: block;/*el menu aparece*/
}
.menu .drop.open {
    background: rgba(255,255,255,0.65);/*el boton cambia de color*/
}




