/**
 * MAIN.CSS
 *
 * @note		This file holds core styles for layout and overall site design. Other files of note are grids.css and navigation.css, which hold the basic grid and the top navigation styles respectively.
 * @author		mraichelson, awang
 *
 */

/* Need to keep importing "legacy" navbar styles for a while.  Vendor sites
   may be running old navbar HTML. Should be deleted in the fall of 2011. */
@import url(./navigation.css);

/**
 * @section Base styles
 */
@media screen,projection {
	a {outline:0} /* turn off FX's annoying anchor outline */
	html {
		margin:0;
		padding:0;
		/* Commented by mmatteo - pointless and breaks horizontal bars*/
		/*overflow:-moz-scrollbars-vertical;*/ /** @note always show vertical scrollbar in firefox */
	}
	img { -ms-interpolation-mode:bicubic; }
	body {
		margin:0;
		padding:0;
		font-family:Arial,Helvetica,sans-serif;
		font-size:12px;
		background-color:#FFF;
	}
		form { margin:0; padding:0; }

		h1,h2,h3,h4,h5 { font-weight:bold; font-family:Arial,Helvetica,sans-serif; color:#000; line-height:1em; }
		h1,h2 { font-size:26px; margin:0; line-height:1em; }
		h2 { color:#024A82 } /* article title */
		h3 { font-size:18px; padding:0; margin:0 0 16px;}
		h4 { font-size:12px; text-transform:uppercase; margin-top: 0.4em}
		h5,h6 { font-weight:normal; font-size:12px; margin-bottom:8px; }

		#story_headline { color: #024A82; } /* article Title -- needs to be an H1 for SEO -- rwm 7/16/08 */
		h3#story_overline  { color: #AAAAAA; margin-bottom: 3px; font-size:18px; }
		h2#story_subheadline  { color: #777777; font-size: 20px; margin-top: 3px; }

		div.img { overflow:hidden; }
		span.timestamp {font-size:11px; font-weight:normal}
		a:link,a:visited { text-decoration:none; color:#024A82; }
		a:focus,a:hover,a:active { text-decoration:underline; }
		a img { border-style:none; }
		h3 a:hover, h3 a:visited, h3 a:hover, h3 a:active { color:#000; }
		abbr,acronym { text-decoration:none; border-style:none; }
		a:focus abbr, a:hover abbr, a:active abbr,
		a:focus acronym, a:hover acronym, a:active acronym {
			text-decoration:underline;
		}
		hr.tier {
			height:1px;
			padding:0;
			margin:20px 0;
			border:0 none;
			border-top:1px solid #BBB;
		}
		/* styling divs cross browser is almost impossible,
		 * thus use a div */
		div.hr {
			background:#BBB;
			padding-top:2px;
			margin:18px 0;
		}
	/**
	 * @workaround	adjust default top margins on items in firefox
	 */
	 /* * { margin-top:0; }*/

	/**
	 * @section baseline settings for form elements
	 */
	textarea { overflow:auto; }
	form { padding:0; margin:0; }
	input { vertical-align:middle; }

	/**
	 * @section reusable classes for applying floats
	 */
	.f-left { float:left; line-height:1em; display:inline; margin-right:0px; }
	.f-right { float:right; line-height:1em; display:inline; margin-left:8px; }

	/**
	 * @note div.wrapper is used within a full-width block to restrict content to
	 * the overall width of the actual design.
	 */
	div.wrapper {
		width:990px;
		margin:0 auto;
	}



	/**
	 * @section Table Setting Reset
	 * @note removes most default styles for tables and applies appropriate ones.
	 */
	table.void {
		margin:0 0 1em;
		padding:0;
		width:100%;
		border-spacing:0;
		border-collapse:collapse;
	}
		table.void td {
			vertical-align:top;
			font-size:1em;
			padding:4px 0;
			margin:0;
			text-align:left
		}
		table.void td.pr {
			padding-right:10px;
		}
		table.void th {
			font-size:1em;
			vertical-align:top;
			font-weight:bold;
			padding:0;
			margin:0;
			text-align:left;
			text-transform:uppercase;
		}
		table.void tr.label td {
			padding:4px 0 0 0;
		}
		table.void tr.repad td {
			padding:0 0 4px 0;
		}

	/**
	 * @section Zebra Tables and Lists
	 * @note List and table with alternating color rows.
	 * requires jQuery and code in sacbee.js
	 */
	table.zebra {
		margin:0 0 8px;
		padding:0;
		width:100%;
		border-spacing:0;
		border-collapse:collapse;
	}
		table.zebra td {
			vertical-align:top;
			font-size:1em;
			padding:2px 5px;
			margin:0;
			text-align:left;
		}
		table.zebra tr.odd td { background-color:#edf3f5; }
	ul.zebra {padding:0}
	ul.zebra li {margin:0; background:#FFFFFF; }
	ul.zebra .odd { background:#EDF3F5 }


/**
 * @section Big structural classes
 * @note Things that are too stylistic to go in grids.css, but are part of the "base template".
 * This includes things like the header, footer, rail, etc.
 */
	/**
	 * @section Page Header
	 * @note The page header relies heavily on absolute positioning inside relatively positioned elements.
	 */
	div#header {
		background:#FFF url(http://media.sacbee.com/static/img/header-top-bg-sm.gif) top repeat-x;
		height:178px;
		border-bottom:1px solid #BBB;
		position:relative;
		margin-bottom:20px;
		overflow:visible;
		z-index:2; /* don't touch this */
	}
	#home div#header {
		background-image: url(http://media.sacbee.com/static/img/header-top-bg.gif); /* home page w/ big branding needs a big bg */
	}
	#popup div#header {
		height: 64px;
		background-image: url(http://media.sacbee.com/static/img/header-top-bg.gif);
	}
	#popup div.standalone {
		padding: 7px 5px 5px 5px;
		margin: auto;
	}

	/**
	 * @section Header Branding
	 * @note holds the logo and section title in the page header.
	 */
	#branding {
		width:990px;
	}
		#branding h1 {
			height:43px;
			line-height:60px;
			text-align:center;
			vertical-align:baseline;
		}
		#branding h1 a { color:#000; margin-right:11px; }
		#branding h1 a:hover { text-decoration:none; }
		#branding h1 img { position:absolute; left:0; top:0 }

	/**
	 * @section Header Date
	 * @note holds the current date and the optional "last updated" text at the top of the page.
	 */
	#headerdate {
		position:absolute;
		left:12px;
		top:137px;
		height:41px;
		line-height:41px;
		z-index:1;
	}

	/**
	 * @section User Tools bar in page header
	 * @note Contains global sign in link, newsletters, subscribe
	 */
	#usertools {
		padding-top:7px;
		width:990px;
		height:29px;
		font-size:12px;
		line-height:29px;
		border-bottom:1px solid #BBB;
		z-index:15;
	}
		#usertools img {
			vertical-align:middle;
			margin-right:3px;
		}
		#usertools ul {
			padding:0;
			margin:0;
			z-index:15;
		}
		#usertools ul li {
			list-style-type:none;
			float:left;
			display:inline;
			height:29px;
			padding:0 3px;
			position:relative;
			z-index:15;
		}
		#usertools ul li.right { float:right; }
		#usertools ul li.user { padding-left:0; }
		#usertools ul li a,
		#usertools ul li span {
			padding-right:6px;
			border-right:1px solid #ccc;
		}
		#usertools ul li.last a {
			padding-right:0;
			border-right-style:none;
		}
			div#insite_links li {
				padding-top:1px;
			}
			div#usertools ul li div.readerservices-menu {
				color:#136aa8;
				cursor:pointer;
				padding-top:1px;
			}
			div#usertools ul li.active div.readerservices-menu {
				border:1px solid #98afcb !important;
				border-bottom-style:none !important;
				margin-left:-7px;
				margin-top:-5px;
				padding-top:5px;
				margin-right:-1px;
				padding-left:6px;
			}
			div#usertools ul li div.readerservices-menu a {
				padding-right:24px;
				background-image:url(http://media.sacbee.com/static/img/readerservices-arrow-up.gif);
				background-repeat:no-repeat;
				background-position:100% 50%;
			}
			div#usertools ul li.active div.readerservices-menu a {
				border-color:#fff;
				background-image:url(http://media.sacbee.com/static/img/readerservices-arrow-down.gif);
			}
			div#usertools div.readerservices-dropdown {
				display:none;
				position:absolute;
				left:-4px;
				top:100%;
				width:225px;
				background-color:#fff;
				border:1px solid #98afcb;
				border-top-style:none;
				z-index:15;
				padding-top:5px;
				line-height:22px;
			}
			div#usertools li.active div.readerservices-dropdown { display:block; padding-top:10px; }
			div#usertools div.readerservices-dropdown ul {
				padding:0 12px 10px;
				clear:both;
				display:block;
			}
			div#usertools div.readerservices-dropdown ul li {
				display:block !important;
				height:auto;
				padding:0 !important;
				float:none;
			}
			div#usertools div.readerservices-dropdown ul li a {
				padding-right:0;
				border-style:none;
			}

	/**
	 * @section Header Search
	 * @note Styles for the header search field and the associated dropdown.
	 */
	#headersearch {
		position:absolute;
		width:100%;
		left:0;
		top:137px;
		height:41px;
		line-height:41px;
		background:#FFF url(http://media.sacbee.com/static/img/header-search-bg.gif) bottom repeat-x;
		font-size:12px;
		z-index:0;
	}
		#headersearch div.searchmain {
			font-size:10px;
			position:absolute;
			left:347px;
		}
		#headersearch span.yahoo { color:#7B0099; }
		#headersearch div.searchmain input#q {
			background:url(http://media.sacbee.com/static/img/header-search-mag.png) 0 0 no-repeat;
			padding:2px 2px 2px 32px;
			border:1px solid #999;
			margin:0 5px 0 0;
			width:187px;
			height:14px;
		}
		#headersearch div.searchmain .button {
			margin:0 34px 0 0;
			display:inline;
			position:relative;
			top:7px;
			line-height:20px; /* IE fix */
		}
		#headersearch div.searchmain div.controller {
			width:34px;
			position:absolute;
			left:303px;
			z-index:10;
			top:13px;
		}
		#headersearch div.searchmain div.controller span { display:none; }
		#headersearch div.searchdropdown {
			position:absolute;
			border:1px solid #CCC;
			border-top-style:none;
			background-color:#EFEFED;
			width:317px;
			padding:0 4px 10px;
			left:346px;
			top:41px;
			text-align:left;
			display:none;
			line-height:25px;
			z-index:10;
		}
		#headersearch div.searchdropdown label { padding-right:0.5em; }
	/**
	 * @section Weather and Traffic
	 * @note styles for the weather/traffic area in the page header.
	 */
	#weathertraffic {
		position:absolute;
		top:20px;
		right:40px;
		width:230px;
		height:50px;
	}
		#weathertraffic img {
			vertical-align:middle;
		}
		#weathertraffic .temperature {
			color:#FFF;
			background:url(http://media.sacbee.com/static/img/weather-temp-bg.gif) no-repeat;
			width:53px;
			height:23px;
			line-height:23px;
			font-weight:bold;
			text-align:center;
			position:absolute;
			right:0;
			top:5px;
		}


	/**
	 * @section Top widgets
	 * @note General styles for the top widgets,
	 * This includes the social widget and third level navigation on the Sports page.
	 * Further third level navigation styles are in navigation.css.
	 */
	div.subsubnav,
	div#socialwidget {
		font-size:12px;
		border-bottom:1px solid #023D5B;
		margin-bottom:13px;
		background:url(http://media.sacbee.com/static/img/body-widget-bg.gif) bottom repeat-x;
		height:30px;
		line-height:30px;
	}
	/**
	 * Copy of social widget for the comment discovery widget
	 */
	div#discovery {
		border-bottom:1px solid #ccc;
		margin:5px 3px;
		padding: 2px 2px 0px 5px;
		background:url(http://media.sacbee.com/static/img/body-widget-bg.gif) bottom repeat-x;
		height:20px;
		line-height:20px;
	}


	/**
	 * @section Social Widget
	 * @note used for the RSS/Share/Print links at the top of the right rail
	 */
		div#socialwidget ul {
			padding:0;
			margin:0;
		}
		div#socialwidget ul li {
			float:left;
			padding:0 0 0 8px;
			margin-right:4px;
			list-style-type:none;
		}
		div#socialwidget ul li a { padding-right:1em; border-right:1px solid #ccc;}
		div#socialwidget ul li.last {
			margin-right:0;
		}
		div#socialwidget ul li.last a { padding-right:0; border-right-style:none; }
		div#socialwidget li#social-dropdown div.ctrl a {
			float:left;
			width:45px;
			background-image:url(http://media.sacbee.com/static/img/readerservices-arrow.gif);
			background-position:100% 13px;
			background-repeat:no-repeat;
			margin-right:24px;
		}
		div#socialwidget li#social-dropdown div.ctrl a.active {
			background-position:right -18px
		}
		div#socialwidget li#social-dropdown {
			position:relative;
		}
		div#socialwidget li#social-dropdown div.dropdown {
			position:absolute;
			top:30px;
			left:-0.5em;
			width:100%;
			height:auto;
			background-color:#E4EDF4;
			padding:10px;
			border:1px solid #023D5B;
			border-bottom-width:2px;
			border-top:0;
			display:none;
		}
		div#socialwidget li#social-dropdown div.dropdown ul li {
			display:block;
			float:none !important;
			position:static;
			padding-right:0 !important;
			margin-right:0 !important;
			margin-bottom:5px;
			line-height:1em;
			height:auto;
		}

	/**
	 * @section Page Body
	 */
	div#pagebody {
		white-space: normal;	/* Fix for broken layout caused by ads in IE */
	}

	/**
	 * @section Page Footer
	 * @note holds the Contact/Correction/Advertising/Etc. links at the bottom of the page.
	 */
	body div#footer {
		border-top:1px solid #98afcb;
		margin-bottom:0;
		padding:0;
	}
		div#footer div.wrapper {
			padding:20px 0;
		}
		div#footer div.cols {
			width:990px;
			margin:0 auto;
			font-size:12px;
			background-color:#EFF6FE;
		}
		div#footer div.col1 {
			background-position:-2px 0
		}
		/* Have to manually set the col widths */
		div#footer div.cols div.col1,
		div#footer div.cols div.col2,
		div#footer div.cols div.col3,
		div#footer div.cols div.col4 {
			width:187px;
			padding:15px 15px 15px 45px;
			background-image:url(http://media.sacbee.com/static/img/footer-bg.gif);
			float:left;
			display:inline;
		}
		/* need 2px total more width to get 990px */
		div#footer div.cols div.col2,
		div#footer div.cols div.col3 {
			width:188px;
		}
		div#footer ul {
			padding:0;
			margin:0;
		}
		div#footer ul li {
			padding:0;
			margin:0 0 4px;
			margin-left:1em;
		}
	/**
	 * @section McClatchy Footer links
	 * @note used to hold McClatchy links at the end of the page.
	 */
	div#mcclatchy {
		border-top:1px solid #98afcb;
		padding:0;
		background:#82B7DB;
		color:#FFF;
		padding:0.5em;
	}
		div#mcclatchy .links {}
			div#mcclatchy .links ul {
				padding:0;
				margin:0;
			}
			div#mcclatchy .links ul li {
				list-style-type:none;
				float:left;
				display:inline;
				margin:0 1em 0 0;
				padding:0 1em 0 0;
				border-right:1px solid #ccc;
			}
			div#mcclatchy .links ul li a {
				color:#FFF;
			}
			div#mcclatchy .links ul li.last {
				padding-right:0;
				margin-right:0;
				border-right-style:none;
			}
			div#mcclatchy .links ul li.rclogo {
				padding-right:0;
				margin-right:0;
				border-right-style:none;
				float:right;
			}
			div#mcclatchy .links img { vertical-align:middle; }
