﻿/*MENÚ HORIZONTAL CON DESPLEGABLE*/

#cssmenu {
  width: auto;
  padding: 0;
  display: block;
  position: relative;
  font-family: 'Archivo Narrow', sans-serif;
  font-size:1.3333em;
  z-index:100;
  float:right;
  padding: 8px 0px;
  margin-top:20px;
}
#cssmenu ul {list-style: none; margin: 0; padding: 0; display: block;}
#cssmenu ul:after,
#cssmenu:after {
  content: " ";
  display: block;
  font-size: 0;
  height: 0;
  clear: both;
  visibility: hidden;
}
#cssmenu ul li {margin-right: 2px; padding: 0px; display: block; position: relative; }

#cssmenu ul li a {
  text-decoration: none;
  display: block;
  margin: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

#cssmenu ul li a.active{color: #00386b;}/*añadido*/
/*#cssmenu ul li a:hover{ background:#000}*/

#cssmenu ul li ul {position: absolute; left: -9999px; top: auto;}/*submenú*/
#cssmenu ul li ul li { max-height: 0; position: absolute; background: #f4f4f4; box-shadow: 0 6px 12px rgba(0, 0, 0, .175);}/*submenú*/
#cssmenu ul li ul li:first-child{margin-top:8px}/*separación del submenú*/


#cssmenu ul li ul li.has-sub:after {
  display: block;
  position: absolute;
  content: "\003e";
  color:#a1a1a1;
  z-index: 1;
  top: 11px;
  right: 15px;
}
#cssmenu.align-right ul li ul li.has-sub:after {right: auto; left: 15px;}
#cssmenu ul li ul li.has-sub:before {
  display: block;
  position: absolute;
  content: "";
  z-index: 2;
}
#cssmenu.align-right ul li ul li.has-sub:before {right: auto; left: 15px; border-left-color: transparent; border-right-color: #a1a1a1;}

/*submenú*/

#cssmenu ul li ul li a {
  font-size:1em; /*0.9285em*/
  text-transform: none;
  color: #828282;
  letter-spacing: 0;
  display: block;
  width: 220px;
  padding:11px 15px;
}

#cssmenu ul li ul li {border-bottom:1px solid rgba(0,0,0,0.14);}
#cssmenu ul li ul li:last-child{border-bottom:0px solid #3b3b3b;}

#cssmenu ul li ul li:hover > a,
/*#cssmenu ul li ul li.active > a {color: #ffffff; background:#282828}*/

#cssmenu ul li ul li.active {color: #222; /*background:#000;*/ }/*naranja*/
#cssmenu ul li ul li.active a {color: #222; /*background:#000*/}/*naranja*/

#cssmenu ul li ul li:hover:after, #cssmenu ul li ul li.active:after {background: none;}
#cssmenu ul li ul li:hover > ul {left: 100%; top: 0;}
#cssmenu ul li ul li:hover > ul > li {max-height: 72px; position: relative;}
#cssmenu > ul > li {float: left;}

#cssmenu > ul > li:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 0;
  top: 0;
  z-index: 0;
  background: #494e55;
}


/*catego*/

#cssmenu ul li {color: #a1a1a1; padding:5px; margin-right:8px; letter-spacing: 1px; z-index: 2; position: relative;}/*8*/
#cssmenu ul li a{color:#a1a1a1; padding-bottom:7px}
#cssmenu ul li:last-child{padding-right:0px;}

#cssmenu > ul > li:hover > a {color: #00386b; background:inherit;}
#cssmenu > ul > li.active > a {color: #00386b; position:relative; border-bottom:2px solid #00386b}


#cssmenu > ul > li.has-sub.active {color: #a1a1a1; background:none;}


#cssmenu > ul > li.has-sub > a{background: none}
#cssmenu > ul > li.has-sub > a:hover{background: none}
#cssmenu > ul > li.has-sub > a.active {background: #006b7b; color: #a1a1a1;}


#cssmenu > ul > li:hover > ul {left: 0;}
#cssmenu > ul > li:hover > ul > li {max-height: 72px; position: relative;}

#cssmenu #menu-button {display: none;}
#cssmenu > ul > li > a {display: block;}
#cssmenu > ul > li {width: auto;}
#cssmenu > ul > li > ul {width: 200px; display: block;}
#cssmenu > ul > li > ul > li {width: 200px; display: block;}

@media (min-width:1200px) {
	#cssmenu ul li {padding:5px; margin-right:35px;}
	#cssmenu ul li:last-child{margin-right:0px;}
		
	#cssmenu > ul > li.has-sub > a, #cssmenu > ul > li.has-sub > a:focus {background: url('../images/minitri.png') no-repeat 94% 22px;}
	#cssmenu > ul > li.has-sub > a:hover, #cssmenu > ul > li.active.has-sub > a {background: url('../images/minitri_hover.png') no-repeat 94% 22px;}
}

@media (min-width:1400px) {
	#cssmenu ul li {padding:5px; margin-right:45px;}
	#cssmenu ul li:last-child{margin-right:0px;}
	
	#cssmenu > ul > li.has-sub > a, #cssmenu > ul > li.has-sub > a:focus {background: url('../images/minitri.png') no-repeat 97% 22px;}
	#cssmenu > ul > li.has-sub > a:hover, #cssmenu > ul > li.active.has-sub > a {background: url('../images/minitri_hover.png') no-repeat 97% 22px;}
}

