/* CSS Document */
#top_links {
	clear: both;
	float: left;
	margin-top: -15px;
	width: 800px;
	padding-left: 8px;
	position: relative;
	left: 135px;
	z-index: 80;
}
	#top_links ul {
		margin: 0;
		padding: 0;
		color: #A4A4A4;
	}
	#top_links ul a:hover {
		color: #000;
	}
	#top_links li {
		position: relative;
		list-style: none;
		float: left;
		left: -40px;
		width: 7em;
		margin: 0;
		z-index: 85;
		display: inline;
		font-size: 10px;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		color: #000;
		white-space: nowrap;
		padding: 0 6px 0 5px;
		text-align: center;
		z-index: 80;
	}
	/* margins to add space on either side of any drop down activated menu items */
	#top_links li.submenu {
		margin-left: 10px;
		margin-right: 10px;
	}
	/* display: inline; for links to line up in row under parent <li> */
	/* display: block; for links to drop down like file menu from parent <li> */
	/* font color of active links */
	#top_links li a {
		display: inline;
		text-align: center;
		padding: 0.25em 0.5em 0.25em 0;
		text-decoration: none; 
		width: 7em;
		color: #FBFAE1;
	}
	#top_links>ul a {
		width: auto;
	}
	#top_links ul ul {
		position: absolute;
		width: 7em;
		display: none;
	}
	#top_links ul ul li {
		text-align: center;
	}
	#top_links li.submenu li.submenu {
		background: 5% 50% no-repeat;
	}
	#top_links ul.level1 li.submenu:hover ul.level2, #top_links ul.level2 li.submenu:hover ul.level3 {
		display: block;
	}
	/* color for secondary links with and without hover */
	#top_links ul.level2 a {
		color: #A4A4A4;		
	}
	#top_links ul.level2 a:hover {
		color: #000;
	}
	/* left: *; is used to move links to the left, or right, under the parent <li> for the first link*/
	/* too much distance between top level and second level means headache */
	#top_links ul.level2 {
		top: 1.55em;
		margin-top: 1.8px;
		left: -65px;
		color: #A4A4A4;
	}
	#top_links ul li.top_link2 {
		left: -135px;
	}
	#top_links ul li.top_link3 {
		left: -48px;
	}
	#top_links ul li.top_link4 {
		left: -335px;
	}
	#top_links ul.level3 {
		top: -1px;
		right: 7em;
	}
#nav {
	clear: both;
	float: left;
	margin-top: 25px;
	margin-left: 12px;
	width: 100px;
}
	#nav ul {
		margin: 0;
		padding: 0; 
		width: 140px; 
		background: #EBEBEB;
		background-position: 45% 100%;
		background-repeat: repeat-y;
	}
	#nav ul.level2 {
		background: #EBEBEB;
		background-position: 45% 100%;
		background-repeat: repeat-y; 
	}
	#nav ul.level3 {
		background: #EBEBEB;
		background-position: 45% 100%;
		background-repeat: repeat-y; 
	}
	#nav li {
		position: relative; 
		background-image: url(http://www.harker.org/upperschool/studentsinfo/css/secondarypage_css/images/small_arrow.gif);
		background-repeat: no-repeat;
		background-position: left;
		list-style: none; 
		margin: 0; 
		z-index: 25;
		padding-left: 15px;
		white-space: nowrap;
	}
	#nav li:hover {
		z-index: 25;
		background-image: url(http://www.harker.org/upperschool/studentsinfo/css/secondarypage_css/images/hoversmall_arrow.gif);
		background-repeat: no-repeat;
		background-position: left;
	}
	#nav li.submenu {
		background: url(http://www.harker.org/upperschool/studentsinfo/css/secondarypage_css/images/submenu.gif);
		background-position: 5% 100%;
		background-repeat: no-repeat; 
	}
	#nav li.submenu:hover {
		background-color: #DDD;
		color: #000;
	}
	#nav li a {
		padding: 0.25em 0 0.25em 0.5em; 
		text-decoration: none; 
		width: 140px; 
		font-family: Verdana, Arial, Helvetica, sans-serif; 
		font-size: 11px; 
		color: #666;
		z-index: 30;
	}
	#nav li a:hover {
		border-left-color: #DDD;
		color: #000;
	}
	#nav>ul a {
		width: auto;
	}
	#nav ul ul {
		position: absolute; 
		top: 0; 
		left: 10em; 
		display: none;
	}
	#nav ul.level1 li.submenu:hover ul.level2, #nav ul.level2 li.submenu:hover ul.level3 {
		display:block;
	}
