/* =============================================================================
   Main Menu
   ========================================================================== */

#menu {
	background: rgba(168,168,168,1);
	position: relative;
}

.menu-main, .menu-main ul {
	display: block;
	margin: 0;
	padding: 0;
	list-style-type: none;
}

	.menu-main li {
		margin: 0;
		padding: 0;
		display: inline;
		float: left;
		position: relative;
		z-index: 100;
	}
	
		.menu-main li a {
			display: block;
			line-height: 1em;
			padding: 1em;
			text-decoration: none;
			color: #FFF;
		}
		
			.menu-main li a:hover, .menu-main > li:hover > a {
				background: rgba(0, 0, 0, 0.3);
			}
		
		.menu-main li .sub-toggle {
			display: none;
			cursor: pointer;
			position: absolute;
			font-size: 1.1em;
			right: 0.5em;
			top: 0.6em;
			line-height: 1em;
			height: 1em;
			width: 1em;
			padding: 0.25em;
			text-align: center;
			color: #333;
			text-shadow: 0 1px 0 #FFF;
			z-index: 1;
			border: 1px solid #bbb;
			-webkit-border-radius: 3px;
			-moz-border-radius: 3px;
			border-radius: 3px;
			-moz-box-shadow: 0 1px 0 #FFF inset;
			-webkit-box-shadow: 0 1px 0 #FFF inset;
			box-shadow: 0 1px 0 #FFF inset;
			background: #EEE;
			background-image: -webkit-linear-gradient(#eee 0%, #bbb 100%);
			background-image: -moz-linear-gradient(#eee 0%, #bbb 100%);
			background-image: -ms-linear-gradient(#eee 0%, #bbb 100%);
			background-image: -o-linear-gradient(#eee 0%, #bbb 100%);
			background-image: linear-gradient(#eee 0%, #bbb 100%);
		}
		
		.menu-main li ul {
			display: none;
			position: absolute;
			z-index: 200;
			top: 100%;
			left: 0;
			background: rgba(84,84,84,1);
			width: 200px;
		}
		
			.menu-main li:hover ul {
				display: block;
			}
			
			.menu-main li li {
				display: block;
				float: none;
			}
			
#menu .btn-navbar {
	display: none;
	float: right;
	padding: 7px 10px;
	margin: 5px;
	background-color: #2c2c2c;
	*background-color: #222222;
	background-image: -ms-linear-gradient(top, #333333, #222222);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#333333), to(#222222));
	background-image: -webkit-linear-gradient(top, #333333, #222222);
	background-image: -o-linear-gradient(top, #333333, #222222);
	background-image: linear-gradient(top, #333333, #222222);
	background-image: -moz-linear-gradient(top, #333333, #222222);
	background-repeat: repeat-x;
	border-color: #222222 #222222 #000000;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	filter: progid:dximagetransform.microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);
	filter: progid:dximagetransform.microsoft.gradient(enabled=false);
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);
	 -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);
	      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.075);
}

	#menu .btn-navbar:hover,
	#menu .btn-navbar:active,
	#menu .btn-navbar.active,
	#menu .btn-navbar.disabled,
	#menu .btn-navbar[disabled] {
		  background-color: #222222;
		  *background-color: #151515;
	}
	
	#menu .btn-navbar:active,
	#menu .btn-navbar.active {
		background-color: #080808 \9;
	}

	#menu .btn-navbar .icon-bar {
		display: block;
		width: 18px;
		height: 2px;
		background-color: #f5f5f5;
		-webkit-border-radius: 1px;
		 -moz-border-radius: 1px;
		      border-radius: 1px;
		-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
		 -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
		      box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
	}
	
	.btn-navbar .icon-bar + .icon-bar {
		margin-top: 3px;
	}