/********************* Menu *************************************/

#menu-icon {display: none; /* hide menu icon initially */}

#nav-wrap {background-color: #a0ce5a; height: 39px; }
#nav-wrap ul {list-style-type: none; margin-left:120px;}
#nav-wrap li {float:left;}
#nav-wrap li a {
	background-color:#a0ce5a;
	display:inline-block;
	font-family: 'OpenSansSemiBold';
	font-size:18px;
	padding:6px 20px;
	text-decoration:none;
}
#nav-wrap li a:hover {
	background: #577031; /* Old browsers */
	background: -moz-linear-gradient(top,  #577031 0%, #a0ce5a 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#577031), color-stop(100%,#a0ce5a)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #577031 0%,#a0ce5a 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #577031 0%,#a0ce5a 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #577031 0%,#a0ce5a 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #577031 0%,#a0ce5a 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#577031', endColorstr='#a0ce5a',GradientType=0 ); /* IE6-9 */
	color:#fdf7d6;
}
#nav-wrap li a:active {
	position:relative;
	top:1px;
}

/************************************************************************************
MOBILE
*************************************************************************************/
/* ensure #nav is visible on desktop version */
@media screen and (min-width: 767px) {
 #nav {display: block !important;}
}

@media only screen and (max-width: 995px) {
#nav-wrap ul {margin-left:20px;}	
}



/* Design for a width of 480px*/
@media only screen and (max-width: 767px) {
	nav{padding:0;}
	
	#nav-wrap {
		position: relative;
		clear:both;
		background-color:transparent;
	}
	#nav-wrap ul {margin-left:0px;}	
	
	#menu-icon {
		height: 30px;
		background: #a0ce5a url(../images/menu-icon.png) no-repeat 10px center;
		padding: 8px 10px 0 42px;
		cursor: pointer;
		border: solid 1px #666;
		display: block; /* show menu icon */
	}

	#nav {
		clear: both;
		position: absolute;
		top: 38px;
		z-index: 10000;
		padding: 10px;
		background: #f8f8f8;
		border: solid 1px #999;
		display: none; /* visibility will be toggled with jquery */
	}
	#nav li {
		clear: both;
		float: none;
		margin: 5px 0 5px 0px;
	}
	#nav li a{
		display:block; 
		padding:15px 15px 15px 20px;
	}
	

}