/*
Theme Name: v6
*/

/* Reset */
body,html,
h1,h2,h3,h4,h5,h6,p,blockquote,
ul,ol,li,dl,dt,dd,
aside,header,footer,article,section,
table,thead,tbody,tfoot,tr,th,td,
form,fieldset { /* normalise margin, padding, typography */
	margin: 0;
	padding: 0;
	font: 13px/16px Corbel, "Bitstream Vera Sans", Lucida Sans Unicode, Helvetica, Arial, sans-serif;
	vertical-align: baseline;
}
aside,header,footer,article,section,nav { display: block; }
ol, ul { list-style: none outside; }
table { border-collapse: collapse; border-spacing: 0; border: 0; }
table th,
table td { vertical-align: middle; border: 0; }
fieldset, img { border: 0; }
q:before, q:after { content: ''; } /* bring good browsers in line with IE <= 6 (!?) */
input, button { width: auto; overflow: visible; }
sub,sup { line-height: 0; }
input, select { font-family: Corbel, "Bitstream Vera Sans", Lucida Sans Unicode, Helvetica, Arial, sans-serif }


a { color: #FF2C16; text-decoration: none; }
a:hover { color: #FF2C16; text-decoration: underline; }

/* layout */

body {
padding: 2px 0 2px 0;
background: #240909 url(gfx/bg.png) repeat left top;
color: #fff;
min-width: 960px;
}

#header {
float: left;
width: 100%;
position: relative;
}
#header h1 {
text-indent: -9999px;
position: relative;
width: 410px;
height: 56px;
float: left;
background: url(gfx/logotype.png) no-repeat 16px 16px;
}
#header h1 canvas {
display: block;
position: absolute;
top: 0; left: 0;
}
#header h1 a {
text-decoration: none;
color: #240909;
}
#header h1 a:hover {
text-decoration: none;
color: #FF2C16;
}
#header h1 a:after {
content: "Home";
position: absolute;
left: 16px; bottom: -32px;
text-indent: 0;
width: 88px;
font-size: 14px;
line-height: 16px;
height: 16px;
vertical-align: bottom;
display: block;
border: 0;
padding-top: 15px;
color: #a6a6a6;
border-top: 1px dotted #e6e6e6;
text-transform: lowercase;
font-variant: small-caps;
letter-spacing: 1px;
}
.blog #header h1 a:after,
#header h1:hover a:after {
color: #ff2c16;
border-top: 1px solid #e6e6e6;
}

#nav {
width: auto;
margin: 0 8px 0 112px;
clear: left;
overflow: hidden;
border-top: 1px dotted #e6e6e6;
position: relative;
}
#nav h2 {
font-size: 14px;
padding-top: 15px;
margin: 0 0 16px;
color: #a6a6a6;
display: inline-block;
padding-right: 16px;
width: 92px;
font-weight: normal;
text-transform: lowercase;
font-variant: small-caps;
letter-spacing: 1px;
background: url(/blog/wp-content/themes/v6/gfx/arrow-thing.png) no-repeat right -17px;
cursor: pointer;
}
#nav.open,
#nav:hover {
border-top: 1px solid #e6e6e6;
}
#nav.open h2,
#nav:hover h2 {
color: #FF2C16;
background: url(/blog/wp-content/themes/v6/gfx/arrow-thing.png?v) no-repeat right -49px;
}
#nav.open h2:hover {
color: #FF2C16;
background: url(/blog/wp-content/themes/v6/gfx/arrow-thing.png?v) no-repeat right 15px;
}

