/*
	NAVIGATION 3
	styles specific to horizontal tabs and subnav
*/

#navigation {
	float: left;
	width: 966px;
	}

.nav, 
.nav * {
	margin:0;
	padding:0;
}

.nav {
	width: 955px;
	line-height:1.0;
	height: 58px;
	float: left;
	position:relative;
	z-index: 1;
	font: normal 1em verdana,helvetica,arial,sans-serif;
	text-transform: uppercase;
	background: #fff url(http://media.thestate.com/static/images/navBg.gif) repeat-x left bottom;
	padding: 0 0 0 10px;
	}

.sf-sub-indicator { display:none; }

.nav ul {
	background: #444; /*IE6 needs this*/
	float: left;
	position:relative;
	width: 960px;
	}

.nav li {
	float: left;
	list-style:none;
	z-index:999;
	background: transparent url(http://media.thestate.com/static/images/tabs.gif) right -50px no-repeat;
	margin: 0 1px 0 0;
	}

.nav li.current ul { z-index: 999; }

.nav li.sfHover ul,
ul.nav li:hover ul {
	z-index: 1000;
}

.nav a {
	color: #fff;
	display: block;
	float: left;
	padding: 9px 0 0 7px;
	margin-right: 8px;
	display: inline;
	text-decoration:none;
	width: auto;
	background: transparent url(http://media.thestate.com/static/images/tabs.gif) left -50px no-repeat;
}

.nav li ul {
	left:0;
	top:-999em;
	position:absolute;
}


/* --- links: default --- */

.nav a,
.nav a:focus, 
.nav a:hover, 
.nav a:active {
	height: 19px;
	background-color: transparent;
	color: #444;
	}

/*--- li hover (default) --- */

/*--- SUBNAVIGATION (default) --- */

/* 2nd level : links */
.nav li li,
.nav li li a {
	background: none;
	padding: 4px;
	margin-right: 0px;
	color: #fff;
	}

.nav li li {
	display: inline;
	height: 20px !important;
	padding-left: 5px;
	padding-right: 0;
	margin: 0 3px 0 0;
	}

.nav li li a {}

/* assigned dynamically from js file - style as needed */
.nav li li.firstSubItem {
	background: none !important;
	}

/* 2nd level : default link hover */
.nav li:hover li a {
	color: #fff;
	}

.nav li li:hover a,
.nav li li a:hover {
	text-decoration: underline;
	}

/*--- li current : currently selected item (see html) --- */

/* top level */
.nav li.current,
.nav li.current:hover,
.nav li.current.sfHover,
.nav li.current.sfHover:hover {
	background-position: right 0;
	}

.nav li.current a,
.nav li.current:hover a,
.nav li.current.sfHover a,
.nav li.current.sfHover:hover a {
	background-position: 0 0;
	/*font-weight: bold;*/
	color: #fff;
	}

.nav li.current a,
.nav li.current:hover a {
	color: #fff;
	}

/*--- current tab, but not active (class name changed dynamically) --- */
.nav li.currentOff:hover a,
.nav li.currentOff a {
	height: 18px; /*<- create a 1px gap - see "nav a" styles */
	}

/* hover */
.nav li.current:hover li a {
	color: #fff;
	}

/* 2nd level : inherited current status */
.nav li.current li a,
.nav li.current:hover li a,
.nav li.current.sfHover li a,
.nav li.current.sfHover:hover li a {
	color: #fff;
	height: auto;
	font-weight: normal;
	}

/* 2nd level : declared current status */
.nav li li.current a,
.nav li li.current a:hover,
.nav li.current:hover li.current a,
.nav li.current li.current a:hover,
.nav li.current.sfHover li.current a {
	font-weight: bold;
	text-decoration: none;
	}

/* 2nd level - selected (declared) hover */
.nav li.current li:hover a {
	color: #fff;
	}

/* 2nd level - selected (declared) hover */
.nav li li.current:hover a {
	text-decoration:underline;
	}

/*--- li hover (dynamically added to html) --- */

/* top level */
.nav li:hover,
.nav li.sfHover:hover,
.nav li.sfHover {
	background-position: right 0;
	}

/*.nav li:hover a,*/
.nav li:hover a,
.nav li.sfHover a,
.nav li.sfHover a:focus, 
.nav li.sfHover a:hover, 
.nav li.sfHover a:active,
.nav li.sfHover:hover a {
	background-position: left 0;
	color: #fff;
	}

/* 2nd level : inherited hover status */

.nav li.sfHover li a,
.nav li.sfHover li a:focus, 
.nav li.sfHover li a:hover, 
.nav li.sfHover li a:active,
.nav li.sfHover:hover li a {
	color: #fff;
	height: auto;
	background-image: none;
	}

/* 2nd level - selected (declared) hover */
.nav li.sfHover li a:hover,
.nav li.sfHover li:hover a {
	text-decoration: underline;
	background-image: none;
	}

.nav li.sfHover li.current a  {}

.nav li.sfHover li.current a:hover,
.nav li.sfHover li.current:hover a {
	text-decoration: none;
	}

.nav li:hover ul, /* pure CSS hover is removed below */
body .nav li.current ul, /* this must be more specific than the .superfish override below */
ul.nav li.sfHover ul,
ul.nav li.sfHover2 ul {
	top: 28px;
	height: 30px;
	border-bottom: 1px solid #d8d9da;
	}

.nav li:hover li ul,
.nav li.sfHover li ul {
	top:-999em;
	}

.nav li li:hover ul, /* pure CSS hover is removed below */
ul.nav li li.sfHover ul,
ul.nav li li.sfHover2 ul {
	top: 28px;
	}

/* following rule negates pure CSS hovers so submenu remains hidden and JS controls when and how it appears*/
.superfish li:hover ul,
.superfish li li:hover ul {
	top: -999em;
	}

/* ---------- Place an Ad Styles ------------- */

.nav .placeAd a{ background:transparent url(http://media.thestate.com/static/images/tabs.gif) no-repeat scroll left -100px; }

.nav a.placeAd:hover { background:transparent url(http://media.thestate.com/static/images/tabs.gif) no-repeat scroll left -150px; }

.nav .placeAd { background:transparent url(http://media.thestate.com/static/images/tabs.gif) no-repeat scroll right -100px; }

.nav li.placeAd:hover { background-position: right 0px; }