/**
 * @section Generic content styles
 * @note Varied things like headings, lists found mainly in the content. No boxes though, that comes next.
 */
	/**
	 * @section Small Black Headers
	 * @note creates the small bold black headers in all-caps. Wide range of uses.
	 */
	div.header {
			text-transform:uppercase;
			font-size:12px;
			color:#000;
			line-height:1.25em;
			font-weight:bold;
			margin-bottom:8px;
		}
	div.header a:link,
	div.header a:visited
		{ color:#000; }
	div.header a:hover,
	div.header a:active
			{ color:#000; }
	/**
	 * @note author byline, wide range of uses
	 */
	div.byline {
		font-size:11px;
		margin:8px 0;
	}

/**
 * @section Generic box styles
 * @note Many types of boxes, be they in content or rail. This is where the styles are.
 */
	/**
	 * @section Box
	 * @note used to create a simple outlined boxes, sometimes with light grey background color.
	 */
	div.box {
		border:1px solid #ccc;
		border-bottom-width:2px;
		clear:both;
		margin-bottom:8px;
	}

	/**
	 * @section Shaded Box
	 * @note general purpose classes to make shaded top and bottom dividers. Some styles are specific to div.insert in the article view.
	 */
	.boxshade {
		/*background:url(http://media.sacbee.com/static/img/body-shade-bg.gif) top repeat-x;*/
		border-top:2px solid #CCC;
		margin:0;
		padding:1em 0 0 0;
	}
	.boxshade-end {
		/*background:url(http://media.sacbee.com/static/img/body-shade-bg.gif) bottom repeat-x;*/
		border-bottom:2px solid #CCC;
		padding:0 0 1em 0;
		margin:0 0 14px 0;
	}
	.insert .boxshade {
		padding:1em 1em 0;
	}
	.insert .boxshade-end {
		margin-bottom:8px;
	}
	.boxshade q {
		display:block;
		padding-bottom:1em;
	}
	.boxshade .header {
		text-transform:uppercase;
		font-weight:bold;
	}
	.boxshade .title {
		font-weight:bold;
		font-size:16px;
	}
	.boxshade .img {
		float:left;
	/*	margin:0 20px 1em 0; 8/27/08 rwm */
	/*	border:1px solid #EEE; */
	}
	/**
	 * @section Header Box
	 * @note Makes a box with a pretty image background header
	 */
	.boxheader {
		border-width:0 1px 1px;
		/*margin-top:12px;*/
	}
	.lower .header,
	.boxheader .header {
		background:#043d5a url(http://media.sacbee.com/static/img/header-box-bg.gif) repeat-x;
		color:#FFF;
		height:31px;
		line-height:31px;
		text-indent:10px;
		margin:0;
		position:relative;
	}
	.boxheader_vip .header_vip {
		background:url(http://media.sacbee.com/static/images/vip/vip_widget_header.jpg);
		color:#03486A;
		height:31px;
		line-height:31px;
		text-indent:10px;
		margin:0;
		position:relative;
		font-size:18px;
		font-weight:bold;
		font-family:"Lucida Sans Unicode","Lucida Grande",sans-serif;
		margin-bottom:0px;
	}
	div.boxheader div.header a:link,
	div.boxheader div.header a:visited,
	div.boxheader div.header a:hover,
	div.boxheader div.header a:active
	{color:#FFF}

	.boxheader .f-right {
		position:absolute;
		right:10px;
		top:0;
		height:31px;
		line-height:31px;
	}

	/* Padded, sometimes gray, box inside of boxheader */
	.boxheader .block {
		border:1px solid #CCC;
		border-top:0;
		padding:10px 10px 0;
	}
	.boxheader .gray { background:#DDD; }

	/* table styles */
	.boxheader th {
		background:#DDD;
		text-align:left;
		text-indent:1em;
		text-transform:uppercase;
		font-size:11px;
	}
	.boxheader table {
		background:#DDD;
		width:320px;
		border-collapse:collapse;
		border-left:1px solid #CCC;
		margin:0;
	}
	/* Firefox CSS hack to fix border alignment */
	html:not([xmlns*=""]) .boxheader table {
		width:319px;
		margin-left:1px;
	}
	.boxheader th,
	.boxheader td {
		font-weight:bold;
		border:1px solid #CCC;
	}
	.boxheader td {
		color:#999;
		background:#FFF;
		font-size:18px;
		font-weight:bold;
		text-align:center;
	}
	/*
	 * @note Highlighted row styles
	 */
	.boxheader .high td {
		background:#F3FBFD;
	}
	.boxheader tr td.nohigh {
		background-color:#FFF;
		width:61px;
	}

	/**
	 * @section Tabbed Boxes
	 * @note uses the jQuery UI Tabs plugin
	 */
	div.ui-tabs-hide {
		display:none;
	}
	div.tabbed ul.tabs {
		padding:0;
		margin:0;
		height:30px;
		border-bottom:1px solid #bbb;
	}
	div.tabbed ul.tabs li {
		background:url(http://www.sacbee.com/static/img/body-tab.png) top left no-repeat;
		height:30px;
		line-height:30px;
		list-style-type:none;
		float:left;
		font-size:11px;
		font-weight:bold;
		padding-left:8px;
		text-align:center;
	}
	div.tabbed ul.tabs li a {
		color:#FFF;
		text-transform:uppercase;
		height:30px;
		background:url(http://www.sacbee.com/static/img/body-tab.png) top right no-repeat;
		display:block;
		padding-right:8px;
	}
	div.tabbed ul.tabs li.ui-tabs-selected {
		background:url(http://www.sacbee.com/static/img/body-tab.png) bottom left no-repeat;
		height:31px;
	}
	div.tabbed ul.tabs li.ui-tabs-selected a {
		color:#000;
		height:31px;
		text-decoration:none;
		cursor:text;
		background:url(http://www.sacbee.com/static/img/body-tab.png) bottom right no-repeat;
	}
	div#cb-tabbed ul.tabs li.ui-tabs-selected a { color:#006; }
	div.tabbody {
		padding:10px;
		border:1px solid #bbb;
		border-top-style:none;
	}
	div.tabbody ul li {
		display:block;
		float:none;
	}
	/**
	 * @note special settings for tabbed top news story-list
	 */
	.content .tabbed .stories .first {
		padding-top:20px;
	}
	.rail .tabbed .stories .first {
		padding-top:18px;
	}
	div.tabbed .three {
		width: 85px;
		margin-left: 4px;
	}
	div.tabbed .latest {
		width:65px;
	}
	div.tabbed .viewed {
		width:100px;
		margin-left:4px;
	}
	div.tabbed .ncaatab {
		width:91px;
		margin-left:4px;
	}
	div.tabbed .commented {
		width:120px;
		margin-left:4px;
	}
	div.tabbed .recommended {
		width:101px;
		margin-left:4px;
	}
	div.railunit div.tabbed .viewed {
		width:101px;
		margin-left:4px;
	}
	div.railunit div.tabbed .commented {
		width:81px;
		margin-left:2px;
	}
	div.railunit div.tabbed .recommended {
		width:95px;
		margin-left:2px;
	}
	div.story-list div.button {
		margin-top:0;
		padding:9px 0 15px;
		display:block;
	}
	div.tabbed div.button {
		padding-left:9px;
	}
	.content div.tabbed div ul.stories li {
		padding-left:9px;
	}
	/**
	 * @note General class for two equal width tabs.
	 */
	/* Content grid tabs */
	.grid-ab .two-tabbed,
	.grid-cd .two-tabbed {
		margin:0 0 12px;
		padding:0;
	}
	/* Content grid: 320px total width */
	.grid-ab div.two-tabbed .tabs li,
	.grid-cd div.two-tabbed .tabs li {
		width:150px;
	}
	/* Rail: 300px total width */
	.rail div.two-tabbed .tabs li {
		width:140px;
	}
	/* spacing between tabs */
	.two-tabbed .tabs li.last {
		margin-left:4px;
	}


/**
 * @section Button styles
 * @note Button styles, be they generic or specific, go here.
 */
	/**
	 * @section Generic button link
	 * @note Easy to use, flexible button links. Comes in three flavors: large black, small black, small orange.
	 * Apply the styles "button-sm" and "button-org" in addition to "button" for mix and match; i.e. "button button-sm button-org" yields a small orange button.
	 * Can also easily be used as a form submit: <button type="submit">
	 */
	.button { padding-bottom:10px }
	/* bad IE hacks for 6 + 7 */
	*:first-child+html span.button,
	 * html span.button {
		vertical-align:bottom
	}
	/* set the left side of the button image on the anchor */
	.button a {
		height:24px;
		background:url(http://media.sacbee.com/static/img/button.gif) left top no-repeat;
		text-align:center;
		padding:0 0 0 8px;
		display:inline-block;
	}
	.button-sm a {
		height:20px;
		background:url(http://media.sacbee.com/static/img/button-sm.gif) left top no-repeat;
	}
	body .button-org a {
		background:url(http://media.sacbee.com/static/img/button-sm-orange.gif) left top no-repeat;
	}

	/* set the right side of the button image on the button */
	.button button {
		font-family:Arial, Helvetica, sans-serif;
		background:transparent url(http://media.sacbee.com/static/img/button.gif) right -24px no-repeat;
		border:0;
		color:#FFF;
		padding:0 8px 3px 0;
		cursor:pointer;
		margin:0;
		height:24px;
		line-height:24px;
		font-size:12px;
		overflow:visible; /* IE fix */
	}
	.button-sm button {
		height:20px;
		line-height:20px;
		background-image:url(http://media.sacbee.com/static/img/button-sm.gif);
		background-repeat:no-repeat;
		background-position:right -20px;
	}
	 * html .button button { line-height:20px; }
	 * html .button-sm button { line-height:16px; }

	body .button-org button {
		background-image:url(http://media.sacbee.com/static/img/button-sm-orange.gif);
	}

	.button button[type=submit] {
		text-transform:uppercase;
	}

	/* fixed width button, seen on Sports page */
	.button-fixed button {
		width:160px;
	}

	/* search button, which means smaller fixed width */
	.button-search button {
		width:68px;
		padding-right:3px;
		background: transparent;
	}
	.button-search a {
		padding-left:3px;
		background: transparent;
	}

	/* fix ff2 button left side display problem */
	div.gridunit div.button { height:24px; }
	div.gridunit div.button a { float:left; }

	/**
	 * @section Signup Button
	 * @note simple "Signup for breaking news" button
	 */
	#signup {
		text-align:center;
	}
	.content #signup {
		padding:20px 0;
		margin:12px 0 0;
		border:2px solid #999;
		border-width:2px 0;
	}

	/**
	 * @section MyCapture "By Photo" buttons
	 */
	.mycapture.button {
		height:24px;
		background:url(http://media.sacbee.com/static/img/button.gif) left top no-repeat;
		text-align:center;
		padding:0 0 0 8px;
		display:inline-block;
		margin-bottom: 7px;
	}

/*
 * @section Image sprites
 * @note Major image sprites should go here, even if they are somewhat page specific.
 * One off sprites (like the up/down toggle in social) can stay there
 * Image spriting is great because it reduces HTTP requests and thus page load time.
 */
	/**
	 * @section Icons
	 * @note These are used to draw importance and clarify links, buttons, headers, and actions.
	 */
	ul.links {padding:0; margin:0 0 12px; color:#024A82}
	ul.links li {margin:0 0 0 1.25em; padding:0; }
	ul.links li.icon {
		margin-left:0;
		list-style:none;
	}
	.icon-bullet,
	.icon-user,
	.icon-comment,
	.icon-video,
	.icon-arrow,
	.icon-picture,
	.icon-rss,
	.icon-share,
	.icon-drop, /* unused */
	.icon-add,
	.icon-bigarrow,
	.icon-print,
	.icon-down,
	.icon-up,
	.icon-email {
		background:url(http://media.sacbee.com/static/img/icon-spritesheet.gif) top left no-repeat;
		display:inline-block;
		margin-right:4px;
		width:16px;
		height:14px;
	}
	.icon-bullet { background-position:0 -5px; margin:0; width:15px; }
	#usertools li span.icon-user { width:20px; height:19px; background-position:-122px 0; border:0; position:relative; top:4px; margin-right:5px; padding-right:0; float:left;}
	span.icon-comment {background-position:-16px -5px;}
	span.icon-video {background-position:-32px -5px;}
	span.icon-arrow {height:12px;width:12px; background-position:-48px -6px;}
	*:first-child+html span.icon-arrow {background-position:-48px -8px; }
	span.icon-picture {background-position:-64px -5px;}
	span.icon-rss {width:14px; float:left; margin-top:7px; background-position:-84px -5px;}
	span.icon-share {float:left; margin-top:7px; background-position:-98px -5px;}
	span.icon-drop {width:8px; margin:0 5px; background-position:-114px -5px;}
	span.icon-add {background-position:-142px -5px;}
	span.icon-bigarrow {background-position:-158px -6px; line-height:22px; vertical-align:middle;}
	span.icon-print {background-position:-174px -5px; }
	span.icon-email {background-position:-190px -5px; }
	span.icon-up	{background-position:-206px -5px; }
	span.icon-down  {background-position:-222px -5px; }

	.icon-sc {
		background:url(http://www.sacbee.com/static/img/sac_connect14.png) top left no-repeat;
		display:inline-block;
		margin-right:4px;
		width:14px;
		height:14px;
	}

	/**
	 * @section Sports Teams
	 * @note Sprites for the logos for sports teams, this should be easily extendable for more teams.
	 */
	.team {
		display:block;
		float:left;
		width:61px;
		height:43px;
		border:1px solid #FFF;
		background:#FFF url(http://media.sacbee.com/static/img/sports-teams.jpg) top no-repeat;
	}
	.nba {
		display:block;
		float:left;
		width:61px;
		height:43px;
		border:1px solid #FFF;
		background:#FFF url(http://media.sacbee.com/static/img/nba-teams.jpg) top no-repeat;
	}
	.nfl {
		display:block;
		float:left;
		width:61px;
		height:43px;
		border:1px solid #FFF;
		background:#FFF url(http://media.sacbee.com/static/img/nfl-teams.jpg) top no-repeat;
	}
	.mlb {
		display:block;
		float:left;
		width:61px;
		height:43px;
		border:1px solid #FFF;
		background:#FFF url(http://media.sacbee.com/static/img/mlb-teams.jpg) top no-repeat;
	}
	.wnba {
		display:block;
		float:left;
		width:61px;
		height:43px;
		border:1px solid #FFF;
		background:#FFF url(http://media.sacbee.com/static/img/nba-teams.jpg) top no-repeat;
	}
	.nhl {
		display:block;
		float:left;
		width:61px;
		height:43px;
		border:1px solid #FFF;
		background:#FFF url(http://media.sacbee.com/static/img/nhl-teams.jpg) top no-repeat;
	}
	.ncaa {
		display:block;
		float:left;
		width:61px;
		height:43px;
		border:1px solid #FFF;
		background:#FFF url(http://media.sacbee.com/static/img/ncaa-teams.jpg) top no-repeat;
	}
	.team-celtics {background-position: 0 0; }
	.team-lakers {background-position:0 -43px}
	.team-kings {background-position:0 -86px}
	.team-clippers {background-position:0 -129px}
	.team-warriors {background-position:0 -172px}
/*
 * @section Bigger generic content styles
 * @note For content widgets that are more than the application of many generic styles, and see reuse on different pages.
 */
	/**
	 * @section Multimedia Bar
	 * @note styles for the multimedia content switching bar.
	 * used on the homepage and most section landing pages.
	 */
	div#multimediabar {
		height:240px;
		background:url(http://media.sacbee.com/static/img/mm-bar.gif) left bottom repeat-x;
		overflow:hidden;
		position:relative;
		border:1px solid #BBB;
	}
		div#multimediabar a { color:#024A82;}
		div#multimediabar div.mm-panels a {
			/*font-family:Georgia, serif;*/
			text-decoration:none;
		}

		div#multimediabar div.mm-panels a:hover { text-decoration:underline; }

		/* mm-links define the tabs that switch between mm-panelsets */
		div#multimediabar ul.mm-links {
			padding:0;
			margin:0;
			list-style:none;
			overflow:auto;
			background:url(http://media.sacbee.com/static/img/header-box-bg.gif) repeat-x;
			width:968px; /* IE fix */
		}
		div#multimediabar .mm-links li {
			float:left;
			position:relative;
		}
		div#multimediabar .mm-links li.active {
			background:#FFF;
		}
		div #multimediabar .mm-links li.active a {
			color:#000;
			font-weight:bold;
		}
		/* Only show the icon for the selected tab */
		div #multimediabar .mm-links li .icon {display:none}
		div #multimediabar .mm-links li.active .icon {
			display:inline-block;
			margin:0 15px 0 -15px;
		}
		div#multimediabar .mm-links a {
			height:31px;
			line-height:31px;
			padding:0 2em;
			text-transform:uppercase;
			color:#FFF;
		}

		/* JS reliant spacer border, because CSS doesn't cut it */
		div#multimediabar .mm-links.mm-panelset1 .two a {
			border-right:1px solid #FFF;
		}
		div#multimediabar .mm-links.mm-panelset1 .three a {
			border-right:1px solid #FFF;
		}
		div#multimediabar .mm-links.mm-panelset1 .four a {
			border-right:1px solid #FFF;
		}
		div#multimediabar .mm-links.mm-panelset2 .three a {
			border-right:1px solid #FFF;
		}
		div#multimediabar .mm-links.mm-panelset2 .four a {
			border-right:1px solid #FFF;
		}
		div#multimediabar .mm-links.mm-panelset3 .one a {
			border-right:1px solid #FFF;
		}
		div#multimediabar .mm-links.mm-panelset3 .four a {
			border-right:1px solid #FFF;
		}
		div#multimediabar .mm-links.mm-panelset4 .one a {
			border-right:1px solid #FFF;
		}
		div#multimediabar .mm-links.mm-panelset4 .two a {
			border-right:1px solid #FFF;
		}
		div#multimediabar .mm-links.mm-panelset5 .one a {
			border-right:1px solid #FFF;
		}
		div#multimediabar .mm-links.mm-panelset5 .two a {
			border-right:1px solid #FFF;
		}
		div#multimediabar .mm-links.mm-panelset5 .three a {
			border-right:1px solid #FFF;
		}

		/* next/prev (or left/right) buttons */
		div#multimediabar div.mm-left {
			width:27px;
			height:27px;
			line-height:0;
			position:absolute;
			left:14px;
			top:95px;
		}
		div#multimediabar div.mm-right {
			width:27px;
			height:27px;
			line-height:0;
			position:absolute;
			right:14px;
			top:95px;
		}
		div#multimediabar div.mm-panels {
			position:absolute;
			left:49px;
			top:50px;
			height:180px;
			overflow:hidden;
			width:864px;
		}
		div#multimediabar div.mm-panels div.mm-panel {
			height:160px;
			width:930px;
			/*background-image:url(http://media.sacbee.com/static/img/mm-panels-bg.gif);*/
			/*background-repeat:repeat-y;*/
		}
		div#multimediabar div.mm-panels ul {
			padding:0 0 0 18px;
			margin:0;
		}
		div#multimediabar div.mm-panels ul li {
			padding:0;
			margin:0 45px 0 0;
			float:left;
			display:inline;
			width:177px;
			list-style-type:none;
		}
		div#multimediabar div.mm-panels ul li.last { margin-right:0; }
			div#multimediabar div.mm-panels div.img {
				line-height:0;
				border:1px solid #024a82;
				margin-bottom:5px;
				text-align: center;
				height: 116px;
				background: black;
			}
			div#multimediabar div.mm-panels div.txt {
				line-height:1.2em;
			}
		div#multimediabar div.mm-panelset {display:none}
		div#multimediabar div.mm-panelset-first {display:block}
		div#multimediabar div.mm-footer {
			top: 220px;
			left: 20px;
			right: 20px;
			position: absolute;
			text-align: center;
			font-weight: bold;
			width: 926px;
		}

