nav{position: relative; float:right;}
#menu-icon{
	display:none;
	width:55px;
	overflow:hidden;
	font:13px/18px "Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#fff;
	text-align:center;
	text-transform:uppercase;
	padding:18px 0 29px;
	background:url(../images/menu-icon.png) center top no-repeat;
	cursor:pointer;
}
	#menu-icon span{
		display:block;
		width:100%;
		height:6px;
		overflow:hidden;
		background:url(../images/menu-arrow.gif) center top no-repeat;
		position:absolute;
		top:41px;
		left:0;
	}
.menu {list-style:none;}
.menu > li {
	position:relative;
	float:left;
	font:13px/18px "Trebuchet MS", Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	margin-right:6px;
}
	.menu > li > a {
		display:block;
		color:#fff;
		text-decoration:none;
		padding:23px 11px 24px;
	}
		.menu > li.sfHover > a, .menu > li > a:hover, .menu > li.current > a {text-decoration:none; background-color:#5a97db;}
	.menu .menu-arrow{display:none;}
	.menu > li > .menu-bottom{
		display:none;
		width:100%;
		height:10px;
		background:url(../images/menu-bottom.png) center bottom no-repeat;
		position:absolute;
		left:0;
		bottom:-10px;
		z-index:999;
	}
		.menu > li.sfHover > .menu-bottom{display:block;}
/***submenu***/
.menu ul {
	position:absolute;
	top:-999em;
	width:146px; 
	display:none;
	padding:37px 10px 34px;
	background:url(../images/submenu-tail.png) center top repeat;
	z-index:999;
}
.menu li li{
	width:100%;
	padding-bottom:6px;
	border-bottom:1px solid #232526;
	margin-bottom:5px;
	position:relative;
	text-transform:none;
}
	.menu li li.last-item{border-bottom:none; padding-bottom:0;}
	.menu li li a{
		color:#737373;
		text-decoration:none;
	}
		.menu li li > a:hover,.menu li li.sfHover > a{
			color:#fff;
			text-decoration:none;
		}
.menu li:hover ul, .menu li.sfHover ul {left:0px; top:83px;}
.menu li:hover li ul, .menu li.sfHover li ul {top:-999em;}

@media only screen and (max-width: 995px){
	.menu > li {margin-right:1px;}
	.menu > li > a {padding:23px 10px 24px;}
	.menu > li > a .menu-arrow{display:block; width:100%; height:6px; overflow:hidden; text-indent:-999em; font-size:0; line-height:0; background:url(../images/menu-arrow.gif) center top no-repeat; position:absolute; top:44px; left:0;}
}

@media only screen and (max-width: 767px) {
	#menu-icon{display:block;}
	/*menu*/
	.menu{display:none; position:absolute; top:74px; right:0; width:146px; padding:37px 10px 34px; background:url(../images/submenu-tail.png) center top repeat; z-index:999;}
	.menu > li {float:none; width:100%; padding-bottom:6px; margin-right:0; margin-bottom:5px; border-bottom:1px solid #232526; text-transform:none;}
		.menu > li.last-item{border-bottom:none; padding-bottom:0;}
	.menu > li > a {display:inline; color:#737373; padding:0;}
		.menu > li.sfHover > a, .menu > li > a:hover, .menu > li.current > a {background-color: transparent; color:#fff;}
		.menu > li > a .menu-arrow{display:inline-block; width:auto; height:auto; text-indent:0; font-size:inherit; line-height:inherit; background:none; position:static; margin-left:3px;}
	.menu > li > .menu-bottom{display:none !important;}
	/***submenu***/
	.menu ul {right:157px; left:auto !important; top:-37px !important;}
}

@media only screen and (max-width: 479px){
	.menu{width:130px;}
	.menu ul {right:141px; width:130px;}
}

@media only screen and (min-width: 768px) {.menu {display:block !important;}}