
/* CSS tabs Document */
/* this layout won't work in ie5 mac unless you give widths to all floats or convert it to inline-block */

* {margin:0;padding:0}/* clear all default paddings and margins*/
#wrap {margin:25px 0;}/* for example purposes only */
ul#navx,#navx li {list-style:none;}
ul#navx{width:930px;margin:0}/* must have a width as we don't want it to wrap*/

/* mac hide - ie5 hacks \*/
ul#navx,ul#navx li, 
ul#navx a, 
ul#navx a span{
	height:33px;
	voice-family: "\"}\""; voice-family:inherit; 
}
ul#navx a span{height:auto}
/* end hide - keep above hacks in the same order at all times */

ul#navx li, ul#navx li a,ul#navx li, ul#navx li span{
	float:left;
	line-height:31px;
	text-decoration:none;
	color:#fff;
	text-align:center;
	font-size:10.5px;
	color:#000066;
	font-weight:bold;
	z-index:0;
}

ul#navx li a{/* pre-load hover image*/
	background:url(/assets/tabs/center-tab-selected-right.gif) no-repeat right top;
}
ul#navx li a:link,ul#navx li a:visited{
	background:url(/assets/tabs/normal-join.gif) no-repeat right top;
}
ul#navx li a span{	padding:2px 25px 2px 0px;}

/* hover */
ul#navx li a:hover {visibility:visible}/* ie needs this*/
ul#navx li a:hover{	
	background:url(/assets/tabs/center-tab-selected-right.gif) no-repeat right top;
	z-index:999;
	position:relative;
}
ul#navx li a:hover span{
	background:url(/assets/tabs/center-tab-selected-left-next.gif) no-repeat -220px 0;
	margin-left:-24px;
	padding-left:24px;
	position:relative;
	cursor:pointer;
	cursor:hand;/* invalid css but ie5+ needs it*/
	z-index:999;
}
/*...*/
ul#navx li.first a span{
	background:url(/assets/tabs/left-end-tab-normal.gif) no-repeat left top;
	padding-left:20px;
}
ul#navx li.last a{	
	background:url(/assets/tabs/right-end-tab-normal.gif) no-repeat right top;
}
ul#navx li.last a span{padding-right:20px}	

/* set current item when its in the middle of the tabs */
ul#navx li#current a,
ul#navx li#current a:hover{
	background: url(/assets/tabs/center-tab-selected-right.gif) no-repeat right top;
}
ul#navx li#current a span,
ul#navx li#current a:hover span{
	background:url(/assets/tabs/center-tab-selected-left.gif) no-repeat -220px 0;
	margin-left:-24px;
	padding-left:24px;
	position:relative;
	color:red;
}

/* set current item when its on the far right tab  */
ul#navx li#lastcurrent a,
ul#navx li#lastcurrent a:hover,
ul#navx li.last a:hover{
	background:url(/assets/tabs/right-end-tab-over.gif) no-repeat right top;
}
ul#navx li#lastcurrent a span,
ul#navx li#lastcurrent a:hover span,
ul#navx li.last a:hover span{
	background:url(/assets/tabs/center-tab-selected-left.gif) no-repeat -220px 0;
	margin-left:-24px;
	padding-left:24px;
	padding-right:20px;
	position:relative;
	color:red;
}
/* set current item when its the first tab  */
ul#navx li#firstcurrent a,
ul#navx li#firstcurrent a:hover,
ul#navx li.first a:hover{
	background:url(/assets/tabs/center-tab-selected-right.gif) no-repeat right top;
	z-index:999;
}
ul#navx li#firstcurrent a span,
ul#navx li#firstcurrent a:hover span,
ul#navx li.first a:hover span {
	background:url(/assets/tabs/left-end-tab-over.gif) no-repeat left top;
	padding-left:20px;
	color:red;
	z-index:999;
}
ul#navx li#firstcurrent a:hover span,
ul#navx li.first a:hover span{
	margin-left:0
}
ul#navx li#next a:hover span{	background-image:url(/assets/tabs/center-tab-selected-left-next.gif)}
ul#navx li#previous a:hover {background-image:url(/assets/tabs/center-tab-selected-left-previous.gif)}

/* bar under nav */
.bar{
	height:2em;
	background:#039;
	clear:both;
 width:43em;
	margin-bottom:1em;
}