/*
 * @section Story related styles
 * @note Formatting for the display of teasers, teasers with images, lists of stories, etc.
 */
	/**
	 * @section Highlighted Stories
	 * @note used for lists of stories on the home and landing pages.
	 * The last item should have the class "last" applied to it.
	 */
	.highlights {
		margin-bottom:8px;
	}
	div.highlights .story {
		border-bottom:2px solid #DBDBDB;
		overflow:hidden;
		/* overflow:auto;  rwm 8/19/08 */
		padding:0 0 14px 0;
		margin:0;
	}
	div.highlights .title {
		padding:12px 0 0 0;
		margin:0;
		font-size:18px;
		font-weight:bold;
	}
	.highlights .teaser p {
		margin:0;
	}
	div.highlights .img {
		float:left;
		width:auto;
	/*	padding-right:10px;  8/27/08 rwm */
	}

	.autohighlights {
		margin-bottom:8px;
	}
	div.autohighlights .story {
		border-bottom:2px solid #DBDBDB;
		overflow:auto;
		padding:0 0 14px 0;
		margin:0;
	}
	div.autohighlights .title {
		padding:12px 0 0 0;
		margin:0;
		font-size:18px;
		font-weight:bold;
	}
	.autohighlights .teaser p {
		margin:0;
	}
	div.autohighlights .img {
		float:left;
		width:auto;
		padding-right:10px;
	}

	/**
	 * @section Story Highlight
	 * @note Within .highlights, a story can be marked for being "really highlighted", meaning a larger title and optionally with a big picture.
	 */
	div.highlights div.story-top {
		border-bottom:2px solid #BBB;
		margin-bottom:8px;
	}
		div.story-top .block {
			padding:0 10px;
		}
		div.story-top .title {
			font-size:24px;
			font-weight:bold;
			margin-bottom:8px;
			padding:0;
		}
		.subtitle {
			color:#024A82;
			margin-bottom:8px;
			line-height:1.3em;
			font-size:1.2em;
			font-weight:bold;
		}
		div.story-top .subtitle { margin-bottom:8px; }
		/* div.story-top .links { clear:both; } rwm 8/4/08 */

		.boxshade .links,
		div.story-top .links {
			font-size:12px;
			margin:0;
			padding:0;
		}
		.boxshade .links li,
		.story-top .links li {
			margin-top:8px;
		}
		/*
		 * @note Styles to override story-top when there is a large image present. Apply both classes to the highlight.
		 */
		.story-top-img {
			background : transparent url(http://media.sacbee.com/static/img/body-gradient-big.gif) repeat-x scroll 0 0px;
			/*border-style:solid;
			border-color:#BBB;
			border-width:1px 1px 2px;*/
			padding:1px 1px 14px;
		}
		div.story-top-img .img {
			float:none;
			padding:1px;
		}
		div.story-top-img .img img {
		/* RWM	width:316px; */
			border:0;
		}
		.story-top-img div.title,
		.story-top-img div.subtitle,
		.story-top-img div.byline,
		.story-top-img div.teaser,
		.story-top-img ul.links {
			padding:0 9px;
		}

		/* 7/29/08 rwm -- trying to adjust for double wide stories */
		.story-top-img div.title .f-right { padding: 0 0px; }
		.story-top-img div.story { padding-bottom: 0px; }
		/*
		.story-top-img div.story-text {
			background:url(http://media.sacbee.com/static/img/body-gradient-big.gif) repeat-x 0 0px;
		} rwm 8/4/08 */

	/**
	 * @section Story List
	 * @note A horizontally divided list of story titles.
	 * The last list item should have the class "last" applied to it.
	 */
	div.story-list {
		font-size:13px;
		margin-bottom: 15px;
	}
		div.story-list h3 {margin-bottom:8px}
		div.tabbody div.story-list {
			border-top-style:none;
			padding-top:0;
		}
		div.no-top { border-top-style:none !important; padding-top:0; }
		div.story-list ul.stories {
			padding:0;
			margin:0;
			list-style:none;
		}
		div.story-list ul.stories li {
			border-bottom:1px dotted #000;
			padding:7px 0;
			margin:0;
			line-height:19px;
		}
		.last {
			border-bottom:0px dotted #000;
		}
		div.story-list ul.stories li a {
		}
		div.story-list ul.stories li.last {
			border-bottom-style:none;
			padding-bottom:0;
		}
		/*
		.grid-ab div.story-list {
			border-top:2px solid #BBB;
			margin-top:18px;
			padding:20px 0 0 0;
		}
		 */
		.lower .grid-ab div.story-list {
			border-top: 0px;
			margin-top: 0px;
			padding: 0;
		}
	/**
	 * @section Story
	 * @note an individual story listing
	 */
	div.story {
		border-bottom:2px solid #DDD;
		margin-bottom:14px;
		padding-bottom:14px;
	}
		div.tabbody div.story {
			border-bottom-style:none;
			padding-bottom:0;
			margin-bottom:0;
		}
		div.last {
			border-bottom-style:none !important;
			margin-bottom:0 !important;
			padding-bottom:0 !important;
		}
		.sectionlink {
			font-size:11px;
			line-height:11px;
			margin-bottom:8px;
			color:#000;
			text-transform:uppercase;
		}
			.sectionlink a { color:#000 !important; }
		.story .title {
			font-size:16px;
			font-weight:bold;
			line-height:1em;
			margin-bottom:8px;
		}
			.tabbody .story .title { margin-bottom:0; }
		.story .teaser {
			font-family:Georgia,"Times New Roman",Times,serif;
			line-height:1.5em;
		}
		.story .teaser p {
			margin:0;
		}
		.story-top-img .img,
		/* rwm changed margin-bottom to padding-bottom */
		.story .img { text-align:center; padding-bottom:8px; /* background-color: #e9eaef; */ }
			.story .img img { border:1px solid #eee; }
			.tabbody .story .img { width:auto; float:left; display:inline; margin-right:8px; margin-bottom:8px; }
		.story .links {
		/*	clear:both;  rwm 8/4/08 */
			padding:12px 0 0 0;
			margin:0;
		}
			.story .links ul li {
				float:left;
				display:inline;
				padding-right:5px;
				margin-right:5px;
				border-right:1px solid #ccc;
			}
			.story .links ul li.last {
				margin-right:0;
				padding-right:0;
				border-right-style:none;
			}
/**
 * @section Rail modules
 * @note Generic rail modules that get reused
 */
	/**
	 * @note Rail styles. More structural stuff can be found in grids.css.
	 */
	div.rail div.block {
		border:1px solid #bbb;
		padding:10px;
		zoom:1;
		overflow:auto;
	}
	div.rail h4 {
		padding:0 0 0 10px;
		margin:0;
		height:31px;
		line-height:31px;
		color:#FFF;
		letter-spacing:1px;
		background:url(http://media.sacbee.com/static/img/header-box-bg.gif) repeat-x;
	}
	div.rail div.blog {
		font-size:11px;
		text-transform:uppercase;
		margin-bottom:4px;
	}
	div.rail div.blog a { color:#000; }

	/**
	 * @section Rail polls
	 */
	div.poll label {
		line-height:2em;
		padding:0 1em 0 0.5em;
	}
	div.poll {
		font-family:Georgia, "Times New Roman", Times, serif;
	}
	div.poll .button {
		margin-top:1em;
		padding-bottom:0;
	}

	/**
	 * @section Bloggers and Columnists
	 */
	#bloggers {
		/* override the overzealous "railunit" classing so the spacing is proper
		   on the homepage. */
		margin-bottom: 0px;
	}
	#bloggers dl {
		margin:0;
	}
	#bloggers dt {
		text-transform:uppercase;
		font-size:11px;
		line-height:1.25em;
	}
	#bloggers dd {
		margin:2px 0 9px 0;
		padding:0 0 9px 0;
		border-bottom:1px dotted #000;
		font-size:12px;
	}
	#bloggers dd.last {
		border:0;
		padding:0;
		margin:2px 0 0 0;
	}

	/**
	 * @section Rail Stories
	 * @note Most Viewed and Most Commented tabbed widget on the rail
	 */
	#railstories .tabbed>div {
		margin-top:0;
		padding:0 10px 10px;
	}

