/*** ESSENTIAL STYLES ***/
 .sf-menu, .sf-menu * {
 	margin: 0;
 	padding: 0;
 	list-style: none;
 }
 .sf-menu li {
 	position: relative;
 }
 .sf-menu ul {
 	position: absolute;
 	display: none;
 	top: 100%;
 	left: 0;
 	z-index: 99;
 }
 .sf-menu > li {
 	float: left;
 }
 .sf-menu li:hover > ul,
 .sf-menu li.sfHover > ul {
 	display: block;
 }
 
 .sf-menu a {
 	display: block;
 	position: relative;
 }
 .sf-menu ul ul {
 	top: 0;
 	left: 100%;
 }
 
 
 /*** DEMO SKIN ***/
 .sf-menu {
 	float: left;
 	margin-bottom: 1em;
 }
 .sf-menu ul {
 	box-shadow: 2px 2px 6px rgba(240,255,240,.2);
 	min-width: 12em; /* allow long menu items to determine submenu width */
 	*width: 12em; /* no auto sub width for IE7, see white-space comment below */
 }
 .sf-menu a {
 	border-left: 1px solid #36580c;
 	border-top: 1px solid #dFeEFF; /* fallback colour must use full shorthand */
 	border-top: 1px solid rgba(0,51,0,.5);
 	padding: .75em 1em;
 	text-decoration: none;
 	zoom: 1; /* IE7 */
 }
 .sf-menu a {
 	color: #f0fff0;
 }
 .sf-menu li {
 	background: #154d00;
 	white-space: nowrap; /* no need for Supersubs plugin */
 	*white-space: normal; /* ...unless you support IE7 (let it wrap) */
 	-webkit-transition: background .2s;
 	transition: background .2s;
 }
 .sf-menu ul li {
 	background: #2a4708;
 }
 .sf-menu ul ul li {
 	background: #2a4708;
 }
 .sf-menu li:hover,
 .sf-menu li.sfHover {
 	background: #415f21;
 	/* only transition out, not in */
 	-webkit-transition: none;
 	transition: none;
 }
 
 /*** arrows (for all except IE7) **/
 .sf-arrows .sf-with-ul {
 	padding-right: 2.5em;
 	*padding-right: 1em; /* no CSS arrows for IE7 (lack pseudo-elements) */
 }
 /* styling for both css and generated arrows */
 .sf-arrows .sf-with-ul:after {
 	content: '';
 	position: absolute;
 	top: 50%;
 	right: 1em;
 	margin-top: -3px;
 	height: 0;
 	width: 0;
 	/* order of following 3 rules important for fallbacks to work */
 	border: 5px solid transparent;
 	border-top-color: #dFeEFF; /* edit this to suit design (no rgba in IE8) */
 	border-top-color: rgba(0,51,0,.5);
 }
 .sf-arrows > li > .sf-with-ul:focus:after,
 .sf-arrows > li:hover > .sf-with-ul:after,
 .sf-arrows > .sfHover > .sf-with-ul:after {
 	border-top-color: #36580c; /* IE8 fallback colour */
 }
 /* styling for right-facing arrows */
 .sf-arrows ul .sf-with-ul:after {
 	margin-top: -5px;
 	margin-right: -3px;
 	border-color: transparent;
 	border-left-color: #dFeEFF; /* edit this to suit design (no rgba in IE8) */
 	border-left-color: rgba(0,51,0,.5);
 }
 .sf-arrows ul li > .sf-with-ul:focus:after,
 .sf-arrows ul li:hover > .sf-with-ul:after,
 .sf-arrows ul .sfHover > .sf-with-ul:after {
 	border-left-color: #36580c;
 }
