body	{color: #001199; background-color: #ffffff; font-family: "trebuchet ms", verdana, arial, sans-serif; margin: 2%;}

/*------This code centers the pages within the browser window------*/

#container  {position: relative; margin: auto; width: auto;}
#contents  { border: 1px solid #cbcbcb; padding: 1em;}

#banner	{height: auto;}

#logo	{position: absolute; top: 30px; left: 350px;}

h1	{font-family: "tempus sans ITC", arial, sans-serif; font-weight: bolder; text-align: center; padding-left: 2em; color: #AF43AF; background-color: #ffffff;}

h2, h3	{font-family: "trebuchet ms", "tempus sans ITC", arial, sans-serif; font-style: italic; text-align: left; color: #AF43AF; background-color: #ffffff;  padding-left: 0.3em;}

h3	{margin-bottom: -0.2em;}

h4      {color: #339966; background-color: #ffffff; vertical-align: top; letter-spacing:0.1em;}

h5	{color: #339966; background-color: #ffffff; text-align: center;}


/*------This code controls the 'last ride' & 'next ride' buttons at the bottom of the individual rides pages------*/
#rideNav	{letter-spacing:0.2em;}
#rideNav a	{color: #001199; background-color: #F7F7F7; border: 1px solid #CBCBCB; padding-left: 0.6em; padding-right: 0.6em; padding-top: 0.1em; padding-bottom: 0.1em;}
#rideNav a:hover {color: #424242; background: #ffeeff;}

hr	{border: 1px solid #dbd8d8; margin-left: 2%; margin-right: 2%;}

/*------This code puts a border & padding around all images------*/
#image	{border: 1px solid #cbcbcb; padding: 0.8em;}

#textbox {font-size: 80%; padding-left: 0.5em; padding-right: 0.5em; padding-top: 0.02em; }

a	{color: #001199; background-color: #ffffff; font-weight: bold; text-decoration: none;}
a:hover	{color: #424242; background-color: #ffffff; text-decoration: none;}


#topnav	{font-size: 80%; text-align: center; letter-spacing: 0.2em; margin-top: -1em;}
#topnav a	{color: #001199; background-color: #F7F7F7; font-weight: bold; border: 1px solid #CBCBCB; padding-left: 0.6em; padding-right: 0.6em; padding-top: 0.1em; padding-bottom: 0.1em;}
#topnav a:hover {color: #424242; background-color: #ffeeff;}

#footer		{vertical-align: bottom;}

#footnav	{font-size: 80%; text-align: center; letter-spacing:0.2em; vertical-align: bottom;}
#footnav a	{color: #001199; background-color: #F7F7F7;font-weight: bold; border: 1px solid #CBCBCB; padding-left: 0.6em; padding-right: 0.6em; padding-top: 0.1em; padding-bottom: 0.1em;}
#footnav a:hover {color: #424242; background-color: #ffeeff;}

#pj p, #pj a		{color: #339966; background-color: #ffffff;}
#pj a:hover	{color: #339966; background-color: #F7F7F7; border-top: 1px solid #CBCBCB; border-bottom: 1px solid #CBCBCB;}

table 	{color: #424242; background-color: #f7f7f7; font-family: "Trebuchet MS", verdana, arial, sans-serif; font-size: 115%; letter-spacing:0.04em}

p, ul, ol {color: #424242; background-color: #ffffff; font-family: "Trebuchet MS", verdana, arial, sans-serif; font-size: 115%; letter-spacing:0.04em}

td	{padding-left: 0.5em;}
td	a {color: #001199; background-color: #f7f7f7;}
td	a:hover {color: #424242; background-color: #f7f7f7;}

#thumbBox   {text-align: center;}
.thumb	    {margin: 9px; border: 1px solid #CBCBCB; padding: 0.4em;}
.thumb a:hover	{border: 1px solid #424242;}


/*------This code controls the pullquote on the home page------*/
#stopPress	{font-family: "comic sans ms", sans-serif; font-size: 70%; font-weight: normal; width: 280px;  margin-left: 1em; margin-top: -1.5em; margin-right: 1em; float: right; color: #001199; background-color: #F7F7F7;}
#stopPress td a	{color: #001199; background-color: #f7f7f7; text-decoration: none;}
#stopPress a:hover	{color: #339966; background-color: #F7F7F7; border-top: none; text-decoration: none;}

.quote	{font-family: georgia, batang, serif; text-align: left;}

.purple {color: #AF43AF; background-color: #f7f7f7; font-weight: bold; padding-left: 5em;}

.star	{color: #339966; background-color: #f7f7f7; font-weight: bolder; font-size: 140%;}
.free	{color: #339966; background-color: #ffffff; font-weight: bold;}

#map	{float: right; margin-right: 4.5em; text-align: center; letter-spacing: 0.2em; margin-top: -0.5em; font-size: 80%;}
#map a	{color: #339966; background-color: #DEFEF9; border: 1px solid #339966; padding: 0.2em 1em; display: block;}
#map a:hover	{border: 1px solid #424242; color: #424242; background-color: #DEFEF9;}


#notice	{border: 1px solid #cbcbcb; color: #001199; background-color: #f7f7f7; padding-right: 1.5em; padding-left: 1.5em; margin-left: 5em; margin-right: 5em; font-size: 90%;}
#notice p	{color: #424242; background-color: #f7f7f7;}

.trycycling	{color: #AF43AF; background-color: #f7f7f7; font-family: "Tempus sans ITC", sans-serif; font-weight: bold;}
.mikel	{font-weight: bold; color: maroon; background-color: #f7f7f7; font-size: 1.2em;}

#booking	{font-size: 0.9em; float: right; margin-right: 3em; text-align: center; letter-spacing: 0.2em; margin-top: -0.5em;}
#booking a	{color: #339966; background-color: #DEFEF9; border: 1px solid #339966; padding: 0.2em 1em; display: block;}
#booking a:hover	{border: 1px solid #424242; color: #424242; background-color: #DEFEF9;}

#addPhoto	{font-size: 0.8em; float: right; margin-right: 3em; text-align: center; letter-spacing: 0.2em; margin-top: -0.5em;}
#addPhoto a	{color: #339966; background-color: #DEFEF9; border: 1px solid #339966; padding: 0.2em 1em; display: block;}
#addPhoto a:hover	{border: 1px solid #424242; color: #424242; background-color: #DEFEF9;}

#removePhoto	{font-size: 0.8em; float: right; margin-right: -9em; text-align: center; letter-spacing: 0.2em; margin-top: -0.5em;}
#removePhoto a	{color: #339966; background-color: #DEFEF9; border: 1px solid #339966; padding: 0.2em 1em; display: block;}
#removePhoto a:hover	{border: 1px solid #424242; color: #424242; background-color: #DEFEF9;}

/*------this code controls the box for the photo archive on the photos page -----------*/
#archive	{font-family: "comic sans ms", sans-serif; font-size: 70%;  text-align: center; position: absolute; top: 15px; right: 15px; color: #001199; background-color: #f7f7f7;}
#archive p, #archive a	{font-size: 98%; color: #001199; background-color: #f7f7f7; letter-spacing: 0.2em; line-height: 1.4em;}
#archive a:hover	{color: #424242; background-color: #F7F7F7; border: none;}

#photoNav	{font-size: 70%; letter-spacing: 0.2em; position: absolute; top: 55px; right: 15px;}	
#photoNav a	{color: #001199; background-color: #F7F7F7; font-weight: bold;  border: 1px solid #CBCBCB; padding-left: 0.6em; padding-right: 0.6em; padding-top: 0.5em; padding-bottom: 0.5em; text-align: center;}
#photoNav a:hover {color: #424242; background-color: #F7F7F7;}

#newsNav	{font-size: 70%; letter-spacing: 0.2em; position: absolute; top: 55px; right: 15px;}	
#newsNav a	{color: #001199; background-color: #F7F7F7; font-weight: bold;  border: 1px solid #CBCBCB; padding-left: 0.6em; padding-right: 0.6em; padding-top: 0.5em; padding-bottom: 0.5em; text-align: center;}
#newsNav a:hover {color: #424242; background-color: #F7F7F7;}

#head	{border: none;}	

#bookingForm	{border: 1px solid #cbcbcb; padding: 1em; margin-top: 1em; margin-left: 2em;}
#bookingForm td	{padding-bottom: 0.5em;}