/**
 * @section Advertising styles
 * @note Everything pertaining to ad boxes everywhere
 */
	div.ads { padding:0; margin:0; line-height:1; text-align:center; }

	/**
	 * @note Styles for ads at the top of the page
	 * This includes a 2x2 block, and also a large column width ad.
	 */
	div#leaderboard {
		width:970px;
		margin:0 auto;
		padding:10px 0 5px 0;
		/*border-bottom:1px solid #98afcb;*/
		/*background:#000;*/
		line-height:0;
	}
		#leaderboard .ads { padding:0; margin:0; }
		#leaderboard .ads div { padding:0; margin:0; }
		#leaderboard .ads img { vertical-align:middle; }
		#leaderboard .ads div.f-left { padding-left:25px; }
		#leaderboard .ads div.f-right { padding-right:25px; padding-top:0px; }

	.billboard {
		margin: 0pt auto;
		width:990px;
		background-color:#F9FAFB;
	}

	/**
	 * @note Styles for ads that are in the main content section.
	 * This includes a 2x2 block, and also a large column width ad.
	 */
	.grid-ab .ads {
		padding-top:20px;
	}
	.grid-ab .ads img {
		padding:0 0 20px;
	}
	.grid-ab .ads-divider {
		border-top:2px solid #BBB;
	}

	/**
	 * @section Lower ads tier, as seen on homepage
	 */
	div.lower .ads {
		border-bottom:1px solid #BBB;
		clear:both;
		text-align:center;
		padding-bottom:20px;
	}
	div.lower .railunit .ads {
		border:0;
	}
	div.partner .ads {
		border-bottom:0;
		padding-bottom:0;
		border-color:#cccccc;
	}

	div#dart_300x250_ats_1, div#dart_300x100_bts_1,
	div#yahoo_300x250_ipatf_1, div#yahoo_300x100_ipstf_1 {
		margin-bottom: 13px;
	}
	div#dart_960x30_ats_1,
	div#yahoo_950x30_ipatf_1 {
		width: 990px;
		margin: 0 auto;
		text-align: center;
	}
	div#dart_1x1_ats_1,
	div#yahoo_1x1_ipatf_1 {
			position: absolute;
	}

	/**
	 * @section Used Cars cars.com
	 * @note rail ad module
	 */
	#cars {
		background:url(http://media.sacbee.com/static/img/rail-unit-bg.gif) repeat-x bottom;
	}
	#cars label {
		display:block;
		font-weight:bold;
	}
	#cars .title {
		border-bottom:1px solid #024A82;
		text-transform:uppercase;
		font-weight:bold;
		font-size:14px;
		margin-bottom:1em;
	}
	#cars .title span {
		text-transform:none;
		font-weight:normal;
		font-size:11px;
		padding-left:6px;
	}
	#cars td {
		text-align:justify;
	}
	#cars select {
		padding:3px;
		font-size:11px;
	}
	select[name=mknm] { margin-right:15px }
	select[name=mknm],
	select[name=mdnm],
	select[name=maxp] {
		width:130px;
	}
	select[name=minp] { width:100px }
	input[name=zc] { width:126px }

	#cars td span {
		padding-left:5px;
	}

	/**
	 * @section Classified Ads
	 */
	.classifieds h5 {
		font-weight:bold;
		margin:0 0 3px;
	}

