/* NAV */
nav.navigation{
	position:relative;
	height: 44px;
	background-color:#2c2c2c;
	z-index:2;
}
ul.nav-menu, ul.nav-menu li, ul.nav-menu li a{
	float:left;
}
ul.nav-menu{
	padding-left:10px;
	width: auto;
	float: right;
}
ul.nav-menu li a{
	height:44px;
	line-height:44px;
	padding:0 20px;
	color:#fed200; /* #ffb000; */
	font-size:120%;
	text-decoration:none;
	-webkit-transition-duration: 0.6s;
	-o-transition-duration: 0.6s;
	transition-duration: 0.6s;
	text-shadow: 1px 1px 2px #000;
	font-weight:300;
}
ul.nav-menu li a:hover{
	color:#ffffff;
}
.nav-toggle{
	display:none;
	position:absolute;
	top:0;
	right:0;
	width:44px;
	height:44px;
	background-color:#ffb000;
	cursor:pointer;
}
span.icon-bar{
	position:absolute;
	right:11px;
	display:block;
	width:22px;
	height:3px;
	background-color:#ffffff;
	-webkit-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
}
.icon-bar:nth-child(1){
  top:12px;
}
.icon-bar:nth-child(2){
  top:20px;
}
.icon-bar:nth-child(3){
  top:28px;
}
.nav-overlay{
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	background-color:rgba(0,0,0,0.5);
	z-index:1;
	opacity:0;
	visibility:hidden;
	-webkit-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	transition-duration: 0.3s;
}
.nav-overlay.active{
	opacity:1;
	visibility:visible;
}

/* ICON BARS ANIMATION */

.nav-toggle.active .icon-bar:nth-child(1){
	top:22px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
}
.nav-toggle.active .icon-bar:nth-child(2){
	width:0;
}
.nav-toggle.active .icon-bar:nth-child(3){
	top:22px;
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

/* MEDIAQUERIES */
@media (min-width: 1380px) and (max-width:1440px) {    
    ul.nav-menu li a{font-size:115%}	
}
@media (min-width: 1301px) and (max-width: 1379px) {	
    ul.nav-menu li a{font-size:110%}	
}
@media (min-width: 1201px) and (max-width: 1300px) {
    ul.nav-menu li a{font-size:105%;padding:0 16px;}
}
@media (min-width: 1120px) and (max-width: 1200px) {    
    ul.nav-menu li a{font-size:100%;padding:0 16px;}		
}
@media (min-width: 991px) and (max-width: 1119px) {
    ul.nav-menu li a{font-size:95%;padding:0 10px;}	
}
@media (min-width: 921px) and (max-width: 990px) {
	ul.nav-menu li a{font-size:90%;padding:0 9px;}	
}
@media screen and (max-width:920px){
	ul.nav-menu{
		position:absolute;
		top:50px;
		width:100%;
		height:0;
		padding:0;
		overflow:hidden;
		margin-top: -6px;
	}
	ul.nav-menu.active{
		height:auto;
	}
	ul.nav-menu li{
		width:100%;
	}
	ul.nav-menu li a{
		width:100%;
		padding:0;
		text-align:center;
		background-color:#2c2c2c;
	}
	ul.nav-menu li a:hover{
		background-color:#1c1c1c;
	}
	.nav-toggle{
		display:block;
	}
}
@media screen and (min-width:921px){
	.nav-overlay.active{
		visibility:hidden;
		opacity:0;
	}
}