/* $Id: layout-fixed.css,v 1.1.2.7 2008/01/28 17:41:35 johnalbin Exp $ */

/*
 * LAYOUT STYLES
 *
 * Define CSS classes to create a table-free, 3-column, 2-column, or single
 * column layout depending on whether blocks are enabled in the left or right
 * columns.
 *
 * This layout is based on the Border Politics Layout Method.
 *   http://drupal.org/node/201428
 *
 * Only CSS that affects the layout (positioning) of major elements should be
 * listed here.  Such as:
 *   display, position, float, clear, width, height, min-width, min-height
 *   margin, border, padding, overflow
 */


/** body **/
	
	html, body {
		height:100%;
		background: #f2f2f2 url(../images/background-gradient.jpg) repeat-x left top;
	}
		
	body, font {
		margin:0; padding:0;
		font: 10pt/1.6 Arial, sans-serif;
		text-align: center;
	}

	#container-body {
		padding: 0;
		margin-left: auto;
		margin-right: auto;	
		text-align: left;
		width: 864px;
		background: url(../images/background-content.jpg) repeat-y left top;
	}

	#main {
		margin:0; padding:0;
		background: url(../images/background-fade.jpg) no-repeat left top;
	}
	
	#content {
		margin:0; padding:0;
	}
	
	#container-header {
		height:220px;
	}

	#container-footer {
		padding: 1em 0 0.5em;
		margin-left: auto;
		margin-right: auto;	
		text-align: center;
		width: 864px;
		font-size: 90%;
		background: url(../images/background-footer.jpg) no-repeat left top;
	}
	
	#left {
		width: 236px;
		float: left;
		background-color: #e9e5d2;
		position:relative;
		margin-left:-236px;
		display:inline;
		margin-right: 8px;
	}

	#right {
		width: 588px;
		float: right;
		position:relative;
		margin-right:-588px;
		display:inline;
	}
	
/* Padding */

	#main-inner { 
		padding: 9px 16px 9px;
	}
	
	#content-inner { 
		position:relative;
		display:block; 
		background:#fdfdfd; 
		border-left:236px solid #fdfdfd; 
		border-right:588px solid #f5f1dd; 
		overflow:visible; 
	}

	#right-inner { padding: 0 1.25em 1em; margin: 0;}
	
	#left-inner { padding: 0; margin: 0;}
	
/* Headings & Hyperlinks */

	h1 {
		font-family: Trebuchet MS, sans-serif;
		font-size: 145%;
		line-height: 145%;
		margin: 0.75em 0;
		color: #000;
	}

	h1.title {
		margin: 0.75em 0 0.25em;
	}

	h2 {
		font-family: Trebuchet MS, sans-serif;
		font-size: 120%;
		line-height: 120%;
		color: #000;
	}

	h3 {
		font-family: Trebuchet MS, sans-serif;
		font-size: 110%;
		line-height: 110%;
		color: #000;	
	}
	
	#left h3 {
		margin: 1em 0;
		padding-left: 1.4em;
		color: #000;
	}

	h4.title {
		margin-top: 0.25em;	
	}	
		
	a:link, a:visited { color:#b41c32; text-decoration:none; outline:none; }
	a:hover, a:active { color:#b41c32; text-decoration:underline; }
	
/* Lists */

	#container-footer ul {
		padding: 0.5em 0 0 0;
		margin: 0;
		}
	
	#container-footer li {
		display: inline;
		padding: 0 1px 0 4px;
		border-left: 1px dotted #777;
		}
	
	#container-footer li.first { border: none; padding-left: 0;}
	
	#right .results-table li {
		padding: 0.2em 0;
	}
	
	.clean {
		margin:0; 
		padding: 0;
		list-style-type: none;
	}	

/* Images & Videos*/

	.image-right, .logo-right {
		float: right;
		margin: 0 0 0 1em;
		padding: 4px;
		background-color: #fcfcfc;
		border: 1px dotted #d8d4c1;
	}
	
	.image-left, .logo-left {
		float: left;
		margin: 0 1em 0 0;
		padding: 4px;
		background-color: #fcfcfc;
		border: 1px dotted #d8d4c1;
	}
	
	.logo-right {
		border: none;
		padding: 0;
		margin: 0.5em 0 1em 1.5em;
	}

	.logo-left {
		border: none;
		padding: 0;
		margin: 0.5em 1.5em 1em 0;
	}
	
	.image {
		margin: 0;
		padding: 4px;
		background-color: #fcfcfc;
		border: 1px dotted #d8d4c1;
	}
	
	.video {
		margin: 1em 1em 1em 0;
		width: 320px;
		height: 280px;
		padding: 4px;
		background-color: #fcfcfc;
		border: 1px dotted #d8d4c1;
	}
	
	li.register a, p.register a {
		background: url(../images/register.jpg) no-repeat left top;
		display: block;
		width: 190px;
		height: 46px;
		font-size: 1px;
		text-indent:-5000px;
		margin-left: -5px;
	}

	li.register a:hover, p.register a:hover {
		background: url(../images/register-hover.jpg) no-repeat left top;
	}
	
	img {
		vertical-align:top;
	}
	
