	@charset "utf-8";
	
	div.topNav, div.bottomNav
	{
		position: relative;
		/* height for bottom nav bar specified dynamically in nav_arrow_drop.php due to absolutely positioned submenus; affects content below nav bar */
	}

	div.topNav
	{
		width: 920px;
		height: 63px;
		margin: -20px auto 0 auto;
	}
	
	div.topNavSubmenu, div.bottomNavSubmenu
	{
		position: absolute;
		left: 0px;
		width: 100%;
	}
	
	div.topNavSubmenu
	{
		top: 43px;
	}
	
	div.topNav a, div.bottomNav a
	{
		text-decoration: none;
	}
	
	div.topNav a:link, div.topNav a:visited, div.bottomNav a:link, div.bottomNav a:visited
	{
		color: #660034;
	}
	
	div.topNav a:hover, div.topNav a:active, div.bottomNav a:hover, div.bottomNav a:active
	{
		color: #000000;
	}
	
	table.topNavRow, table.bottomNavRow
	{
		max-width: 100%;
		margin: 0 auto;
	}
	
	td.topNavCell
	{
		font-size: auto;
		height: 40px;
	}
	
	td.topNavCellOn, td.bottomNavCellOn
	{
		color: #000000;
	}
	
	td.topNavCellHasChildren, td.bottomNavCellHasChildren
	{
		color: #660034; /* so color remains that of link when javascript makes parents of dropdowns no longer links themselves */
	}
	
	td.topNavSpacer
	{
		width: 25px;
		min-width: 3px;
	}
	
	td.bottomNavCell
	{
		font-size: 12px;
	}
		
	td.bottomNavSpacer
	{
		width: 15px;
		min-width: 3px;
	}
		
	td.topNavSeparator
	{
		width: 0px;
	}
		
	td.bottomNavSeparator
	{
		background-color: #660034;
		width: 1px;
	}

	td.topNavCellHasChildren div.topNavSubmenu, td.bottomNavCellHasChildren div.bottomNavSubmenu
	{
		visibility: hidden;
	}
	
	td.topNavCellHasChildren div.topNavSubmenu
	{
		padding-top: 11px;
		margin-top: -11px;
	}
	
	td.bottomNavCellHasChildren div.bottomNavSubmenu
	{
		border-top: 1px solid black;
		padding-top: 12px;
		padding-bottom: 3px;
	}
	
	td.topNavCell span, td.bottomNavCell span
	{
		white-space: nowrap;
		padding: 0px 5px;
	}

	td.bottomNavCellHasChildren span
	{
		border: 1px solid transparent; /* here so nothing moves when becomes colored upon hover over parent if parent has hidden children */
		border-bottom-width: 0px;
		position: relative;
		top: 1px;  /* to cover corresponding portion of top border of corresponding submenu - jquery used to place this above that */
	}
	
	img.topArrow
	{
		width: 920px;
		height: 19px;
		position: absolute;
		margin-top: -11px;
	}
	
	img.bottomArrow
	{
		width: 920px;
		height: 12px;
	}

	/* update styles for vertical top nav drop down */

	td.topNavCellHasChildren
	{
		position: relative;
	}

	td.topNavCellHasChildren div.topNavSubmenu
	{
		width: auto;
		padding-top: 3px;
		margin-top: -3px;
	}
	
	td.topNavCellHasChildren td
	{
		height: 25px;
	}