@charset "utf-8";
/* CSS Document */
@import "reset.css";
html { overflow-y: scroll }
body { font-family: Helvetica, Verdana, Arial, sans-serif; font-size: 62.5%; background: #5286bc; min-width: 800px }

a { text-decoration: none }
a:focus, a:hover { text-decoration: underline }

/******************************************* Layout*/
#wrapper { width: 800px; margin: 20px auto 0; font-size: 1.2em; background: #8cb4dc url(../../images/bg_wrapper.png) top left repeat-x }

/******************************************* Header */
#header { position: relative; width: 100%; height: 113px; margin-bottom: 10px; background: url(../../images/bg_header.png) center 10px no-repeat }
#header .top { width: 100%; height: 6px; position: absolute; top: 0; left: 0; background: url(../../images/bg_wrapper_top.png) top left no-repeat }
#header .logo { height: 87px }
#header .logo a:focus { background: none }

#header img { position: absolute }
#header img.sharp { top: 20px; left: 30px }
#header img.charity { top: 28px; left: 515px }
#header img.raam { top: 28px; left: 658px }

#header .counter { display:none; height: 55px; width: 189px; background: url(../../images/counter.png) left top no-repeat;position: absolute; top: 20px; right: 22px }
#header .counter p { width: 52px; height: 22px; font-size: 19px; font-weight: bold; color: white;position: absolute; top: 18px; left: 12px; letter-spacing: 8px }

/*
#header img.donate { top: 18px; right: 20px }
*/
/******************************************* Navigation */

/*.menu li.home:hover > a {background:#fff url(../images/home_f2.jpg) no-repeat left top;height:19px;}*/


#nav { height: 20px; margin-bottom: 6px }
#nav ul { height: 20px; margin-left: 27px }
#nav li { float: left; height: 20px }
#nav li a { display: block; color: white; font-weight: bold; height: 20px; text-indent: -9999px; 
	background: url(../../images/nav.png) top left no-repeat }
/*#nav ul li:hover > a { display: block; color: white; font-weight: bold; height: 20px; text-indent: -9999px; 
	background: url(../../images/nav_over.png) top left no-repeat }*/
#nav li.nav-1 a { width: 101px; background-position: 0 0 }
/*#nav ul li.nav-1:hover > a { width: 101px; background-position: 0 0; background: url(../../images/nav_over.png); }*/
#nav li.nav-2 a { width: 240px; background-position: -101px 0 }
#nav li.nav-3 a { width: 140px; background-position: -341px 0 }
#nav li.nav-4 a { width: 197px; background-position: -481px 0 }
#nav li.nav-5 a { width: 77px; background-position: -678px 0 }
#nav li a:hover { filter: alpha(opacity=60); -moz-opacity: .60;	opacity: .60; }

/******************************************* Sidebar */
#sidebar { width: 201px; margin-right: 12px; float: right }
#sidebar div { margin-bottom: 10px }
#sidebar p { margin: 0 10px }
#sidebar a { display: block; font-weight: bold; color: #ed1c29; text-decoration: underline }
/*
#sidebar .donation { height: 72px; background: url(../../images/bg_donation.png) top left no-repeat }
#sidebar .donation a { text-indent:-9999px; display:block; height:20px; width:200px; padding-top:15px}
#sidebar .donation p { color: #bbd6f0; line-height: 1.2em }
#sidebar .newsletter { height: 136px; background: url(../../images/bg_newsletter.png) top left no-repeat }
#sidebar .newsletter p { position: relative; top: 70px; margin-right: 50px; color: #6699cc; font-size: 0.9em; line-height: 1.3em }

#sidebar .speed { height: 137px; background: url(../../images/bg_speed.png) top left no-repeat }
#sidebar .speed p { position: relative; top: 70px; margin-right: 50px; color: #6699cc; font-size: 0.9em; line-height: 1.3em }

#sidebar .rapha { height: 137px; background: url(../../images/bg_raphacondor.png) top left no-repeat;  }

#sidebar .gallery { height: 137px; background: url(../../images/bg_gallery.png) top left no-repeat;  }

#sidebar .tour { height: 137px; background: url(../../images/bg_tour.png) top left no-repeat }
#sidebar .tour p { position: relative; top: 70px; margin-right: 50px; color: #6699cc; font-size: 0.9em; line-height: 1.3em }

#sidebar .events { height: 215px; background: url(../../images/bg_events.jpg) top left no-repeat }
#sidebar .events p { position: relative; top: 55px; color: white; line-height: 1.3em }
#sidebar .events p span { color: #bbd6f0; font-weight: bold }

#sidebar .hoedown { height: 302px; background: url(../../images/hoedown.png) top left no-repeat }
#sidebar .hoedown a { text-indent:-9999px; display:block; height:302px; width:200px;}
*/

/******************************************* Home Page Base */

#brakes { margin: 10px 0 0 0;float: left }
#justgiving { padding: 2px 0 0 0; }

