@import url(http://fonts.googleapis.com/css?family=Anton);/*font-family: 'Anton', sans-serif;*/

nav{
	position:relative; 
	margin:  0;
	display: inline-block;
	float: right;
	padding: 35px 0px 0px 0px;
	}
.sf-menu ul {position:absolute;top:-999px; display:none;/* left offset of submenus need to match (see below) */}
.sf-menu ul li {width:100%}
.sf-menu>li {                                           /** R **/
	float:left;
	position:relative;
	font-family: 'Anton', sans-serif;
	width:110px;
	background: url(.x./images/bg-li.jpg) 0 50% repeat-x #ffffff;/*B8DE29*/
	font-weight: normal;
	text-transform:uppercase;
	z-index:1;
	margin: 0 5px;
	box-shadow:0px 0 5px rgba( 255, 255, 255, 0.77);
    text-shadow: 0px 0px 5px #FFFFFF;
	}
.sf-menu>li.g{                                           /** G **/
	float:left;
	position:relative;
	font-family: 'Anton', sans-serif;
	width:110px;
	background: url(.x./images/bg-li-g.jpg) 0 50% repeat-x #ffffff;/*B8DE29*/
	font-weight: normal;
	text-transform:uppercase;
	z-index:1;
	margin: 0 5px;
	box-shadow:0px 0 5px rgba( 255, 255, 255, 0.77);
    text-shadow: 0px 0px 5px #FFFFFF;
	}
.sf-menu li.sub-menu:after{
	display:block;
	position:absolute;
	content:'';
	width:8px;
	height:4px;
	top:80%;
	left:50%;
	margin-left: -4px;
	background: url(../images/indicator.png) 0 0 no-repeat;
	}
.sf-menu>li>a{
	display:block;
	text-align:center;
	position:relative; 
	font-size: 21px; 
	line-height: 26px;
	text-transform: uppercase;
	padding: 27px 0 27px 0; 
	color:#222;
	border-top: 3px solid #22A807;
	border-bottom: 3px solid #ED4624;
	}

.sf-menu>li:hover,.sf-menu>li.current,.sf-menu>li.sfHover{background: url(../images/bg-li-g.jpg) 0 0 repeat-x #ED4624;text-shadow: 0px 0px 5px #FFFFFF;}        /** R **/
.sf-menu>li.g:hover,.sf-menu>li.g.current,.sf-menu>li.g.sfHover{background: url(../images/bg-li-g.jpg) 0 0 repeat-x #B8DE29;text-shadow: 0px 0px 5px #FFFFFF;}/** G **/
.sf-menu>li>a:hover,.sf-menu>li.current>a,.sf-menu>li.sfHover>a{}


/*================================>> 2 Level <<========================================*/
.sf-menu>li>ul,.sf-menu>li.sfHover>ul{
	left:0;
	top:94px;
	width: 175px;
	padding:0 0 0 0; 
	z-index:99;
	background: #B8DE29;
	}
.sf-menu>li>ul>li{
	display:block;
	text-align:left;
	padding:8px 0 8px 10px;
	background:none;
	border-top: 1px solid #6ab604;
	font-family: Arial, Helvetica, sans-serif; 
	text-transform: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
    text-shadow: 0px 0px 3px #FFFFFF;
	}
	.sf-menu>li>ul>li:first-child{border: none;}
.sf-menu>li>ul>li>a{
	font-size: 12px; 
	line-height: 20px;
	display:inline-block;
	color:#111;
	}
.sf-menu li li a:hover, .sf-menu li.sfHover li.sfHover>a{color:#111;text-decoration:underline;}

/*==================================RESPONSIVE LAYOUTS===============================================*/
@media only screen and (max-width: 995px) {
	.sf-menu > li > ul, .sf-menu > li.sfHover > ul{top: 68px;}
.sf-menu>li {
	width:87px;
	margin: 25px 5px 0;}
.sf-menu>li>a{
	padding: 24px 0 24px 0;
	font-size: 17px; 
	line-height: 20px;
	}

    	.sf-menu > li.g > ul, .sf-menu > li .g .sfHover > ul{top: 68px;}
.sf-menu>li.g {
	width:87px;
	margin: 25px 5px 0;}
.sf-menu>li.g>a{
	padding: 24px 0 24px 0;
	font-size: 17px; 
	line-height: 20px;
	}


}

@media only screen and (max-width: 767px) {

  nav{
		float:none;
		font:12px/15px Arial, Helvetica, sans-serif;
		text-transform:uppercase;
		color:#fff;
		padding:8px 3px 0 3px;
		margin: 13px 0 0;
		border-radius: 4px;
	}

		nav:before{
			content:'Menu:';
			display:none;
			margin-bottom:5px;
		}
	.sf-menu{display:none;}
	nav select{
		font:12px/15px Arial, Helvetica, sans-serif;
		color:#464646;
		width:100%;
        outline: none;
		border:2px solid #9e9e9e;
		border-radius: 3px;
	}
	
}

@media only screen and (max-width: 479px) {
	
}