#nav .slider {
display: none;
}
#nav h3 {
margin: 0;
font-weight: normal;
line-height: 18px;
}
#nav ul {
position: relative;
float: left;
width: 96px;
margin-right: 16px;
padding-bottom: 32px;
}
#nav ul:first-child {
width: 96px;
}
#nav ul.friends {
width: 280px;
}
#nav ul.friends li {
float: none;
width: auto;
}
#nav li {
margin: 0 8px 0 0;
padding: 0;

}
#nav li ul {
margin: 0;
padding: 0;
}
#nav ul ul li {
white-space: nowrap;
margin: 0;
}
#nav a {
font-weight: normal;
font-size: 12px;
line-height: 18px;
text-decoration: none;
vertical-align: bottom;
display: inline-block;
}
#nav .current a,
#nav a:hover {
color: #FF2C16;
text-decoration: underline;
}
#nav a[href^="http://delicious"] {
padding-left: 20px;
background: url(/blog/wp-content/themes/v6/gfx/delicious-16x16.png) no-repeat left center;
}
#nav a[href^="http://www.flickr"] {
padding-left: 20px;
display:inline-block;
background: url(/blog/wp-content/themes/v6/gfx/flickr-16x16.png) no-repeat left center;
}
#nav a[href^="http://last.fm"] {
padding-left: 20px;
display:inline-block;
background: url(/blog/wp-content/themes/v6/gfx/lastfm-16x16.png) no-repeat left center;
}
#nav a[href^="http://twitter"] {
padding-left: 20px;
display:inline-block;
background: url(/blog/wp-content/themes/v6/gfx/twitter-16x16.png) no-repeat left center;
}
#nav a[href*="posterous"] {
padding-left: 20px;
display:inline-block;
background: url(/blog/wp-content/themes/v6/gfx/posterous-16x16.png) no-repeat left center;
}
#nav a[href^="http://hascanvas"] {
padding-left: 20px;
display:inline-block;
background: url(/blog/wp-content/themes/v6/gfx/hascanvas-16x16.png) no-repeat left center;
}

#header p {
margin: 0 0 32px;
line-height: 16px;
position: absolute;
top: 28px;
left: 400px;
text-align: right;
color: #676767;
font-size: 12px;
height: 16px;
font-style: italic;
}


#wrap {
padding: 30px 0 16px 32px;
background: #fff;
color: #6a6a6a;
-moz-box-shadow: -236px -124px 124px #FF2C16;
-webkit-box-shadow: -236px -32px 124px #FF2C16;
}

#main {
padding: 32px 16px 32px 208px;
clear: both;
}


section,
article {
margin: 32px 32px 64px 0;
clear: both;
}
section .title,
article .title {
font-size: 20px;
line-height: 24px;
margin: 0 0 16px;
font-weight: normal;
color: #240909;
}
/*.blog .title,
.archive .title,
.search .title {
margin: 0;
}*/
.title .sep {
width: 16px;
display: inline-block;
font-weight: normal;
color: #a6a6a6;
margin: 0;
}
p {
margin: 16px 0 16px 16px;
font-size: 14px;
line-height: 20px;
}
article p,
section p {
width: 432px;
}
section ul,
article ul,
section ol,
article ol {
margin: 16px 0 16px 16px;
width: 432px;
list-style: disc;
}
section ol,
article ol {
list-style: lower-roman;
}
section li,
article li {
font-size: 14px;
line-height: 20px;
color: #6a6a6a;
margin: 0 0 8px;
}

blockquote {
padding-left: 0;
margin: 8px 0 8px 16px;
position: relative;
width: 432px;
color: #8a8a8a;
}
blockquote:before {
content: "\201C";
position: absolute;
left: -32px; top: 16px;
line-height: 16px;
font-size: 64px;
color: #e6e6e6;
width: 32px;
font-family: Georgia, serif;
}
blockquote:after{
content: "\201D";
position: absolute;
right: -32px; bottom: -20px;
line-height: 16px;
font-size: 64px;
color: #e6e6e6;
width: 32px;
font-family: Georgia, serif;
}
blockquote p {
width: auto;
margin: 8px 0 8px 0;
font-size: 13px;
line-height: 20px;
font-style: italic;
}
blockquote cite {
display: block;
text-align: right;
}
blockquote cite:before {
content: "\2014";
margin-right: 8px;
}