/******************************************* Footer */
#footer { position: relative; width: 100%; height: 55px; clear: both; background: url(../../images/bg_wrapper_btm.jpg) bottom left no-repeat }
#footer a { display: block; position: absolute; top: 20px }
#footer a.akiko { width: 99px; height: 21px; left: 20px; background: url(../../images/logo_footer_akiko.png) top left no-repeat }
#footer a.raam { width: 69px; height: 23px; left: 235px; background: url(../../images/logo_footer_raam.png) top left no-repeat }
#footer a.rapha { width: 148px; height: 28px; left: 425px; background: url(../../images/logo_footer_raphacondor2.png) top left no-repeat }
#footer a.charity { width: 88px; height: 28px; left: 695px; background: url(../../images/logo_footer_charity.png) top left no-repeat }
/*
#footer a.speed { width: 75px; height: 30px; top: 23px; left: 708px; background: url(../../images/logo_footer_speed.png) top left no-repeat }
*/

/******************************************* Links */
#links { width: 800px; margin: 0 auto; background: #5286bc; text-align: right; font-size: 0.9em }
#links ul { float: right; margin: 15px 0 }
#links ul li { float: left; margin-right: 5px }
#links ul li a { color: white; text-transform: uppercase }
#links ul li a:focus { text-decoration: none }

/******************************************* Global Content */
#content { width: 556px; margin: 0 12px; float: left }
#content a { font-weight: bold; color: #ffffff; text-decoration: underline }
#content p, #content li {line-height: 1.3em }

/******************************************* Home Content */
/*body.home #content p { margin: 0 10px;}
body.home #content a { display: block; }*/
/*
body.home #content .moneyraised { background: url(../../images/bg_money_raised.png) left top no-repeat; min-height: 278px; height: auto !important; height: 278px }
body.home #content .moneyraised p { position: relative; top: 190px; margin: 0; color: white }
body.home #content .meet { width: 380px; height: 300px; float: left; background: url(../../images/bg_meettheteam.jpg) top left no-repeat }
body.home #content .meet p { position: relative; top: 210px; color: #b4d2f0 }
body.home #content .about { width: 165px; margin-left: 15px; height: 300px; float: right; background: url(../../images/bg_about.png) top right no-repeat }
body.home #content .about p { position: relative; top: 100px; color: #6188b3 }
body.home #content .about a { position: relative; top: 20px }
.fadein { position:relative; height:384px; width:560px; clear:both; background: url(../../images/slideshow/ss-bg.png) no-repeat 0 0 }
.fadein img { position:absolute; left:20px; top:20px; }
*/

.home #content #asset-1 { height: 180px; width: 100%;}
.home #content #teamNews { margin-top: 10px; color: white; min-height: 96px; width:330px; float:left}
.home #content #teamNews h2 { color: white; font-size: 24px; margin-bottom: 3px }
.home #content #teamNews p { color: white }
.home #content #teamNews .date { margin-bottom: 4px; font-weight: bold; font-style: italic }
.home #content #teamNews .desc a { color: red; font-weight: bold; font-style: italic; text-decoration: none }
.home #content #teamProfiles { float: left; height: 234px; width: 379px; }
.home #content #endomondo { float: right; width: 164px; height: 234px; background: url(../../images/endomondo_info.jpg) left top no-repeat }
.home #content #endomondo a { display: block; height: 100%; width: 100% }
.home #content #hoedown {float:right; height:121px;width:219px; background: url(../../images/hoedown.jpg) left top no-repeat; margin: 10px 0; }
.home #content #hoedown a { display: block; height: 100%; width: 100% }

#sidebar #donate { position: relative; height: 180px; width: 100%; }
#sidebar #eventsDiary { height: 96px; width: 100%; background: url(../../images/events_diary.jpg) left top no-repeat }
#sidebar #eventsDiary a { display: block; height: 100%; width: 100% }
#sidebar #ridersPages { position: relative; height: 232px; width: 100%; background: url(../../images/ridersPages.png) left top no-repeat }
#sidebar #ridersPages h3 { clear: left; color: white; font-size: 24px; position: relative; top: 40px; left: 9px }
#sidebar #ridersPages p { padding-top: 3px; margin: 0 7px; font-weight: bold; text-size: 9px; color: #bad4ef }
#sidebar #ridersPages span { padding-left: 12px }
#sidebar #ridersPages ul { margin: 50px 10px 10px }
#sidebar #ridersPages li { height: 23px; line-height: 23px; border-bottom: 1px solid #bad4ef; 
	background: url(../../images/arrow.png) right center no-repeat }
#sidebar #ridersPages li a { color: #bad4ef; text-decoration: none; display: inline; position: static }
#sidebar #ridersPages a { display: block; position: absolute }
#sidebar #ridersPages a.youtube { height: 28px; width: 68px; background: url(../../images/youtube.png) left top no-repeat; top: 23px; left: 7px }
#sidebar #ridersPages a.radar { height: 39px; width: 141px; background: url(../../images/bike_radar_logo.jpg) left top no-repeat; top: 146px; left: 7px }
#sidebar #ridersPages a.flickr { height: 19px; width: 66px; background: url(../../images/flickr.png) left top no-repeat; top: 28px; right: 19px }
#sidebar #ridersPages a.twitter { height: 19px; width: 77px; background: url(../../images/twitter.png) left top no-repeat;
	bottom: 10px; left: 10px }
