@charset "UTF-8";
/* CSS Document */


/* RESET */
/* ----------------------------------------- */

/* Global reset */
/* Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
ol, ul, li { list-style:none }
caption, th { text-align:left }
h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal }
q:before, q:after { content:''}

/* Global reset-RESET */
/* The below restores some sensible defaults */
strong { font-weight: bold }
em { font-style: italic }
a img { border:none } /* Gets rid of IE's blue borders */

/* This helps to identify headings at the initial build stage, so I thought it'd be useful to have it */
h1, h2, h3, h5, h5, h6 { font-weight:bold } 


/* LAYOUT */
/* ----------------------------------------- */

/* You might find the following useful */
br.dirtyLittleTrick { clear:both; display:block; height:1px; margin:-1px 0 0 0 } /* Use this br class to clear your floated columns */
div { position:relative } /* This will save you having to declare each div's position as 'relative' and allows you to absolutely position elements inside them */


body { background: #024979; font-family: Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; color: #fff; font-size: 62.5%; }


#intro { width: 970px; margin: 0 auto; }
#intro .photoCol { width: 291px; float: right; margin-right: 35px; }
#intro .double { width: 620px; padding-top: 10px; border-top: 1px solid #fff; }
#intro .single { width: 300px; float: left; margin: 0 20px 0 0; }


#lowerHalf { background: #0087B5 url(images/bkd-lower-half.png) repeat-x 0 0; }
#lowerHalf .center { width: 970px; margin: 0 auto; }
#lowerHalf .single { width: 410px; float: left; margin: 10px 30px; }
#lowerHalf h2 { margin: 10px 30px 0px; }
#lowerHalf p { padding-bottom: .8em; }


#footer { background-color: #01729F; text-align: center; padding: 1em; }




h1 { height: 65px; background: url(images/before-the-wheel-logo.png) no-repeat; margin: 1em 0em 0em; }
h1 span { display: none; }

h2 { font-family: Cambria, Georgia, Times, 'Times New Roman', serif; font-size: 1.7em; color: #EFE4B6; line-height: 1.5em; padding-bottom: 1em; }
h3 { font-family: Cambria, Georgia, Times, 'Times New Roman', serif; font-size: 1.4em; color: #EFE4B6; line-height: 1.2em; padding-bottom: .7em; }
h4 { font-size: 1.5em; color: #EFE4B6; line-height: 1.5em; padding-bottom: 0em; font-weight: bold; }
h5 { font-family: Cambria, Georgia, Times, 'Times New Roman', serif; font-size: 1.7em; color: #81EA74; line-height: 1.5em; padding-bottom: .5em; }


p { font-size: 1.2em; line-height: 1.8em; padding-bottom: 1em; }

a { /* color: #05A0D8; */ color: #fff; font-weight: bold; }
a:hover { text-decoration: none; }