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

body, ul, li,a {
	margin: 0;
	padding: 0;
}
.menu{
	text-align: center;
	background-color: #5D80B4;
	background-position: 44;
}
.menu a{
	display: block;
	text-decoration: none;
	color: #fff;
	border: 1px solid #1d2531;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 100;
	font-size: 16px;
	padding-top: 7px;
	padding-bottom: 7px;
}
.menu li{
 position: relative;
}
.menu li ul{
 display: block;
 background: #09F;
 max-height: 0;
 overflow: hidden;
 transition: all 0.3s ease;
}
.menu li ul
{
list-style-type: none;
}
nav{
 transition: max-height 0.3s;
 overflow: hidden;
}
.menu-btn{
	text-align: center;
	cursor: s-resize;
	background: #FB9D0A;
	font-size: 16px;
}
.menu-btn img{
	vertical-align: middle;
	height: 30px;
}
#section2 .container #navegacion .menu li a {
	background-color: #5D80B4;
}
#section2 .container #navegacion .menu li a:hover {
	background-color: #09F;
}
.menu-open,
.menu .open > ul{
 max-height: 2000px;
}
.menu .open > .more img{
 transform: rotate(-90deg);
}
.more img{
 height: 30px;
 transition: transform 0.3s;
}
.more{
 background: #5D80B4;
 float: right;
 min-width: 10%;
 cursor: move;
 margin-top:2px;
 margin-right:5px;
}
nav{
	max-height:30px;
	transition: max-height 0.3s;
	overflow: hidden;
	margin-bottom:25px;
 	margin-top:25px;
}

#indent{
 margin-left: -25px;
}

@media (min-width: 660px) {

#indent{
 margin-right: 0px;
}		

nav{
 max-height: 100%;
 overflow: visible;
 max-width: 720px;
 margin-right: auto;
 margin-left: auto;
 margin-bottom:35px;
 margin-top:25px;
}

.menu{
 background-color: #061C3E;
}
#navegacion .menu{
 background-color: #FFF;
}

.menu-btn{
 display: none;
}
.more img{
 display: none;
}

.menu a{
	background: #5D80B4;
	padding: 5px 5px;
}
.menu a:hover{
 background-color: #09F;
}
.menu > li{
 display: inline-block;
 margin: 0 2px;
}
.menu li ul{
 left: -9999px;
 position:absolute;
 overflow: visible;
 -webkit-transition: all 0.01s ease;
 z-index: 1000;
}
.menu > li > ul ul{
 top: 0;
}
.menu li:hover > ul{
 left:100%; 
}
.menu > li:hover > ul{
 left: 0;
}
.menu .open > ul{
 left:100%; 
}
.menu > li.open > ul{
 left: 0;
}
.menu-btn{
	text-align: center;
}
}