@charset "utf-8";
/* Set the styles and background image for the "body" paart of the document */
body {
	color:#000;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	background-image: url(../images/Bglogo-234px_45.png);
	background-repeat:repeat;
	margin:0;
}
/* Set the width of the Home page, background and if wanted, a background image (commented out) and left & right border */
#wrapper {
	width: 960px;
	margin: 0 auto;
	background-color:#FFF;
	/*background-image:url(../images/sidebar_both.jpg);*/
    /*background-position:center;
	background-repeat:repeat-y;*/
	border-left:#252017 solid 1px;
	border-right:#252017 solid 1px;
}
/* Sets the height of the header, the background image and whetehr the image repeats or not */ 
#header {
	height: 234px;
	background-image: url(../images/BikeHash960x234px.jpg);
	background-repeat: no-repeat;
}
/* Sets the styling of any text that is written over the header background image */
#header h1 {
	margin:0;
	padding:10px 20px;
	color:#FFF;
	font-family:Verdana, Geneva, sans-serif;
}
/* Sets the size and padding for the left sidebar */
#sidebar1 {
	width:100px;
	padding:10px 5px;
}
/* Sets the size and padding for the right sidebar whic is not contained in the "inner" div */
#sidebar2 {
	width:200px;
	padding:10px 5px;
}
/* Sets the width of the central section + left sidebar and makes it float (position) to the left */
#inner {
	width:740px;
	float:left;
}
/* Makes the left sidebar float to the left. This won't work if added to the earlier #sidebar1 above */
#sidebar1 {
	float:left;
}
/* This is the central column of the page, seting width and styling paramenters */
#mainContent {
	width:600px;
	float:right;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;
}
/* This is the righ sidebar, (not contained in "inner" div) and is floated right. Won't work if added to the earlier #sidebar2 style */
#sidebar2 {
	float:right;
}
/* The next two styles determine the way the area in the centre of the page looks. Currently with a light green background, set for one column (#subcol1) and containing the */
/* "Next Ride" tabele */
#subcol_wrapper {
	background-color: #E8ECD8;
	overflow:auto;
}
span p {
	color: #F00;
	margin: 2px 0px;
	font-style: italic;
}
/* Used to determine the width and style of subcol1 if only one column is being used in the central section. The :Next Ride" table is currently there. */
#subcol1 {
	width:540px;
	padding:0 10px;
	float:left;
}
/* This next style is is used to style the second column in the area now used by the "Next Ride" table. The HTML has the <div> that contains it commented out */
/*#subcol2 {
	width:270px;
	padding:0 10px;
	float:right;
}*/

/* This styles the way the header above the "Next Ride" table looks */
#subcol_wrapper h3 {
	border-bottom:3px solid;
	font-size: 150%;
	color: #F00;
	margin-top: 0;
	margin-right: 10px;
	margin-bottom: 0;
	margin-left: 10px;
}
/* This styles the way the "Next Ride" table looks */
table {
	font-weight: bold;
	border-collapse: collapse;
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
}
td {
	padding: 5px;
	vertical-align: top;
	border-bottom: 1px solid;
}
/* These styles deal with table captions and header row in the table - currently not used */
caption {
  font-size:18px;
  color:#468966;
  font-weight:bold;
  text-transform:capitalize;
}
th {
  font-weight: normal;
  text-align:right;
}
/* end comment */
#footer {
	background-color:#E8ECD8;
	color:#333;
	text-align: center;
	padding:3px;
	clear:both;
}
/* These next styles determine the way the footer looks */
#footer p {
	margin: 2px 0;
	font-size: x-small;
}
/* Sets the size, colour and font stye for the footer paragraph "p" that comes within the <span> tag. */
#footer span p {
	font-size: x-small;
	color: #333;
	font-style: normal
}
/* The next two styles are classes and my be used anywhere in the document. They set the margins for paragraphs with this class. */
.marginp_tb_5px {
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
	text-align: center;
}
.marginp_tb_5px_small_txt {
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
	text-align: left;
	font-size: 12px;
}
/* Sets the general style for an h2 header */
h2 {
	margin-top: 0;
}
/* Sets the style for an h3 header that appears in the mainContent div */
#mainContent > h3 {
	margin-top: 5px;
	margin-bottom: 5px;
	text-align: left;
	font-weight: bolder;
	color: #00875A;
}
/* Sets the general style for an h4 header */
h4 {
	margin-top: 4px;
	margin-bottom: 0;
}
/* Sets the general style for a paragraph that follows an h4 header */
h4 + p {
	margin-top: 5px;
	margin-bottom: 5px;
}
/* Sets the general style for an h3 header that is in the left sidebar */
#sidebar1 h3 {
	margin-top: 5px;
	margin-bottom: 5px;
	text-align: center;
	font-weight: bolder;
	color: #00875A;
}
/* Sets the general style for an h3 header that is in the right column */
#sidebar2 h3 {
	margin-top: 0;
	margin-bottom: 5px;
	text-align: center;
	font-weight: bolder;
	color: #00875A;
}
/* THese next styles determine the styling of hyperlinnks */
a {
  font-weight:bold;
  text-decoration:none;
}
a:link {
  color:#B64926;
}
a:visited {
  color:#75BAFF;
}
a:hover, a:active {
  color:#8E2800;
  text-decoration:underline overline;
}
/* These two styles are not currently used, but are useful class styles to help float text around an image */
.floatleft {
  float:left;
  margin:3px 8px 3px 0;
}
.floatright {
  float:right;
  margin:3px 0 3px 8px;
}
/* This style takes care of a bug in IE6 & 7 */
[if lte IE 6]> <style type="text/css"> #subcol_wrapper {
 zoom: 1;
}
</style> <![endif]
