nav{float:right; padding-right:15px;}
.menu {list-style:none;}
.menu > li {
	position:relative;
	float:left;
	font:400 11px/14px 'Quattrocento', serif;
	text-transform:uppercase;
	text-align:center;
	margin:5px 10px;
	border:1px solid transparent;
	border-radius:7px;
}
	.menu > li:after{
		content: "";
		display:block;
		background:url(../images/menu-separator.gif) center top repeat-y;
		width:2px;
		height:43px;
		position:absolute;
		top:-5px;
		right:-12px;
	}
	.menu > li:first-child{margin-left:0;}
	.menu > li.last-item{margin-right:0;}
	.menu > li.last-item:after{display:none;}
	.menu > li.current, .menu > li:hover, .menu > li.sfHover{background-color:#232323; border-color:#1a1a1a; box-shadow:0 1px 0 #373434;}
	.menu > li > a {
		color:#fff;
		text-decoration:none;
		display:block;
		padding:9px 20px 8px;
	}
		.menu > li.sfHover > a, .menu > li > a:hover, .menu > li.current > a {text-decoration:none;}
	.menu .menu-arrow{display:none;}
/***submenu***/
.menu ul {
	position:absolute;
	top:-999em;
	width:125px; 
	display:none;
	padding:8px 8px 14px;
	background:#312e2e;
	z-index:999;
	border-radius:8px;
	border-top:4px solid #F16022;
}
.menu li li{
	position:relative;
	text-align:left;
	margin-bottom:7px;
	border:1px solid transparent;
	border-radius:7px;
}
	.menu li li:hover, .menu li li.sfHover{background-color:#232323; border-color:#1a1a1a; box-shadow:0 1px 0 #373434;}
	.menu li li.last-item{margin-bottom:1px;}
	.menu li li a{
		display:block;
		color:#fff;
		text-decoration:none;
		padding:9px 8px 8px;
	}
		.menu li li > a:hover,.menu li li.sfHover > a{text-decoration:none;}
.menu li:hover ul, .menu li.sfHover ul {left:-29px; top:53px;}
.menu li:hover li ul, .menu li.sfHover li ul {top:-999em;}
/***subsubmenu***/
.menu li li:hover ul, .menu li li.sfHover ul {left:133px; top:-14px;}
.menu li li:hover li ul, .menu li li.sfHover li ul {top:-999em;}

@media only screen and (max-width: 995px){
	nav{padding-right:0;}
	.menu > li {margin:5px;}
	.menu > li:after{right:-7px;}
	.menu > li > a{padding:9px 15px 8px;}
	.menu .menu-arrow{display:inline-block; margin-left:5px;}
}

@media only screen and (max-width: 767px) {
	nav{float:none; position:relative; font:400 11px/14px 'Quattrocento', serif; text-transform:uppercase; padding:9px 20px 13px; border:1px solid #1a1a1a; border-radius:7px; background-color:#232323; color:#fff;}
	nav:before{display:block; content:'Menu:'; margin-bottom:5px;}
	.menu{display:none;}
	nav select{width:100%; text-transform:none;}
}