@charset "UTF-8";
/* CSS Document */

	/* navigation */
	#nav {
		background:#ddd url(h300_reverse.png);
		border-bottom:1px solid #CCCCCC;
		height:156px;	
		width:468px;
	}
	
	#nav ul {	
		width:468px;
		margin:0 auto;	
	}
	
	#nav li {	
		border-right:1px solid #ddd;
		float:left;
		padding-left:1px;
		width:140px;
		list-style-type:none;
		text-align:center;
		margin-top:0px;
	}
	
	#nav a {
		color:#333333;
		display:block;
		padding:10px;
		position:relative;
		word-spacing:-2px;
		font-size:10px;		
		height:122px;
		text-decoration:none;
	}	
	
	#nav a.current {
		background-image: url(down_large.jpg);
	}
	
	#nav img {
		background-color:#fff;
		border:1px solid #ccc;
		margin:3px 0 5px 17px;
		padding:4px;		
		display:block;
	}
	
	#nav strong {
		display:block;		
		font-size:11px;
	}
	
	/* panes */
	#panes {
		border-left: 1px solid #ccc;
		border-right: 1px solid #ccc;
		border-top: 1px solid #ccc;
		border-bottom: 0 solid #ccc;
		background: #fff url('h300_reverse.png') 0 0;
		width:466px;	
		height:255px;
		margin-bottom:-20px;
		padding-bottom:20px;
		
		/* must be relative so the individual panes can be absolutely positioned */
		position:relative;
		top: 0px;
		left: 0px;
}
	
	/* crossfading effect needs absolute positioning from the elements */
	#panes div {
		display:none;
		position:absolute;
		top:20px;
		left:20px;
		font-size:11px;
		color:#333;
		width:420px;
		text-align: left;
	}
	
	#panes img {
		border: 0px;
		float: left;
		margin-right: 20px;
}
	
	#panes p.more {
		color:#000;
		font-weight:bold;
		font-size:13px;
	}
	
	#panes h3 {
		margin:0 0 -5px 0;
		font-size:14px;
		font-weight:normal;
		font-family: Tahoma, Geneva, sans-serif;
	}

	#panes a {
		color:#333333;
		text-decoration:none;
	}

	.overlay {
		display:none;
		width:500px;
		padding:20px;
		background-color:#ddd;
	}