/* common styling */
/* set up the overall width of the menu div, the font and the margins */

.menu
{
   font-family: "trebuchet ms", arial, sans-serif; 
   width:780px; 
   margin:0; 
}

/* for the main menu ul, remove bullets and padding */
.menu ul
{
   padding:0; 
   margin:0;
   list-style-type: none;
}

/* float the list so that the items are in a line and their position relative so that the drop down list will appear in the right place underneath each list item */
.menu ul li
{
   float:left; 
   position:relative;
}

/* set the properties of the main menu - height, width, color and the font size. */
.menu ul li a, .menu ul li a:visited, .menu ul li a:hover
{
   display:block; 
   text-align:center; 
   text-decoration:none; 
   width:123px; 
   height:25px; 
   line-height:18px; 
   font-size:11px;
}

/* set all background images (relative to the css file). Position dropdown images below main image */
.home
{
   background:#fff url(../../pics/btnHome.jpg);
}

.homeOver
{
   background:transparent url(../../pics/btnGeneralL2.gif) 0px -25px;
}

.news
{
   background:#fff url(../../pics/btnNews.jpg);
}

.newsOver
{
   background:transparent url(../../pics/btn2items.gif) 0 -25px;
}

.about
{
   background:#fff url(../../pics/btnAbout.jpg);
}

.aboutOver
{
   background:transparent url(../../pics/btnGeneralL2.gif) 0 -25px;
}

.case
{
   background:#fff url(../../pics/btnCase.jpg);
}

.caseOver
{
   background:transparent url(../../pics/btn3items.gif) 0 -25px;
}

.faq
{
   background:#fff url(../../pics/btnFAQ.jpg);
}

.faqOver
{
   background:transparent url(../../pics/btnGeneralL2.gif) 0 -25px;
}

.contact 
{
   background:#fff url(../../pics/btnContact.jpg);
}

.contactOver
{
   background:transparent url(../../pics/btnGeneralL2.gif) 0 -25px;
}

/* hide the dropdown items */
.menu ul li ul
{
   display: none;
}

.menu ul li:hover a span
{
   display:none;
}




/* style the background and foreground color of the submenu links */
.menu ul li:hover ul li a
{
display:block; 
color:#000;
}

/* on hover, show the dropdown ul and position it beneath the corresponding main menu item */
.menu ul li:hover ul 
{
   display:block; 
   position:absolute; 
   top:25px; 
   left:0; 
   width:123px;
}
 
/* style the hidden span text */
.menu ul li:hover ul li a span {
display:none;
position:absolute;
left:130px; top:0;
background:#E5F2FF;
width:230px;
padding: 6px;
color:#000;
border: 1px;
}

/* show the "notes" (span) text */
.menu ul li:hover ul li:hover span {
display:block;
text-align:left;
line-height:1.5em;
}

/* position the span text on the left of the last menu item */
.menu ul li:hover ul.left li:hover span {
left:-230px;
}