/* tio nav bar drop css */ 

.mynavbar {
	position: relative;
	width: 180px;
	height: 130px;
	margin-left: 20px;
	margin-top: 15px;
	border: 0px;
	padding: 0px;
	filter: alpha(opacity=90);
	opacity: 0.9;
}


a.navbartitle {
  display: block; 
  float: none;
  color:#FFFFFF;  /*text colour*/
  background-image: url(images/navbkgrd2.jpg); /* this is for navbar titles*/
  /*background-color: #D1EACE; /*this is for the navbar titles*/
  /*filter: alpha(opacity=70);
  opacity: 0.7;*/
  font-family: Verdana, Arial, Geneva,  Helvetica, sans-serif;
  font-size: 12px;
  font-weight: 500;
  margin-left: 5px; margin-top: 2px; margin-right: 0px; border: 0px; padding: 0px;
  line-height: 23px; /* corresponds to 'top' value of .submenu below */
  text-align: left;
  text-indent: 10px;
  text-decoration: none;
}

a.navbartitle:hover {
   /*background-image: url(nav_bkgrd_hov.gif); /*this is for when hovering over navbar titles*/
   background-image: url(images/navbkgrd.jpg);
   /* background-color: #447755;*/
   margin-left: 5px; margin-top: 2px; margin-right: 0px; border: 0px; padding: 0px;
}

a.navbartitle:active {
   /*background-image: url(nav_bkgrd_hov.gif); /*this is for when hovering over navbar titles*/
   background-image: url(images/navbkgrd2.jpg);
   /* background-color: #447755;*/
   color: #CCCC66;
   margin-left: 10px; margin-top: 2px; margin-bottom: 0px; margin-right: 0px; border: 0; padding: 0;
}
/* menu title widths */
#t01 { width: 170px; }
#t1 { width: 170px; }
#t2 { width: 170px; }
#t3 { width: 170px; }
#t4 { width: 170px; }
/* We just specify a fixed width for each menu title. Then, down below we specify
    a fixed left position for the corresponding submenus (e.g. #products_submenu, etc.)
    Using these fixed values isn't as elegant as just letting the text of each 
    menu title determine the width of the menu titles and position of the submenus,
    but we found this hardwired approach resulted in fewer cross-browser/cross-OS 
    formatting glitches -- and it's pretty easy to adjust these title widths and the
    corresponding submenu 'left' positions below, just by eyeballing them whenever
    we need to change the navbar menu titles (which isn't often). */
	
.navbartitle {
  width: 170px;
  display: block; 
  float: none;
  color:#660033;  /*text colour*/
  background-image: url(images/navbkgrd.jpg);
  /*background-color: #CCCCCC; /*this is for the navbar titles*/
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 11px;
  font-weight:500;
  margin-left: 5px; margin-top: 0px; margin-bottom: 0px; border: 0; padding: 0;
  line-height: 15px; /* corresponds to 'top' value of .submenu below */
  text-align: left;
  text-indent: 10px;
  text-decoration: none;
}



ul { position: relative; display: block; }
li { position: relative; display: block; }

.submenubox { 
  margin: 0; padding: 0; border: 0;
}
.submenubox ul
{
  margin: 0; padding: 0; border: 0;
  list-style-type: none;
}

.submenubox ul li { 
  margin: 0; padding: 0; border: 0;
}

.submenubox ul li a:link { }
.submenubox ul li a:visited { }
.submenubox ul li a:hover
{
  color:#999966; /* text color for submenu items on hover */
  background-color:#FF3333;
  border-bottom: #447755 dotted 0px; 
}