/* CSS Document */
*{ margin: 0; padding: 0; }
    html, body{
        width: 100%;
        height: 100%;
        z-index:1;
    }
    /*
    HAY QUE PONER ESTO EN UN IF*/
     #map
     {
      width:100%;
      height:90%;
      top:10%;
      z-index: 1;
     }


      #menutop_nuevo
      {
        position:absolute;
        top:0%;
        width:100%;
        height:75px;
        background-color: white;
        /*opacity:0.5;*/
        z-index:500;
      }
      .nav {  
        position:absolute;
        display: inline-block;
        top:25px;
        left:250px;
        list-style:none;
        margin:0;
        padding:0;
        min-width: 720px;
}




.nav ul {
  list-style: none;
  background-color: white;
  opacity:0.9;
  text-align: center;
  padding: 0;
  margin: 0;


    -moz-border-radius-bottomleft: 10px;
    -moz-border-radius-bottomright: 10px

    -webkit-border-bottom-left-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;

}



.nav li {
  font-family: 'Oswald', sans-serif;
  font-size: 1.2em;
  line-height: 40px;
  text-align: left;
  padding:2px;
  float:left;
}

/*fuente del menu superior (no activo)*/
.nav a {
  text-decoration: none;
  color: black;
  display: block;
  padding-left: 15px;
  border-bottom: 1px solid #888;
  transition: .3s background-color;
}

.nav a.resaltar:hover {
  background-color: #c0c0c0;
}

.subfuentes:hover {
  background-color: #c0c0c0;
}

.login:hover{
    background-color: #c0c0c0;
}

.nav a.active {
  background-color: #aaa;
  color: #444;
  cursor: default;
}

/* Sub Menus */
.nav li li {
  font-size: .8em;
}

/*******************************************
   Style menu for larger screens

   Using 650px (130px each * 5 items), but ems
   or other values could be used depending on other factors
********************************************/

@media screen and (min-width: 650px) {
  .nav li {
    width: 160px;
    border-bottom: none;
    height: 50px;
    line-height: 50px;
    font-size: 1.4em;
    display: inline-block;
    margin-right: -4px;
  }
    .nav li.normal {
    width: 160px;
    border-bottom: none;
    height: 50px;
    line-height: 50px;
    font-size: 1.4em;
    display: inline-block;
    margin-right: -4px;
  }
    .nav li.fuentes {
    width: 230px;
    border-bottom: none;
    height: 50px;
    line-height: 50px;
    font-size: 1.4em;
    display: inline-block;
    margin-right: -4px;
  }
      .nav li.subfuentes {
    width: 230px;
    /*
    border-bottom: none;
    height: 50px;
    line-height: 50px;
    font-size: 1.4em;
    display: inline-block;
    margin-right: -4px;*/
  }
  .nav li.publicar{
    background-color: orange;
  }


  .nav a {
    border-bottom: none;
  }

  .nav > ul > li {
    text-align: center;
  }

  .nav > ul > li > a {
    padding-left: 0;
  }

  /* Sub Menus */
  .nav li ul {
    position: absolute;
    display: none;
    width: inherit;
  }

  .nav li:hover ul {
    display: block;
  }

  .nav li ul li {
    display: block;
  }
}



.tablafuente_izquierda
{
  width:65%;
  
  border-right: 1px solid black;
}
.tablafuente_centro
{
  width:18%;
  text-align: center;
    border-right: 1px solid black;
    cursor: pointer;
}
.tablafuente_derecha{
  width:18%;


}
#tabla_titulo_subfuentes
{
  font-size: .8em;
  border-bottom: 5px solid black;
  /*background-color: rgb(87,218,247);*/
}
#tabla_pon_tu_mapa
{
  font-size: .8em;
  border-top: 5px solid black;
  width: 100%;
  /*background-color: rgb(87,218,247);*/
}















#logotipo_superior
{
  
  height: 100%;
  width: auto;
background-size: auto 100%;
background-repeat: no-repeat;
background-position: 15px;

  background-image: url('../logo_small.png');
}
    
