﻿
/*=========================
      MENÚ HORIZONTAL
=========================*/

.fondo-menu{background-color:#055c9d; color:white; margin-top:15px;height:50px;}

nav {font-family:'Open Sans', sans-serif; color: #fff; font-size:1em; line-height:20px; padding:0px}

nav ul {list-style: none; text-align: center; float:left; margin-left:150px}
nav ul li {display: inline-block; margin-right:15px;}
nav ul li:last-child {margin-right:0px;}

nav ul li a {display: block; padding: 0px 2px; text-decoration: none; color: #fff; text-transform: uppercase;  height: 20px;}
/*nav ul li a, nav ul li a:after, nav ul li a:before {transition: all .2s;}*/
nav ul li a:hover, nav ul li a:focus {color: #8bdcff;transition: all .2s;}

nav ul li a.active {color: #8bdcff;}


/*@media (min-width:1200px) {
	nav ul li a {display: block; padding: 0px 20px;}	
}

@media (min-width:1400px) {
	nav ul li a {display: block; padding: 0px 20px;}
}*/


/*Nav menú categorías*/

.menu-categorias{position:absolute; top:0; left:15px; width: 160px;}

.navbar-toggles {position: relative; height: 50px; line-height: 50px; padding-right: 5px; padding-left: 5px; color: #fff; text-align: center; background:#0281c4; border-radius:0px;}
.navbar-toggles:hover > div, .navbar-toggles.active > div{background: #0281c4; color: #8bdcff!important;}

.navbar-toggles div {font-family:'Open Sans', sans-serif; color: #fff; font-size:1em; letter-spacing: 1px; text-transform: uppercase; display:inline;}
.navbar-toggles .before {display: inline-block; margin-right: 0px; margin-bottom:2px}
.navbar-toggles .before span {height: 1px; background-color: #fff; content: ''; width: 15px; display: block;}
.navbar-toggles .before span:nth-child(1) {width: 15px;}
.navbar-toggles .before span:nth-child(2) {width: 15px; margin: 3px 0;}

.navbar-toggles:hover > .before span, .navbar-toggles.active > .before span{background-color: #8bdcff !important;}

@media only screen and (min-width:1200px) and (max-width :1980px){
	nav ul li a { margin-right:30px;}/*nuevo*/
}


@media (min-width: 1024px) {
	nav ul li a {padding: 0px 10px;}/*nuevo*/
}


@media (max-width: 991px) {
	.menu-categorias{left:15px; width: 170px;}
}

/*=========================
       MENÚ VERTICAL
=========================*/

.header-menu{padding:10px 5px 10px 5px;position:relative; /*background:#dfe9f3; background-image: linear-gradient(to bottom, #dfe9f3 30%, #ffffff 100%);*/ background-color:#055c9d;}
.header-menu img{max-width:120px}

.sidenav > .content{width:280px;}

.verticalmenu,
.verticalmenu ul,
.verticalmenu ul li,
.verticalmenu ul li a {margin: 0; padding: 0; border: 0; list-style: none; font-family:'Open Sans',Arial, Helvetica, sans-serif; display: block; font-size:0.9575em; font-weight:400; /*max-width:250px;tamaño zona sidenav*/ position: relative; line-height:130%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}

.verticalmenu ul:first-child{border-top:1px solid rgba(0,0,0,0.1);}

.verticalmenu {width: 100%;  color: #444e57; border:0px; background-color:#f2f2f2;/**/}
.verticalmenu ul ul {display: none;}
.verticalmenu > ul > li.active > ul {display: block;}


.verticalmenu > ul > li > a {padding: 10px; cursor: pointer; z-index: 2; text-decoration: none; color: #444e57; background: #f2f2f2;/**/ -webkit-transition: color .2s ease; -o-transition: color .2s ease; transition: color .2s ease;}
.verticalmenu > ul > li > a:hover {color: #055c9d; }
.verticalmenu ul li.active > a {color:#055c9d;}

.verticalmenu ul li.has-sub.open > a {padding-bottom: 0px;}

/*.verticalmenu ul > li.has-sub > a:after {
	position: absolute; right: 20px; top: 22px; z-index: 5; display: block; height: 8px; width: 1px; background: none; content: "";
	-webkit-transition: all 0.1s ease-out; -moz-transition: all 0.1s ease-out; -ms-transition: all 0.1s ease-out; -o-transition: all 0.1s ease-out; transition: all 0.1s ease-out;
	-moz-transform: rotate(-135deg); -o-transform: rotate(-135deg); -webkit-transform: rotate(-135deg); transform: rotate(-135deg);  
}
.verticalmenu ul > li.has-sub > a:before {
	position: absolute; right: 15px; top: 26px; display: block; width: 8px; height: 1px; background: none; content: "";
	-webkit-transition: all 0.1s ease-out; -moz-transition: all 0.1s ease-out; -ms-transition: all 0.1s ease-out; -o-transition: all 0.1s ease-out; transition: all 0.1s ease-out;  
	-moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);
}*/

.verticalmenu ul > li.has-sub.open > a:after,
.verticalmenu ul > li.has-sub.open > a:before {-webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg);}

/*.verticalmenu ul li.has-sub{text-transform:uppercase;}
.verticalmenu ul li.has-sub ul{text-transform:none;}*/

.verticalmenu ul ul > li.has-sub > a:after {right: 13px; top: 23px; background: #dddddd;}
.verticalmenu ul ul > li.has-sub > a:before {top: 26px; background: #dddddd;}

.verticalmenu ul li {border-bottom:1px solid rgba(0,0,0,0.1); padding-left:5px; padding-right:5px}
.verticalmenu ul li:last-child {border-bottom:0px solid #d8d8d8;}


/*submenu */
.verticalmenu ul ul li a {padding: 5px 15px; cursor: pointer; z-index: 2; font-size: 1.035em; text-decoration: none; color: #444e57; background-color: #f2f2f2;/*color fondo submenu*/ -webkit-transition: color .2s ease; -o-transition: color .2s ease; transition: color .2s ease; }
.verticalmenu ul ul ul li a {padding-left: 5px;border:0px solid #ccc;}
.verticalmenu ul ul li a:hover {color: #055c9d;}
.verticalmenu ul ul li a:last-child{border-top:0px solid #ccc;}

.verticalmenu ul ul ul li.active a {color:#055c9d;}
.verticalmenu ul ul li ul li a:first-child, .verticalmenu ul ul li ul li:first-child a:hover, .verticalmenu ul ul li ul li.active a:first-child{padding-top:0px;}

.verticalmenu ul ul li {border-bottom: 0px solid rgba(0,0,0,0.1);}/*elimina la linea separación submenú*/
.verticalmenu ul ul li:first-child{padding-top:10px;}
.verticalmenu ul ul li:last-child{padding-bottom:10px;}

/*primera profundidad*/
.verticalmenu ul li {font-size:1em;}

/*segunda profundidad*/
.verticalmenu ul li ul li{font-size:0.875em; padding-left:3px}
.verticalmenu ul li ul li a:before{content:"\203A"; padding-right:3px; padding-left:0px; font-size:1.2em; font-weight:lighter; color:#055c9d;}
.verticalmenu ul li ul li.active, .verticalmenu ul li ul li.active a{color:#055c9d;}
.verticalmenu ul li ul li.active a:hover{color:#055c9d;}

/*tercera produndidad*/
.verticalmenu ul li ul li ul li {border:0px; font-size:0.875em; padding-left:13px;}
.verticalmenu ul li ul li ul li a::before{content:"\203A"; padding-right:3px; padding-left:0px; font-size:1em; font-weight:lighter; color:#ccc;}
.verticalmenu ul li ul li ul li.active a,.verticalmenu ul li ul li ul li.active a:hover, .verticalmenu ul li ul li ul li.active a:focus, .verticalmenu ul li ul li ul li.active a::before{color:#055c9d;}


/*ESCRITORIO*/
.menu-escritorio.verticalmenu, .menu-escritorio.verticalmenu ul, .menu-escritorio.verticalmenu ul li, .menu-escritorio.verticalmenu ul li a{background:transparent; font-size:1em}
.menu-escritorio.verticalmenu ul li ul li{font-size:0.9575em;}

.borde-colder-big{border-left:1px solid rgba(0,0,0,0.16);}

@media only screen and (min-width :1px) and (max-width :1600px){
  .borde-colder-big{border:none; padding-top:20px;}
}

@media only screen and (min-width :1px) and (max-width :1200px){
  .zona-500max2{width:100%; max-width:500px; margin:0 auto;}
}

.zona-500max{
  width:100%; max-width:500px; margin:0 auto;
}
