/* Dssktop menu */
#menu {
	display: block;
	font-size: 0.8em;
	padding: 25px 20px;
	position: relative;
	z-index: 1000;
}
#menu a {
	color: #063;
	text-decoration: none;
}
#menu .active a {
	color: #003;
	text-decoration: none;
	 text-shadow: none;

}
#menu a:hover {
	color: #000;
}
#menu li {
	display: inline-block;
	letter-spacing: 0.05rem;
	padding: 0 6px;
	text-transform: uppercase; 
}


/* Mobile menu */
@media (max-width: 1024px) {
 body {
 perspective: none;
 transform-style: inherit;
}
 .button_menu {
 cursor: pointer;
 position: fixed;
 height: 26px;
 right: 4%;
 top: 20px;
 width: 30px;
 -webkit-transition: opacity .25s ease;
 transition: opacity .25s ease;
 z-index: 2000;
}
.button_menu:hover {
 opacity: .7;
}
.button_menu.active .top {
 -webkit-transform: translateY(10px) translateX(0) rotate(45deg);
 transform: translateY(10px) translateX(0) rotate(45deg);
 background: #fff;
}
.button_menu.active .middle {
 background: #fff;
 opacity: 0;
}
.button_menu.active .bottom {
 background: #fff;
 -webkit-transform: translateY(-10px) translateX(0) rotate(-45deg);
 transform: translateY(-10px) translateX(0) rotate(-45deg);
}
.button_menu span {
 background: #079b05;
 border: none;
 cursor: pointer;
 height: 5px;
 width: 100%;
 left: 0;
 position: absolute;
 top: 0px;
 -webkit-transition: all .35s ease;
 transition: all .35s ease;
}
.button_menu span:nth-of-type(2) {
 top: 10px;
}
.button_menu span:nth-of-type(3) {
 top: 20px;
}
#menu {
height: 100%;
 left: 0;
 opacity: 1;
 position: fixed;
 visibility: hidden;
 top: 0;
 -webkit-transition: opacity .35s, visibility .35s, width .35s;
 transition: opacity .35s, visibility .35s, width .35s;
 transform-style: inherit;
 width: 100%;
 z-index: 500;
}
#menu:before {
 content: '';
 background: #1b8817;;
 left: -55%;
 top: 0;
 width: 50%;
 height: 100%;
 position: absolute;
 -webkit-transition: left .35s ease;
 transition: left .35s ease;
}
#menu:after {
 background: #1b8817;;
 content: '';
 right: -55%;
 top: 0;
 width: 50%;
 height: 100%;
 position: absolute;
 -webkit-transition: all .35s ease;
 transition: all .35s ease;
}
#menu.open {
 visibility: visible;
 height: 100%;
 padding-bottom: 5vh;
}
#menu.open:before {
 left: 0;
}
#menu.open:after {
 right: 0;
}
#menu.open li {
 -webkit-animation: fadeInRight .5s ease forwards;
 animation: fadeInRight .5s ease forwards;
 -webkit-animation-delay: .35s;
 animation-delay: .35s;
}
#menu nav {
 position: relative;
 height: 70%;
 top: 45%;
 -webkit-transform: translateY(-50%);
 transform: translateY(-50%);
 font-size: 5rem;
 text-align: center;
 z-index: 100;
}
#menu ul {
 list-style: none;
 padding: 0;
 margin: 0 auto;
 display: inline-block;
 position: relative;
 height: 100%;
}
#menu ul li {
 display: block;
 height: 20vh;
 height: calc(100% / 6);
 letter-spacing: 0.05em;
 min-height: 40px;
 position: relative;
 opacity: 0;
}
#menu ul li a {
 display: block;
 font-size: 6vw;
 position: relative;
 color: #fff;
 text-decoration: none;
 overflow: hidden;
 text-shadow: 1px 1px #000;
}
#menu ul li a:hover {
 color: #D7F4DC
}
#menu ul li a:hover:after, #menu ul li a:focus:after, #menu ul li a:active:after {
 width: 100%;
}
#menu ul li a:after {
 content: '';
 position: absolute;
 bottom: 0;
 left: 50%;
 width: 0%;
/* -webkit-transform: translateX(-50%);
 transform: translateX(-50%);
 height: 3px;
 background: #FFF;
 -webkit-transition: .35s;
 transition: .35s; */
}
 @-webkit-keyframes fadeInRight {
 0% {
 opacity: 0;
 left: 20%;
}
 100% {
 opacity: 1;
 left: 0;
}
}
 @keyframes fadeInRight {
 0% {
 opacity: 0;
 left: 20%;
}
 100% {
 opacity: 1;
 left: 0;
}
}
