html {background: #2e1407 url(/assets/bg1.jpg) top left repeat; font-family: Verdana, Geneva, sans-serif; color: #2f3140; font-size: 12px; margin: 0; padding: 0;}
body {background: url(/assets/header_bg.png) top center no-repeat; margin: 0; padding: 0;}

em {font-style: italic;}
strong {font-weight: bold;}

#masthead {position: relative; margin: 0 auto; background: transparent url(/assets/header.png) top center no-repeat; width: 950px; height: 181px; z-index: 7;}
#ContactSheet {background:transparent url(/assets/contact.png) no-repeat scroll left top; height:507px; position:absolute; right:80px; top:-464px; width:773px; z-index:4;}
#ContactSheet a {display: block; position: absolute; bottom: 100px; right: 280px; height: 80px; width: 200px;}
#ContactSheet a span {position: absolute; top: -9999px;}
#ContactSheet span.handle {bottom:0; height:100px; position:absolute; right:50px; width:200px; cursor: pointer; text-indent: -9999px;}

h1 {position: absolute; margin: 0; padding: 0; right: -20px; top: 61px; height: 75px; width: 555px;}
h1 a {display: block; height: 100%; width: 100%; background: url(/assets/title.png) 0 -75px no-repeat;}
h1 a:hover {background-position: 0 0;}
h1 span {position: absolute; top: -9999px;}
#masthead h2 {position: absolute; text-indent: -9999px; right: 40px; bottom: 20px; height: 24px; width: 283px; background: url(/assets/tagline.png) top left no-repeat;}
h3, h4 {clear: both;}
h3 {font-family: "Gill Sans", Helvetica, sans-serif; font-size: 24px; font-weight: bold; color: #2f3140;}

#core {position: relative; z-index: 2; top: -100px; width : 890px; padding: 120px 10px; margin: 0 auto; background-color: #fff;}

#navStrut {margin:0 auto; width: 910px; position: relative; z-index: 5;}
#navigation {left:40px; width: 550px; padding:0 0 6em; position:relative; text-indent:-9999px; top: 0; z-index:5;}
#navigation li {display: block; float: left; margin: 0; height: 35px; width: 120px; background: url(/assets/navigation.png) top left no-repeat;}
#navigation li a {display: block; width: 100%; height: 100%;}
#navigation li#navhome {}
#navigation li#navhome:hover, #PageHome #navigation li#navhome {background-position: 0 -35px;}
#navigation li#navabout {background-position: -120px 0;}
#navigation li#navabout:hover, #PageAbout #navigation li#navabout {background-position: -120px -70px;}
#navigation li#navarchives {background-position: -240px 0;}
#navigation li#navarchives:hover, #PageArchives #navigation li#navarchives {background-position: -240px -105px;}
#navigation li#navnotebook {width: 150px; background-position: -360px 0;}
#navigation li#navnotebook:hover, #PageNotebook #navigation li#navnotebook {background-position: -360px -140px;}
#navigation li#navwork {background:transparent url(/assets/work_location.png) no-repeat scroll 0 -61px; float:none; height:40px; position:absolute; right:0px; top:35px; width:240px;}
#navigation li#navwork:hover {background-position: 0 0;}

#core_left {clear: both; width: 240px; float: left; margin-left: 40px; padding-bottom: 2em;}
#core_right {width: 540px; float: right; margin-right: 40px; padding-bottom: 2em;}

#PageHome #core_left {width: 440px;}
#PageHome #core_right {width: 300px;} /*right col a bit narrower on home to give cols breathing space*/
#PageHome #core_right h3 {font-weight: normal;}
#PagePost h3 {padding-bottom: 0.5em;}
#PagePost #core_left {width: 840px;}
#PagePost #core_left h3, #PagePost #core_left h4 {display: inline;}
#PagePost #core_right {margin-left: 20px; margin-right: 20px;}
#PagePost .datestamp {padding-bottom: 2em;}
#PageAbout #core_left {width: 540px;}
#PageAbout #core_right {width: 240px; font-size: 11px; color: #565b7a; line-height: 2; }
#PageSpares #core_left h4 {font-weight: bold; width: 320px;}
#PageSpares #core_right {width: 460px; background: url(/assets/poster_wrench.jpg) top right no-repeat; padding-top: 400px;}
#PageNotebook #core_left {width: 340px;}
#PageNotebook #core_right {text-align: right; width: 440px;}
#PageNotebook #core_right ul li {float: right; width: 140px; padding: 0; margin: 0; clear:left; padding-bottom: 10px;}
#PageNotebook #core_right ul li a {margin: 0 auto;}
#PageNotebook #core_right h3 {font-weight: normal; color: #666;}
#PageNotebook #notebook ul, #PageHome #notebook ul {width: auto;}

#PageArchives #core_right.poster {background: url(/assets/poster_spanner.jpg) top right no-repeat; padding-top: 400px;}

#core p {line-height: 1.6; padding-bottom: 1em; max-width: 45em;}
#core a {color: #b2120d; text-decoration: none; font-weight: bold;}
#core li {line-height: 1.6; margin-left: 2em;}
#core ul, #core ol {padding-bottom: 0.5em;}
#core h3 { padding-bottom: 0.25em;}
#core h3 a {color: #2f3140; font-weight: normal;}
#core h3 a:hover {color: #b2120d;}
#core h4 {font-size: 14px; padding-bottom: 0.5em; font-weight: bold; color: #2F3140;}

#Preamble {font-size: 14px; margin-left: 40px; clear: both; padding-bottom: 1em;}
#Preamble h3 { padding-bottom: 0.25em;}

#PostRel {font-size:0.9em; height:2em; position:relative;}
#PostRel li a[rev="Previous"] {position:absolute; left:40px; top:0;}
#PostRel li a[rel="Next"] {position:absolute; right:60px; top:0; left: auto;}

.summary img {float: left; margin: 0 10px 30px 0;}
.work h3, .work .datestamp {position: relative; bottom: -15px;}
	#PageHome .work h3, #PageHome .work .datestamp {bottom: 0;}

#sparesList {padding-bottom: 2em;}
#sparesList ul {padding-top: 1em;}
#sparesList h3 {color:#666; font-size:22px; font-weight:normal;}
#sparesList li {color: #666; padding: 0; line-height: 1.8em; margin-left: 0; font-size: 11px;}
#sparesList p a {color: #666; font-size: 11px;}

#latestVideo {padding-bottom: 2em;}
#latestVideo h3, #latestVideo h3 a {color:#666; font-size:22px; font-weight:normal;}
#latestVideo object {border: 1px solid #333;}
#latestVideo p {color:#666; font-size: 11px;}

#notebook h3 {color:#666; font-size:22px; font-weight:normal; padding-bottom: 0;}
#notebook {padding-bottom: 65px; background: url(/assets/mars_ruler.jpg) bottom left no-repeat;}
#notebook ul {width: 70%;}
#notebook li h4 {padding: 5px 0; line-height: 1;}
#notebook li h4 a {font-weight: bold; font-size: 11px; padding: 0; margin: 0; color: #666;}
#notebook li a {font-weight: normal;}
#notebook li:first-child {border-width: 0;}
#notebook li {padding: 0; margin-left: 0; border-top: 1px solid #ccc;}
#notebook p {color: #666; font-size: 11px;}

#monthArchive, .categories {padding-bottom: 2em;}

.tags {}
.tags span {background: url(/assets/target.png) top left no-repeat; float: left; width: 22px; height: 22px; margin-right: 10px; text-indent: -9999px;}
.tags a span {position: absolute; top: -10000px;}

#core_left .categories ul li {margin-left: 0; line-height: 1.8;}
#core_left .categories ul a {}
.photo {position: relative; display: block; float: left; padding: 15px;}
	#PageHome .photo {float: right;}
.summary .photo {left: -15px;}
	#PageHome .summary .photo {right: -15px; left: 15px; margin-bottom: -65px; top: -35px;}
	
.photo div.p1 {width: 80px; height: 60px; position: absolute; top: 0; right: 0; background: url(/assets/tape_top.png) 100% 0 no-repeat; z-index: 10;}
.photo div.p2 {width: 80px; height: 60px; position: absolute; bottom: 20px; left: 0; background: url(/assets/tape_bottom.png) bottom left no-repeat;z-index: 9;}
#PagePost .photo div.p2 {bottom: 55px;}
.photo img {position: relative;}
.FlickrLink {text-align: right; position: relative; right: 20px; margin-bottom: 20px;}
.caption {color: rgba(64, 56, 32, 0.699219); font-weight: bold; font-size: 80%; width: 240px;}
.photo .FlickrLink {right: 0;}
#Fig1, #Fig2, #Fig3, #Fig4, #Fig5, #Fig6 {height: 40px; width: 60px; position: absolute; bottom: 10px; text-indent: -9999px;}
#Fig1 {background: url(/assets/fig1.gif) top left no-repeat; bottom: 0;}
#Fig2 {background: url(/assets/fig2.gif) top left no-repeat;}
#Fig3 {background: url(/assets/fig3.gif) top left no-repeat;}
#Fig4 {background: url(/assets/fig4.gif) top left no-repeat;}
#Fig5 {background: url(/assets/fig5.gif) top left no-repeat;}
#Fig6 {background: url(/assets/fig6.gif) top left no-repeat;}

#PagePost #Photo1, #PagePost #Photo2, #PagePost #Photo3, #PagePost #Photo4, #PagePost #Photo5, #PagePost #Photo6 {background: #fff; -moz-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.5); box-shadow: 0 3px 10px rgba(0, 0, 0, 0.5); -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;}


#PagePost #Photo1 {z-index: 10; top: 10px;}
#PagePost #Photo2 {-moz-transform: rotate(-3deg); -webkit-transform: rotate(-3deg); transform: rotate(-3deg); top: -10px; left: 30px; z-index: 11;}
#PagePost #Photo3 {-moz-transform: rotate(10deg); -webkit-transform: rotate(10deg); transform: rotate(10deg); top: -20px; right: -40px; z-index: 5; overflow: hidden;}
#PagePost #Photo4 {-moz-transform: rotate(1deg); -webkit-transform: rotate(1deg); transform: rotate(1deg); top: -25px; left: 10px;}
#PagePost #Photo5 {-moz-transform: rotate(-6deg); -webkit-transform: rotate(-6deg); transform: rotate(-6deg); top: -30px; left: 20px;}
#PagePost #Photo6 {-moz-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); transform: rotate(-4deg); top: -50px; left: 60px;}

#PagePost #Photo2:hover, #PagePost #Photo3:hover, #PagePost #Photo4:hover, #PagePost #Photo5:hover, #PagePost #Photo6:hover {
-moz-transform: rotate(0deg) scale(1.10); 
-webkit-transform: rotate(0deg) scale(1.10); 
transform: rotate(0deg) scale(1.10);
/*-webkit-transition: all 0.5s ease-in-out; */
-moz-transition: all 0.5s ease-in; 
transition: all 0.5s ease-in; 
z-index: 12;
}

#PagePost .photo div.p2 {bottom: -25px; left: -25px;}
#PagePost .photo div.p1 {top: -15px; right: -25px;}


#PageAbout div.p2 {bottom: 0;}



#Zoom {background: url(/assets/zoom.gif) top left no-repeat; bottom: 0; height: 36px; right: 10px; position: absolute; text-indent: -9999px; width: 200px;}

#PagePost .FlickrLink a {color: #ccc;}
.FlickrLink a span {position: absolute; top: -10000px;}

#base {position: relative; top: -130px; z-index: 3; clear: both; height: 438px; width: 948px; margin: 0 auto; background: transparent url(/assets/temp_page_main.jpg) top center no-repeat;}
#pages {position: relative; float: left; left: 60px; top: -97px; width: 530px; height: 350px; background: url(/assets/temp_page_top.jpg) top left no-repeat; padding-top: 165px; padding-left: 20px; margin-left: -7px; z-index: 3;}

h3#spares {text-indent: -9999px; width: 85px; height: 32px; background: url(/assets/spares_header.png) top left no-repeat; margin-left: 10px;}
h3#videos {text-indent: -9999px; width: 84px; height: 64px; background: url(/assets/video_header.png) top left no-repeat; margin-left: 10px;}
#pages p {font-weight:normal; width: 160px; padding: 5px 0 15px 15px; line-height: 1.4; font-size: 12px; font-weight: bold; opacity: 0.65;}
#pages a {color: #000;}

#about {width: 258px; height: 431px; background: url(/assets/about_bg.png); float: left; padding: 0 50px; color: #fff; font-size: 14px; line-height: 1.6;  z-index: 4; position: relative;}
#about a, #about h3 {color: #fff;}
#about h3 {padding: 1em 0;}

#workplan {position: relative; width: 940px; height: 180px; margin: 0 auto; background: url(/assets/category_map.gif) 180px -100px no-repeat; top: -135px;}

#elevateStrut {margin:0 auto; width: 910px; position: relative; z-index: 5;}
#elevate {position: absolute; z-index: 5; top: -350px; right: -40px; display: block; height: 101px; width: 105px; background: url(/assets/keyfob.png) bottom left no-repeat;}
#elevate:hover {background-position: top left;}
#elevate span {position: absolute; top: -10000px;}

#meta {position: absolute; bottom: 0; right: 0; width: 200px; color: #ddd; line-height: 1.6; font-size: 11px;}
#meta p {padding-left: 60px;}
#meta a {color: #fff;}

#workplan .categories {padding:0 60px 2em; position: absolute;}
#workplan .categories h3 {text-indent: -9999px; width: 94px; height: 40px; background: url(/assets/work_header.png) top left no-repeat;}
#workplan .categories ul {line-height: 1.4; margin-left: 10px;}
#workplan .categories ul a {color: #8e730a; text-decoration: none; font-weight: bold;}
#workplan .categories ul a:hover {color: #ffcc00;}
#workplan .categories ul li a span {cursor: pointer; position: absolute; height: 22px; width: 22px; background: url(/assets/target.png) 0 0 no-repeat;}
#workplan .categories ul .bodywork span {left: 500px; top: 115px;}
#workplan .categories ul .brakes span {left: 240px; top: 135px;}
#workplan .categories ul .clutch span {left: 340px; top: 55px;}
#workplan .categories ul .electrics span {left: 245px; top: 10px;}
#workplan .categories ul .engine span {left: 285px; top: 40px;}
#workplan .categories ul .fuel span {left: 680px; top: 15px;}
#workplan .categories ul .interior span {left: 400px; top: 25px;}
#workplan .categories span:hover, #workplan .categories a:hover span {background-position: 0 -22px;}

.clear {clear: both; padding-bottom: 2em;}
.readon span {position: absolute; top: -10000px;}

#core:after, #core_left:after, #core_right:after, #comments:after, .fix:after {content:".";display:block;height:0;clear:both;visibility:hidden;}
#core, #core_left, #core_right, #comments, .fix {display:inline-block;} 
* html #core, * html #core_left, * html #core_right, * html #comments, *html .fix {height:1%;}
#core, #core_left, #core_right, #comments, .fix {display:block;}

/*comments*/
#comments {margin-bottom: 10px; padding: 10px 40px; clear: both; background: transparent url(/assets/commentform.jpg) no-repeat right top; min-height: 800px;}
#comments h4 {text-indent: -9999px; height: 33px; background: url(/assets/comments_header.jpg) top left no-repeat; padding-bottom: 20px;}
#comments h5 {font-size: 14px; font-weight: bold; margin-top: 2em;}
#comments p {margin: 0; padding: 0;}
#chatter {width: 240px; float: left;}
#comments li {margin-left: 0;}
#comments form {text-align: right; line-height: 1.5; width: 400px; float: right; position: relative; top: 60px; right: 50px;}
#comments .inputBlock {clear: both;}
#comments .input {width: 170px; float: right; text-align: left;}
#comments label {width: 70px; float: left; font-size: 1em; text-transform: uppercase; padding-bottom: 11px;}
#comments label span {position: absolute; top: -99999px;}
#comments label.alert {background: url(/assets/red_crayon.jpg) bottom right no-repeat;}
#comments input, #comments textarea {width: 150px; margin-left: 10px; margin-bottom: 15px;}
#comments form h5 {text-transform: uppercase; margin-top: 0; font-size: 1.3em;}
/*commentFormNo1*/
#comments textarea {clear: both; height: 200px; width: 400px;}
#commentFormNo1 label {float: right; width: 400px; margin: 0;}
#commentFormNo1 p {position: relative; top: -10px; font-size: 0.9em;} 
/*commentFormNo2*/
#commentFormNo2 {position: relative; top: 35px; float: right; width: 200px;}
#commentFormNo2 form p {width: 300px; float: left; margin-left: 180px;}
#commentFormNo2 input {width: 120px;}
#commentFormNo2 .inputBlock {min-height: 50px;}
#commentFormNo2 .input {width: 130px;}
#comments .checkbox label {text-transform: none;}
#comments input.button {}