/*
***********************************************************

Title:			styleMain.css
Browser(s): 	All (except IE)

***********************************************************
*/





/* 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, h5, 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, h5, h5, h6 { font-size:100% }
q:before, q:after { content:''}





/* Global reset-RESET */
/* The below restores some sensible defaults */

strong { font-weight: bold }
em { font-style: italic }
ol, ul, li { list-style:none }

* a {
	position:relative;
} /* Gets links displaying over a PNG background */
a { outline:none } /* Gets rid of Firefox's dotted borders */
a img { border:none } /* Gets rid of IE's blue borders */







/* Typography */

h1.title a {
	text-indent:-9999px;
	width:318px;
	height:76px;
	position:absolute;
	top:94px;
	left:55px;
	overflow:hidden;
	display:block;
	border:none;
	background-image: url(h1Logo-about02.gif);
}
h1.title a:hover { border:none }
body.pageIsBlabber h1.title a 		{ background:url(/images/h1Logo-blog02.gif) top left no-repeat }
body.pageIsComics h1.title a { background:url(/images/h1Logo-blog02.gif) top left no-repeat }
body.pageIsVideos h1.title a { background:url(/images/h1Logo-blog02.gif) top left no-repeat }
body.pageIsTV h1.title a { background:url(/images/h1Logo-blog02.gif) top left no-repeat }
body.pageIsLabrary h1.title a		{ background:url(/images/h1Logo-blog02.gif) top left no-repeat }
body.pageIsGames h1.title a		{ background:url(/images/h1Logo-blog02.gif) top left no-repeat }
body.pageIsSuckbag h1.title a		{ background:url(/images/h1Logo-blog02.gif) top left no-repeat }
body.pageIsLunchpail h1.title a		{ background:url(/images/h1Logo-blog02.gif) top left no-repeat }
body.pageIsArchive h1.title a		{ background:url(/images/h1Logo-blog02.gif) top left no-repeat }
body.pageIsStore h1.title a		{ background:url(/images/h1Logo-blog02.gif) top left no-repeat}