/*
 * @section Homepage specific styles
 * @note Homepage has many unique things underneath the multimediabar, put that stuff here.
 */
	/**
	 * @section In Content Section Heading
	 * @note As seen on the homepage for Inside The Bee, provides a tab-looking heading background.
	 */
	div.highlights div.sectionheading,
	div.sectionheading {
		/*background:url(http://media.sacbee.com/static/img/body-sectionheading-bg.gif) no-repeat;*/
		border-top:1px solid #ccc;
		border-left:1px solid #ccc;
		border-right:1px solid #ccc;
		font-size:18px;
		font-weight:bold;
		padding:12px 0 10px 10px;
	}
	/* 8/27/08 rwm added to support a different background on thin columns */
		div.grid-a div.sectionheading {
			background:url(http://media.sacbee.com/static/img/body-sectionheading-150-bg.gif) no-repeat;
		}
		div.grid-b div.sectionheading {
			background:url(http://media.sacbee.com/static/img/body-sectionheading-150-bg.gif) no-repeat;
		}
		div.grid-c div.sectionheading {
			background:url(http://media.sacbee.com/static/img/body-sectionheading-150-bg.gif) no-repeat;
		}
		div.grid-d div.sectionheading {
			background:url(http://media.sacbee.com/static/img/body-sectionheading-150-bg.gif) no-repeat;
		}

	/**
	 * @section Lower
	 * @note lower tier specific styles
	 * Right now, only the homepage has a lower tier.
	 */
		div.lower .fulltier {
			padding-top:0;
			border-top:0;
		}
		div.lower div.gridunit {margin:0}
		div.lower div.story-top {
			border:1px solid #BBB;
			margin:0;
			overflow:hidden;
			/* bump the bg down to account for header */
			/* background-position:0 266px; rwm 9/3/09*/
		}
		div.lower div.story-top .img {
			padding:1px 0;
		}
		div.lower .title {
			font-size:18px;
		}
		div.lower div.story-top .teaser {
			font-weight:bold;
			font-size:16px;
			padding:10px 10px 0;
		}
		div.lower div.story-top .links {
			padding:0 10px 0;
		}
		div.lower div.grid-ab {border:0}
		/**
		 * @section Lower links
		 * @note lower tier link lists
		 */
		div.lower div.grid-c,
		div.lower div.grid-d {
			/* border-right:1px solid #EEE; *
			padding:0;
			margin:0; */
		}
		div.lower .grid-a .links,
		div.lower .grid-b .links,
		div.lower .grid-c .links,
		div.lower .grid-d .links {
			padding:0;
			margin:0;
			list-style:none;
			padding:0 11px 0 0;
		}
		div.lower .grid-a ul.links li,
		div.lower .grid-b ul.links li,
		div.lower .grid-c ul.links li,
		div.lower .grid-d ul.links li {
			margin:5px 0;
			padding-bottom:5px;
			border-bottom:1px solid #EEE;
		}
		div.lower ul.links li.last {
			border-bottom:0;
		}
		.grid-a .links,
		.grid-b .links,
		.grid-c .links,
		.grid-d .links {
			padding:0;
			margin:0;
			list-style:none;
			padding:0 11px 0 0;
		}
		.grid-a ul.links li,
		.grid-b ul.links li,
		.grid-c ul.links li,
		.grid-d ul.links li {
			margin:5px 0;
			padding-bottom:5px;
			border-bottom:1px solid #EEE;
		}
		.grid-a ul.links li.last,
		.grid-b ul.links li.last,
		.grid-c ul.links li.last,
		.grid-d ul.links li.last {
			border-bottom:0px solid #EEE;
		}

		.raillinks {
			padding:0;
			margin:0;
			list-style:none;
			padding:0 11px 0 0;
		}
		ul.raillinks li {
			margin:5px 0;
			padding-bottom:5px;
			border-bottom:1px solid #EEE;
		}
		ul.raillinks li.last {
			border-bottom:0px solid #EEE;
		}


/**
 * @section Article View styles
 */
	div#articlebody {
		font-size:15px;
		line-height:1.5em;
		font-family:Georgia,"Times New Roman",Times,serif;
	}
	div#articlebody a {
		text-decoration: none;
	}
	div#articlebody a.lingo_link {
		text-decoration: none;
		border-bottom: 1px dotted;
	}
	div#articlebody p {
		margin-bottom: 15px;
	}
	a.lingo_link {
		text-decoration: none;
		border-bottom: 1px dotted;
	}
	div.published {
		padding:0 0 1.5em 0;
	}

	/**
	 * @section Inserts
	 * @note Holds photos, slideshows or supplemental material in the right side of an article.
	 */
	div.insert {
		width:320px;
		float:right;
		display:inline;
		margin-left:10px;
		margin-bottom:10px;
		line-height:1.5em;
		background-color: #fff;
	}
	div.insert .box2 {
		border:0;
		margin-bottom:8px;
	}
	div.insert .box {
		margin-bottom:8px;
	}
	div.insert q {
		font-family:Georgia,"Times New Roman",Times,serif;
	}


	/**
	 * @section Single Images
	 * @note USed for single images on story pages
	 */
	div.insert .singleimage .image {
		margin-top: 0px;
	}
	div.insert .singleimage .box.image {
		margin-bottom: 0px;
	}
	div.insert .singleimage .txt {
		margin-left: 5px;
		margin-right: 5px;
	}
	div.insert .singleimage .txt h4 {
		color: #888888;
		font-size: 10px;
		font-weight: normal;
		text-align: right;
		text-transform: none;
		margin-top: 0px;
		margin-bottom: 4px;
	}


	/**
	 * @section Pagination
	 * @note Pagination for the article view
	 */
	div.pagination {
		text-transform:uppercase;
		text-align:right;
		font-weight:bold;
		padding-bottom:1.5em;
		margin-top:1em;
		font-family:Arial,Helvetica,sans-serif;
		font-size:12px;
		text-decoration:none;
	}
	div.pagination ol {
		display:inline;
		padding-left:20px;
	}
	div.pagination ol li {
		list-style:none;
		padding:5px;
		display:inline;
	}
	div.pagination ol li a {
		text-decoration:underline;
	}

	/**
	 * @section Comments
	 * @note Holds the number of comments and an "add your comment" link on the article page
	 */
	div.comment {
		border:2px solid #ccc;
		border-width:2px 0;
		background:url(http://media.sacbee.com/static/img/body-shade-bg.gif) bottom repeat-x;
		padding:8px 0 8px 8px;
		font-size:12px;
		margin:20px 0;
		clear:both;
	}
	div.comment_guidelines {
		border-top: 1px solid gray;
	}

	div#comment_toggle {
		display: none;
		margin-bottom: 0.8em;
	}
	div#comment_toggle img {
		width: 209px;
		height: 26px;
	}

	/**
	 * @section Related Stories
	 * @note Article view's related stories
	 */
	div.related {
		background:url(http://media.sacbee.com/static/img/body-gradient-big.gif) top repeat-x;
		border:1px solid #CCC;
		padding:8px;
	}
	div.related .title {
		text-transform:uppercase;
		font-weight:bold;
		margin-bottom:0.5em;
	}
	div.related ul {
		color:#024A82;
		padding-left:16px;
		list-style-type: none;
	}
	div.related li {
		padding:0.5em 0;
	}

	/* ShareThis widget */
	.share {

	}
	.share.upper {
		float: right;
		margin-top: 5px;
	}
	.share.lower {
		font-family:Arial,Helvetica,sans-serif;
		font-size:12px;
	}

/*
 * @section Sports page specific styles
 */
	/*
	 * @note Calendar styles
	 */
	.boxheader .calendar {table-layout:fixed;}
	.boxheader .calendar th { width:44px; margin:0; padding:0; }
	.boxheader .calendar th.last {width:48px;}
	.boxheader .calendar td {
		font-size:9px;
		vertical-align:top;
		text-align:left;
		color:#000;
		height:42px;
		text-indent:5px;
		overflow:hidden;
	}
	.calendar .high td {
		background:#E0F2FC;
	}
	.boxheader .calendar span {
		border:0;
		height:42px;
		float:left;
	}

	/* For the city cell in the "Standings" widget */
	.boxheader .city {
		font-size:12px;
		padding-left:1em;
		width:109px;
		font-weight:normal;
	}

	/* For the colspan=2 cell that holds links related to a single game */
	#sports .boxheader tr td.span {

		color:#000;
		background:#FFF;
		font-size:11px;
		font-weight:normal;
		text-transform:uppercase;
		text-align:left;
	}
	#sports .boxheader .span ul {
		list-style:none;
		padding:0 0 0 1em;
		margin:0;
		line-height:1.75em;
	}
	#sports .boxheader .span a {color:#000;}

	/* Home team & final score are emphasized */
	.boxheader tr.hometeam td,
	.boxheader td.final {color:#000}

/*
 * @section Homes specific modules
 */
	/*
	 * @section Find a Home
	 * @note Styles for the big tabbed widget on the Homes page
	 */
	#findhome .tabs .mls,
		#findhome .tabs .class {
		width:73px;
	}
		#findhome .tabs .class { margin-left:4px; }
	#findhome .tabs .newhomes,
		#findhome .tabs .rentals {
		width:65px;
		margin-left:4px;
	}
	#findhome .tabs .mls a,
	#findhome .tabs .newhomes a {
		line-height:14px;
	}
	#findhome #mls,
	#findhome #class,
	#findhome #newhomes,
	#findhome #rentals {
		border:1px solid #CCC;
		border-top:0;
		padding-top:1em;
	}
	#findhome form {
		background:#FFF url(http://media.sacbee.com/static/img/rail-unit-bg.gif) repeat-x bottom;
		padding:9px;
		border-bottom:1px solid #CCC;
	}
	#findhome h4 {
		font-size:14px;
		border-bottom:1px solid #016898;
		margin:0 0 9px;
	}
	#findhome .or {
		text-align:center;
		color:#999;
		font-size:14px;
		font-weight:bold;
		margin-bottom:9px;
	}
	#findhome table {
		width:100%;
	}
	#findhome table th {
		font-weight:normal;
		text-align:left;
	}
	/* Make input and selects a consistent size */
	#findhome input,
	#findhome select {
		width:140px;
		border:1px solid #CCC;
		padding:3px;
	}
	#findhome input {width:132px;}
	#findhome input.wide {width:282px;}

	#findhome .button {
		float:right;
		padding:9px 0 0;
	}

	/*
	 * @section Video Showcase of Homes
	 * @note Styles for the video showcase on the Homes page
	 */
	.video .block {
		background:#043D5C url(http://media.sacbee.com/static/img/body-video-bg.png) no-repeat top left;
		padding:8px 8px 18px;
		color:#FFF;
		font-weight:bold;
		overflow:auto;
	}
	.video .block img {
		margin-bottom:1em;
	}
	.video .block .f-left { line-height:18px; width:208px; }
	.video .block .f-right { line-height:18px; width:80px; }
	.video .block .tagline {
		padding-top:1em;
		clear:both;
		font-weight:normal;
		line-height:18px;
	}
	.video .block .tagline .button {
		width:80px;
		float:right;
		padding:0;
	}

	/* The classified ads and the ads under the video share many styles */
	.classifieds ul,
	.video .zebra {
		border:1px solid #022C4C;
		border-top:0;
		margin:0 0 20px;
		list-style:none;
		overflow:auto;
	}
	.classifieds ul li,
	.video .zebra li {
		padding:10px;
		clear:both;
		height:51px;
		vertical-align:bottom; /* IE fix */
	}
	.classifieds ul img,
	.video .zebra img {
		float:left;
		padding:0 10px 0 0;
		margin:0;
	}
	.video .zebra .f-left { width:80px; }
	.video .zebra .f-right { width:122px; }
	.classifieds ul li,
	.video .zebra li div { line-height:1.25em; }

	/**
	 * @section Tools & Services
	 * @note Holds lists of links on the Homes page in two columns
	 */
	.tools h3 { margin-bottom:18px }
	.tools .links {
		border-bottom:2px solid #DDD;
		padding-bottom:12px;
		margin-bottom:18px;
	}
	.tools ul.last { border:0 }
	.tools .links li {
		padding-bottom:7px;
	}
	.tools .links li.last {
		padding:0;
	}
	.tools h4 {
		padding:0 0 9px 0;
		margin:0;
	}

