/*

Site design and coding 
by John Rawsterne 
www.rawsterne.co.uk
March 2010

*/

/* 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 {
margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}

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;}

/* typography */
body {font-size:0.8em;color:#222;background:#fff;font-family: Helvetica, Arial, sans-serif;}
h1,h2,h3,h4,h5,h6 {font-family: Georgia, Utopia, 'Times New Roman', Times, serif;font-weight:bold;color:#000;}
h1 {font-size:3em;line-height:1;margin-bottom:.5em;}
h2 {font-size:2em;margin-bottom:.75em;}
h3 {font-size:1.5em;line-height:1;margin-bottom:1em;}
h4 {font-size:1.2em;line-height:1.25;margin-bottom:1.25em;}
h5 {font-size:1em;font-weight:bold;margin-bottom:1.5em;}
h6 {font-size:1em;font-weight:bold;}
h1 img,h2 img,h3 img,h4 img,h5 img,h6 img {margin:0;}
p {margin:0 0 1.5em;}
p img.left {float:left;margin:1.5em 1.5em 1.5em 0;padding:0;}
p img.right {float:right;margin:1.5em 0 1.5em 1.5em;}
a:focus,a:hover {color:#000;}
a {color:#009;text-decoration:underline;}
blockquote {margin:1.5em;}
strong {font-weight:bold;}
em,dfn {font-style:italic;}
dfn {font-weight:bold;}
sup,sub {line-height:0;}
abbr,acronym {border-bottom:1px dotted #666;}
address {margin:0 0 1.5em;font-style:italic;}
del {color:#666;}
pre {margin:1.5em 0;white-space:pre;}
pre,code,tt {font:1em 'andale mono', 'lucida console', monospace;line-height:1.5;}
li ul,li ol {margin:0 1.5em;}
ul,ol {margin:0 1.5em 1.5em;}
ul {list-style-type:disc;}
ol {list-style-type:decimal;}
dl {margin:0 0 1.5em;}
dl dt {font-weight:bold;}
dd {margin-left:1.5em;}
table {margin-bottom:1.4em;width:100%;}
th {font-weight:bold;}
thead th {background:#c3d9ff;}
th,td,caption {padding:4px 10px 4px 5px;}
tr.even td {background:#e5ecf9;}
tfoot {font-style:italic;}
caption {background:#eee;}
.small {font-size:.8em;margin-bottom:1.875em;line-height:1.875em;}
.large {font-size:1.2em;line-height:2.5em;margin-bottom:1.25em;}
.hide {display:none;}
.left{float:left;margin:0 5px 5px 0;}
.right{float:right;margin:0 0 5px 5px;}

/* Globals */
body{
color:#555;
background-color:#ddd;
background-image: url();
background-position: top center;
background-repeat: no-repeat;
background-attachment: fixed;
}

a{color:#a00;text-decoration:underline;}
a:hover{color:#000000;text-decoration:underline;}
.button {background:#ec008c;border:0;color:#eeeeee;font-size:0.8em;overflow:visible;padding:3px 10px;text-transform:uppercase;text-align:center;border-radius:5px; -moz-border-radius: 5px; -webkit-border-radius:5px; -khtml-border-radius:5px;}
.button:hover{text-decoration:none;background-color:#333333;color:#ffffff;cursor:pointer;}
h1{padding:0 0 0.2em 0;font-weight:bold;}

/* Layout */
#wrapper{background:#ccc url(../images/gradient-black.png) repeat-x left top;border-top:#888 1px solid;}
.container{width:960px;margin:0 auto; padding:0;overflow:hidden;}
#content{overflow:hidden;background:#fff url(../images/page-bg.png) repeat-y left top;padding:20px 10px;border-bottom:#ccc 1px solid;}
#column-wrap{float:left;width:770px;overflow:hidden;}
#sub-column-1{float:left;width:150px;padding:0;overflow:hidden;}
#main-column{float:right;width:600px;padding:0 0 20px 0;}
#sub-column-2{float:right;width:140px;padding:10px;overflow:hidden;}

/* Header */
#header{background:#f6f6f6 url(../images/gradient-black.png) repeat-x left top;border-bottom:1px solid #333333;}
#header strong a{display:block;width:379px;height:127px;text-indent:-9999em;overflow:hidden;background:url(../images/logo.png) no-repeat left top;}

/* Navigation */
#navigation{overflow:hidden;background:#a00;border-bottom:1px solid #c00;border-top:1px solid #FF0000;}
#navigation ul{list-style:none;margin:0;overflow:hidden;padding:0;border-left:#800 1px solid;}
#navigation li{float:left;text-transform:uppercase;border-right:#800 1px solid;}
#navigation li a{display:block;padding:5px 15px;color:#fff;}
#navigation li a:hover{background:#700;text-decoration:none;}

/* Sub columns */
#sub-column-1{padding:0 10px 0 0;}
#sub-column-1 h3{margin:0 0 5px 0;font-size:1.3em;border-bottom:#ccc 1px solid;padding:0 0 5px 0;}
#sub-column-2{}
#twitter img,#facebook img{padding: 0 0 5px 0;}
#facebook img{margin:0 0 10px 0;}

/* Featured slider */
#top-section{background:#111 url(../images/gradient-black.png) repeat-x left top;padding-top:10px;border-bottom:#ccc 1px solid;}
#slider{height:250px;background:#000;padding:10px 104px;border:#333 1px solid;margin:0 0 10px 0;position:relative;border-radius:10px; -moz-border-radius: 10px; -webkit-border-radius:10px; -khtml-border-radius:10px;}
a#prev2, a#next2{position:absolute;top:120px;background:#a00;color:#fff;padding:3px 7px;border-radius:5px; -moz-border-radius: 5px; -webkit-border-radius:5px; -khtml-border-radius:5px;font-weight:bold;border:#a00 1px solid;}
a#prev2{left:10px;}
a#next2{right:10px;}
a#prev2:hover, a#next2:hover{border-color:#f00;text-decoration:none;background:#b00;}

/* Promo */
#promo-boxes{overflow:hidden;margin: 0 0 20px 0;}
#promo-boxes div{position:relative;background:#555 url(../images/gradient-black.png) repeat-x left top;;color:#ddd;float:left;width:151px;border:#444 1px solid;margin:0 10px 0 0;padding:20px 20px 40px 20px;overflow:hidden;border-radius:5px; -moz-border-radius: 5px; -webkit-border-radius:5px; -khtml-border-radius:5px;}
#promo-boxes div.last{margin:0;}
#promo-boxes h3{border-bottom:#444 1px solid;padding:0 0 10px 0;margin:0 0 10px 0;}
#promo-boxes h3 a{color:#fff;}
#promo-boxes img{margin:0 0 5px 0;}
.item-link{position:absolute;bottom:20px;margin:0;left:20px;}
.item-link a{background:#a00;color:#fff;padding:3px 7px;border-radius:5px; -moz-border-radius: 5px; -webkit-border-radius:5px; -khtml-border-radius:5px;font-weight:bold;border:#a00 1px solid;}
.item-link a:hover{border-color:#f00;text-decoration:none;background:#b00;}

/* Sections */
.section{overflow:hidden;border-top:#ccc 2px dotted;margin:0;padding:10px 0 0 0;}
.section img{padding:10px;background:#eee;border:#ccc 1px solid;}
.section img.left{float:left;margin:0 10px 10px 0;}
.section img.right{float:right;margin:0 0 10px 10px;}
.section p:first-letter{float:left;font-size:3em;font-weight:bold;line-height:0.8em;margin-right:3px;padding:2px;}

/* Product page*/
#product-page #content{background:#fff;}
#product{overflow:hidden;}
#product-main{overflow:hidden;padding:20px 50px;}
#product-main img{margin:0 40px 10px 0;}
.buy-now{background:#A00;color:#fff;overflow:visible;padding:5px 15px;border:#c00 2px solid;text-transform:uppercase;border-radius:10px; -moz-border-radius: 10px; -webkit-border-radius:10px; -khtml-border-radius:10px;cursor:pointer;font-weight:bold;font-size:1.5em;}
.buy-now:hover{background:#333;border-color:#000;text-decoration:none;color:#fff;}
#product .section{margin:0px 50px;padding:20px 0 10px 0;}
#product .section img.left{margin:0 30px 10px 0;}
#product .section img.right{;margin:0 0 10px 30px;}
#product .section ul{margin-left:50px;}
#product .section ul li.title{font-weight:bold;color:#333;list-style:none;margin:0;}
#product .section .video{display:block;float:left;margin:0 30px 10px 0;}


/* Footer */
#footer{background:#ddd;padding:20px 0 0 0;border-top:#fff 1px solid;}
p#copyright{float:left;width:400px;font-size:0.9em;}
.footer-nav{margin:0;float:right;width:400px;list-style:none;text-align:right;}
.footer-nav li{display:inline;margin:0 10px;}


ol.toc li {clear:left;border-bottom:dashed 1px #aaa;height:1.05em;margin-top:10px;position:relative;}
ol.toc a, ol.toc span {background:#fff;padding:0 3px 0 0;float:left;position:absolute;text-decoration:none;}
ol.toc a {padding:0 0 0 3px;right:0;}
ol.toc ol {list-style:lower-roman;margin:1.5em 0 1em 5%;padding:0;background:#fff;float:left;display:block;width:95%;}

/* Newsletter */
#subscribe{margin: 0 0 20px 0;}
#subscribe p{margin:0 0 5px 0;}
#subscribe .submit{background:#a00;color:#fff;padding:3px 7px;border-radius:5px; -moz-border-radius: 5px; -webkit-border-radius:5px; -khtml-border-radius:5px;font-weight:bold;border:#a00 1px solid;margin:5px 0 0 0;}
#subscribe .submit:hover{border-color:#000;text-decoration:none;background:#333;}