#menu
{
    position:absolute;
    right:0px;
    top:50px;
    /*z-index:-1*/
    width: 200px; 
    border: 1px solid #333333;
    text-align: center;
    padding: 5px;
    background-color:black;
    opacity: 0.7;
}
#flechas
{
    position:absolute;
    color:black;
    left:20px;
    bottom:20px;
    border-style:inset;
    border-width:5px;
    border-color:black;   
    z-index:998;
    background-color:rgba(250,250,250,0.9);
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -moz-border-radius-bottomleft: 10px;
    -moz-border-radius-bottomright: 10px
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;


}
    
#list
{
    text-align:left;
}
    
#creditos
{
    position:absolute;
    bottom:0px;
    left: 40%;
    z-index:10;
    width: 200px; 
    border: 1px solid #333333;
    text-align: center;
    padding: 5px;
    color: orange;
    background-color:black;
    opacity: 0.7;
}
        
#usc
{
    position:absolute;
    bottom:0px;
    right: 0px;
    z-index:-1
    width: 200px;
    border: 1px solid #333333;
    text-align: center;
    padding: 5px;
    color: orange;
    background-color:black;
}

#logotipo
{
    position:absolute;
    border-style:inset;
    border-width:5px;
    border-color:black;              
    top:25px;
    width: 320px;
    right: 10px;

    
     
    /*border: 1px solid #333333;*/
    text-align: center;
    padding: 5px;
    /*background-color:rgba(51,51,51,0.6);sacado para el mapa.es*/
    background-color:rgba(250,250,250,0.9);
    color:#FFFFFF;z-index:2;
    -moz-border-radius-topleft: 10px;/*estaba a 10*/
    -moz-border-radius-topright: 10px;
     -moz-border-radius-bottomleft: 10px;
     -moz-border-radius-bottomright: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
     
    /*opacity:0.9*/
}
    
#buscar
{
      position:absolute;
      bottom:0px;
      right: 0px;
      z-index:3;
      width: 200px; 
      border: 1px solid #333333;
      text-align: center;
      padding: 5px;
      background-color:#333333;
      color:#FFFFFF
}
    
     
#dia-noche
{
      position:absolute;
      top:0px;
      left: 0px;
      z-index:4;
      width: 250px; 
      border: 1px solid #333333;
      text-align: center;
      padding: 5px;
      background-color:black;
      color:orange;
      font: Homenaje;
        
}
    
#page-wrap 
{
      position: absolute;
      top:0px;
      left:0px; 
      width: 300px;  
      padding: 20px; 
      background: black; -moz-box-shadow: 0 0 20px black; -webkit-box-shadow: 0 0 20px black; box-shadow: 0 0 20px black;
}
    

		
#carga
{
      cursor:pointer;
      background-repeat:no-repeat;
      border-radius:10px;
      -moz-border-radius:10px;
      -webkit-border-radius:10px;
      box-shadow:inset black 0px 0px 14px;
      ;background-image:url(../cargando.gif);
      background-position:center;
      background-size:100%;
      background-color:white;
      width:300px;
      color:black;
      text-align:center;
      height:100px;
      padding:52px 12px 12px 12px;
      position:fixed;
      top:30%;
      left:40%;
      z-index:6;
}
    
input[type="text"] 
{
	background:transparent;
	width:75%;
	border:1px outset;
	color:white;
}
  
select 
{	
	 background:#333333;
	 width:75%;
	 border:1px dotted;
	 color:white;
	 border:1px outset;
}


#facebook
{
    position:absolute;
    border-style:inset;
    border-width:5px;
    border-color: black;
    bottom:25px;
    left: 13px;
    z-index:14;
    width: 270px; 
    background-color:rgba(250,250,250,0.9);
    color:black;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -moz-border-radius-bottomleft: 10px;
    -moz-border-radius-bottomright: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
    
    opacity:0.9
}

