* { margin: 0; padding: 0; }

body { 	
	margin: 1em;	
	font: 8px Verdana, Arial, Helvetica, sans-serif;
	behavior: url(/hover.htc);
}

#top a { text-decoration: none; }
#top a:hover { text-decoration: underline; }
#top .nav a:hover { text-decoration: none; }
	
.clear:after {
	 content: "."; 
	 display: block; 
	 height: 0; 
	 clear: both; 
	 visibility: hidden;
	}
.clear { display: inline-block; }
		
/* image replacement general properties */

#top_nav ul li sup {font-size:8px;}


ul.IR li { 
	position: relative;
	/* The original method recommends setting this so that the text 
	doesn't peak out if you resize the text. But overflow also includes 
	our dropdown list, so we need the overflow to be visible. */
	/*overflow: hidden; */
	font-size: 0.9em;
}
			
.IR em {
	display: block;
	position: absolute;
	top: 0; left: 0;
	z-index: 1;
	}

.IR span {
	display: block;
	position: absolute;
	top: 0; left: 0;
	z-index: 1;
	}
	

	
/* image replacement specific properties */
.nav { list-style: none; }
.nav li { float: left; padding-bottom: 10px; } 
/* add a little bottom padding to make sure the sub menus don't disappear before selecting them */

.nav li, .nav li em, .nav li span { width: 146px; height: 40px; padding:0 4px 0 0; }
	
.nav li em.last {width: 146px; height: 40px; padding:0;}
	
.link1 em, .link2 em, .link3 em, .link4 em, .link5 em { 
	background: url(/images/top_nav.gif) no-repeat; 
	cursor: pointer;
/* IE5 requires cursor: hand; however this is not valid CSS2 */
}



.link1 {left:0; }
.link1 em {background-position: 0 0; }
.link1:hover em { background-position: 0 0px; }
.link1 span {background: url(/images/top_nav.gif) no-repeat 0 0px; cursor: pointer;}
	
.link2 {left: 0px;  }
.link2 em {background-position: -150px 0; }
.link2:hover em { background-position: -150px 0px; }
.link2 span { background: url(/images/top_nav.gif) no-repeat -150px 0px; cursor: pointer;}
	
.link3 { left: 0px; }
.link3 em { background-position: -300px 0; }
.link3:hover em { background-position: -300px 0px; }
.link3 span { background: url(/images/top_nav.gif) no-repeat -300px 0px; cursor: pointer;}
	
.link4 { left: 0px; }
.link4 em { background-position: -450px 0; }
.link4:hover em { background-position: -450px 0px; }
.link4 span { background: url(/images/top_nav.gif) no-repeat -450px 0px; cursor: pointer;}
	
.link5 { left: 0px; }
.link5 em { background-position: -600px 0; }
.link5:hover em { background-position: -600px 0px; }
.link5 span { background: url(/images/top_nav.gif) no-repeat -600px 0px; cursor: pointer;}
	
/* suckerfish styles */
.nav a { display: block; font-weight: normal; }
* html .nav a { height: 1%; }
	
.nav li ul {
	position: absolute;
	z-index: 10; /* show the dropdowns above the images */
	top: 39px; /* position the dropdowns a set distance from the top of the image */
	left: -999em;
	list-style: none;
}
	
.nav li:hover ul { left: auto;  }
	
.nav li li {
	height: auto; /* reset the height and padding set on the IR list items */
	padding-bottom: 0;
	font-size: 12px;
/*	border-bottom: 0px solid #FFCC00;*/
}
	
.nav li ul a {
	padding:2px 10px;
	color: #fff;
	background: #4f9595;
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	border-bottom:1px solid #fff;	
}

.nav li ul a.topborder {
border-top:1px solid #fff;
}

.nav li ul a:hover {
	color: #000;
	background: #f3e3a2;
}