/* Navigation */	

	#nav {
		margin: 9px 0; padding: 0;
		height: 35px;
		background-color: #df4b51;
		color: #ffffff;
		}

	#nav ul {
		display: inline;
		margin: 0; padding: 0; 
		list-style-type: none;
	}

	#nav li {
		margin: 0; padding: 0 1.5em;
		float: left;
		border-right: 1px dotted #fff;
		height: 35px;
		font-size: 115%;
		line-height: 230%;
		background-color: #df4b51;
	}
	
	#nav li.first {
	}

	#nav li.last {
		border-right: none;
		background-color: #df4b51;
	}
	
	#home #nav li.first, #schedule #nav li.schedule, #riders #nav li.riders, #sponsors #nav li.sponsors, #spectators #nav li.spectators, #photos #nav li.photos, #results #nav li.results {
		font-style: italic;
		background-color: #c42f3d;
	}
	
	#nav li a { color:#ffffff; text-decoration:none; }
	#nav li a:hover { color:#ffffff; text-decoration:underline; }

/* Sub Navigation */	

	#navrsn, .side {
		padding: 0; margin: 0;
		background-color: #efebd7;
		font-size: 100%;
		border-top: 1px solid #ffffff;
		border-bottom: 9px solid #ffffff;
	}
	
	.subnav {
		padding: 0; margin: 0;
	}
	
	.subnav ul, .side ul {
		padding: 0; margin: 0;
		list-style-type: none;
	}

	.subnav li, .side li {
		text-decoration: none;
		padding: 0.75em 0.75em 0.75em 1.5em; margin: 0;
		list-style-type: none;
		border-top: 1px dotted #c7c8ac;
		list-style-type: none;
		width: 15.4em;
	}
	
	.subnav li.first, .side li.first, .side li.register {
		border: none;
	}

	ul.root {
		margin: 1em 0 0.5em; 
		padding: 0;
		font-weight: normal;
	}
	
	ul.root li {
		margin: 0;
		padding: 0.1em 0 0.1em 1.25em;
		border: 0;
		list-style-image: none;	
		background: url(../assets/arrow.gif) center left no-repeat;		
	}
	
	.subnav li.parent { font-weight: bold; }
	
	#last { border-bottom: none; }
	
	#schedule-nav, #riders-nav, #sponsors-nav, #spectators-nav, #photos-nav, #results-nav {
		display: none;
	}
		
	#schedule #schedule-nav, #riders #riders-nav, #sponsors #sponsors-nav , #spectators #spectators-nav, #photos #photos-nav, #results #results-nav {
		display: inline-block;
		display:-moz-inline-box;
	}
	
	#navrsn li a { color:#000000; text-decoration:none; }
	#navrsn li a:hover { color:#000000; text-decoration:underline; }

/* tables */
	
	table, td, th {
		border-color: #bcb9a6;
		border-style: solid;
		font-size: 95%;
	}

	table {
    	border-width: 0 0 1px 1px;
    	border-spacing: 0;
    	border-collapse: collapse;
		border: 4px solid #cac6b4;
		margin: 1em 0;
	}

	td, th {
    	margin: 0;
    	padding: 5px;
    	border-width: 1px 1px 0 0;
    	background-color: #fefefe;
		text-align: center;
	}

	.results-table td {
		text-align: left;
	}
	
	table.logo {
		border: none;
		margin: 1em 0;
	}

	table.right {
		float: right;
		border: none;
		margin: 0 0 1em 1em;
	}
	
	.logo td, .logo th {
    	margin: 0;
    	padding: 0;
    	border-width: 0;
    	background-color: transparent;
		text-align: left;
	}
	
	.logo th {
		font-size: 85%;
	}
	
/* cleaner */

	.cleaner {
		clear:both;
		height:1px;
		font-size:1px;
		border:none;
		margin:0; padding:0;
		background:transparent;
	}
		
	em {
		font-style: italic;
	}
		
	.form {
		margin: 1em 0 0.5em;	
	}