/* -----------------------

Site:			Hambleton UK Limited
Author:			Gareth Redfern
Updated:		21-09-10
Updated by:		Gareth Redfern

COLORS
Body: 			#858585
Borders:    #E5E5E5
Links: 			#165278
Visited links:	#
Hover links:	#

----------------------- */

@media screen {

/* -----------------------------------
Global reset
----------------------------------- */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, nav, section { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
article, aside, dialog, figure, footer, header, hgroup, nav, section { display: block; }
body { line-height: 1.5; }
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
table, td, th { vertical-align: middle; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
a img { border: none; } /* Gets rid of IE's blue borders */
a { outline: none; }
li { list-style: none; }
.clear { clear: both; }
hr { color: #E5E5E5; }

/* -----------------------------------
Global reset-RESET (restores some sensible defaults)
----------------------------------- */
strong { font-weight: bold; }
em { font-style: italic; }
a:active { outline: none; }
html { overflow-y: scroll; }

.group:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /* Taken from Handcrafted CSS Self-Clear Floats */
* html .group { /* IE6 */ height: 1%; }
*:first-child+html .group { /* IE7 */ min-height: 1px; }

/* -----------------------------------
Basic layout
----------------------------------- */
body { color: #858585; font: 62.5% Arial, "MS Trebuchet", sans-serif; background: #FFF url(../images/background.jpg) repeat-x left top; }
#main-wrap { width: 740px; margin: 32px auto 0; }
.main-content { width: 490px; float: right; }
.header { float: right; width: 497px; margin-bottom: 2em; }
.aside { background-color: #F7F7F7; width: 233px; border-right: 2px solid #E5E5E5; border-bottom: 2px solid #E5E5E5; float: right; }
.col-1 { border-bottom: 1px solid #E5E5E5; float: left; width: 477px; margin-left: 20px; display: inline; }
.col-2 { float: left; width: 220px; padding-top: 3em; margin-left: 20px; display: inline; }
.col-3 { float: right; width: 200px;  border-left: 1px solid #E5E5E5; padding-left: 2em; }
.col-4 { float: right; width: 464px; padding-top: 3em; }

/* -----------------------------------
Navigation
----------------------------------- */
.header .nav { width: 475px; padding-bottom: 19px; margin: -37px 0 0 30px; position: relative; height: 52px; }
.nav li { float: left; display: inline; }
.header a { display: block; padding: 35px 5px 5px; text-transform: uppercase; border-left: 1px solid #E5E5E5; text-decoration: none; }
.footer .nav { width: 150px; display: block; margin: 22px auto 0; overflow: hidden; }
.footer a { display: block; padding: 0px 30px 10px 5px; border-left: 1px solid #FFFFFF; text-decoration: none; }
#home .home a { color: #99CC66; background-color: #4C9DCF; }
#about .about a { color: #99CC66; background-color: #4C9DCF; }
#policy .policy a { color: #99CC66; background-color: #4C9DCF; }

/* -----------------------------------
Footer
----------------------------------- */
.footer { background-color: #4C9DCF; height: 46px; margin-top: 3em; }
.footer-inner { width: 730px; margin: 0 auto; overflow: hidden; }

/* -----------------------------------
Basic typography
----------------------------------- */

/* -----------------------------------
Specifics h1
----------------------------------- */
h1 { color: #99CC66; font-size: 1.4em; margin: 2em 0 0.5em 0; }

/* -----------------------------------
Specifics h2
----------------------------------- */
h2 { font-size: 1.2em; color: #666; margin: 2em 0 0.5em 0; }
.aside h2 { margin-left: 2em; }

/* -----------------------------------
Specifics h3
----------------------------------- */
h3 { margin: 10px 0 5px; font-weight: bold; }

/* -----------------------------------
Specifics a
----------------------------------- */
a { color: #165278; }
.footer a { color: #FFF; }
small a { text-decoration: none; }

/* -----------------------------------
Specifics lists
----------------------------------- */
.col-2 li { line-height: 2em; }
.aside li { line-height: 2em; list-style-type: circle; color: #666; }
.aside ul { margin: 1em 3.5em; }

/* -----------------------------------
Specifics p
----------------------------------- */
p { font-size: 1.1em; margin-bottom: 1.5em; }
#home .col-1 p { width: 22em; }
.aside p { margin: 1em 2em; }
#about .col-1 p { width: 300px; float: right; }
#vcard p { margin-bottom: 5px; }

/* -----------------------------------
Specifics other
----------------------------------- */
.footer-inner small { padding: 20px 0; display: block; text-align: center; color: #666; }

/* -----------------------------------
Images
----------------------------------- */
#home .col-1 img { float: right; }
#about .col-1 img { float: left; margin: 26px 10px; }
.img-1, .img-2 { margin-bottom: -3px; }
.col-4 img { float: right; }

/* -----------------------------------
Enrichment
----------------------------------- */

} /* END @media screen */


/* -----------------------------------
Print
----------------------------------- */

@media print {

/* PUT PRINT STYLES HERE */

} /* END @media print */