/*   
Theme Name: Nebula
Theme URI: http://www.danwellman.co.uk/
Description: A dark theme featuring galactic nebulae
Author: Dan Wellman
Author URI: http://www.danwellman.co.uk
Version: 1.0
*/

/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline}
:focus {outline:0}
body {line-height:1;color:black;background:white}
ol, ul {list-style:none}
table {border-collapse:separate;border-spacing:0}
caption, th, td {text-align:left;font-weight:normal}
blockquote:before, blockquote:after, q:before, q:after {content:""}
blockquote, q {quotes:"" ""}

/* utility */
.float-clear:after { content:"."; display:block; height:0; visibility:hidden; clear:both; }
#innerContainer #content .last, #innerContainer #content li.last a { margin-right:0; }

/* shell */
body { background:#000 url(img/header_bg.png) 50% 0 no-repeat; font:16px "Trebuchet MS", Sans-serif; }

/* header */
#header { width:1004px; height:234px; margin:auto; }
#header h2 { text-indent:-99999px; overflow:hidden; width:513px; height:85px; float:left; background:url(img/name.jpg) no-repeat 0 0; margin:94px 0 0 71px; }
#header ul { float:right; margin:90px 73px 6px 0; }
#header ul li { background:url(img/skills.jpg) no-repeat 0 0; display:block; width:273px; height:50px; text-indent:-99999px; overflow:hidden; }
#header ul li.last { background-position:0 -50px; }

/* nav */
ul#nav { margin:0 ;float:none; clear:both; position:relative; left:76px; top:2px; position:relative; z-index:1; }
ul#nav li { float:left; width:auto; height:auto; background:none; }
#header ul.hover-css li a, #header ul.hover-anims li a { display:block; width:140px; height:53px; position:relative; background:url(img/tabs.jpg) no-repeat 0 0; }
#header ul.hover-anims li span { display:block; width:140px; height:53px; position:absolute; top:0; left:0; background:url(img/tabs.jpg) no-repeat 0 0; cursor:pointer; }
#header ul.hover-css li.home a, #header ul.hover-anims li.home a, #header ul.hover-anims li.home a span { width:150px; }
#header ul.hover-css li.home a:hover, #header ul.hover-css li.home a.on, #header ul.hover-anims li.home span a.on, #header ul.hover-anims li.home span { background-position:0 -54px; }
#header ul.hover-css li.about a, #header ul.hover-anims li.about a { background-position:-150px 0; }
#header ul.hover-css li.about a:hover, #header ul.hover-css li.about a.on, #header ul.hover-anims li.about span, #header ul.hover-anims li.about span a.on { background-position:-150px -54px; }
#header ul.hover-css li.books a, #header ul.hover-anims li.books a { background-position:-290px 0; }
#header ul.hover-css li.books a:hover, #header ul.hover-css li.books a.on, #header ul.hover-anims li.books span, #header ul.hover-anims li.books span a.on { background-position:-290px -54px; }
#header ul.hover-css li.articles a, #header ul.hover-anims li.articles a { background-position:-430px 0; }
#header ul.hover-css li.articles a:hover, #header ul.hover-css li.articles a.on, #header ul.hover-anims li.articles span, #header ul.hover-anims li.articles span a.on  { background-position:-430px -54px; }
#header ul.hover-css li.web a, #header ul.hover-anims li.web a { background-position:-570px 0; }
#header ul.hover-css li.web a:hover, #header ul.hover-css li.web a.on, #header ul.hover-anims li.web span, #header ul.hover-anims li.web span a.on { background-position:-570px -54px; }
#header ul.hover-css li.contact a, #header ul.hover-anims li.contact a { background-position:-710px 0; width:147px; }
#header ul.hover-anims li.contact span { width:147px; }
#header ul.hover-css li.contact a:hover, #header ul.hover-anims li.contact span, #header ul.hover-anims li.contact span a.on { background-position:-710px -54px; }

/* containers */
#outerContainer { width:1004px; margin:-28px auto 0; background:url(img/outer_bg_top.png) no-repeat 50% 0; position:relative; top:28px; }
#innerContainer { width:1004px; margin:auto; position:relative; clear:both; }

/* footer */
#footer { width:840px; margin:-134px auto 0; padding:0 82px 290px; position:relative; background:url(img/outer_bg_bottom.jpg) no-repeat 50% 100%; clear:both; color:#fff; font-size:12px; }
#footer .list-container { float:left; width:167px; }
#footer h2 { font-size:16px; margin-bottom:10px; }
#footer a { color:#fff; }
#footer ul li { position:relative; padding-left:15px; }
#footer ul li span { font:20px Georgia, serif; position:absolute; left:0; top:-5px; }
#footer .social { width:294px; float:right; }
#footer .social h2 { text-indent:10px; }
#footer .social ul li { float:left; text-indent:-99999px; overflow:hidden; padding:0; }
#footer .social ul li a, #footer ul.hover-anims li span { display:block; width:62px; height:62px; top:0; background:url(img/social.png) no-repeat 0 0; }
#footer ul.hover-css li a:hover, #footer ul.hover-anims li span { background-position:0 -128px; }
#footer .social ul li.facebook a { background-position:-62px 0; width:58px; }
#footer ul.hover-css li.facebook a:hover, #footer ul.hover-anims li.facebook span { background-position:-62px -128px; }
#footer .social ul li.technorati a { background-position:-120px 0; width:59px; }
#footer ul.hover-css li.technorati a:hover, #footer ul.hover-anims li.technorati span { background-position:-120px -128px; }
#footer .social ul li.digg a { background-position:-179px 0; width:57px; }
#footer ul.hover-css li.digg a:hover, #footer ul.hover-anims li.digg span { background-position:-179px -128px; }
#footer .social ul li.reddit a { background-position:-237px 0; width:57px; }
#footer ul.hover-css li.reddit a:hover, #footer ul.hover-anims li.reddit span { background-position:-237px -128px; }
#footer .social ul li.rss a { background-position:0 -63px; height:58px; }
#footer ul.hover-css li.rss a:hover, #footer ul.hover-anims li.rss span { background-position:0 -191px; }
#footer .social ul li.delicious a { background-position:-62px -63px; width:58px; }
#footer ul.hover-css li.delicious a:hover, #footer ul.hover-anims li.delicious span { background-position:-62px -191px; }
#footer .social ul li.linkedin a { background-position:-120px -63px; width:58px; }
#footer ul.hover-css li.linkedin a:hover, #footer ul.hover-anims li.linkedin span { background-position:-120px -191px; }
#footer .social ul li.stumble a { background-position:-178px -63px; width:58px; }
#footer ul.hover-css li.stumble a:hover, #footer ul.hover-anims li.stumble span { background-position:-178px -191px; }
#footer .social ul li.yahoo a { background-position:-237px -63px; width:58px; }
#footer ul.hover-css li.yahoo a:hover, #footer ul.hover-anims li.yahoo span { background-position:-237px -191px; }

/* content */
#content { width:840px; background-color:#000; margin:0 auto 175px; padding-top:25px; position:relative; color:#fff; font-size:12px; }
#content #intro, #content .intro { font-size:24px; margin-bottom:44px; clear:both; }

#blogContainer, #aboutContainer, #archiveContainer, #errorContainer, #postContainer { width:500px; float:left; }
#content p, #content pre { line-height:1.5em; margin-bottom:1.8em; }
#content p strong { font-weight:bold; }
#content pre { font:14px Monospace; width:516px; white-space:pre-wrap; }
#content .item, #content .entry { position:relative; margin-bottom:78px; padding-top:20px; }
#content .entry img { float:left; margin:0 20px 10px 0; }
#content h2, #content h1 { font-size:18px; margin-bottom:16px; }
#content h2.pagetitle, #content h1 { font-size:24px; }
#content h2 a, #content a { position:relative; color:#fff; bottom:auto; }
#content h2 a:hover, #content a:hover { color:#eee; }
#content .date, #content a.top, #content p.postmetadata, #blogContainer .post-tools { color:#7f7f7f; position:absolute; right:0; top:0; }
#content .date:hover, #content a.top:hover, #content p.postmetadata:hover, #blogContainer .post-tools:hover { color:#9E9E9E; }
#content a.top, #content p.postmetadata, #blogContainer .post-tools { top:auto; bottom:-20px; }
#content p.postmetadata, #blogContainer .post-tools { margin-bottom:0; }
#content p.postmetadata a, #blogContainer .post-tools li, #blogContainer .post-tools li a, #postContainer .post-tools li, #postContainer .post-tools li a { color:#7f7f7f; }
#blogContainer .post-tools li, #postContainer .post-tools li { float:left; margin-right:5px; font-size:16px; font-weight:bold; padding-left:0; background:none; }
#blogContainer .post-tools li a, #blogContainer .post-tools li span, #postContainer .post-tools li a, #postContainer .post-tools li span { font-size:12px; font-weight:normal; margin-right:5px; }
#blogContainer .post-tools li a:hover, #postContainer .post-tools li a:hover { color:#9e9e9e; }
#content h3 { font-size:16px; margin-bottom:5px; }
#content ul { margin-bottom:12px; }
#content ul li { padding-left:23px; background:url(img/bullet.png) no-repeat 0 0; }
#content .book-container ul li { padding-left:0; background:none; }
.entry dd { padding-left:14px; margin-bottom:11px; }

#bookBar { float:right; width:260px; font-size:12px; line-height:1.2em; }
#bookBar ul li { position:relative; height:129px; margin-bottom:60px; background:none; padding-left:0; }
#bookBar ul li img { float:left; margin-right:10px; }
#bookBar ul li h2 { font-size:14px; font-weight:bold; margin-bottom:10px; }
#bookBar ul li span { display:block; text-decoration:line-through; position:absolute; left:120px; bottom:14px; }
#bookBar ul li span.special { text-decoration:none; font-weight:bold; bottom:-3px; }
#bookBar ul li a { color:#fff; }
#bookBar a.more { position:absolute; bottom:-3px; right:0; color:#7F7F7F; }
#bookBar a.more:hover { color:#9e9e9e; }

.book-container { width:240px; float:left; margin:0 60px 45px 0; position:relative; }
#content .book-container h2 { font-size:24px; margin:24px 0 17px; height:70px; }
.book-container span { font-size:14px; display:block; }
.book-container img { margin-bottom:17px; }
.book-container ul { width:152px; margin:0 auto 17px; }
.book-container ul li { float:left; margin-right:5px; color:#7F7F7F; font-size:16px; font-weight:bold; background:none; padding-left:0; }
#content .book-container ul li a { margin-right:5px; font-size:13px; color:#7F7F7F; }
#content .book-container .book-description { font-size:12px; height:140px; clear:left; margin-bottom:0; }
.book-container dl { font-size:16px; }
.book-container dl span, .book-container p.price span { font-size:12px; text-decoration:line-through; color:#ff0000; display:inline; }
.book-container dt, .book-container dd { float:left; }
.book-container dt {clear:left; width:100px; }
.book-container dd a { margin-right:5px; }
#content .small-container h2 { margin:0; font-size:12px; line-height:1.2em; height:36px; position:relative; top:-2px; }
.small-container img { float:left; margin-right:10px; }
#content .small-container .book-description { height:87px; clear:none; font-size:11px; }

.article-container { width:840px; height:282px; position:relative; font-size:16px; margin-bottom:60px; }
.article-container img { float:left; margin-right:60px; width:279px; height:282px; }
.article-container dl { margin-bottom:16px; }
.article-container dl, .article-container dt, .article-container dd { float:left; }
.article-container dt { width:85px; clear:left; }
.article-container dd { width:415px; }
#content .article-container p { font-size:14px; }
#content .article-container .button { width:140px; height:33px; padding-top:8px; display:block; background:url(img/buttons.gif) no-repeat 0 0; color:#fff; text-align:center; position:absolute; top:0; right:0; text-decoration:none; font-size:18px; }
#content .article-container .button:hover { background-position:0 -41px; }

.project-container { float:left; width:397px; height:620px; font-size:12px; margin:0 45px 45px 0; position:relative; }
#content .project-container h2 { font-size:18px; }
#content .project-container img { margin-bottom:10px; }
#content .project-container a.more { position:absolute; right:0; bottom:0; color:#7F7F7F; }

#navigation ul { margin:-10px 0 20px; }
#navigation ul li { float:left; margin-right:5px; font-size:13px; color:#7F7F7F; background:none; padding-left:0; }
#innerContainer #content li.last { float:right; }
#navigation ul li span.arrow { font:20px Georgia,serif; color:#7F7F7F; margin:0 2px; }
#navigation ul li a { color:#7F7F7F; }
#postContainer { margin-bottom:45px; }
#postContainer p.postmetadata { bottom:auto; }
#postContainer p.postmetadata .date { position:relative; }
#postContainer .post-tools li { font-size:13px; font-weight:normal; background:none; padding-left:0;; }
#postContainer .nocomments { margin-bottom:0; }
#content #postContainer .post { position:relative; margin-bottom:45px; padding-top:26px; }
#comment { width:100%; }
#postContainer .comment-author img { float:left; margin-right:10px; }
#postContainer #comments { margin-bottom:10px; font-size:16px; }
#respond h3 { font-size:16px; margin-bottom:15px; }
#postContainer .comment-meta { margin-bottom:10px; }
#postContainer .commentlist { margin-bottom:45px; }
#postContainer #respond { position:relative; }
#commentform { position:relative; }
#commentform p { color:#7F7F7F; text-align:right; position:absolute; right:0; top:-34px; }
#commentform p a { color:#7F7F7F; }
#commentform input { float:left; clear:left; display:block; margin:0 15px 15px 0; width:240px; font-size:16px; }
#commentform label { float:left; display:block; font-size:14px; }
#commentform input#submit { font:12px Verdana, Serif; width:auto; padding:5px 10px; margin:15px 0 0 -1px; }
#commentform p span { font:20px Georgia, Serif; margin-left:2px; position:relative; top:2px; }
#postContainer .commentlist li { margin-bottom:30px; background:none; padding-left:0; }

/* mailer form */
#mailer { background:url(img/mailerBg.png) no-repeat 0 0; width:436px !important; height:300px !important; padding:51px 0 0 51px !important; background-color:transparent !important; }
#mailer fieldset { width:400px; }
#mailer fieldset div { margin-bottom:10px; }
#mailer fieldset .label { color:#fff !important; font-size:18px !important; margin-right:30px !important; }
#mailer fieldset input { font-size:18px !important; padding:6px 10px 4px; width:260px !important; }
#mailer fieldset textarea { font-size:18px !important; padding:10px; width:260px !important; }
#cancel { float:left !important; margin-left:114px; }
#send { margin-right:32px; }
#confirm { width:400px !important; font-size:22px !important; color:#fff; margin-bottom:30px; }
#back { margin-right:28px; }

/* comments page */
#comments { width:500px;  }
.comment { border-bottom:1px solid #fff; padding:5px 0 5px 5px; color:#fff; }
#leaveComment { width:500px; overflow:hidden; position:relative; }
#leaveComment .row { width:500px; }
.row { padding-left:5px; margin-bottom:5px; clear:both; overflow:hidden; }
.row label { width:100px; text-align:right; margin-right:5px; display:block; float:left; font-weight:bold; padding-top:5px; }
.row input, .row textarea, .row div { width:385px; display:block; float:left; }
#add { position:absolute; bottom:5px; left:60px; font-weight:bold; font-size:10px; width:45px; }

/* jpoll */
#pollForm { width:200px; }
#pollForm input { width:auto; margin-top:7px; float:right; }
#results .row .result { height:20px; margin-top:3px; background-color:#06F; }

/* compo */
.compo img { display:block; width:240px; margin:auto; }
.compo sup { position:relative; top:-7px; font-size:10px; }
#tweet-box-header #tweet-box-container label { color:#fff; }