body.pageIsStore .sidebarbg   { background-color:transparent; padding:12px 0px 0px 70px}
body.pageIsStore div#main a:hover { border:none; padding:0 0 0px 0  } /*prevents default redline and hover movement*/
body.pageIsStore tr,td,caption {font:16px/18px Georgia, 'Times New Roman', Times, serif bold; color:#fff; background-image:none}
body.pageIsStore .sidebarbg table { width:150px}
body.pageIsStore td.footer {color:#FFFFFF; text-align:center; padding-top:60px; position:absolute; left:475px;} /*centers cafepress footer in FF*/
body.pageIsStore td.smallsidebartext { color:#FFFFFF; text-align:left } /*makes little arrows white*/
body.pageIsStore div#main  .imageborder { outline:solid; outline-color:#5d5407; outline-width:3px; background-color:#FFFFFF; margin:18px 12px 6px 12px} /*gives items their paddign and solid white background fills*/
body.pageIsStore div#productCaption { font:24px/24px Georgia, 'Times New Roman', Times, serif bold; color:#ffffff}
body.pageIsStore .xsmallText { font:14px/18px Georgia, 'Times New Roman', Times, serif bold; color:#FFFFFF; text-align:left}
body.pageIsStore td.xsmallText {height: 24px}
body.pageIsStore .pageTitle {width:390px}
body.pageIsStore .productInfo   {  font:12px/18px Georgia, 'Times New Roman', Times, serif bold; color:#ffffff}
body.pageIsStore .tableheaderbg {background-color: #5d5407; font:18px/21px Georgia, 'Times New Roman', Times, serif bold; color:#FFFFFF}
body.pageIsStore td.tableheaderbg {height: 30px}
body.pageIsStore .tablebg {background-color: transparent;color: #ffffff}
body.pageIsStore td.tablebg {padding-top:12px; padding-bottom:12px; padding-right:8px}
body.pageIsStore .tablebg2 {background-color: transparent;color: #ffffff}
body.pageIsStore .smallsidebartext {font-size:8pt;color: #ffffff;font-family:Verdana,Arial,Geneva,Helvetica,sans-serif;}
body.pageIsStore .sidebartext {color: #ffffff;font-family:Verdana,Arial,Geneva,Helvetica,sans-serif;}
body.pageIsStore .head {font:24px/26px Georgia, 'Times New Roman', Times, serif bold; color:#ffffff}
body.pageIsStore .smallselectedsidebartext {font-size:8pt;color: #ffffff;font-family:Verdana,Arial,Geneva,Helvetica,sans-serif;font-weight:bold;}
body.pageIsStore .smallprintsubscribe {font:11px/18px Georgia, 'Times New Roman', Times, serif bold; color:#ffffff}




/*body.pageIsStore td.footer		{color:#FFFFFF; position:absolute; left:475px; top:960px}

body.pageIsStore .breadCrumb  { text-align:left; position:absolute; top:180px}
body.pageIsStore .sidebarbg   { background-color:transparent; padding:12px 0px 0px 250px}
body.pageIsStore tr,td,caption {font:18px/18px Georgia, 'Times New Roman', Times, serif bold; color:#fff; text-align:center; background-image:none}
body.pageIsStore .productInfo   {  font:12px/18px Georgia, 'Times New Roman', Times, serif bold; color:#ffffff}
body.pageIsStore td.smallsidebartext { color:#FFFFFF; text-align:left }
body.pageIsStore .container{ color:#FFFFFF; text-align:left}
body.pageIsStore div#productCaption { font:24px/24px Georgia, 'Times New Roman', Times, serif bold; color:#fff}
body.pageIsStore div#main  table {width:220px}
body.pageIsStore .sidebarbg table { width:150px}
body.pageIsStore div#main  .imageborder { outline:solid; outline-color:#5d5407; outline-width:3px; background-color:#FFFFFF; margin:20px 24px 12px 24px}
body.pageIsStore div#main  img.imageborder { height:150px; width:150px; margin-bottom:0px}
body.pageIsStore div#headerContent {margin-bottom:70px}

body.pageIsStore .xsmallText { font:14px/18px Georgia, 'Times New Roman', Times, serif bold; color:#FFFFFF; text-align:left}
body.pageIsStore .tablebg { background-color: #670001;color: #000000}
body.pageIsStore .tablebg2 { background-color:transparent; color: #000000}
body.pageIsStore td.tablebg { width:10px;}

body.pageIsStore td.xsmallText {width:400px}
body.pageIsStore .fitTitle { font:14px/18px Georgia, 'Times New Roman', Times, serif bold; color:#FFFFFF; text-align:left}



body.pageIsStore div#main a:hover { border:none; padding:0 0 0px 0  }
body.pageIsStore .smallprint a:hover {}



body.pageIsStore .storesmallprint   {position:absolute; left:20px; top:-30px}


/*body.pageIsStore .smallsidebartext   { text-align:left;}*/

h1 { font:24px/24px Georgia, 'Times New Roman', Times, serif bold; margin:0px 0 2px 0; color:#fff }/*The margin moves main content area up or down -- Me */
h2 { font:20px/20px Georgia, 'Times New Roman', Times, serif bold; margin:60px 0 2px 0; color:#fff }
h2.siteDecription {
	/*background:url(/images/siteDescription03.gif) top left no-repeat;*/
	position:absolute;
	top:70px;
	left:440px;
	width:458px;
	height:96px;
	text-indent:-9999px;
	/*background-image: url(/images/siteDescription03.gif);*/
}
h3 {
	margin:0px 0 2px 0;
	color:#cf9;
	font-family: Georgia, 'Times New Roman', Times, "serif bold";
	font-size: 18px;
	line-height: 24px;
	font-weight: 500;
	padding-bottom: 10px;
}
h4 { font:16px/24px Georgia, 'Times New Roman', Times, serif bold; margin:40px 0 2px 0; color:#fff }
h5 { font:20px/20px Georgia, 'Times New Roman', Times, serif bold; margin:0px 0 2px 0; color:#fff }/*Used as duplicate of h2 cause h2 conflicts with WordPress css -- Me*/

p { margin:2px 0 16px 0 }
body, h4, p, li, dt, dd, label, input, textarea {
	font-family:'Verdana', 'Lucida Sans Unicode', Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
}
h4 { font-size:14px; line-height:18px; color:#fff }
p, li, dt, dd, label { font-size:11px; line-height:18px; color:#fff }
input, textarea { font-size:11px; color:#000; padding:2px }

pre, code { margin:2px 0 16px 0; background:#000; color:#ccc; font:12px/16px 'Courier New', Courier, monospace }
pre { padding:10px }

a { color:#cf9; text-decoration:none }
a:hover { color:#fff; border-bottom:2px solid #900; padding:0 0 1px 0 }
h2 a { color:#fff }

span.smallcaps { text-transform:lowercase; font-variant:small-caps }

ol.iNeedNumbers { margin:0 0 0 50px }
ol.iNeedNumbers li { list-style-type:decimal-leading-zero; padding:0 0 0 6px }

span.crossedOut { text-decoration:line-through }

/*body { font:20px/20px "Courier New", Courier, mono; color:#0f0 } */ /* To easily spot text sitting outside of a tag */






/* Layout (basic) */

body { background:#000; text-align:center }

div#headerWrapper, div#footerWrapper { width:100%; /* height:360px; */ margin:0; padding:1px 0 0 0 } /* The 1px padding is there to fix a weird height bug. Don't ask... */
html>body div#headerWrapper, html>body div#footerWrapper { background:url(headerWrapperBG01.png) center left repeat-x } /* 'html>body' because IE can't understand parent/child selectors */


div#headerContent {
	width:890px;
	height:180px;
	padding:0;
	text-align:left;
	position:relative;
	margin-top: -60px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

body.pageIsStore div#headerContent {
	width:830px;
	height:180px;
	padding:0;
	text-align:left;
	position:relative;
	margin-top: -15px;
	margin-right: auto;
	margin-bottom: 30px;
	margin-left: auto;
}



html>body div#headerContent { background:url(headerBG01.png) top left no-repeat } /* 'html>body' because IE can't understand parent/child selectors */

div#wrapperGames {
	width:784px;
	text-align:left;
	position:relative;
	margin-top: 50px;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding: 0;
}/*Use of negative margin is applied in both IE and FF but FF calculates height above into this number allowing adjustments for each browser*/

div#wrapperSucksbag { width:834px; margin:-25px auto 0 auto; padding:0; text-align:left; position:relative }/*Use of negative margin is applied in both IE and FF but FF calculates height above into this number allowing adjustments for each browser*/

div#wrapper {
	width:840px;
	margin:40px auto 0 auto;
	padding:0;
	text-align:left;
	position:relative;
	left: 6px;
}/*Use of negative margin is applied in both IE and FF but FF calculates height above into this number allowing adjustments for each browser*/

div#main { width:500px; float:left; padding:0px 0px 0 30px }/* I used these to line up the two columns*/
div#sidenotes { width:220px; float:left }
div#extras { width:200px; float:left; padding:0 0 0 30px }
br.columnEnder { clear:both; border:none; height:0 }

div#footerWrapper { width:100%; height:360px; margin:0px}
html>body div#footerWrapper { background:url(headerWrapperBG01.png) center left repeat-x } /* 'html>body' because IE can't understand parent/child selectors */

div#footerContent { /* background:url(/images/footerContentBG01.gif) center left no-repeat; */ width:890px; height:172px; margin:auto auto; padding:160px 0 0 120px; text-align:left; position:relative; /* border:1px solid yellow */ }






/* Layout (advanced) */

div#extras p { float:left }

body.pageIsVideos div#wrapper { width:834px}
body.pageIsGames div#main { width:784px; padding:0 0 0 13px}
body.pageIsLunchpail div#main { width:834px; padding:0 0 0 0px}
body.pageIsComics div#main { width:834px; padding:0 0 0 0px}
body.pageIsVideos div#main { width:834px; padding:0 0 0 0px}
body.pageIsTV div#main { width:834px; padding:0 0 0 0px} 
body.pageIsLabrary div#main { width:850px; padding:0 0 0 0px}
body.pageIsSuckbag div#main { width:834px; padding:0 0 0 0px}/* What's with all this weird padding and width shifting? I need extra room for the floated <div>'s right-margin, so this padding helps maintain the page in the centre of the browser. */


ol.portfolioList li { margin:0 55px 0 0; float:left; width:420px; height:500px }
ol.portfolioList li h2 { position:relative; width:420px }
ol.portfolioList li h2 span { font-style:italic; color:#999; position:absolute; top:0; right:8px }
ol.portfolioList li h2+a:hover { border:none } /* Oh yeah, adjacent sibling selectors, baby! IE won't understand this, of course... */
ol.portfolioList li a img { width:400px; height:200px; margin:10px 0 12px 0; border:5px solid #fff }
html>body ol.portfolioList li a img { background:url(semiTransparent.png) } /* Hidden from IE */
ol.portfolioList li a:hover img { border:none; padding:5px }
ol.portfolioList li a+p { font-style:italic } /* Oh yeah, adjacent sibling selectors, baby! IE won't understand this, of course... */

/*body.pageIsComics { background:#191919 url(../images/presentation/bodyBG01-cropped.jpg) top center no-repeat fixed }*/
/*body.pageIsComics div#footerWrapper { display:none } If on, removes footer on Comics page*/
body.pageIsComics div#footerContent {width:890px; height:0px; margin:0px auto; padding:40px 0 0 120px; text-align:left; position:relative;}
body.pageIsComics p.copyrightInfo {
	position:absolute;
	top:40px;
	width:740px;
	left: 134px;
}
body.pageIsComics ul.smallPrint { display:none }
body.pageIsComics h3 { color:#000; margin:60px 0 20px 0 }
body.pageIsComics p { color:#000 }
body.pageIsComics p a { color:#cf9}
body.pageIsComics p a:hover { color:#000 }
body.pageIsComics a[title="Subscribe to my RSS feed"] { display:none } /* Sexy attribute selector action! */

body.pageIsVideos div#footerContent {width:890px; height:0px; margin:0px auto; padding:40px 0 0 120px; text-align:left; position:relative;}
body.pageIsVideos p.copyrightInfo { position:absolute; top:40px; left:134px; width:740px }


body.pageIsLabrary div#footerContent {width:890px; height:0px; margin:0px auto; padding:40px 0 0 120px; text-align:left; position:relative;}
body.pageIsBlabber div#footerContent {width:890px; height:0px; margin:0px auto; padding:0px 0 0 120px; text-align:left; position:relative;}
body.pageIsComics div#footerContent {width:890px; height:0px; margin:0px auto; padding:0px 0 0 0px; text-align:left; position:relative;}
body.pageIsGames div#footerContent {width:890px; height:0px; margin:0px auto; padding:0px 0 0 0px; text-align:left; position:relative;}
body.pageIsVideos div#footerContent {width:890px; height:0px; margin:0px auto; padding:0px 0 0 0px; text-align:left; position:relative;}
body.pageIsTV div#footerContent {width:890px; height:0px; margin:0px auto; padding:0px 0 0 0px; text-align:left; position:relative;}
body.pageIsLabrary div#footerContent {width:890px; height:0px; margin:0px auto; padding:0px 0 0 0px; text-align:left; position:relative;}
body.pageIsSuckbag div#footerContent {width:890px; height:0px; margin:0px auto; padding:0px 0 0 0px; text-align:left; position:relative;}
body.pageIsLunchpail div#footerContent {width:890px; height:0px; margin:0px auto; padding:0px 0 0 0px; text-align:left; position:relative;}
body.pageIsArchive div#footerContent {width:890px; height:0px; margin:0px auto; padding:0px 0 0 120px; text-align:left; position:relative;}
body.pageIsStore div#footerContent {width:890px; height:0px; margin:0px auto; padding:0px 0 0 0px; text-align:left; position:relative;}
body.pageIsBlabber p.copyrightInfo { position:absolute; top:0px; left:170px; width:740px }
body.pageIsComics p.copyrightInfo { position:absolute; top:0px; left:80px; width:740px }
body.pageIsGames p.copyrightInfo { position:absolute; top:0px; left:80px; width:740px }
body.pageIsVideos p.copyrightInfo { position:absolute; top:0px; left:80px; width:740px }
body.pageIsTV p.copyrightInfo { position:absolute; top:0px; left:80px; width:740px }
body.pageIsSuckbag p.copyrightInfo { position:absolute; top:0px; left:80px; width:740px}
body.pageIsLunchpail p.copyrightInfo { position:absolute; top:0px; left:80px; width:740px}
body.pageIsLabrary p.copyrightInfo { position:absolute; top:0px; left:80px; width:740px }
body.pageIsArchive p.copyrightInfo { position:absolute; top:auto; left:170px; width:740px }
body.pageIsStore p.copyrightInfo { position:absolute; top:800px; left:80px; width:740px }


p.backToTop { padding:24px 0 0 0 }
p.copyrightInfo { position:absolute; top:180px; width:740px }






/* Tid bits */

span.caption { color:#666 }

div.aboutPics { margin:62px 0 0 0 }
/* div.aboutPics div div img, div.aboutPics noscript img { border:5px solid #fff; width:213px; height:213px } */ /* Used when smoothGallery is in place */
div.aboutPics img { border:5px solid #fff; width:213px; height:213px } /* Used temporarily until smoothGallery is in place */

p.freelanceGubbins { margin:2px 0 50px 0 }
/*
p.CVbutton { background:url(../images/presentation/iconPDF24.gif) top left no-repeat; margin:8px 0 60px 0; padding:0 0 0 34px; width:190px; height:26px }
p.CVbutton a { height:26px }
*/

input { border:1px solid #000 }
input.formButton { background:#cf9; padding:2px; color:#000 }

html>body a.continueReadingButton { background:url(iconArrow.gif) top right no-repeat; padding:0 24px 0 0 }

img.secondLeafPackshot { border:5px solid #fff; margin:0 0 20px 0 }
input.buySLbutton { margin:0 0 6px 0; padding:0; border:none }
a.buySLbutton { margin:0 0 18px 0; padding:0; background:url(buyButton-iTunes.gif) top left no-repeat; width:107px; height:9px; text-indent:-9999px; display:block; border:none }






/* Navigation */

ul.nav { width:540px; height:23px; position:absolute; top:164px; left:60px}
ul.nav li a { margin:0; padding:0 }
ul.nav li a:hover { border:none }

/*  
Handy measurements for the nav image replacement:

	The distance from the top to the...
	
	blabber button = 0 / 69px
	comics button = 0 / 69px
	videos button = 23px / 92px
	labrary button = 23px / 92px
	games button = 46px / 115px
	sucked bag button = 69px / 115px
	archive button = 92px / 115px

	The distance from the far-left to the...
	
	blabber button = 0px
	comics button = 72px
	videos button = 144px
	labrary button = 216px
	games button = 288px
	sucked bag button = 360px
	archive button = 432px
	
	The width of all buttons = 110px
*/

li.navBlabber a, li.navComics a, li.navVideos a, li.navTV a, li.navLabrary a, li.navGames a, li.navSuckbag a, li.navLunchpail a, li.navArchive a, li.navStore a { background:url(/images/navBG04.gif) top left no-repeat; text-indent:-9999px; display:block; position:absolute; top:0; width:139px; height:23px; overflow:hidden }

li.navBlabber a 							{ background-position:0 0; top:0; left:0 }
li.navBlabber a:hover 						{ background-position:0 -115px }
body.pageIsBlabber li.navBlabber a 			{ background-position:0 -115px }

li.navComics a 							{ background-position:-140px 0; top:0; left:67px }
li.navComics a:hover 					{ background-position:-140px -115px }
body.pageIsComics li.navComics a 			{ background-position:-140px -115px }

li.navVideos a						{ background-position:0 -23px; top:0px; left:129px }
li.navVideos a:hover					{ background-position:0 -138px }
body.pageIsVideos li.navVideos a	{ background-position:0 -138px }

li.navTV a						{ background-position:-140px -69px; top:0px; left:188px }
li.navTV a:hover					{ background-position:-140px -184px }
body.pageIsTV li.navTV a	{ background-position:-140px -184px }

li.navLabrary a							{ background-position:-140px -23px; top:0px; left:225px}
li.navLabrary a:hover					{ background-position:-140px -138px }
body.pageIsLabrary li.navLabrary a		{ background-position:-140px -138px }

li.navGames a							{ background-position:0 -69px; top:0px; left:296px}
li.navGames a:hover						{ background-position:0 -184px }
body.pageIsGames li.navGames a			{ background-position:0 -184px }

li.navSuckbag a							{ background-position:-140px -92px; top:0px; left:354px}
li.navSuckbag a:hover						{ background-position:-140px -207px }
body.pageIsSuckbag li.navSuckbag a			{ background-position:-140px -207px }

li.navLunchpail a								{ background-position:-140px -46px; top:0px; left:507px}
li.navLunchpail a:hover						{ background-position:-140px -161px }
body.pageIsLunchpail li.navLunchpail a				{ background-position:-140px -161px }

li.navArchive a								{ background-position:0px -46px; top:0px; left:641px}
li.navArchive a:hover						{ background-position:0px -161px }
body.pageIsArchive li.navArchive a				{ background-position:0px -161px }

li.navStore a								{ background-position:0px -92px; top:0px; left:708px}
li.navStore a:hover						{ background-position:0px -207px }
body.pageIsStore li.navStore a				{ background-position:0px -207px }






/* BLOG : General */
img.articleIllustration { /*width:400px; height:100px;*/ border:5px solid #fff; margin:-5px 0 0 0 }
div.searchBox input#s { width:161px }
h2.recently { margin:60px 0 4px 0 }
ul.searchResults li { margin:0 0 30px 0 }
h1.archiveHeading { margin:60px 0 24px 0 }

body.pageIsBlabber div#wrapper { width:834px; padding:0 0 0 0px }
body.pageIsBlabber div#extras { width:230px; float:left; padding:0 0 0 30px }






/* BLOG : Featured */

ul.featured { width:224px; background:url(/images/presentation/semiTransparent.png); border:1px solid #fff; margin:0px 0 10px 0; padding:10px }
ul.featured h3 { margin:0px 0 2px 0 }
ul.featured span { color:#ffc }

ul.featured ul.featuredPrint { border-bottom:5px solid #000; margin:0 0 10px 0 }
ul.featured ul.featuredPrint li { border-bottom:1px solid #000; padding:10px 0 }
ul.featured ul.featuredPrint li span { font:16px/18px Georgia, 'Times New Roman', Times, serif bold }
ul.featured ul.featuredPrint li img.printMagOdd { float:left; border:5px solid #fff; width:50px; margin:5px 10px 0 0 }
ul.featured ul.featuredPrint li img.printMagEven { float:right; border:5px solid #fff; width:50px; margin:5px 0 0 10px }

ul.featured ul.featuredOnline li { position:relative; border-bottom:1px solid #000; padding:5px 0 5px 15px; background:url(iconBullet01.gif) center left no-repeat }
ul.featured ul.featuredOnline li:hover { background:#000 }
ul.featured ul.featuredOnline li a.siteButton { position:absolute; top:5px; left:140px; width:16px; height:16px; background:url(../images/presentation/iconPermalink01.gif) top left no-repeat; text-indent:-9999px }
ul.featured ul.featuredOnline li a.siteButtonNo { position:absolute; top:5px; left:140px; width:16px; height:16px; background:url(../images/presentation/iconNoPermalink01.gif) top left no-repeat; text-indent:-9999px }
ul.featured ul.featuredOnline li a.screengrabButton { position:absolute; top:5px; left:160px; width:16px; height:16px; background:url(../images/presentation/iconFlickr01.gif) top left no-repeat; text-indent:-9999px }
ul.featured ul.featuredOnline li a.siteButton:hover, ul.featured ul.featuredOnline li a.siteButtonNo:hover, ul.featured ul.featuredOnline li a.screengrabButton:hover { border:none }








/* BLOG : Flickr */

ul.flickrThumbs li { float:left; margin:0 28px 28px 0 }
ul.flickrThumbs li a img { border:5px solid #fff; width:75px; height:75px }
html>body ul.flickrThumbs li a img { background:url(../images/presentation/semiTransparent.png) } /* Hidden from IE */
ul.flickrThumbs li a:hover img { border:none; padding:5px }
ul.flickrThumbs a { border:none; background:none }

/*
p.viewFlickr { margin:0 20px 25px 0 }
p.viewFlickr a span.flickrLogo { color:#06c }
p.viewFlickr a span.flickrLogoR { color:#f09 }
*/




/* BLOG : Comments */

h4.commentAuthor { margin:0; padding:0 }
div.commentContent { border-left:2px solid #fff; margin:0 0 40px 0; padding:0 0 0 20px }
div.authorIsElliot { background:url(../images/presentation/semiTransparent.png); padding:5px 5px 5px 20px; border:1px solid #666; border-left:2px solid #fff }

div#commentForm input.textfield { width:398px; margin:0 0 12px 0 }
div#commentForm input.submit { width:403px; margin:0 0 12px 0 }
div#commentForm textarea.commentbox { width:398px; height:200px; margin:0 0 12px 0 }

p.commentsTagsGuide { font-size:9px; line-height:14px; color:#999; margin:2px 0 6px 0 }
#commentform #author, #commentform #email, #commentform #url, #commentform textarea { background:#fff; border:1px solid #000; padding:2px }

img.gravatar { border:1px solid #fff; float:right; margin:5px }

/*ul.recentComments li { border-bottom:1px dotted #fff; padding:10px 0 12px 0 }*/

div.livePreviewBox { background:url(semiTransparent.png); padding:10px; width:378px }
div.livePreviewBox p { margin:10px; color:#666 }






/* Lists, glorious lists */

ul.oldFashionedList li { list-style:disc; margin:0 0 20px 12px; padding:0 0 0 14px }
ul.conciseList { margin:0 0 20px 0 }
ul.conciseList li { margin:0 0 6px 12px }

ul.dates li { border-bottom:1px dotted #fff }
ul.dates li:hover { background:url(semiTransparent.png) }
ul.dates li a { display:block; padding:10px 0 12px 0 }
ul.dates li a:hover { border:none; padding:10px 0 12px 0 }

ul.blogroll { margin:-10px 0 0 0 }
ul.blogroll li { border-bottom:1px dotted #fff }
ul.blogroll li:hover { background:url(semiTransparent.png) }
ul.blogroll li a { display:block; padding:10px 0 12px 24px }
ul.blogroll li a[href="http://twistedintellect.com"] 		{ background:url(http://jorgenarnor.com/favicon.ico) center left no-repeat }
ul.blogroll li a[href="http://31three.com/weblog"] 			{ background:url(http://31three.com/favicon.ico) center left no-repeat }
ul.blogroll li a[href="http://artofadambetts.com/weblog"] 	{ background:url(http://artofadambetts.com/favicon.ico) center left no-repeat }
ul.blogroll li a[href="http://markboulton.co.uk/journal"] 	{ background:url(http://markboulton.co.uk/favicon.ico) center left no-repeat }
ul.blogroll li a[href="http://carsonified.com"] 			{ background:url(http://carsonified.com/favicon.ico) center left no-repeat }
ul.blogroll li a[href="http://bearskinrug.co.uk"] 			{ background:url(http://bearskinrug.co.uk/favicon.ico) center left no-repeat }
ul.blogroll li a[href="http://firewheeldesign.com"] 		{ background:url(../images/presentation/favicon-firewheel.gif) center left no-repeat }
ul.blogroll li a[href="http://jasperhauser.nl/weblog"] 		{ background:url(../images/presentation/favicon-jasper.gif) center left no-repeat } /* Attribute selectors - yeah! */
ul.blogroll li a[href="http://hicksdesign.co.uk"] 			{ background:url(http://hicksdesign.co.uk/favicon.ico) center left no-repeat }
ul.blogroll li a[href="http://shauninman.com"] 				{ background:url(http://shauninman.com/favicon.ico) center left no-repeat }
ul.blogroll li a[href="http://danielmall.com"] 				{ background:url(http://danielmall.com/favicon.ico) center left no-repeat }
ul.blogroll li a[href="http://jasonsantamaria.com"] 		{ background:url(../images/presentation/favicon-jsm.gif) center left no-repeat }
ul.blogroll li a[href="http://mezzoblue.com"] 				{ background:url(http://mezzoblue.com/favicon.ico) center left no-repeat }
ul.blogroll li a[href="http://subtraction.com"] 			{ background:url(http://subtraction.com/favicon.ico) center left no-repeat }

ul.blogroll li a:hover { border:none; padding:10px 0 12px 24px }

ul.recentComments li { border-bottom:1px dotted #fff }
ul.recentComments li:hover { background:url(../images/presentation/semiTransparent.png) }
ul.recentComments li a { display:block; padding:10px 0 12px 0; color:#fff }
ul.recentComments li a:hover { border:none; padding:10px 0 12px 0; text-decoration:underline;/*color:#fff*/ }
ul.recentComments li a strong { color:#cf9; font-weight:normal }
ul.recentComments li a:hover strong { /*color:#cf9*/ }

ul.recentReads li { border-bottom:1px dotted #fff; height:auto; width:245px}
/*ul.recentReads li:hover { background:url(../images/presentation/semiTransparent.png) }*/
ul.recentReads li a { display:block; padding:10px 0 12px 0 }
ul.recentReads li a:hover { border:none; padding:10px 0 12px 0}
ul.recentReads li a img { border:5px solid #fff; width:50px; float:left; margin:0 10px 0 0 }
ul.recentReads li a span { color:#fff; margin:0; width:120px; padding:0 }
ul.recentReads li a span strong { color:#cf9; font-weight:normal}
ul.recentReads li a br { clear:both }

/* I added archiveReads */
ul.archiveReads li { border-bottom:1px dotted #fff; height:auto; width:245px}
ul.archiveReads li:hover {}
ul.archiveReads li a { display:block; padding:4px 0 5px 0 }
ul.archiveReads li a:hover { border:none; padding:4px 0 5px 0; background:url(../images/presentation/semiTransparent.png)}
ul.archiveReads li a img { border:5px solid #fff; width:50px; float:left; margin:0 10px 0 0 }
ul.archiveReads li a span { color:#fff; margin:0; width:120px; padding:0 }
ul.archiveReads li a span strong { color:#cf9; font-weight:normal}
ul.archiveReads li a br { clear:both }

ol.chronology li { color:#ffc; font-weight:bold; position:relative; border-top:1px solid #000; padding:4px 0 0 0; margin:0 0 40px 0 }
ol.chronology li.firstDate { border:none }
ol.chronology li span { color:#fff; font-weight:normal; position:absolute; left:100px }

ul.friends li { border-bottom:1px dotted #fff }
ul.friends li.friendIsSam a { background:url(../images/presentation/friendPic-sam.jpg) 0 15px no-repeat }
ul.friends li.friendIsNeil a { background:url(../images/presentation/friendPic-neil.jpg) 0 15px no-repeat }
ul.friends li.friendIsMark a { background:url(../images/presentation/friendPic-mark.jpg) 0 15px no-repeat }
ul.friends li.friendIsFrancis a { background:url(../images/presentation/friendPic-francis.jpg) 0 15px no-repeat }
ul.friends li.friendIsMarc a { background:url(../images/presentation/friendPic-marc.jpg) 0 15px no-repeat }
ul.friends li.friendIsTim a { background:url(../images/presentation/friendPic-tim.jpg) 0 15px no-repeat }
/* I wanted to avoid having to explicity assign a class to each <li> but there was no way around it... */
ul.friends li:hover { background:url(../images/presentation/semiTransparent.png) }
ul.friends li a { display:block; padding:10px 0 12px 70px; color:#fff }
ul.friends li a:hover { border:none; padding:10px 0 12px 70px }
ul.friends li a strong { color:#cf9; font-weight:normal }

ul.softwareLove li { border-bottom:1px dotted #fff }
html>body ul.softwareLove li.appIsWordpress a { background:url(../images/presentation/appIcon-wordpress2.png) 0 16px no-repeat }
html>body ul.softwareLove li.appIsMint a { background:url(../images/presentation/appIcon-mint.png) 0 16px no-repeat }
html>body ul.softwareLove li.appIsTextmate a { background:url(../images/presentation/appIcon-textmate.png) 0 16px no-repeat }
html>body ul.softwareLove li.appIsDisco a { background:url(../images/presentation/appIcon-disco.png) 0 16px no-repeat }
html>body ul.softwareLove li.appIsTransmit a { background:url(../images/presentation/appIcon-transmit.png) 0 16px no-repeat }
html>body ul.softwareLove li.appIsCyberduck a { background:url(../images/presentation/appIcon-cyberduck.png) 0 16px no-repeat }
html>body ul.softwareLove li.appIsDropsend a { background:url(../images/presentation/appIcon-dropsend.png) 0 16px no-repeat }
html>body ul.softwareLove li.appIsFlock a { background:url(../images/presentation/appIcon-flock.png) 0 16px no-repeat }
html>body ul.softwareLove li.appIsNewsfire a { background:url(../images/presentation/appIcon-newsfire.png) 0 16px no-repeat }
html>body ul.softwareLove li.appIsXtorrent a { background:url(../images/presentation/appIcon-xtorrent.png) 0 16px no-repeat }
html>body ul.softwareLove li.appIsAcquisition a { background:url(../images/presentation/appIcon-acquisition.png) 0 16px no-repeat }
html>body ul.softwareLove li.appIsUndercover a { background:url(../images/presentation/appIcon-undercover.png) 0 16px no-repeat }
html>body ul.softwareLove li.appIsAppzapper a { background:url(../images/presentation/appIcon-appZapper.png) 0 16px no-repeat }
/* I wanted to avoid having to explicity assign a class to each <li> but there was no way around it... */
ul.softwareLove li:hover { background:url(../images/presentation/semiTransparent.png) }
ul.softwareLove li a { display:block; padding:10px 0 12px 82px; color:#fff }
ul.softwareLove li a:hover { border:none; padding:10px 0 12px 82px }
ul.softwareLove li a strong { color:#cf9; font-weight:normal }

ul.aboutThisSite li { margin:0 0 20px 0 }

ul.smallPrint {
	position:absolute;
	top:170px;
	left:387px;
	width: 83px;
	height: 62px;
}
ul.smallPrint li { float:left; margin:0 10px 50px 0 }
ul.smallPrint li a { text-indent:-9999px; display:block; height:58px; margin:0; padding:0 }
ul.smallPrint li a:hover { border:none }
ul.smallPrint li.eGreenpeace a { background:url(/images/lablogobottom.png) top left no-repeat; width:82px}
ul.smallPrint li.eWWF a { background:url(../images/presentation/enviroLogo-wwf-s.gif) top left no-repeat; width:31px }
ul.smallPrint li.eFOE a { background:url(../images/presentation/enviroLogo-foe-s.gif) top left no-repeat; width:22px }





/* Buttons - hidden from IE */
html>body a.buttonFlickr { margin:6px 0 0 -2px; background:url(../images/presentation/button-flickr.png) top left no-repeat; width:200px; height:16px; text-indent:-9999px; display:block }
html>body a.buttonFlickr:hover { height:15px; border:none }

html>body a.buttonTop { margin:-13px 0 0 0px; background:url(/images/presentation/button-top.png) top left no-repeat; width:44px; height:17px; text-indent:-9999px; display:block }
html>body a.buttonTop:hover { height:15px; border:none }

html>body a.buttonContinue { margin:0 0 80px -2px; background:url(../images/presentation/button-continue.png) top left no-repeat; width:410px; height:16px; text-indent:-9999px; display:block }
html>body a.buttonContinue:hover { height:15px; border:none }

html>body a.buttonCV { margin:4px 0 60px -2px; background:url(../images/presentation/button-CV.png) top left no-repeat; width:200px; height:26px; text-indent:-9999px; display:block }
html>body a.buttonCV:hover { height:25px; border:none }

html>body a.button-buyiTunes { margin:0 0 40px 0; background:url(../images/presentation/button-buyiTunes.png) top left no-repeat; width:220px; height:16px; text-indent:-9999px; display:block }
html>body a.button-buyiTunes:hover { height:15px; border:none }





/* And one last thing... */

body { background:#000 url(../images/presentation/bodyBG01-cropped.jpg) top center no-repeat fixed } /* This is all the way down here so that - in theory - everything else will load before the (rather huge) background image does */