/**
 * @section Page specific styles and modules
 * @note One-off, specific bits of code that are only really found on one page or subset of pages.
 * If a page has enough of these, it might be worthwhile to create a section for it as above.
 * If it gets reused outside of a specific context, don't put it here.
 */
	/**
	 * @section Find Things to do
	 * @note Main section widget that has a horizontal calendar and a search box
	 */
	#fttd {
		margin:0;
	}
	#fttd p {
		margin-bottom:12px;
	}
	#fttd ol {
		overflow:auto;
		margin:1em 0 1em;
		padding:1em 0 1em;
		list-style:none;
		border-top:1px dotted #000;
	}
	#fttd .dates {
		border:0;
		padding:0;
		margin:0 0 12px 0;
		height:30px; /* IE6 fix */
	}
	#fttd .dates li {
		overflow:auto;
		display:block;
		float:left;
		height:30px;
		width:35px;
		margin-right:3px;
		background:#FFF url(http://media.sacbee.com/static/img/calendar.gif) left top no-repeat;
		color:#364E62;
		font-weight:bold;
		font-size:16px;
		line-height:18px;
		text-align:center;
	}
	#fttd .dates li a {
		text-decoration:none;
	}
	#fttd .dates li.active a {
		color:#A4170A;
	}
	#fttd .dates li span {
		font-size:9px;
		line-height:7px;
		display:block;
		color:#666;
	}
	#fttd .dates li.calendar {
		background-position:0 -30px;
		width:38px;
	}
	#fttd .dates li.calendar span {
		width:38px;
		height:30px;
		cursor:pointer;
	}

	/**
	 * @section Mini Slideshow for embedding in Article pages
	 * @notes the mini slideshow goes inside div.inset to hold it in place.
	 */
	.mini-slideshow {
		width:318px;
		border:1px solid #ccc;
		background-repeat:repeat-x;
		position:relative;
		margin-bottom: 8px;

		list-style-position: inside;
		list-style-image: none;
		list-style-type: none;
	}
		.mini-slideshow div.name { padding:0px 5px; z-index:1; }
		.mini-slideshow div.controls {
			text-align:right;
			position:absolute;
			z-index:2;
			top:0px;
			right:11px;
		}
		.mini-slideshow div.controls img { vertical-align:middle; }
		.mini-slideshow div.controls span.indicator img { width:8px; height:15px; }
		.mini-slideshow div.controls span.indicator a {
			background-image:url(http://media.sacbee.com/static/img/mm-panel.gif);
			background-repeat:no-repeat;
			background-position:50% 50%;
			margin:0 3px;
		}
		.mini-slideshow div.controls span.indicator a.activeSlide {
			background-image:url(http://media.sacbee.com/static/img/mm-panel-active.gif);
		}
		.mini-slideshow span.icon { background-image:url(http://media.sacbee.com/static/img/icons-white.gif); }
		/*.mini-slideshow a { color:#fff; }*/
		.mini-slideshow div.slides {
			background: transparent url(http://media.sacbee.com/static/img/body-gradient-big.gif) repeat-x scroll 0 0;
			/* padding:0 11px; */
		}
		.mini-slideshow div.slides ul {
			height:0px;
			overflow:hidden;
			padding:0;
			margin:0;
		}
		.mini-slideshow div.slides ul li {
			width: 318px;
			height: 0px;
			padding: 0;
			margin: 0;
			list-style-type: none;
		}
		.mini-slideshow div.slides img {
			border-right: 1px solid #999;
			border-bottom: 1px solid #999;
			border-left: 1px solid #999;
			/*margin-top: 2px;
			margin-left: 2px;*/
		}
		.mini-slideshow div.boxheader { margin-top: 0px; }
		.mini-slideshow div.slides div.img { margin-bottom:8px; }
		.mini-slideshow div.slides div.txt {}
		.mini-slideshow div.slides div.xref {
			text-align:center;
			padding-top:45px;
		}
		.mini-slideshow div.jumplink {
			padding:0 11px 12px;
			font-size:11px;
		}
		.mini-slideshow h4 {
			color:#888888;
			font-size:10px;
			font-weight:normal;
			text-align:right;
			text-transform:none;
		}
		.mini-slideshow .box {
			border: 0;
			text-align: center;
		}
		.mini-slideshow .txt {
			margin: 0 7px;
		}
		.mini-slideshow .mini-slideshow-loader img {
			margin: 0 0 0 10px;
			vertical-align: middle;
		}
		.mini-slideshow .captions {
			margin: 0 4px 5px 4px;
		}
			.mini-slideshow .captions h4 {
				margin-top: 1px;
				margin-bottom: 5px;
			}
		.mini-slideshow .icon_picture {
			background:url(http://media.sacbee.com/static/img/icon-spritesheet.gif) top left no-repeat;
			display:inline-block;
			margin-right:4px;
			width:16px;
			height:14px;
		}


	/**
	 * @section Big Slideshow for embedding in Article pages
	 */
	div#big-slideshow {
		width: 665px;
		margin-left: -10px;
		border: 1px solid #ccc;
		border-bottom-width: 2px;
		background-image: url(http://media.sacbee.com/static/img/mm-mini.gif);
		background-repeat: repeat-x;
		background-color: #0a212c;
		color: #9ed3fd;
		position: relative;
	}
		div#big-slideshow div.name {
			padding:8px 11px;
			z-index:1;
			font-size: 1.3em;
			font-weight: bold;
			text-align: left;
			text-transform: uppercase;
		}
		div#big-slideshow div.controls {
			z-index:2;
			top:8px;
			right:11px;
			padding:0 0 14px 14px;
			text-align: center;
			font-size: 1.3em;
		}
		div#big-slideshow .standalone {
			text-align: center;
		}
		div#big-slideshow div.controls img { vertical-align:middle; }
			div#big-slideshow div.controls span.indicator img { width:8px; height:15px; }
			div#big-slideshow div.controls span.indicator a {
				background-image:url(http://media.sacbee.com/static/img/mm-panel.gif);
				background-repeat:no-repeat;
				background-position:50% 50%;
				margin:0 3px;
			}
			div#big-slideshow div.controls span.indicator a.activeSlide {
				background-image:url(http://media.sacbee.com/static/img/mm-panel-active.gif);
			}
		div#big-slideshow span.icon { background-image:url(http://media.sacbee.com/static/img/icons-white.gif); }
		div#big-slideshow a { color:#9ed3fd; }
		div#big-slideshow div.slides {
			padding:0 11px;
		}
		div#big-slideshow div.slides ul {
			/*width: 624px;*/
			overflow: hidden;
			padding: 0;
			margin: 0;
		}
		div#big-slideshow div.slides ul li {
			width: 640px;
			padding: 0;
			margin: 0;
			list-style-type: none;
			display: none;
		}
			div#big-slideshow div.slides div.img { margin-bottom:8px; text-align: center; }
			div#big-slideshow div.slides div.txt { width:624px;}
			div#big-slideshow div.slides div.xref {
				text-align:center;
				padding-top:45px;
			}
		div#big-slideshow div.jumplink {
			padding:0 11px 12px;
			font-size:11px;
		}
		div#big-slideshow div.caption {
			padding:0 11px 12px;
			font-size:11px;
		}

		span#big-slideshow-loader img{
			margin: 0 0 0 10px;
			vertical-align: middle;
		}
		div#big-slideshow h4 { color: #ddd; }
		div#big-slideshow .name .lingo_link_hidden {
			color: #9ed3fd;
		}

		div#big-slideshow .galcaption {
			padding: 5px 0px 12px;
			font-size: 13px;
			color: white;
			text-align: left;
		}
		div#big-slideshow .galcaption a.lingo_link_hidden,
		div#big-slideshow .galcaption a.lingo_link_hidden:hover {
			color: white;
		}

		div#big-slideshow .galbyline {
			text-align: right;
			padding-bottom: 5px;
		}
		div#big-slideshow .galbyline a.lingo_link_hidden,
		div#big-slideshow .galbyline a.lingo_link_hidden:hover {
			color: #9ed3fd;
		}

	/*
	 * @section Factbox
	 * @notes styles Factboxes displayed underneath mini slideshows inside the inset div
	 */
	div.insert div.factbox {
		margin: 8px 0 0 0;
		border: 1px solid #bbb;
		padding: 5px;
		list-style-position: inside;
		list-style-image: none;
		list-style-type: none;
		margin-bottom: 5px;
	}
		div.factbox .factbox_ul {
			list-style-position: inside;
			list-style-image: none;
			list-style-type: none;
			margin: 0;	/* IE 7 fix */
		}
		div.factbox h4 {
			color:#000000;
			font: bold 11px Arial,Helvetica,sans-serif;
			line-height:1.25em;
			margin:0pt;
			padding:2px 5px 5px;
			text-transform:uppercase;
		}
		div.factbox span.instructions {
			font-size: 11px;
			color: #999;
			text-transform: lowercase;
			margin: 0 0 0 5px;
			font-weight: normal;
		}
		div.factbox_header a {
			text-decoration: none;
		}
		div.factbox_header a:visited {
			color: #999;
		}
		div.factbox_header a:hover {
			text-decoration: underline;
		}
		div.factbox_header a:active {
			text-decoration: none;
		}
		div.factbox_content {
			display: none;
			margin: 8px 0 0 0;
			padding: 5px;
		}


	/**
	 * @section Content Guidlines
	 */
	div.content_guidelines {
		display: none;
		margin: 5px 0px;
	}
		div.content_guidelines p {
			padding-bottom: 5px;
		}


	div#avatarImage {
		float: left;
		margin-left: 2px;
	}

	div#avatarImage img {
		border: 1px solid #37b;
		width: 23px;
		margin-top: 3px;
	}
	div#insite {
		float: left;
		font-size: 12px;
	}
	div#insite_links {
		float: left;
	}
	div#short_summary_body { display: none; }

	div.railunit div.tabbed .viewed {
		width:90px;
		margin-left:0px;
	}
	div.wide h2{
		font-size: 15px;
		color: black;
		text-transform: uppercase;
		padding: 3px 0px 5px 0px;
	}

	div.e911 h2{
		font-size: 24px;
		font-style: italic;
		text-transform: none;
		color: red;
		padding-left: 5px;
	}

	div.wide .title {
		font-size: 28px;
	}

	div.e911 .title {
		font-size: 40px;
	}

	.full_column {
		float: left;
		width: 328px;
	}

	div.box .image { text-align: center; }
	div.single {
		margin-top: 10px;
		border-style : none;
	}
	div.single img {
		border : 1px solid #aaa;
	}
		/*
		 * @ notes Calendar Widget
		 */
		div#events_calendar {
		}

		div.ZventsEvent {
				font-family: Arial, helvetica, sans-serif;
				border-bottom: 1px dotted #000000;
				margin: 2px 5px 9px;
				padding: 0 0 9px;
		}
		a.ZventsEventName {
				margin: 0;
				display: block;
				padding-left: 5px;
				font-size: 14px;
		}
		div.ZventsEvent br {
			display: none;
		}
		div.ZventsEventList hr {
			display: none;
		}
		div.ZventsEvent .ZventsEventDate {
			padding-left: 5px;
		}

		a.ZventsImageLink {
			margin: 8px 0;
			display: block;
		}

		ul#date-widget {
			margin: 0 0 8px 0;
			padding: 0;
			list-style: none;
			float: left;
		}
			ul#date-widget li {
				display: inline;
				float: left;
				height: 36px;
				position: relative;
				font: normal 10px arial;
				text-align: center;
				margin: 0 5px 0 0;
				border: 1px solid #bbb;
				width: 45px;
			}
				ul#date-widget li.last {
					margin: 0;
				}

				ul#date-widget li a {
					text-decoration: none;
					display: block;
					font: bold 18px arial;
					color: #136aa8;
					padding: 2px 11px 0 11px;
				}

				ul#date-widget li a:hover {
					color: #003f6a;
				}

		div.link {
			padding: 0;
		}

		div.day {
			width: 45px;
		}

		div#ZventsSearchForm {
			margin: 8px 0 0 0;
		}

		div#ZventsSearchForm input.text {
			border: 1px solid #bbb;
			width: 100px;
			margin: 0;
			line-height: 20px;
			vertical-align: middle;
		}
		button {
			margin: 0;
			display: inline;
			line-height: 20px;
			height: 25px;
		}
		div.ZventsQuickSearch {
			width: 285px;
			padding-left: 7px;
		}
		div#ZventsWidget .title {
			padding: 10px;
		}
		div#zventsMovies {
			border: 1px solid rgb(204, 204, 204);
			padding: 10px 0px 10px 3px;
		}
		div#zventsDining {
			border: 1px solid rgb(204, 204, 204);
			padding: 10px;
		}

		div.highlights .story-top-img { padding-right : 0px; }

		div.gallery_index div.story {
			height:195px;
		}

		div.gallery_index div.sectionlink {
			display: none;
		}

		div.gallery_index.grid-a {
			margin-left: 3px;
		}

		/**
		 * @section Career Builder Rail Items
		 * @notes styles that apply to the Career Builder rail objects either
		 * when held in a tabbed box or one after the other in the right rail.
		 */
		div#jobs {
			background:url(http://media.sacbee.com/static/img/rail-unit-bg.gif) repeat-x bottom;
			/*height: 252px;*/
			/*margin-bottom: 13px;*/
		}
			div#jobs .button { margin:0 }

		div.block div#cb-quicksearch {
			/*padding:10px 10px 20px; */
			padding:5px 5px 5px 5px;
			/* margin:-5px -5px 10px; */
			background-image:url(http://media.sacbee.com/static/img/bg-careerbuilder-blocks.gif);
			background-position:bottom left;
			background-repeat:repeat-x;
			border-bottom:1px solid #bbb;
		}
		*+html div.block div#cb-quicksearch { margin:-5px -5px 10px; width:279px; }
		div.block div#cb-topjobs {
			padding:10px 10px 20px;
			margin:-10px -5px 10px;
			background-image:url(http://media.sacbee.com/static/img/bg-careerbuilder-blocks.gif);
			background-position:bottom left;
			background-repeat:repeat-x;
			border-bottom:1px solid #bbb;
		}
		*+html div.block div#cb-topjobs {
			margin:-5px -5px 10px; width:279px;
		}
		div.block div#cb-videos {
			padding:0 !important;
			margin:-10px -10px -5px;
			text-align:center;
			line-height:1px;
			font-size:1px;
			background-image:none;
		}
			div.block div#cb-videos img { border:0; padding:0; margin:0; }
		*+html div.block div#cb-videos { margin:-10px -5px -5px; width:299px; }
		div#cb-quicksearch table.void td.pr { padding-right: 0px; }
		div#cb-quicksearch table label {
			display:block;
			font-weight:bold;
		}
		div#cb-quicksearch table input {
			width:120px;
			padding:3px;
			border:1px solid #ccc;
			font-size:1em;
		}
		div#cb-quicksearch table select {
			width:125px;
			padding:3px;
			border:1px solid #ccc;
			font-size:1em;
		}
		div#cb-topjobs span.icon-rss {
			background-image:url(http://media.sacbee.com/static/img/icon-rss-careerbuilder.gif);
			background-position:0 0;
		}
		div.railunit div.careerbuilder {
			background-image:url(http://media.sacbee.com/static/img/bg-careerbuilder-blocks.gif);
			background-position:bottom left;
			background-repeat:repeat-x;
			/*width: 280px;*/
			overflow: hidden;
		}
			div.careerbuilder div.logo {
				margin-bottom:10px;
			}
			div.careerbuilder div.header {
				border-bottom:1px solid #006;
				color:#f60;
				padding:4px 0;
				margin:0 0 5px;
				line-height:1em;
			}
			div.careerbuilder div.header a { color:#f60 !important; }
			div.careerbuilder div.othersearches { font-size:10px; line-height:20px; }
			div.careerbuilder ul {
				margin:0;
				padding:0;
			}
			div.careerbuilder ul li {
				margin:0;
				padding:0;
				list-style-type:none;
			}

		/* styles to fix the DC Headline widget so that it fits in a 150 px column */
		div#MI_DC_headlines {
			background:url(http://media.sacbee.com/static/img/dc_headlines.png) top left no-repeat;
			padding-top: 15px;
		}
			div#MI_DC_headlines h1 {
				display: none;
			}

		div.vertpic {
			margin-right: 10px;
		}
		div.addpadding {
			padding-right: 10px;
		}
		div.rssbar {
			float: right;
			padding-top: 10px;
			padding-right: 10px;
		}
	.story-asset-swf {
		text-align : center;
	}
	div.swf {
		margin-top: 15px;
	}
	.swf_caption {
		font-family:Georgia,"Times New Roman",Times,serif;
		font-size:16px;
		line-height:1.5em;
		margin-top:16px;
	}
	div.cartoon_thumbs {
		padding: 5px 0px 5px 2px;
	}
	div.cartoon_thumb {
		border: 1px solid rgb(0, 0, 0); margin-right: 2px; padding-right: 0px; float: left; width: 100px;
	}
	div#cartoon_swf .cartoon_thumb {
		width: 150px;
		border: 0px solid #000000;
		margin: 3px;
	}
	div#cartoon_images .cartoon_thumb {
		width: 150px;
		height: 101px;
		border: 0px solid #000000;
		margin: 3px;
	}
	div.boxscore {
		width: 219px;
		float: left;
	}
	div.boxscorelinks {
		width: 100px;
		float: left;
	}
	.boxscore table {
		background:#DDD;
		width:220px;
		border-collapse:collapse;
		border-left:1px solid #CCC;
		margin:0;
	}
	/* Firefox CSS hack to fix border alignment */
  	html:not([xmlns*=""]) .boxscore table {
		width:219px;
		margin-left:1px;
	}
	.boxscorelinks {
		color:#000;
		background:#FFF;
		font-size:11px;
		font-weight:normal;
		text-transform:uppercase;
		text-align:left;
		border-left: 1px solid #ccc;
	}
	.boxscorelinks ul {
		list-style:none;
		padding:9px 0 9px 1em;
		margin:0;
		line-height:1.75em;
	}
	.boxscorelinks a {
		color: #000;
	}
	.gameinfo { display: none; }
	.center { text-align: center; }
	.count { padding: 0 15px; }
	div.eventscore {
		width: 318px;
		border: 2px solid #777;
		font-size:1.25em;
		font-weight: bold;
		background-color: #000;
		height: 45px;
	}
	div.eventscore .teamcode {
		border-left: 2px solid #777;
		border-right: 2px solid #777;
		color: #777;
		float: left;
		padding: 10px 3px;
		height: 27px;
	}
	div.eventscore .score {
		color: #fff;
		float: left;
		padding: 10px 3px;
		height: 27px;
	}
	div.eventscore .noperiod {
		border-left: 2px solid #777;
		color: #fff;
		float: left;
		height: 27px;
		padding: 10px 3px;
	}
	div.eventscore .period {
		border-left: 2px solid #777;
		color: #fff;
		float: left;
		height: 27px;
		padding: 10px 3px;
	}
	div.eventscore .timeremaining {
		border-left: 2px solid #777;
		color: #fff;
		float: left;
		height: 27px;
		padding: 10px 3px;
	}
	div.mbrcntr_option {
		border-bottom:2px solid #DBDBDB;
		overflow:auto;
		padding:0 0 14px 0;
		margin:0;
	}
	div.mbrcntr_option h2 {
		font-size: 18px;
	}
	.bottommargin {
		margin-bottom: 10px;
	}
	.slinks {
		list-style-position: inside;
	}
	.poll {
		padding: 8px;
	}
	.cleardiv { clear:both; }
	div#ntl2 { text-align:center; }
	div#billbo { margin: 0 auto; width: 990px; text-align: center; }
	div#ah_mrec01 {
		float:left;
		margin-right: 10px;
	}
	div#usertools span.socialwidget { border-right: 0px; }
	div.morephotos {
		border-left: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
		border-right: 1px solid #ddd;
	}
	div.tooltip {
		display: none;
	}
	div.teaser h3 {
		font-size: 10px;
	}
	div#comics_links li {
		list-style-image: none;
		list-style-position: outside;
		list-style-type: none;
		border-bottom: 1px solid #eee;
		margin: 5px 0;
		padding-bottom: 5px;
	}
	.quote {
			font-size: 1.2em;
		font-style: italic;
	}
		#story_tools {
		border: 1px solid gray;
		background-color: #EDEDED;
		float: right;
		margin: 35px 0 0 10px;
		width: 110px;
		padding: 5px 0;
		}

		#toolbox {
		display:none;
		}

	.image_media-detail .standalone { width:660px; overflow: hidden; }

		#story_tools a {
		font-size: 1.1em;
		margin-bottom: 5px;
		}
		.mimg { text-align: center; }

	/*
	#ttip { font-size:85%; font-weight:bold; text-align:left; width:auto; background:url(http://media.sacbee.com/static/imgs/tooltip_lt.gif) no-repeat 0 0; margin:0 0 0 0; padding:0 0 0 0; z-index:9998; filter:alpha(opacity=90); }
	#ttip span.ttip { width:auto; background:#fff url(http://media.sacbee.com/static/imgs/tooltip_rt.gif) no-repeat 100% 100%; margin:22px 0 0 2px; padding:5px 15px 7px 10px; display:block; }

	#ttip.t2 { font-size:85%; font-weight:bold; text-align:left; width:auto; background:url(http://www.sacbee.com/static/imgs/tooltip_rt3.gif) no-repeat 0 100%; margin:0 0 0 0; padding:0 0 0 0; z-index:9998; filter:alpha(opacity=90);  }
	#ttip.t2 span.ttip { width:auto; background:#fff url(http://www.sacbee.com/static/imgs/tooltip_lt3.gif) no-repeat 100% 0; margin:0 0 5px 15px; padding:7px 15px 5px 10px; display:block; }
	*/