section h2,
article h2 {
font-weight: normal;
margin-left: 16px;
font-size: 14px;
line-height: 20px;
color: #240909;
}
h3 {
line-height: 20px;
margin-left: 16px;
font-size: 12px;
font-weight: bold;
}

pre {
background: #f8f8f8;
padding: 8px;
overflow: auto;
font-size: 12px;
line-height: 16px;
margin-left: 8px;
}

article .date {
width: 136px;
margin: -40px 0 0 -144px;
padding: 0;
display: block;
float: left;
line-height: 24px;
text-align: right;
font-size: 12px;
}
.ncn {
display: block;
float: right;
}
.single article .date {
margin-top: -40px;
}

article .aside,
section .aside {
float: left;
clear: left;
width: 136px;
margin-left: -144px;
text-align: right;
}

.aside h2 {
margin-bottom: 0;
margin-top: 31px;
line-height: 16px;
}
.aside h2:first-child {
margin-top: 2px;
}
.aside p {
width: auto;
line-height: 16px;
font-size: 12px;
margin: 8px 0 8px 0;
color: #7a7a7a;
overflow: hidden;
}
.aside p img {
margin: 0 0 5px;
display: block;
float: right;
}

.meta {
margin: 16px 16px;
padding: 0;
display: block;
clear: both;
font-size: 10px;
}
.meta p {
width: auto;
font-size: 11px;
margin: 0;
}
/*.archive .meta,
.blog .meta {
margin: 0 16px 0 0;
text-align: left;
width: auto;
float: none;
clear: none;
}*/

article footer {
clear: both;
margin: 0 0 16px;
padding-bottom: 16px;
border-bottom: 1px dotted #e7e7e7;
}
article footer p {
margin: 16px;
font-size: 11px;
}

.pagination {
margin: 0;
width: 32px;
text-align: center;
position: absolute;
top: 90px; left: 252px;
height: 40px;
}
.pagination .up {
display: none;
}
.next a, .prev a {
width: 16px; height: 16px;
display: block;
text-indent: -9999px;
background: url(/blog/wp-content/themes/v6/gfx/pagination.png) no-repeat center;
}
.next, .prev {
width: 16px; height: 16px;
position: absolute;
left: 0; top: 16px;
text-align: left;
text-indent: -9999px;
}
.next a:hover {
background-position: right center;
}
.next {
left: 16px;
}
.prev a:hover {
background-position: left center;
}
.pagination a:hover .title {
text-align: left;
position: absolute;
left: 36px; top: 0;
height: 16px;
font-size: 12px;
line-height: 16px;
color: #ff2c16;
width: 320px;
text-indent: 0;
}
.pagination .next a:hover .title {
left: 20px;
}

/* comments */
#comments {
width: 432px;
margin-left: 16px;
}

