/*-- menu-navigation --*/
.menu {
	float: right;
	position: relative;
}
.menu .navicon {
    background: transparent;
    position: relative;
    height: 41px;
    width: 41px;
    display: block;
    z-index: 9999;
    -webkit-transition: linear 0.5s all;
    -moz-transition: linear 0.5s all;
	-ms-transition: linear 0.5s all;
	-o-transition: linear 0.5s all;
    transition: linear 0.5s all;
	outline: none;
}
.menu .navicon:before, .menu .navicon:after {
	background: #fff;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	content: "";
	height: 3px;
	left: 0;
	-webkit-transition: 0.8s ease;
	-moz-transition: 0.8s ease;
	-o-transition: 0.8s ease;
	-ms-transition: 0.8s ease;
	transition: 0.8s ease;
	width: 40px;
} 
.menu .navicon:before {
	-moz-box-shadow: #fff 0 13px 0 0;
	-o-box-shadow: #fff 0 13px 0 0;
	-ms-box-shadow: #fff 0 13px 0 0;
	-webkit-box-shadow: #fff 0 13px 0 0;
	box-shadow: #fff 0 13px 0 0;
	position: absolute;
	top: 0;
} 
.menu .navicon:after {
	position: absolute;
	top: 26px;
} 
.menu .navicon--active { 
	-webkit-transition: linear 0.5s all;
	-moz-transition: linear 0.5s all; 
	-moz-transition: linear 0.5s all; 
	-o-transition: linear 0.5s all;
	transition: linear 0.5s all;
} 
.menu .navicon--active:before {
	-moz-box-shadow: transparent 0 0 0 0;
	-ms-box-shadow: transparent 0 0 0 0;
	-o-box-shadow: transparent 0 0 0 0;
	-webkit-box-shadow: transparent 0 0 0 0;
	box-shadow: transparent 0 0 0 0;
	top: 15px;
	-webkit-transform: rotate(225deg);
	-ms-transform: rotate(225deg);
	-moz-transform: rotate(225deg);
	-o-transform: rotate(225deg);
	transform: rotate(225deg);
}
.menu .navicon--active:after {
	top: 15px;
	-webkit-transform: rotate(315deg);
	-ms-transform: rotate(315deg);
	-moz-transform: rotate(315deg);
	-o-transform: rotate(315deg);
	transform: rotate(315deg);
} 
.menu .toggle {
    display: block;
    position: absolute;
	right: 0;
    width: 250px;
    background-color: #FFF;
    padding: 2em 2em;
	font-size: 1.1em;
    opacity: 0;
    -webkit-transition: ease 0.5s all;
    -moz-transition: ease 0.5s all;
    transition: ease 0.5s all;
    -webkit-transform:translate(0);  
    -moz-transform:translate(0);  
    -o-transform: translate(0);  
    -ms-transform:translate(0);    
    transform: scale(0);  
    z-index: 99999;
    -webkit-box-shadow: 0px 0px 7px #696868;
    -moz-box-shadow: 0px 0px 7px #696868;
    box-shadow: 0px 0px 7px #696868;
}
.menu .toggle--active { 
	opacity: 1;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all; 
	transition: 0.5s all;
	-webkit-transform:scale(1);
	-ms-transform:scale(1);
	-o-transform:scale(1);
	-moz-transform:scale(1);
	transform:scale(1);  
} 
.menu .toggle-menu li {
    display: block;
    margin: 6px auto;
    text-align: center;
}
.menu .toggle-menu li a {
    text-decoration: none;
    color: #333;
    display: inline-block;
    text-align: center;
    font-size: 1.1em;
    text-transform: uppercase; 
    -webkit-transition:0.5s all;
    -moz-transition:0.5s all;
    transition:0.5s all;
    font-weight: 400;
    padding: 5px 0;
    margin: 0 auto;
}  
.menu .toggle-menu li a:hover,.menu .toggle-menu li a.active{
	color:#00BCD4;
	border-bottom-color:#20B2AA;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all; 
	transition: 0.5s all;
	-webkit-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-o-transform: scale(1.2);
	transform: scale(1.2);
	font-weight: 600;
}
/*-- //menu-navigation --*/