


/* Add a background & arelative position with a high z-index to make it appear over any element below */
#menu_container {padding-top:5px; position:relative; width:750px; z-index:100;
                background-image: url(/links_bg.png);
		background-repeat: no-repeat;
		background-position: left top;
		height:40px;
                overflow:visible;}

/* Get rid of the margin, padding and bullets in the unordered lists */
#toplevel, #toplevel ul {
            padding:0; margin:0; list-style-type: none;}

/* Set up the link size, color and borders */
#toplevel a, #toplevel a:visited {display:block; width:187px; font-size:14px; font-weight:bold; color:#ffffff; height:25px; line-height:24px; text-decoration:none; text-indent:5px;text-align:center;}
#toplevel a#long {display:block; width:175px; font-size:14px; font-weight:bold; color:#ffffff; height:25px; line-height:24px; text-decoration:none; text-indent:5px;text-align:center;}
#toplevel a#short {display:block; width:125px; font-size:14px; font-weight:bold; color:#ffffff; height:25px; line-height:24px; text-decoration:none; text-indent:5px;text-align:center;}

/* Set up the sub level borders */

.dropdown   a           {background-color:#814b00;
                        color:#ffffff;
                        }


/* Set up the list items */
#toplevel li            {float:left;
                        }

#toplevel ul.dropdown a, #toplevel ul.dropdown li, #toplevel ul.dropdown li a 
                        {text-align:left; 
                        font-size:12px; 
                        font-weight:normal;
                        }

/* For Non-IE browsers and IE7 */
#toplevel li:hover      {position:relative;
                        }
/* Set up the sublevel lists with a position absolute for flyouts and overrun padding. The transparent gif is for IE to work */
#toplevel li ul         {display:none;
                        }
/* For Non-IE and IE7 make the sublevels visible on list hover. This is all it needs */
#toplevel li:hover > ul {display:block; 
                        position:absolute; 
                        top:-11px; 
                        left:80px; 
                        padding:10px 30px 30px 30px; 
                        background:transparent url(transparent.gif); 
                        width:120px;
                        }
/* Position the first sub level beneath the top level liinks */
#toplevel > li:hover > ul 
                        {left:-30px; 
                        top:16px;
                        }



/* For IE5.5 and IE6 give the hovered links a position relative and a change of background and foreground color. This is needed to trigger IE to show the sub levels */
* html #toplevel li a:hover 
                        {position:relative;
                        }


/* This lot is for IE5.5 and IE6 ONLY and is necessary to make the sublevels appear */

/* change the drop down levels from display:none; to visibility:hidden; */
* html #toplevel li ul  {visibility:hidden; 
                        display:block; 
                        position:absolute; 
                        top:-11px; 
                        left:80px; 
                        padding:10px 30px 30px 30px; 
                        background:transparent url(transparent.gif);
                        }


/* make the second level visible when hover on first level link and position it */
#toplevel li a:hover ul {visibility:visible; 
                        left:-30px; 
                        top:14px; 
                        left:-31px; 
                        top:15px;
                        }