#sidebar #ridersPages a.facebook { height: 31px; width: 83px; background: url(../../images/facebook.png) left top no-repeat; top:198px; 
	bottom: 10px; right: 13px }

/******************************************* Global Inside */

#content h1 { text-indent:-9999px; background:url(../../images/h1-sprite.png) no-repeat; height:34px; margin-bottom:10px}
#content h2 { font-size:16px; color:#bceefe; margin-bottom:6px }
#content p, #content ul { color:#2c4661; font-size:12px; margin-bottom:14px;  }
#content p.intro { color:#fff; font-size:14px; font-weight:bold; margin-bottom:6px}
#content p.highlight { color:#fff; font-weight:bold }
#content ul { margin-left: 30px; margin-right:30px}
#content ul li { list-style: disc; margin-top:12px;}
#content ol { margin-left: 30px; margin-right:30px}
#content ol li { list-style:decimal; margin-top:12px;}

/******************************************* Sub Nav*/
/*
body.inside #content #subnav { margin: 0 0 20px 0}
body.inside #content #subnav li { color:#5184b9; float:left; list-style:none; padding-right:10px }
body.inside #content #subnav li a { color:#5184b9; float:left; display:block; text-transform: uppercase; font-size:11px; font-weight:bold; font-style:italic; margin-right:10px}
*/
body.inside #content #subnav li.current a { color:#bceefe}

/******************************************* [EVENTS] Content */

body.events-diary #content img.events-diary { margin-bottom: 10px }
body.events-diary #content table { text-align: left }
body.events-diary #content table th { padding-bottom: 5px }
body.events-diary #content table th h3 { color: white; font-size: 1.2em }
body.events-diary #content th,
body.events-diary #content td { width: 20%; padding-right: 1%; padding-bottom: 2px }
body.events-diary #content th.event,
body.events-diary #content td.event { width: 36% }

body.events #content ul li { margin-left: 30px;}
body.walk #content ol { margin-left:25px; color:#2c4661; margin-bottom:15px}
body.walk #content li { list-style:decimal}


/******************************************* h1 Classes */

body.about #content h1 { background-position: 0 -314px}
body.inside aboutcharity #content h1 { background-position: 0 -280px}
body.info #content h1 { background-position: 0 0}
body.raam #content h1 { background-position: 0 -35px}
body.sponsorship #content h1 { background-position: 0 -70px}
body.links #content h1 { background-position: 0 -105px}
body.contactus #content h1 { background-position: 0 -140px}
body.media #content h1 { background-position: 0 -455px}
body.terms #content h1 { background-position: 0 -175px}
body.privacy #content h1 { background-position: 0 -210px}
body.events #content h1 { background-position: 0 -350px}
body.partners #content h1 { background-position: 0 -245px}
/*body.aboutcharity #content h1 { background-position: 0 -280px}
body.aboutsharp #content h1 { background-position: 0 -315px}
body.donate #content h1 { background-position: 0 -385px}
body.newsletter #content h1 { background-position: 0 -420px}

*/
/******************************************* TERMS Classes */
/*
body.terms #content ol,ul { margin-left:15px; color:#2c4661; margin-bottom:15px}
body.terms #content ul { margin-bottom:0}
body.terms #content ul li.letters { list-style: lower-alpha;}
body.terms #content li { list-style:decimal}
*/
/******************************************* NEWSLETTER Classes */
/*
body.newsletter #content form#contact {margin:30px 0 0 20px }
body.newsletter #content form#contact label { width:90px; color:#2c4661; display:block; float:left;}
div.thanks { margin: 20px auto 0; width: 790px; border: 1px solid #E91D24; color: #E91D24; padding: 5px; background: white; text-align: center; font-size: 1.4em; font-weight: bold; display: none }
div.donate { float: left; width: 45%; position: relative; top: 227px; text-align: center }  

form { width: 55%; float: left }
form p { position: relative; min-height: 22px; margin-bottom: 5px; clear: both }
form p.last { color: #396a9c; padding-top: 10px; margin-bottom: 0 }
form label { display: block; float: left; color: #396a9c; font-weight: bold; font-size: 1em; line-height: 1.1em; }
body.newsletter #content form#contact label.error { color: red; font-weight: normal; font-style: italic; clear: both; margin-left: 90px; width: 185px; padding: 3px 0 10px; text-align: right }
form input[type=text] { float: left; width: 180px }
form textarea { float: left; width: 180px }
form input[type=image] { margin: 10px 0 0 90px }
*/
/******************************************* Generic Classes */
.white { color: white }
.red { color: #ec1d25 }
.l-blue { color: #bbd6f0 }
.clear {display:inline-block;}
.clear:after {content:".";display:block;height:0;clear:both;visibility:hidden;}
* html .clear {height:1%;}
.clear {display:block;}
.cboth {clear:both;}