/*
---------------------------------------------------------------
  Note that styles you apply to the main menu items are inherited by the sub menus items too.
  If you'd like to avoid this, you could use child selectors (not supported by IE6) - for example:
  .sm-clean > li > a { ... } instead of .sm-clean a { ... }
---------------------------------------------------------------*/

/* Menu box
===================*/

	#main-menu {
		position:relative;
		z-index:999;
		width:auto;
	}

#header-bar .module-wrapper.no-cnt {
    overflow: visible !important;
}

	.sm-clean ul {
		border: 1px solid #8BA571 !important; 
		color: #454545;
		background: background-color: #FFFFFF;
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0%, #FFFFFF), color-stop(50%, #FFFFFF), color-stop(100%, #FFFFFF) );
	background: linear-gradient( top, #FFFFFF 0%, #FFFFFF 50%, #FFFFFF 100% );
	background: -moz-linear-gradient( top, #FFFFFF 0%, #FFFFFF 50%, #FFFFFF 100% );
	background: -webkit-linear-gradient( top, #FFFFFF 0%, #FFFFFF 50%, #FFFFFF 100% );
	background: -o-linear-gradient( top, #FFFFFF 0%, #FFFFFF 50%, #FFFFFF 100% );
	background: -ms-linear-gradient( top, #FFFFFF 0%, #FFFFFF 50%, #FFFFFF 100% );
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFFFF', endColorstr='#FFFFFFFF', GradientType=0 );
		-webkit-box-shadow: 1px 1px 6px rgba(0,0,0, 0.25); -moz-box-shadow: 1px 1px 6px rgba(0,0,0, 0.25); box-shadow: 1px 1px 6px rgba(0,0,0, 0.25);

		-moz-border-radius-bottomleft: 5px 5px; -webkit-border-bottom-left-radius: 5px 5px; border-bottom-left-radius: 5px 5px; -moz-border-radius-bottomright: 5px 5px; -webkit-border-bottom-right-radius: 5px 5px; border-bottom-right-radius: 5px 5px;
		padding-top:12px;padding-bottom:12px;
	}

	/* first sub level carets */
	.sm-clean > li > ul:before {
	 content: '';
	  display: inline-block;
	  border-left: 7px solid transparent;
	  border-right: 7px solid transparent;
	  border-bottom: 7px solid #8BA571;
	  border-bottom-color: #8BA571;
	  position: absolute;
	  top: -7px;
	  left: 9px;
	}
	.sm-clean > li > ul:after {
	  content: '';
	  display: inline-block;
	  border-left: 6px solid transparent;
	  border-right: 6px solid transparent;
	  border-bottom: 6px solid white;
	  position: absolute;
	  top: -6px;
	  left: 10px;
	}
	/* no carets for vertical main */
	.sm-clean-vertical > li > ul:before, .sm-clean-vertical > li > ul:after {
		display:none;
	}

/* Menu items
===================*/

	.sm-clean a:hover, .sm-clean a:focus, .sm-clean a:active,
	.sm-clean a.highlighted {

	}
	.sm-clean-vertical a:hover, .sm-clean-vertical a:focus, .sm-clean-vertical a:active,
	.sm-clean-vertical a.highlighted {
		background:#fff;
	}
	#nav-main .sm-clean a.nav-entry.has-submenu {
		padding-right:14px !important;
	}
	.sm-clean-vertical a,
 	.sm-clean ul a {
	font-size: 1em;
    padding: 3px 20px;
	line-height:20px;
	font-weight:bold;
	}
	.sm-clean ul a:hover {
		color:  #000000 !important;
	}

	.sm-clean-vertical a.has-submenu,
 	.sm-clean ul a.has-submenu {
		padding-right:40px;
	}

	.sm-clean ul a:hover, .sm-clean ul a:focus, .sm-clean ul a:active,
	.sm-clean ul a.highlighted {

    background-color: #F0F0F0;
    border-bottom-color: #B4B4B4;
    border-top-color: #B4B4B4;
    box-shadow: 0 12px 6px -10px #B4B4B4 inset;
	}
	/* current items - add the class manually to some item or check the "markCurrentItem" script option */
	.sm-clean a.current, .sm-clean a.current:hover, .sm-clean a.current:focus, .sm-clean a.current:active {

	}

/* Sub menu indicators
===================*/

	.sm-clean a span.sub-arrow {
		position:absolute;
		right:0;
		top:50%;
		//margin-top:-3px;
		/* we will use one-side border to create a triangle so that we don't use a real background image, of course, you can use a real image if you like too */
		width:0;
		height:0;
		overflow:hidden;
		border-width:4px; /* tweak size of the arrow */
		border-style:solid dashed dashed dashed;
		border-color:#346800 transparent transparent transparent;

	}
	.sm-clean a.nav-entry span.sub-arrow 
	{
		width: 14px;
		height: 16px;
		line-height: 16px;
		background: transparent url('../images/mm-chevron.png') -42px 0 no-repeat;

		text-indent: -9000px;
		border-width:0;
		top: 30%;
	}

	.selected a.nav-entry span.sub-arrow	{ background-position: 0px 0 !important }
	.sm-clean a.nav-entry:hover span.sub-arrow  			{ background-position: -28px 0 !important }

	.sm-clean-vertical a span.sub-arrow,
 	.sm-clean ul a span.sub-arrow {
		right:0px;
		top:50%;
		margin-top:-5px;
		border-width:5px;
		border-style:dashed dashed dashed solid;
		border-color:transparent transparent transparent #346800;
	}

/* Scrolling arrows containers for tall sub menus - test sub menu: "Sub test" -> "more..." -> "more..." in the default download package
===================*/

	.sm-clean span.scroll-up, .sm-clean span.scroll-down {
		position:absolute;
		display:none;
		visibility:hidden;
		overflow:hidden;
		background:#fff;
		height:20px;
		/* width and position will be automatically set by the script */
	}
	.sm-clean span.scroll-up:hover, .sm-clean span.scroll-down:hover {
		background-color: #F0F0F0;
	}
	.sm-clean span.scroll-up-arrow, .sm-clean span.scroll-down-arrow {
		position:absolute;
		top:0;
		left:50%;
		margin-left:-6px;
		/* we will use one-side border to create a triangle so that we don't use a real background image, of course, you can use a real image if you like too */
		width:0;
		height:0;
		overflow:hidden;
		border-width:6px; /* tweak size of the arrow */
		border-style:dashed dashed solid dashed;
		border-color:transparent transparent #346800 transparent;
	}
	.sm-clean span.scroll-up:hover span.scroll-up-arrow {
		border-color:transparent transparent #000000 transparent;
	}
	.sm-clean span.scroll-down-arrow {
		top:8px;
		border-style:solid dashed dashed dashed;
		border-color:#346800 transparent transparent transparent;
	}
	.sm-clean span.scroll-down:hover span.scroll-down-arrow {
		border-color:#000000 transparent transparent transparent;
	}