section form,
#respond {
width: 432px;
margin-left: 16px;
}
fieldset {
margin: 0;
padding: 0;
}
form p {
margin: 0;
}
.msg {
line-height: 1;
}
.error {
color: #240909;
font-weight: bold;
}
.field textarea {
width: 100%;
height: 12em;
width: 434px;
margin: 0 0 16px -9px;
background: #f7f7f7;
padding: 7px;
border: 1px solid #fff;
font-size: 14px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
background-image: -moz-linear-gradient(bottom, #f7f7f7, #eee); /* FF3.6 */
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #f7f7f7),color-stop(1, #ddd)); /* Saf4+, Chrome */
}
#respond h3 {
margin: 16px 0;
}
#respond .cancel-comment-reply {
}
.field {
margin: 15px 0 7px;
}
.field label {
display: block;
padding: 0 0 4px;
}
.field input {
font-size: 14px;
width: 218px;
padding: 7px;
background: #f7f7f7;
border: 1px solid #fff;
margin-left: -9px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
background-image: -moz-linear-gradient(bottom, #f7f7f7, #eee); /* FF3.6 */
background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #f7f7f7),color-stop(1, #eee)); /* Saf4+, Chrome */
}
.field input:focus,
.field textarea:focus {
border: 1px solid #ccc;
}

.submit input {
padding: 4px 16px;
color: #fff;
background: #240909;
text-transform: uppercase;
-moz-border-radius: 16px;
-webkit-border-radius: 16px;
border-radius: 16px;
text-shadow: 1px 1px 1px #a9a9a9;
font-weight: bold;
border: 0;
font-size: 16px;
cursor: pointer;
}
.submit input:hover {
background: #ff2c16;
}

.commentlist {
width: 432px;
margin-left: 16px;
}
.commentlist li {
margin: 16px 0;
}
.commentlist p {
margin: 8px 0;
}
.commentlist li .vcard img {
width: 40px;
height: 40px;
}
.commentlist li .vcard div {
float: left;
margin: 0 8px 8px 0;
}


#searchform {
overflow: hidden;
position: absolute;
top: 10px; right: 0;
}
#searchform label {
position: absolute;
left: -9999px; top: -9999px;
}
#searchform #s {
width: 200px;
border: 0;
border: 1px solid #ddd;
padding: 3px 4px;
font-size: 12px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
padding-right: 20px;
height: 16px;
}
#searchform #s:focus {
outline: 0;
background: #f7f7f7;
}
#searchform #searchsubmit {
padding: 0;
font-size: 14px;
border: 0;
color: #240909;
position: absolute;
z-index: 2;
right: 4px; top: 4px;
background: url(/blog/wp-content/themes/v6/gfx/search.png) no-repeat center;
display: inline-block;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
cursor: pointer;
overflow: hidden;
height: 16px; width: 16px;
line-height: 100px;
text-indent: -9999px;
}
#searchform:hover #s {
border-color: #d0d0d0;
}


#footer {
clear: both;
margin: 32px 8px 0 16px;
padding: 15px 0 0;
border-top: 1px dotted #a6a6a6;
text-align: left;
overflow: hidden;
}
#footer p {
font-size: 12px;
margin: 0;
}
#footer .blurb {
float: right;
text-align: right;
margin-right: 32px;
display: block;
}
#footer a {
margin-right: 8px;
margin-left: 8px;
display:inline-block;
}
#footer a:first-child {
margin-left: 0;
}

#footer a[href$="feed"] {
padding-left: 20px;
display:inline-block;
background: url(/blog/wp-content/themes/v6/gfx/feed-16x16.png) no-repeat left center;
}


/* nitty gritty */

abbr { font-variant: small-caps; text-transform: lowercase; border: 0; letter-spacing: 1px; font-size: 100%; }

dl { font-size: 16px; margin: 16px 0 32px; margin-left: 16px; width: 432px; line-height: 20px; border-bottom: 1px dotted #ccc; }
dt { font-style: italic; line-height: 20px; border-top: 1px dotted #ccc; margin-top: 0; font-weight: bold; padding-top: 8px; }
dd { margin: 0 0 0 48px; line-height: 20px; padding-bottom: 8px; }

a.bookmarklet,
a[href^="javascript"] {
padding: 2px 8px;
color: #fff;
background: #ff2c16;
-moz-border-radius: 16px;
-webkit-border-radius: 16px;
border-radius: 16px;
text-shadow: 1px 1px 1px #a9a9a9;
font-weight: bold;
margin-right: 4px;
}

a.more-link {
font-style: italic;
color: #6a6a6a;
}
a.more-link:hover {
color: #240909;
}

p div { display: inline; }
.alignleft {
float: right;
display: block;
margin: 0 8px 10px 0;
}

iframe {
margin-left: -240px;
width: 150%;
}
.noJS iframe {
margin-left: 0;
}

q:before { content: open-quote; }
q:after { content: close-quote; }
