nav {
	/* Repeating background image */
	background: url("images\a.png");
	width:240px;
	margin:20px;z-index:4;
	position:relative;
}

nav ul {
	/* Removes bullet points */
	list-style:none;
	margin:0;
	padding:0;
	
}
nav ul li {
	/* Any child positioned absolutely will be positioned relative to this */
	position:relative;
		background-color:#222222;

}
nav a {
	color:#fed966;
	padding:12px 0px;
	/* Fill all available horizontal space */
	display:block;
	/* Remove underline */
	text-decoration:none;
	/* 
	New CSS3 animations:
	apply transition to background property, taking 1s to change it 
	*/
	transition:background 1s;
	-moz-transition:background 1s;
	-webkit-transition:background 1s;
	-o-transition:background 1s;
	font-family:tahoma;
	font-size:12px;
	
	padding-left:10px;
}
nav a:hover {
	/* 
	RGBA background for transparancy: 
	last number(0.05) is the transparency 
	*/
	background: RGBA(255,255,255,0.05);
	color:#fff;
	
}
nav a:hover span {
	background: #b92321;
	transform:rotate(90deg);
	-moz-transform:rotate(90deg);
	-webkit-transform:rotate(90deg);
}
nav ul li:hover ul {
	display:block;
	
}
nav ul ul {
	position:absolute;
	left:240px;
	top:0;
	border-top:1px solid #e9e9e9;
	display:none;
}
nav ul ul li {
	width:200px;
	background:RGBA(10,10,10,0.8);
	border:0px solid #e9e9e9;
	border-top:0;
}
nav ul ul li a {
	color:#a8a8a8;
	font-size:12px;
	text-transform:none;
}
nav ul ul li a:hover {
	color:#929292;
}

nav ul ul ul {
	position:absolute;
	left:200px;
	top:0;
	border-top:0px solid #e9e9e9;
	display:none;
}
nav ul ul ul li {
	width:200px;
	background:RGBA(10,10,10,0.8);
	border:0px solid #e9e9e9;
	border-top:0;
}
nav ul ul ul li a {
	color:#adadad;
	font-size:12px;
	text-transform:none;
}
nav ul ul ul li a:hover {
	color:#929292;
}


nav span {
	width:12px;
	height:12px;
	background:#fff;
	display:inline-block;
	float:left;
	margin-top:3px;
	margin-right:10px;
	position:relative;
	transition:all 0.5s;
	-moz-transition:all 0.5s;
	-o-transition:all 0.5s;
	-webkit-transition:all 0.5s;
}
nav span:before {
	content:"";
	width:12px;
	height:2px;
	background:#3a3b3b;
	position:absolute;
	left:0px;
	top:5px;
}
nav span:after {
	content:"";
	width:2px;
	height:12px;
	background:#3a3b3b;
	position:absolute;
	left:5px;
	position:top;
}