#switch_dia_noche
{
    position:absolute;
    border-style:inset;
    border-width:5px;
    border-color:black;
    bottom:30px;
    right: 10px;
    width:400px;
    background-color:rgba(250,250,250,0.9);
    z-index:11;
    
 
    
    color:#FFFFFF;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -moz-border-radius-bottomleft: 10px;
    -moz-border-radius-bottomright: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
    
    
}
#abrir_lateral
{
    position:absolute;

    bottom:45%;
    right: 0px;
        background-color:rgba(250,250,250,0.9);
    z-index:11;
    

    
    
}
#abrir_filtro
{
    position:absolute;
    bottom:45%;
    left: 0px;
    background-color:rgba(250,250,250,0.9);
    z-index:11;
    

    
    
}
img.switch
{
  border:1px black;
  border-style: inset;
  background-color: #333333;
  -moz-border-radius-topleft: 100%;
  -moz-border-radius-topright: 100%;
  -moz-border-radius-bottomleft: 100%;
  -moz-border-radius-bottomright: 100%;
  -webkit-border-top-left-radius: 100%;
  -webkit-border-top-right-radius: 100%;
  -webkit-border-bottom-left-radius: 100%;
  -webkit-border-bottom-right-radius: 100%;
}
    
#div_recientes
{
    width:300px;
    border-style:dashed;
    border-width:3px;
    position:absolute;
    top:100px;
    right: 25px;
    z-index:12;
    /*width: 200px;*/ 
    border: 1px solid #333333;
    text-align: center;
    padding: 5px;
    background-color:#333333;
    color:#FFFFFF;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -moz-border-radius-bottomleft: 10px;
    -moz-border-radius-bottomright:10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
    
    opacity:0.9
}  

#popid{-moz-border-radius: 10px;border-radius: 10px;background-color:black;}

.popid{-moz-border-radius: 10px;border-radius: 10px;background-color:black;}

p { font: 15px/2 Fredoka One; }

p.infowindow{font: 20px Homenaje; text-align: justify; color:rgb(102,204,153);}

