/* 
CSS Document - describes the activity of the Eclipse menus.
Each block is 26px high inclusive of a 2 px margin by 200 px wide 
The main block should be created in multiples of 26 pixels high and is created without any margins
Easiest way to generate the hover boxes is to show the main box using the script below 
then do a screen grab and cut the screen grab into multiple hover items, each being the 26 pixels (24 + 2px border) 
NB. The border is at the bottom on the image, as per the script below    
*/

#about-menu {
width: 200px;
line-height: 23px;
font-weight: normal;
color: #FFFFFF;
border-top-width: 2px;
}
#about-menu ul {
margin: 0;
padding: 0;
list-style-type: none;
font-family: verdana, arial, sanf-serif;
font-size: 10pt; 
background-image: url(/images/menus/about/about-menu.jpg);
} 
#about-menu li {
margin: 0px 0 0;
} 
#about-menu a {
	display: block;
	width:190px;
	padding: 0px 0px 0px 10px;
	text-decoration: none;
	border-width: 0px;	
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #EEEEEE;
} 
#about-menu a:link, #about-menu a:active, #about-menu a:visited {
color: #FFFFFF;
}
#about-menu a#item1:hover {
	background-image: url(/images/menus/about/about-over-1.jpg);
}
#about-menu a#item2:hover {
	background-image: url(/images/menus/about/about-over-2.jpg);
}
#about-menu a#item3:hover {
	background-image: url(/images/menus/about/about-over-3.jpg);
}
#about-menu a#item4:hover {
	background-image: url(/images/menus/about/about-over-4.jpg);
}
#about-menu a#item5:hover {
	background-image: url(/images/menus/about/about-over-5.jpg);
}

.food-top
{
	background-color:#CC6E00;
	width:550px;
	height:20px;
	border: 2px solid #CC6E00;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11pt;
	color: #FFFFFF;
}
.food-top2
{
	background-color:#CC6E00;
	height:20px;
	border: 2px solid #CC6E00;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11pt;
	color: #FFFFFF;
}

.food-box
{
	background-color:#FFFFFF;
	width:550px;
	height:450px;
	overflow: scroll;
	border: 2px solid #CC6E00;
}
.water-top
{
	background-color:#00A5D1;
	width:550px;
	height:20px;
	border: 2px solid #00A5D1;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11pt;
	color: #FFFFFF;
}
.water-top2
{
	background-color:#00A5D1;
	height:20px;
	border: 2px solid #00A5D1;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11pt;
	color: #FFFFFF;
}
.water-box
{
background-color:#FFFFFF;
width:550px;
height:450px;
overflow: scroll;
border: 2px solid #00A5D1;
}

.pharma-top
{
	background-color:#800073;
	width:550px;
	height:20px;
	border: 2px solid #800073;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11pt;
	color: #FFFFFF;
}
.pharma-top2
{
	background-color:#800073;
	height:20px;
	border: 2px solid #800073;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11pt;
	color: #FFFFFF;
}
.pharma-box
{
	background-color:#FFFFFF;
	width:550px;
	height:450px;
	overflow: scroll;
	border: 2px solid #800073;
}