.sf-menu ul { border:2px solid #528292;}
.sf-menu a { border-right:1px solid #888;font: bold 10px Arial, Helvetica, sans-serif;
	text-transform:uppercase; color:#FFF; }
	.sf-menu a.last { border-right:none; }
.sf-menu ul a { border-bottom:1px solid #528292; border-top:1px solid #fff }

.sf-menu ul a.top { border-top:none }
.sf-menu ul a.bottom { border-bottom:none }

.sf-menu ul a:hover { background:#5fc3e3 !important; color:#FFF !important; border-bottom-color:#1C4563; border-top-color:#84B1D3 }

/* visited pseudo selector so IE6 applies text colour*/
.sf-menu a,
.sf-menu a:visited  { color:#222; }

.sf-menu li li { background: #F00 }
.sf-menu li li li { background:#F00 }

.sf-menu li:hover,
.sf-menu li.sfHover,
.sf-menu a:focus,
.sf-menu a:hover,
.sf-menu a:active { background:#F00}

.sf-menu ul li:hover,
.sf-menu ul li.sfHover a.item,
.sf-menu ul a:focus,
.sf-menu ul a:hover,
.sf-menu ul a:active { background:#F00; color:#FFFFFF !important; border-bottom-color:#999; border-top-color:#fff }

	/* SUPERFISH STYLESHEET ---------------------------------- */
	/*** DO NOT DELETE OR EDIT THE FOLLOWING (Unless you know what you're doing of course!) ***/
	.sf-menu, .sf-menu * { margin:0; padding:0; list-style:none}
	.sf-menu { line-height:1.0 }
	.sf-menu ul { position:absolute; top:-999em; width:12em}
	.sf-menu ul li { width:100% }
	
	/* fixes IE7 'sticky bug' */
	.sf-menu li:hover { visibility:inherit }
	
	.sf-menu li { float:left; position:relative; }
	.sf-menu a { display:block; position:relative }
	
	.sf-menu li:hover ul,
	.sf-menu li.sfHover ul { left:0; top:1.4em; /* match top ul list item height */ z-index:99 }
	
	ul.sf-menu li:hover li ul,
	ul.sf-menu li.sfHover li ul { top:-999em }
	
	ul.sf-menu li li:hover ul,
	ul.sf-menu li li.sfHover ul { left:10em; top:-0.1em }
	
	ul.sf-menu li li:hover li ul,
	ul.sf-menu li li.sfHover li ul { top:-999em }
	
	ul.sf-menu li li li:hover ul,
	ul.sf-menu li li li.sfHover ul { left:12em; top:-0.1em }
	/*** ---------------------------------------------------------------------------------- ***/
	
	/* Dropdown Styling */
	.sf-menu { margin:0 }
	.sf-menu a {
	text-transform:uppercase;
	font-size:10px;
	line-height:1;
	text-decoration:none;
	color: #FFF;
	padding-top: 9px;
	padding-right: 16px;
	padding-bottom: 7px;
	padding-left: 15px;
}
	.sf-menu ul a { background:none; cursor:pointer; text-transform:none; border-left:none; border-right:none; font-size:14px; padding:10px 16px 10px 16px; text-decoration:none; color:#FFF; }
	
	.sf-menu li:hover, .sf-menu li.sfHover,
	.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	outline:0;
	color: #FFF;
}

	.sf-menu a.sf-with-ul { padding-right: 2.25em; min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */ }
	.sf-sub-indicator { position:absolute; display:block; right:.75em; top:1.05em; /* IE6 only */ width:10px; height:10px; text-indent:-999em; overflow:hidden; background:url('../images/arrows-ffffff.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */ }
	a > .sf-sub-indicator {  /* give all except IE6 the correct values */ top:.8em; background-position: 0 -100px; /* use translucent arrow for modern browsers*/ }
	
	a:focus > .sf-sub-indicator,
	a:hover > .sf-sub-indicator,
	a:active > .sf-sub-indicator,
	li:hover > a > .sf-sub-indicator,
	li.sfHover > a > .sf-sub-indicator { background-position: -10px -100px }
	
	.sf-menu ul .sf-sub-indicator { background-position: -10px 0 }
	.sf-menu ul a > .sf-sub-indicator { background-position: 0 0 }
	
	.sf-menu ul a:focus > .sf-sub-indicator,
	.sf-menu ul a:hover > .sf-sub-indicator,
	.sf-menu ul a:active > .sf-sub-indicator,
	.sf-menu ul li:hover > a > .sf-sub-indicator,
	.sf-menu ul li.sfHover > a > .sf-sub-indicator { background-position: -10px 0 }