td.descn {background-color:#223c5a;}
    
td.infon{background-color:#0f0e0b;}
		
td.td_tabla_ultimas a{font: 20px Oswald; color:white;}

#tabla_ultimas_publicaciones{border-spacing: 5px 20px; }
#tabla_ultimas_publicaciones tr{display: table;            /* this makes borders/margins work */
        /*border: 10px outset white;*/
        border-bottom: 2px solid white;
        width: 90%;
        margin: 5px;}
#tabla_ultimas_publicaciones tr:hover{background-color: green;}




td.centro{text-align:center;width:25%;}
td.centro:hover{background-color: green;    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -moz-border-radius-bottomleft: 10px;
    -moz-border-radius-bottomright: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
  }
  .filtrar:hover{cursor:pointer;}

		
#n { font: 15px/2 Oswald;  color:white; text-align:centre;}
   
#tituloleyenda {font: 40px Fredoka One; color:white; } 
		
#mio h2{font: 30px Shadows Into Light; color:red;}
h2.ultimas{font: 20px Shadows Into Light; color:red;}
h2.login{font: 20px  Shadows Into Light; color:black;}
h3.ultimas{font: 20px Shadows Into Light; color:red;}
h3.texto_infobox{font: 20px Shadows Into Light; color:black;}
#prueba
{
    position:absolute;
    border-style:inset;
    border-width:5px;
    border-color:black;
    top:175px;
    left: 10px;
    
    z-index:13;
         opacity:0.9;
    /*background-color:rgba(255,255,255,0.7);*/
    color:#000000;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -moz-border-radius-bottomleft: 10px;
    -moz-border-radius-bottomright: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
    }

 
.contenedor_tab{
  float:left;
  clear:both;
  width:400px;
  padding:0px;
  margin:0 auto;
  
  display:block;
   background-color:rgba(250,250,250,0.9);
   
  border:1px solid #333;-moz-border-radius:0 0 7px 7px;-webkit-border-radius:0 0 7pc 7px;border-radius: 0 0 7px 7px;}
  
  
ul.tabs
{
  float:left;
  margin:0;
  padding:0;
  list-style:none;
  height:32px;
  width:400px;
  margin-top:-7px;
}

ul.tabs li
{
  float:left;
  margin:0;
  padding:0;
  height:31px;
  line-height:31px;
  border:1px solid #333;
  margin-bottom:-1px;
  background:#333;
  overflow:hidden;
  position:relative;
  border:1px solid #333;
  -moz-border-radius:7px 7px 0 0;
  -webkit-border-radius:7px 7px 0 0;
  border-radius: 7px 7px 0 0;
}

ul.tabs li a
{
  text-decoration:none;
  color:#fff;
  display:block;
  font-size:13px;
  padding:0 20px;
  border:1px solid #fff;
  outline:none;-moz-border-radius:7px 7px 0 0;
  -webkit-border-radius:7px 7px 0 0;
  border-radius: 7px 7px 0 0;
  }
  
  
ul.tabs li a:hover{background:#666;}
ul.tabs li.activa,ul.tabs li.activa a,ul.tabs li.activa a:hover 
{
  color:#333;
  font-weight:bold;
  background:white;
  border-bottom:1px solid #ccc;
}
.contenido_tab
{
  padding-top:10px;
  padding-bottom: 10px;

  font-size:1.2em;
  width:99%;
}

.contenido_tab img
{
  /*margin:0 20px 20px 0;*/
  border:2px solid black;
  border-style: inset;
  background-color:#333333;
  padding:5px;
      -moz-border-radius-topleft: 100%;/*antes 10px*/
    -moz-border-radius-topright: 100%;
    -moz-border-radius-bottomleft: 100%;
    -moz-border-radius-bottomright: 100%;
    -webkit-border-top-left-radius: 100%;
    -webkit-border-top-right-radius: 100%;
    -webkit-border-bottom-left-radius: 100%;
    -webkit-border-bottom-right-radius: 100%;
  
  }
 
  .infobox
{
  
  /*background-color:rgba(51,51,51,0.9);*/
  background-color:rgba(250,250,250,0.9);
  width: 300px ;
  padding:10px 10px 10px 10px;
  border-style:inset;
    border-width:3px;
    border-color:white;  
                 
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -moz-border-radius-bottomleft: 10px;
    -moz-border-radius-bottomright: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
    opacity:0.9;


}
  .infoboxv
{
  
  /*background-color:rgba(51,51,51,0.9);*/
  background-color:rgba(250,250,250,0.9);
  width: 500 ;
  padding:10px 10px 10px 10px;
  border-style:inset;
    border-width:3px;
    border-color:white;  
                 
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    -moz-border-radius-bottomleft: 10px;
    -moz-border-radius-bottomright: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
    opacity:0.9;


}
#flecha
{
  visibility: visible;
  top:-15px
}

#tabla_leyenda
{
  width:100%;
  font-family: 'Oswald', sans-serif;

}
#tabla_usuarios
{
  padding-left: 10px;
}
#tabla_mapas_sonoros
{
  border: 1px solid #333333;
  padding-left: 10px;
  width:90%;
}
h2.lista_de_mapas
{
  color:black;
  font: 15px Fredoka One;
  text-transform: capitalize;
}
#filtro
{
    position:absolute;
    border-style:inset;
    border-width:5px;
    border-color:black;              
    bottom:150px;
    left: 10px;
    width: 150px;


    
     
    /*border: 1px solid #333333;*/
    text-align: center;
    padding: 5px;
    /*background-color:rgba(51,51,51,0.6);sacado para el mapa.es*/
    background-color:rgba(250,250,250,0.9);
    color:#FFFFFF;z-index:2;
    -moz-border-radius-topleft: 10px;/*estaba a 10*/
    -moz-border-radius-topright: 10px;
     -moz-border-radius-bottomleft: 10px;
     -moz-border-radius-bottomright: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
     
    /*opacity:0.9*/
}
.avatar
{
  height: 32px;
  width: 32px;
  -moz-border-radius-topleft: 50%;
  -moz-border-radius-topright: 50%;
  -moz-border-radius-bottomleft: 50%;
  -moz-border-radius-bottomright: 50%;
  -webkit-border-top-left-radius: 50%;
  -webkit-border-top-right-radius: 50%;
  -webkit-border-bottom-left-radius: 50%;
  -webkit-border-bottom-right-radius: 50%;  
  /*background-color:blue;*/
}