﻿#pad {
	height: 40px;
	width: 40px;
	top: 35px;
	position: absolute;
	z-index: 502;
	left: 150px;
}
#menu {
	list-style: none;
	height: 20px;
	position: absolute;
	z-index: 500;
	font-family: "Times New Roman", Times, Serif;
	top: 20px;
	left: 158px;
}
#menu li {
	float: left;
	margin-right: 1px;
}
#menu li a {
	display: block;
	float: left;
	height: 20px;
	line-height: 20px;
	background: #000000;
	color: #808080;
	text-decoration: none;
	font-size: 12px;
	font-weight: bold;
	padding: 0 20px 0 20px;
}


#menu table {
	border-collapse: separate;
	width: 0;
	height: 0;
	position: absolute;
	top: 0;
	left: 0;
}

/* Default link styling */

/* Style the list OR link hover. Depends on which browser is used */

#menu li a:hover {
	z-index: 200;
	position: relative;
	color: #808080;
	background-color: #800000;
}
#menu li:hover {
	position: relative;
	z-index: 200;
}

#menu li:hover > a {
	color: #FFFFFF;
	background: #800000;
}
#menu li:hover > a.sub {
	color: #FFFFFF;
	background-color: #800000;
}

#menu li.current a {
	color: #fff;
	background: #800000;
}

#menu li a.sub {
	background: #000000 url('images/down-arrow.gif') no-repeat right
center;
}
#menu li.current a.sub {
	color: #fff;
	background: #800000 url('images/right-arrow.gif') no-repeat right
center;;
}

#menu :hover ul {
	left: 0;
	top: 20px;
	width: 120px;
	background: #444;
}

/* keep the 'next' level invisible by placing it off screen. */
#menu ul, 
#menu :hover ul ul {
	position: absolute;
	left: -9999px;
	top: -9999px;
	width: 0;
	height: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

#menu :hover ul :hover ul{
	left: 120px;
	top: -1px;
	background: #222;
	white-space: nowrap;
	width: 100px;
	z-index: 200;
	height: auto;
}

#menu :hover ul li {
	margin: 0;
	border-top: 1px solid #666;
}
#menu :hover ul li a {
	width: 120px;
	padding: 0;
	text-indent: 10px;
	background: #000000;
	color: #808080;
	height: 20px;
	line-height: 20px;
}
#menu :hover ul li a.fly {
	background: #000000 url('images/right-arrow.gif') no-repeat right
center;
}

#menu :hover ul :hover {
	background-color: #800000;
	color: #FFFFFF;
}
#menu :hover ul :hover a.fly {
	background-color: #800000;
	color: #FFFFFF;
}

#menu :hover ul li.currentsub a {
	background: #800000;
	color: #fff;
}
#menu :hover ul li.currentsub a.fly {
	background: #800000 url('images/right-arrow.gif') no-repeat right
center;
	color: #fff;
}

#menu :hover ul :hover ul li a {
	width: 150px;
	padding: 0;
	text-indent: 10px;
	background: #0A0A0A;
	color: #808080;
}
#menu :hover ul :hover ul :hover {
	background-color: #800000;
	color: #fff;
}

#menu :hover ul :hover ul li.currentfly a,
#menu :hover ul :hover ul li.currentfly a:hover {
	background: #800000;
	color: #fff;
}


/* INFOBOX*/
#box {
	position: absolute;
	left: 900px;
	z-index: 502;
	top: 36px;
}

#box a {
	color: #808080;
	background: #000000;
	font: normal normal bold 12px "Times New Roman", Times, Serif;
	text-decoration: none;
	display: block;
	width: 40px;
	text-align: center;
	height: 20px;
}

#box a:hover {
	color: #FFFFFF;
	background: #800000;
}

#box a span {display:none;}

#box a:hover span {
	position: absolute;
	z-index: 3;
	display: block;
	width: 300px;
	color: black;
	font: normal medium courier, sans-serif;
	padding: 10px;
	bottom: -575px;
	right: 650px;
}

/*<div id="box"><a href="#">Info<span>Lorem ipsum dolor sit amet.</span></a></div>*/
