@import url('reset.css');

body { background: #eee url('img/temp-grid.png') repeat-y top center; font-family: "kulturista-web-1", "kulturista-web-2", Georgia, serif; }
body { background: #eee url('img/bg-site.png') repeat; }

a { text-decoration: none; }

#debris #header-wrapper { background: transparent url('img/bg-work-header.png') repeat-x bottom left; height: 144px; }
#header { width: 960px; margin: 0 auto; }
h1 { font-size: 36px; line-height: 36px; margin-top: 26px; font-weight: 300; font-style: italic; color: #000; width: 176px; float: left; }
h1 a { color: #000; }
#navigation { float: left; margin-left: 98px; font-weight: 500; margin-top: 30px; }
#navigation li {display: inline; font-size: 18px;}
#navigation li a:link, #navigation li a:visited {float: left; display: block; text-decoration: none; margin: 0 20px; height: 96px; line-height: 100px; color: #00baf0; padding-top: 6px; }
#navigation li a:hover { color: #000; }
#navigation li a.active { background: transparent url('img/nav-active.png') no-repeat center center; color: #fff; font-style: italic; width: 96px; text-align: center; margin: 0; }

#hero-wrapper { background-color: #fff; }
#hero { width: 960px; margin: 0 auto; padding-bottom: 25px; margin-bottom: 20px; }
#hero .blurb { width: 430px; float: left; padding: 23px 20px 20px 20px; height: 120px; background-color: #eee; }
#hero .blurb p { line-height: 18px; font-size: 14px; margin-bottom: 18px; color: #555; }
#hero .blurb p a:link, #hero .blurb p a:visited { color: #555; border-bottom: 1px dotted #888; }
#hero .blurb p a:hover { color: #222; border-bottom: 1px dotted #333; }
#hero .extra { width: 468px; height: 160px; float: right; }
#hero .extra .face { width: 468px; height: 160px; background: url('img/debris-face.jpg') no-repeat; }
.ask { display: none; }

#content { width: 960px; margin: 0 auto; }
#content li.entry-item { clear: both; border-bottom: 1px solid #aaa; margin: 18px 0; padding: 18px 0; }
#content li .copy { width: 764px; float: left; }
#content li.photo .copy img { float: right; width: 470px; margin-left: 20px; padding-bottom: 18px; }
#content li .copy p { line-height: 18px; font-size: 14px; margin-bottom: 18px; font-family: "ff-meta-web-pro-1","ff-meta-web-pro-2", "Lucida Sans", "Lucida Grande", Verdana, sans-serif; color: #555; }
.first { margin-right: 26px; }
#content li .copy p a:link, #content li .copy a:visited { color: #555; text-decoration: underline; }
#content li .copy p a:hover { color: #222; }
.connect { color: #00baf0; }

#content li.question .query { width: 372px; float: left; margin-right: 20px; }
#content li.question .answer { width: 372px; float: right; }
#content li.question .asker, #content li.question .response { display: block; background-color: #ccc; height: 24px; line-height: 24px; font-size: 10px; padding: 0 8px; text-transform: uppercase; }
#content li.question .asker a:link, #content li.question .asker a:visited { color: #333; }
#content li.question .asker a:hover { color: #000; }
#content li.question .response { background-color: #00baf0; color: #fff; }

#content li.text span.description, #content li.text p.description, #content li.text div.description { width: 274px; margin-right: 20px; float: left; }
#content li.text .copy .cycle { width: 470px; float: right; margin-top: -9px; }
#content li.text .copy img { width: 470px; float: right; margin: 0 0 18px 0; }

#content li.quote blockquote { width: 372px; float: right; }
#content li.quote blockquote p { font-family: "kulturista-web-1", "kulturista-web-2", Georgia, serif; }
#content li.quote div.cite { width: 372px; float: left; margin-right: 20px; }

#content li.link p.the-link { width: 372px; float: right; }
#content li.link p.the-link span { background-color: #00baf0; color: #fff; padding: 3px 6px; font-size: 10px; margin-right: 10px; display: block; margin-bottom: 9px; }
#content li.link p.the-link a:link, #content li.link p.the-link a:hover { font-size: 24px; line-height: 36px; color: #444; border-bottom: 1px dotted #666; }
#content li.link p.the-link a:hover { color: #000; border-bottom: 1px dotted #000; }
#content li.link div.description { width: 372px; float: left; margin-right: 20px; }

#content li .meta { width: 176px; float: left; margin-left: 20px; }
#content li .meta li { margin: 0; padding: 0; line-height: 18px; }
#content li .meta .permalink a:link, #content li .meta .permalink a:visited { display: block; line-height: 36px; background-color: #ddd; color: #000; padding: 0 8px; font-size: 12px; margin-bottom: 12px; }
#content li .meta .permalink a:hover { color: #fff; background-color: #00baf0; }
#content li .meta .note-count { display: block; /*background-color: #ccc;*/ color: #000; padding: 0 0 0 8px; font-size: 12px; margin-bottom: 12px; }
#content li .meta .tags { display: block; /*background-color: #ddd;*/ color: #666; padding: 0 0 0 8px; font-size: 12px; }
#content li .meta .tags a:link, #content li .meta .tags a:visited { color: #666; border-bottom: 1px dotted #888; }
#content li .meta .tags a:hover { color: #222; border-bottom: 1px dotted #444; }
#content li .meta ol.notes { /*background-color: #fff;*/ padding: 0 0 0 8px; color: #999; }
#content li .meta ol.notes li { font-family: "ff-meta-web-pro-1","ff-meta-web-pro-2", "Lucida Sans", "Lucida Grande", Verdana, sans-serif; font-size: 12px; }
#content li .meta ol.notes li img { display: none; }
#content li .meta ol.notes li span { line-height: 18px; }
#content li .meta ol.notes li span a:link, #content li .meta ol.notes a:visited { color: #888; text-decoration: none; border-bottom: 1px dotted #ccc; }
#content li .meta ol.notes li span a:hover { color: #555; border-bottom: 1px dotted #333; }
#content li .meta ol.notes li blockquote { padding-left: 10px; font-size: 10px; }
#content li .meta ol.notes li blockquote a:link, #content li .meta ol.notes li blockquote a:visited { color: #555; text-decoration: none; }

.footer { margin-bottom: 36px; }
.footer a.previous, .footer a.next { display: block; width: 470px; height: 36px; line-height: 36px; text-align: center; font-size: 12px; background-color: #ddd; font-family: "ff-meta-web-pro-1","ff-meta-web-pro-2", "Lucida Sans", "Lucida Grande", Verdana, sans-serif; }
.footer a.previous { float: right; }
.footer a.next { float: left; }
.footer a.previous:link, .footer a.previous:visited, .footer a.next:link, .footer a.next:visited { color: #333; }
.footer a.previous:hover, .footer a.next:hover { background-color: #00baf0; color: #fff; }

br.c { clear: both; line-height: 1px; }