/* Fix IE formatting quirks. */
* html .submenu { width: 148px; } /* IE needs narrower than width of .submenu above */
/* End */

/* ####################   Navigation bar CSS styling   ################## */ 
/*  this is BEHIND the navbar   */
.mynavbar {
	position: relative;
  width: 100%;
  height: 32px; /* corresponds to 'line-height' of a.navbartitle below */
  margin: 0; border: 0; padding: 0;
  background-color: #ffffff; 
}
/* ########################## */ 
/*  this is the MAIN navbar   */
/* ########################## */ 
a.navbartitle {
  display: block; 
  float: left;
  color: black;  				/* text color */
  background-color:  #ffffff;  	/* navbar cell background color */
  font-family: "Comic Sans MS";
  font-size: 24px;
  font-weight: bold;
  margin: 0; border: 0; padding: 0;
  line-height: 23px; /* corresponds to 'top' value of .submenu below */
  text-align: center;
  text-decoration:none;
}
a.navbartitle:hover {
  background-color: #ffffff;
}
/* ################################################# */ 
/*  Navbar MAIN menu title widths                    */
/*  This is how you position cells across the page   */
/* ################################################# */ 
#t1 { width: 164px; }
#t2 { width: 130px; }
#t3 { width: 142px; }
#t4 { width: 145px; }
#t5 { width: 155px; }

/* ############################# */ 
/*     this is the SUB menu      */
/* ############################# */ 
.submenu 
{	position:absolute;
    z-index: 2;
    top: 23px; 					/* corresponds to line-height of a.navbartitle above */
    padding: 0; margin: 0; 
	width:166px; 				/* If adjust this, then adjust width of .submenu below a too */
	color: red; 				/* Cant find this one ??  */
	background-color:  #FFFFFF; /* 666633 dark green - Cant tell what this does???  */
	font-family: "Comic Sans MS";
	font-size: 18px;
}
/* ########################################################### */ 
/* 	Note, each SUB menu is hidden when the page loads - then 
	made visible when the mouse goes over the menu title.  
	This seems to be the INITIAL or NON-ROLLOVER state     */
/* ########################################################### */ 
.submenu a
{ 	display: block;
	color: #eee;   				/* this color is red and I cant tell what it does */
  	background-color: #000000;  
  	color: #990033;  				/* text color line, w/o this it apparently reverts to white */
	width: 146px; 			  	/* This should be width of .submenu above minus right-side padding on next line */
	padding: 5px 0px 4px 20px;
  	text-decoration: none;
  	background-color: #FFFFFF; 	/*  background color of submenu cells in non-rollover state  */
  	border-top: 0; border-left: 0; border-right: 0;
}
/* ############################# */ 
/*  position of each SUB menu    */
/* ############################# */ 
#products_submenu { left:  13px; visibility: hidden; }
#services_submenu { left: 160px; visibility: hidden; }
#funstuff_submenu { left: 300px; visibility: hidden; }
#aboutus_submenu  { left: 445px; visibility: hidden; }
#contact_submenu  { left: 588px; visibility: hidden; }

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;
}
/* ############################# */ 
/*  SUB menu Rollover            */
/* ############################# */ 
.submenubox ul li a:link { }
.submenubox ul li a:visited { }
.submenubox ul li a:hover
{    
  color: #6600CC; 				/* text color: PURPLE*/
  background-color: #ffffff; 	/* Background color*/
  /* border-bottom: #447755 dotted 1px; */ 
}