/*** ESSENTIAL STYLES ***/
.sf-menu {
	margin: 0;
	padding: 0;
	list-style: none;
	position:relative;
}
.sf-menu > li {
	float: left;
}
.sf-menu a {
	display: block;
	position:relative;
}

/*** DEMO SKIN ***/
.sf-menu {
	margin-bottom: 0;
	text-transform:uppercase;
	font-size:12px;
	font-weight:600;
}
.sf-menu a {
	padding: 1.1em 1.8em;
	text-decoration: none;
	zoom: 1; /* IE7 */
	color: #fff;
}
.sf-menu li {
	background: none;
	white-space: nowrap; /* no need for Supersubs plugin */
	*white-space: normal; /* ...unless you support IE7 (let it wrap) */
	-webkit-transition: background .2s;
	transition: background .2s;
}
ul.sf-menu li a{
	color:#fff;
}
ul.sf-menu li a:hover{
	color:#30d9a4;
	outline:none;
}
.sf-menu li:hover {
	background: #111;
	/* only transition out, not in */
	-webkit-transition: none;
	transition: none;
	color:#fff;
}

/*** arrows (for all except IE7) **/
/* styling for both css and generated arrows */
/* styling for right-facing arrows */
#mobnav-btn:before {
    display: none;
	font-family: "fontello";
	 content: "\e874";
    font-size: 24px;
	width:24px;
	height:24px;
    color: white;
	cursor:pointer;
}


/** VERSION 1.3 New CSS  ==================== **/	
/**  End Version 1.3 Updated  **/	

@media (max-width: 767px) {
	   #mobnav-btn  {
		   position:absolute;
		   top:-44px;
		   right:20px;
		   width:20px;
	      height:20px;
	      cursor:pointer;
    }
   #mobnav-btn:before  {
        display: block;
    }
	
	/* styling for both css and generated arrows */
    .sf-menu {
        width: 100%!important;
        display: none;
    }
    .sf-menu li {
        float: none!important;
        display: block!important;
        width: 100%!important;
    }
    .sf-menu li a {
        float: none!important;
    }

}
