/* Begin CSS Popout Menu */

#menu {
width: 800px;
font:  12px Verdana, Arial, Helvetica, sans-serif;
height: 43px;
position:absolute;
top: 100px;
}

#menu ul {
list-style: none;
margin: 0;
padding: 0;
float: left;
text-align:center;
}

#menu a{
background-color:#013567;  /* assigns a color for the backgrounds of all boxes, including sub sections  */
display: block;
margin: 0;
padding: 4px 2px;
color:#FFFFFF;
text-decoration: none;
background-image:url(../images/menu_color.jpg);
background-repeat:repeat-x;
height:20px;
outline: none;
}

#menu a:hover {
background-image:none;
background:#F19B12;
color:#006599;
}

#menu li {
position: relative;
	}

#menu ul ul {
position: absolute;
z-index: 10;
	
	}

#menu ul ul.extralarge{   /* Sets the sub-sub category of SERVICES to be longer in size to accomodate the length of text  without wrap   */
position: absolute;
top: 100;
left: 0;
width: 110%;   /* this is the setting that stretches the menu more to accomodate the text    */
text-align:left;
}

#menu ul ul a{      /*  Setting for the Sub Category boxes.   */
background-image:none;     /*  NO background image  */
}


div#menu ul ul,             /*  Set ALL sets of boxes on hover, or no hover to NOT have bullets in front of them  */
div#menu ul li:hover ul ul,
div#menu ul ul li:hover ul ul
{display: none;}

div#menu ul li:hover ul,   /*  Set ALL sets of boxes on hover, or no hover to be displayed as BOXES (bounding boxes)  */
div#menu ul ul li:hover ul,
div#menu ul ul ul li:hover ul
{display: block;}