/**
 * @section Page specific styles for Databases page
 */
	.sectionlink2 { font-size:13px; font-weight:bold; } /* modifier applied to .sectionlink items */
	div.datagroup {
		border-bottom:2px solid #bbb;
		padding:8px 8px 0;
	}
		div.datagroup .sectionlink { font-size:12px; line-height:1.3em; font-weight:bold; }
		div.datagroup div.db-subhead { color:#000; font-size:12px; margin-bottom:10px; }
		div.datagroup ul.links li {
			border-style:none;
			margin:0 0 10px !important;
			padding:0 !important;
		}
	div.dg-alt {
		background-color:#edf1f4;
	}
	div.dg-last { border-bottom:none; }

/**
 * @section TSN pullout (aka widget) styles
 */
	.tsn {
		margin-bottom: 10px;
	}
	.tsn .header {
		background: transparent url(http://media.sacbee.com/static/img/header-box-bg.gif) repeat-x scroll 0 0;
		color: #fff;
		height: 31px;
		line-height: 31px;
		margin: 0;
		position: relative;
		text-indent: 10px;
	}
	.tsn table {
		border-bottom: 1px solid #ccc;
		border-right: 1px solid #ccc;
		border-spacing: 0;
	}
	.tsn table table {
		border: 0;
	}
	.tsn table table td {
		border-left: 0;
	}
	.tsn td {
		border-top: 1px solid #ccc;
		border-left: 1px solid #ccc;
	}
	.tsn .TSN6, .tsn .TSN2, .tsn .TSNHeader, .tsn .TSNSubHeader {
		font-weight: bold;
		background: #ddd none repeat scroll 0 0;
		font-size: 11px;
		text-align: left;
		text-indent: 1em;
		text-transform: uppercase;
	}
	.tsn .TSNHeader {
		text-indent: 0;
		text-align: center;
		background: #fff none repeat scroll 0 0;
		border-left: 1px solid #ccc;
		border-right: 1px solid #ccc;
	}
	.tsn .TSN1, .tsn .TSN5, .tsn .TSNData1, .tsn .TSNData2 {
		background: #fff none repeat scroll 0 0;
		color: #999;
		font-size: 14px;
		font-weight: bold;
		text-align: center;
	}

/**
 * @section front-page breaking headline styles
 */
	.breaking_alert {
		border:1px none red;
		font-size:22px;
		font-weight:bold;
		margin-bottom:10px;
		margin-top:0;
		padding-bottom:3px;
		padding-top:4px;
	}
	.breaking_alert_label {
		background-color: #CC0000;
		color: white;
		text-transform: uppercase;
		font-size: 14px;
		padding: 4px;
		width: 250px
	}
	.breaking_alert_head {
		padding: 0px;
		margin-top: 6px;
	}
	.breaking_alert_email {
		font-size: 12px;
		float: right;
		margin-left: 3px;
	}
	.breaking_alert_time {
		font-size: 11px;
		font-weight: bold;
		text-transform: none;
	}

/**
 * @section Ken's Link List
 */
 	#kenlinks h4 {
		border-top: 1px solid #bbb;
		border-left: 1px solid #bbb;
		border-right: 1px solid #bbb;
		color: black;
 		background: transparent url(http://static.lingospot.com/apps/custom/sacbee/widget/static/bg_forest.gif) repeat-x scroll center bottom;
 	}
	#kenlinks .raillinks a:link,
	#kenlinks .raillinks a:visited {
		color: #063;
	}

/**
 * @section Lingospot widget styles
 */
	.lingospot_around_the_web_widget {
		margin-bottom: 13px;
	}
	.lingospot_popular_topics_widget {
		margin-bottom: 13px;
	}

/**
 * @section PageToppper styles (from Matt)
 */
	.PageToppper {
		background-color:#F8F8F8;
		border-bottom:1px solid #D7D7D7;
		border-top:1px solid #D7D7D7;
		color:#024A82;
		font-family:Georgia, "Times New Roman", Times, serif;
		margin:0 0 15px;
		padding:10px;
		text-align:left;

	}
	.PageTopperTitle {
		font-size:22px;
		margin-bottom:6px;
		color:#333;
	}
	.PageTopperInfo {
		font-size:12px;
		color:#000;
		text-transform:uppercase;
		text-decoration:none;
	}

/**
 * @section Preps Leaderboard styles
 */
	div.preps_leaderboards ul.tabs li {
		margin-left: 4px;
	}
	div.preps_leaders table tr.table_header td {
		text-align: center;
		text-indent: 0;
		background-color: #ddd;
		font-weight: bold;
		text-align: left;
		text-transform: uppercase;
		color: black;
	}
	div.preps_leaders table td {
		font-size: 10px;
		padding: 2px;
	}
	div.preps_leaderboards .button {
		margin-top: 10px;
	}

/**
 * @section Mobile teaser styles
 */
	#mobileteaser {
		background: -webkit-gradient(linear, left top, left bottom, color-stop(.4, #043D5D), color-stop(1, #016A9A));
		border-radius: 3px;
		box-shadow: 5px 5px 5px #999;
		color: white;
		display: none;
		font-size: 48px;
		margin-bottom: 20px;
		padding: 15px;
		text-align: center;
	}
	#mobileteaser .closebox {
		float: right;
		height: 32px;
		margin: -5px -5px 0 0;
		width: 32px;
	}

/**
 * Override for Disqus comment flags.  Most a fix for IE7
 */
	.dsq-comment-flag {
		visibility: visible !important;
	}
}

