@charset "UTF-8";
/* CSS Document */

#menu {
	padding:0px 0 0 0px;
	margin:0;
	list-style:none;
	height:175px;
	/*width:auto;*/
	position:relative;
	z-index:500;
	float:right;
}
#menu a {
	color:white;
}
#menu li {
	float:left;
}
#menu li {
	display:block;
	float:left;
	height:45px;
	line-height:25px;
	background-image:url(../images/white.png);
	background-repeat:repeat;
	font-size:0.7em;
	padding:135px 15px 0 15px;
	position:relative;
}
#menu li ul li {
	clear:both;
	background-image:none;
	padding: 0px 15px 0 15px;
	border: 0;
	margin: 0;
	height: 2em;
	line-height: 2em;
	font-size: 1em;
	position: relative;
}
#menu li a {
	text-decoration:none;
}
/* Default link styling */
/* Style the list OR link hover. Depends on which browser is used */

#menu li:hover {
}
#menu li:hover {
	background-image:none;
	position:relative;
	z-index:200;
}
#menu li:hover ul {
	left:0;
	top:auto;
	bottom:53px;
	width:auto;
}
#menu li:hover ul li {
	display: block;
}
#menu a:hover ul {
	left:0;
	top:auto;
	bottom:0;
}

#menu a:hover ul li {
	display: block;
}
/* keep the 'next' level invisible by placing it off screen. */

#menu ul, #menu :hover ul ul {
	position:absolute;
	left:-1000px;
	top:-1000px;
	width:0;
	height:auto;
	margin:0;
	padding:0;
	list-style:none;
}
#menu :hover ul li a {
	padding:8px 0 8px 0;
	height:auto;
	line-height:1.1em;
	background-image:none;
}
/*-----this doesn't work change colour of sub links when hovered over---------*/

#menu :hover ul li a:hover {
	color:black;
	background-image:none;
}
