nav{
	float:right;
	background:url(../images/menu-separator.gif) 0 center no-repeat;
	padding-right:34px;
	min-height:113px;
}
.sf-menu > li {
	background:url(../images/menu-separator.gif) right center no-repeat;
	position:relative;
	float:left;
	padding-right:1px;
	padding-left:2px;
	font:800 12px/15px 'Open Sans', sans-serif;
	text-transform:uppercase;
	text-shadow:0px 1px 2px rgba(0,0,0,0.2);
	text-align:center;
}
	.sf-menu > li > a {
		display:block;
		width:117px;
		background:url(../images/menu-tail.gif) center -999em repeat-x;
		color:#262b2f;
		padding:54px 0 44px;
	}
		.sf-menu > li.sfHover > a,.sf-menu > li > a:hover, .sf-menu > li.current > a {
			text-decoration:none;
			color:#fff;
			background-position: center top;
			background-color:#f04243;
		}
/***submenu***/
.sf-menu ul {
	position:absolute;
	top:-999em;
	z-index:999;
	width:148px; 
	display:none;
	background:#f35355;
}
.sf-menu li li{
	width:100%;
	padding:0;
	position:relative;
	font:800 12px/15px 'Open Sans', sans-serif;
	text-transform:uppercase;
	text-shadow:0px 1px 2px rgba(0,0,0,0.2);
	text-align:left;
}
	.sf-menu li li a{
		display:block;
		color:#fff;
		background:url(../images/submenu-tail.gif) center -999em repeat-x;
		padding:14px 10px 12px 25px;
	}
		.sf-menu li li > a:hover,.sf-menu li li.sfHover > a{
			text-decoration:none;
			background-position: center bottom;
			background-color:#2d2d2d;
		}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:2px;
	top:113px;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:-999em;
}
/***subsubmenu***/
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:149px;
	top:0px;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:-999em;
}

/* Design for a width of 768px */
@media only screen and (max-width: 995px){
	nav{padding-right:25px;}
	.sf-menu > li > a {width:95px;}
	.sf-menu > li > a .arrow{display:block; width:100%; height:8px; background:url(../images/menu-arrow.png) center -16px no-repeat; position:absolute; top:75px; left:0;}
	.sf-menu > li.sfHover > a .arrow,.sf-menu > li > a:hover .arrow, .sf-menu > li.current > a .arrow{background-position:center top; }
}

/* Design for a width of 320 and 480px*/
@media only screen and (max-width: 767px) {
	nav{float:none; background:none; padding:0px 20px 33px;}
	.sf-menu > li {background:none; float:none; padding:0px; margin-bottom:4px; text-align:left;}
	.sf-menu > li > a {width: auto; background:url(../images/menu-tail2.gif) center -132px repeat-x #eeeceb; padding:22px 22px; box-shadow:0px 1px 3px rgba(0,0,0,0.2);}
		.sf-menu > li.sfHover > a,.sf-menu > li > a:hover, .sf-menu > li.current > a {background-color:#d93d3f; box-shadow:none;}
	.sf-menu > li > a .arrow{display:inline-block; width:11px; position:static; margin-left:10px; vertical-align:0px;}
	/***submenu***/
	.sf-menu ul {position:static; width: auto;}
	.sf-menu ul > li > a .arrow{display:inline-block; width:11px; height:8px; background:url(../images/menu-arrow.png) center top no-repeat; position:static; margin-left:10px; vertical-align:0px;}
	/***subsubmenu***/
	.sf-menu ul ul li{text-transform:lowercase;}
	.sf-menu ul ul a{padding:8px 10px 8px 45px;}
}