/*@media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {*/

@media (max-width: 992px) {
  
  
  #cssmenu{background: #d7d7d7; float:none; margin:0 auto; position:relative; margin-top:0px; padding:0px;
  	/*position:absolute; top:1px; left:0; margin:0 auto; width:100%; z-index:1;*/  position:relative; z-index:2
  }
  /*#cssmenu ul li:first-child{margin-top:15px;}*/
  
  #cssmenu ul{
	position:absolute; z-index:-1; top:47px; left:0px;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
  }/*añadido por mi para que despliegue sobre contenido*/
  
  #cssmenu > ul > li > a {color: #4b4b4b; font-size:1em; padding:0px; border-top:0px;background:#f8f8f8;}
  #cssmenu > ul > li > a:hover {background: #a1a1a1;}
  #cssmenu ul li:last-child{padding-bottom: 0px;}
  
 
  
  #cssmenu > ul {max-height: 0; overflow: hidden;}
  #cssmenu > ul > li > ul {width: 100%; display: block; }

   
  #cssmenu ul li > a:hover {color: #4b4b4b;background:#efefef}
  
  #cssmenu > ul > li.active > a {color: #00386b; border-top:0px}
  #cssmenu > ul > li.active > a:hover {color: #00386b;}
  
  #cssmenu > ul > li.active > a {border-bottom:0px solid #00386b}

  
  #cssmenu.align-right ul li a {text-align: left;}
  #cssmenu > ul > li > ul > li {width: 100%; display: block;}
  #cssmenu.align-right ul ul li a {text-align: left;}
  #cssmenu > ul > li > ul > li > a {width: 100%; display: block; font-size:0.8571em}
  #cssmenu ul li ul li a {width: 100%;}
  #cssmenu.align-center > ul {text-align: left;}
  #cssmenu.align-center > ul > li {display: block;}
  #cssmenu > ul.open {max-height: 2000px; /*border-top: 1px solid rgba(110, 110, 110, 0.25);*/background:#f8f8f8;}
  #cssmenu ul {width: 100%;}
  #cssmenu ul > li {float: none; width: 100%; border:none; border-top: 1px solid rgba(110, 110, 110, 0.15); z-index:2;}
  #cssmenu ul > li:first-child {border-top: 0px solid rgba(110, 110, 110, 0.15);}
  #cssmenu ul li a {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; padding: 12px 10px; }  
  #cssmenu ul > li:after {display: none;}

  #cssmenu ul li.has-sub > a:after,
  #cssmenu ul li.has-sub > a:before,
  #cssmenu ul li ul li.has-sub:after,
  #cssmenu ul li ul li.has-sub:before {display: none;}
 
 
  #cssmenu > ul > li.has-sub.active {color: #f42736; background:none;}

 
  #cssmenu ul li ul,
  #cssmenu ul li ul li ul,
  #cssmenu ul li ul li:hover > ul,
  #cssmenu.align-right ul li ul,
  #cssmenu.align-right ul li ul li ul,
  #cssmenu.align-right ul li ul li:hover > ul {left: 0; position: relative; right: auto; border:none; box-shadow: none;}
  
  /*submenú*/
  #cssmenu ul li ul li,
  #cssmenu ul li:hover > ul > li {max-height: 999px; position: relative; background: none; box-shadow: none; border:none;}
  #cssmenu ul li ul li a {padding: 8px 10px 8px 10px; color: #828282;}
  #cssmenu ul li ul ul li a {padding: 8px 20px 8px 50px;}
  
  #cssmenu ul li ul li:hover > a {color: #00386b;}/*naranja*/
  #cssmenu > ul > li:hover > a {color: #00386b;}/*naranja*/
  
  #cssmenu ul li ul li a { font-size:1em;}
    
  #cssmenu > ul > li.fonver > a{display:none; visibility:hidden;}

	#cssmenu #menu-button {
	  display: block;
	  padding: 12px 0px;
	  cursor: pointer;
	  font-size: 1em;
	  text-decoration: none;
	  color: #dddddd;
	  font-weight:bold;
	  text-transform: uppercase;
	  background: #01366a;
	  
	}
	#cssmenu #menu-button:after {
	  content: "";
	  position: absolute;
	  right: 20px;
	  top: 15px;
	  display: block;
	  -webkit-box-sizing: content-box;
	  -moz-box-sizing: content-box;
	  box-sizing: content-box;
	  border-top: 4px solid #dddddd;
	  border-bottom: 4px solid #dddddd;
	  width: 28px;
	  height: 4px;
	}
	#cssmenu #menu-button.menu-opened:after {
	  border-top: 4px solid #dddddd;
	  border-bottom: 4px solid #dddddd;
	}
	#cssmenu #menu-button:before {
	  content: "";
	  position: absolute;
	  right: 20px;
	  top: 31px;
	  display: block;
	  width: 28px;
	  height: 4px;
	  background: #dddddd;
	}
	#cssmenu #menu-button.menu-opened:before {background: #dddddd;}
}