/**
 * @section Print styles
 */
@media print {
	html { padding:0; margin:0; }
	body { padding:0; margin:0; font-family:Arial,Helvetica,sans-serif; }
	a:link, a:visited, a:hover, a:active {
		color:#000;
	}
	a:link { text-decoration:none; }
	a img { border-style:none; }
	div.tier { clear:both; width:100%; }

	span#pagename,
	div.ads,
	div#leaderboard,
	div#usertools,
	div#story_section_breadcrumb,
	div#discovery,
	div#footer,
	div#mcclatchy,
	div.rail,
	div.pagination,
	div.comment,
	div#multimediabar,
	.mini-slideshow .header,
	div#mrComment,
	table.lingo_widget,
	div.share,
	div#comment_toggle img,
	div#Comments_Container,
	p#nyxComments_header,
	div.content_guidelines,
	div#header div { display:none; }

	div#header div#branding { display:block; }
	div#header div#branding img { display:block }

	div.insert {
		float:right;
	}

	div.published {
		font-style: italic;
		font-size: 10px;
	}

	/* Hide the toolbar on printing */
	#meebo m { display: none; }
}

/**
 * @section Grid styles (formerly grids.css)
 */
@media screen,projection {
	div.tier {
		/* float:left;  NO!!! */
		margin-bottom:15px;
		position:relative;
		padding:0 10px;
	}
	div.fulltier {
		border-top:1px solid #BBB;
		border-bottom:1px solid #BBB;
		padding:15px 0;
	}
	div.content {
		width:656px;
		float:left;
	}
		div.content_harvest {
		width:750px;
		float:left;
	}
		div.gridunit {
			background-position:0 0;
			background-repeat:repeat-y;
			/*margin-bottom:8px;*/
		}
			div.gridunit div.gridunit {
				height:auto;
				/*background-color:#fff;*/
			}
		div.grid-a {
			width:152px;
			float:left;
			margin-right:4px;
			padding-right:4px;
			border-right:1px solid #EEE;
			/* rwm 8/13/08 margin-right:11px; */
		}
			div.grid-ab {
				width:320px;
				float:left;
				margin-right:8px;
				padding-right:8px;
				border-right:1px solid #EEE;
			}
			div.grid-abc {
				width:488px;
				float:left;
				margin-right:0;
			}
			div.grid-ab-c-d,
			div.grid-ab-cd,
			div.grid-abcd {
				width:100%;
				border-right:1px solid #EEE;
				padding-right:7px;
			}
		div.grid-b {
			width:152px;
			float:left;
			border-right: 1px solid #eee;
			padding: 0 7px;
			/* rwm 8/13/08 margin-right:11px; */
		}
			div.grid-bc {
				width:320px;
				float:left;
				margin-right:16px;
			}
			div.grid-bcd {
				width:488px;
				float:right;
			}
		div.grid-c {
			width:152px;
			float:left;
			margin-right:5px;
			padding-right:7px;
			border-right:1px solid #EEE;
		}
			div.grid-cd {
				width:320px;
				float:right;
				margin:0 0 0 -5px;
				padding:0;
			}
		div.grid-d {
			width:152px;
			float:right;
		}
	div.grid-ads { padding:20px 0 0; }
	div.rail {
		width:300px;
		float:right;
	}
		div.rail_harvest {
		width:220px;
		float:right;
		height: 800px;
		background-color:#E5E5E5;
	}
		.iframe_harvest {
		width: 210px;
		height: 100%;
		min-height: 100%;
	}

		div.rail2 {
			padding:0;
		}
		div.railunit {
			margin-bottom:13px;
			padding-bottom:0;
		}
			div.rail-a {
				width:146px;
				float:left;
			}
			div.rail-b {
				width:146px;
				float:right;
			}
			div.rail-ab {}
	/**
	 * @section No Right Margin
	 * @notes may need to be applied to some grid units to prevent column wrapping in IE6.
	 */
	div.nrm { margin-right:0 !important; }
}

/**
 * @section print-based grid styles (also from grids.css)
 */
@media print {
	div.grid-a {
		width: 25%;
		margin-right:1%;
		float:left;
	}
		div.grid-ab {
			width:50%;
			margin-right:1%;
			float:left;
		}
		div.grid-abc {
			width:75%;
			margin-right:0;
			float:left;
		}
		div.grid-abcd {}
	div.grid-b {
		width:24%;
		margin-right:1%;
		float:left;
	}
		div.grid-bc {
			width:49%;
			margin-right:0;
			float:left;
		}
		div.grid-bcd {
			width:73%;
			float:right;
		}
	div.grid-c {
		width:24%;
		margin-right:0;
		float:left;
	}
		div.grid-cd {
			width:49%;
			float:right;
		}
	div.grid-d {
		width:24%;
		float:right;
	}
}

/**
 * @section More grid styles (yes, from grids.css)
 */

/*
 * See http://positioniseverything.net/easyclearing.html
 * for a description of this code.
 *
 * This code is applied to ALL media.
 *
 * fix clearing of floated items without structural markup
 */
.clearfix:after, #pagebody:after, .tier:after, .gridunit:after,
.railunit:after, #pagefooter:after, #mcclatchy:after, #main-nav ul.subnav:after,
#cb-quicksearch:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix, #pagebody, .tier, .gridunit, .railunit, #pagefooter, #mcclatchy, #main-nav ul.subnav, #cb-quicksearch { display:block; }
/* Hides from IE-mac \*/
* html .clearfix, * html #pagebody, * html .tier, * html .gridunit,
* html .railunit, * html #pagefooter, * html #mcclatchy, * html #main-nav ul.subnav,
* html #cb-quicksearch { height:1%; }
*+html .clearfix, *+html #pagebody, *+html .tier, *+html .gridunit,
*+html .railunit, *+html #pagefooter, *+html #mcclatchy, *+html #main-nav ul.subnav,
*+html #cb-quicksearch { height:1%; }
/* End hide from IE-mac */

/**
 * @section New Navigation Bar styles
 */
@media screen, projection  {
	#main-navbar {
		height: 62px;
		font-size: 13px;
		font-weight: bold;
		position: absolute;
		top: 75px;
	}
	#main-navbar ul {
		margin: 0;
		padding: 0;
	}
	#main-navbar li {
		display: block;
		float: left;
		list-style-type: none;
		text-align: center;
	}
	#main-navbar a {
		display: block;
		text-decoration: none;
	}
	#main-navbar li.last > a {
		border: 0;
	}

	/**
	 * @subsection Nav Bar Topnav
	 */
	#main-navbar .topnav {
		height: 28px;
	}
	#main-navbar .topnav.active {
		background: #e8f3f9;
		background: -moz-linear-gradient(center top, #fbfcfe 0%, #d8e9f3 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fbfcfe), color-stop(1, #d8e9f3));
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fbfcfe', endColorstr='#d8e9f3');
	}
	#main-navbar .topnav > a {
		border-right: 1px solid #999;
		color: #444;
		height: 21px;
		line-height: 21px;
	}
	#main-navbar .topnav.active > a {
		color: #024A82;
	}
	#main-navbar .topnav.right > a {
		font-weight: normal;
		color: #024A82;
	}

	#main-navbar #nav-news > a { width: 50px; }
	#main-navbar #nav-capital > a { width: 136px; }
	#main-navbar #nav-region > a { width: 82px; }
	#main-navbar #nav-sports > a { width: 56px }
	#main-navbar #nav-livinghere > a { width: 92px }
	#main-navbar #nav-entertainment > a { width: 106px }
	#main-navbar #nav-opinion > a { width: 68px }
	#main-navbar #nav-cars > a { width: 44px }
	#main-navbar #nav-jobs > a { width: 44px }
	#main-navbar #nav-homes > a { width: 56px }
	#main-navbar #nav-classifieds > a { width: 83px }
	#main-navbar #nav-shopping > a { width: 80px }
	#main-navbar #nav-ad { height:26px; overflow: hidden; width: 82px }

	/**
	 * @subsection Nav Bar Subnav
	 */
	#main-navbar .subnav {
		background: #024c71;
		background: -moz-linear-gradient(center top, #043d5d 40%, #016a9a 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(.4, #043d5d), color-stop(1, #016a9a));
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#043d5d', endColorstr='#016a9a');

		display: none;
		height: 34px;
		left: 0px;
		position: absolute;
		top: 28px;
	}
	#main-navbar .subnav.active {
		display: block;
	}
	#main-navbar .subnav li {
		height: 22px;
		padding-top: 12px;
	}
	#main-navbar .subnav li.first {
		padding-left: 6px;
	}
	#main-navbar .subnav li.active {
		background: #4c88ac;
		background: -moz-linear-gradient(center top, #98c4df 20%, #3a7fa9 80%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(.2, #98c4df), color-stop(.8, #3a7fa9));
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#98c4df', endColorstr='#3a7fa9');
	}
	#main-navbar .subnav a {
		border-right: 1px solid #698FA4;
		color: white;
		font-size: 12px;
		font-weight: normal;
		height: 12px;
		line-height: 12px;
		padding: 0 6px;
		width: auto;
	}
	#main-navbar .topnav.right .subnav {
		left: auto;
		margin-left: 0;
		right: 0;
	}

	/**
	 * @subsection Nav Bar Sponsors
	 */
	#main-navbar .subnav.sponsor {
		width: 100%;
		z-index: -1;
	}
	#main-navbar .rsponsorcontainer {
		position: absolute;
		top: 0px;
		height: 34px;
		right: 10px;
		left: auto;
		float: right;
		background-image: url('http://media.sacbee.com/static/img/sponsoredby/sponsorback.gif');
		cursor: pointer;
	}
	#main-navbar .rsponsorleft {
		float: left;
		position: relative;
		width: 14px;
		height: 34px;
		background-image: url('http://media.sacbee.com/static/img/sponsoredby/navbar_sponsor_endcaps.gif');
	}
	#main-navbar .rsponsorcenter {
		float: left;
		position: relative;
		height: 34px;
		padding: 0px 5px 0px 4px;
	}
	#main-navbar .rsponsorby {
		position: absolute;
		left: 0px;
		top: 7px;
		width: 66px;
		height: 5px;

		font-size: 8px;
		text-transform: uppercase;
		color: #444;
	}
	#main-navbar .rsponsortext {
		position: absolute;
		xtop: 14px;
		top: 15px;
		left: 5px;
		font-size: 10px;
		text-transform: uppercase;
	}
	/* Override for Lingospot */
	#main-navbar .rsponsortext .lingo_link {
		border-right: none;
		color: black;
		padding: 0;
	}
	#main-navbar .rsponsorright {
		float: left;
		position: relative;
		width: 2px;
		height: 34px;
		background-image: url('http://media.sacbee.com/static/img/sponsoredby/navbar_sponsor_endcaps.gif');
		background-position: -15px 0px;
	}

	/* Individual Sponsor Styles */
	#main-navbar .sponsorsullivan { width: 190px; }
	#main-navbar .sponsorsullivan .rsponsorcenter { width: 165px; }

	#main-navbar .sponsortoyota { width: 135px; }
	#main-navbar .sponsortoyota .rsponsorcenter { width: 110px; }

	#main-navbar .sponsorftoyota { width: 150px; }
	#main-navbar .sponsorftoyota .rsponsorcenter { width: 125px; }

	#main-navbar .sponsorCCUL { width: 210px; }
	#main-navbar .sponsorCCUL .rsponsorcenter { width: 185px; }

	#main-navbar .sponsorsutter { width: 115px; }
	#main-navbar .sponsorsutter .rsponsorcenter { width: 90px; }
}