/* Sloppy CSS written by yours truly */


/* ==== */
/* = General CSS = */
/* ==== */

* { margin:0; padding:0; border:0; }

html { background:   url('images/x2.jpg') fixed top;  }
body { font-family: "Lucida Grande", Helvetica, arial, sans-serif; font-size:13px;background:   url('images/bg-bodyx.jpg') top center no-repeat ;height:100%; width:100%; min-height:600px;}

h1, h2, h3, h4, h5, h6 { color:#991740; font-weight:bold; }

h2 { font-size:60px; line-height:60px; margin-bottom:25px; letter-spacing:-2px; }

h3 { margin-bottom:8px;text-shadow:1px 1px #fff; }
h3#comments, h3#respond { font-size:18px; background:url('images/bg-border.png') repeat-x bottom; padding:0 0 8px 0; margin-bottom:10px; color:#aaa; font-weight:normal; text-transform:uppercase;}
a { text-decoration:underline; color:#83153a;}
a:hover { text-decoration:underline;}
a:active, a:focus { outline:none;}

.post-content a, .more-posts a, .comments a, .pagination a { text-decoration:underline; color: #83153a; padding:1px 1px;}
.post-content a:hover, .more-posts a:hover, .comments a:hover {background:#f8f0f3;  color:#83153a;text-decoration: none;}
.post-content h2 { text-shadow:1px 1px #fff; font-family:helvetica,arial; }
.post-content h2 a { text-decoration:none; }
p, li { color:#333;}
p {line-height:1.55em; margin:0 0 20px 0;}
.post-content p { /* text-indent:30px; */ }
.post-content h2 + p { text-indent:0px; }
.post-content ol { margin-left:30px;}

ul, ol { margin-bottom:20px;}
li { margin-bottom:5px;}


/* classes */
.last { margin-right:0px!important;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.block:after{content:".";display:block;height:0;clear:both;visibility:hidden;}

/* ========== */
/* = Layout = */
/* ========== */

#wrapper { background:   url('images/bg-bodyx.jpg') no-repeat center top fixed; border-top:0px solid red; }

#content { position:relative;}
#content .post-edge {  background:url('images/bg-paperfold.png') no-repeat bottom;  width:555px; height:176px; margin-top:-00px;}
#content .post-edge:first-child { margin-top:-60px;}
#content .post-edge p.comments { margin-left:50px;}
#content .post-content { width:460px; margin-left:50px; position:relative;    }
#content .post {background:url('images/bg-paper.png') repeat-y;width:555px; padding-bottom:00px;}

.post-content .date { font-weight:normal!important; color:#bbb;font-size:14px; margin-bottom:3px;}

#content .post { position: relative}
#content .post-meta { position:absolute; top:22px; padding-right: 10px;left:-48px; width:55px; background: url('images/marker.png') no-repeat right 20px; }
#content .post-meta ul { margin:0px; padding:0 0 10px 0;}

#content .post-meta ul li { list-style:none; margin:0 0 8px 0; padding:0;}
#content .post-meta ul li a { display:block; text-decoration:none; font-weight:bold;}
#content .post-meta ul li a:hover { position:relative; top:1px;}

#content .post-meta ul li.date a { width:46px; height:46px; padding:5px 3px 0 0px;  text-align:center; background:url('images/icons/icon-meta-cal.png') no-repeat;}
#content .post-meta ul li.date a .day { font-size:26px; letter-spacing:-1px; padding-left:5px;}
#content .post-meta ul li.date a .month-year { font-size:10px; letter-spacing:-1px; position:relative; top:-3px;}


#content .post-meta ul li.category a { background:url('images/icons/icon-meta-cat.png') no-repeat; width:49px; height:49px;  text-indent:-9999px;}

#content .post-meta ul li.category a span { display: block; height:48px; width:49px;padding-top: 4px; background-repeat:no-repeat; background-position:center center;  }
#content .post-meta ul li.category a .User-interface { background-image:  url('images/icons/icon-cat-ui.png')}
#content .post-meta ul li.category a .Photography { background-image:  url('images/icons/icon-photography.png')}
#content .post-meta ul li.category a .Photoshop { background-image:  url('images/icons/icon-cat-ps.png')}
#content .post-meta ul li.category a .Hardware { background-image:  url('images/icons/icon-cat-hardware.png')}
#content .post-meta ul li.category a .Personal { background-image:  url('images/icons/icon-cat-personal.png')}
#content .post-meta ul li.category a .Design { background-image:  url('images/icons/icon-cat-design.png')}
#content .post-meta ul li.category a .Uncategorized { background-image:  url('images/icons/icon-cat-uncategorized.png')}

#content .post-meta ul li.comments a { width:46px; height:50px; font-size:31px; padding:11px 3px 0 0px; background:url('images/icons/icon-meta-comment.png') no-repeat; text-align:center; letter-spacing:-2px; line-height:23px;}

#sidebar { position:absolute; width:165px; top:185px; right:-140px; text-shadow:0.5px 0.5px #222; color:#ffd4e4; font-size:12px; }

#sidebar a { color:#fff; }
#sidebar a:hover { text-decoration:none;}
#sidebar small { font-size:11px;}

#sidebar ul { margin:0px 0 15px; background:url('images/border.png') repeat-x top; padding:0px 0 0  0; }
#sidebar ul li { background:url('images/border.png') repeat-x bottom; padding: 0px 0 0px 0; list-style-type:none;  }
#sidebar ul li a { padding:10px 0 10px 20px; display:block;}

#sidebar ul li.home a { background:url('images/icon-house.png') no-repeat left 13px   }
#sidebar ul li.archives a { background:url('images/icon-archives.png') no-repeat left 13px   }


#sidebar .intro { color:#ffd4e4;background:url('images/border.png') repeat-x bottom; padding: 0px 0 15px 0; line-height:1.6em; margin:0 0 10px 0;}


/* archives */
.post-navigation {  padding-top:20px; margin-bottom:50px}  
.post-navigation h3 { margin-bottom:10px;  background:  url("images/bg-border.png") repeat-x top; padding:15px 0 0 0; text-align:right; clear:both; text-transform:uppercase;  color:#aaaa; font-weight:normal;  text-shadow:1px 1px #fff;}
.post-navigation h3  a { color:#aaa; border:0px; text-decoration:none;}

.post-navigation p { font-size:17px; }
.post-navigation ul { clear:both; margin:-35px 0 30px 0; padding:9px 0 0 0 }
.post-navigation ul:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.post-navigation ul li {  list-style-type:none; margin: 0 0px 12px 0;  padding-bottom:15px; color:#ccc; width:350px; float:left; background:  url("images/bg-border.png") repeat-x bottom;}


.post-navigation ul li strong { font-size:13px; position:relative; top:0px; text-transform:uppercase; color:#aaa; text-shadow:1px 1px #fff; }
.post-navigation ul li a { margin-left:9px; padding:2px; border:0px }




/* pagination */
.pagination {color:#eee; position:relative; background:url('images/bg-paginate.png'); height:102px; width:483px; top:-40px; left:45px;}

.pagination ol { text-align:center; position:relative; top:25px; }
.pagination ol li { display:inline-block; margin-right:5px;}

.pagination ol li a { color:#adacac;  text-shadow:1px 1px #000; text-decoration:none;  font-weight:bold; font-size:22px;  display: block; ;background: #d3d3d3 -moz-linear-gradient(top, #d3d3d3, #c7c7c7); background: -webkit-gradient(linear, left top, left bottom, from(#d3d3d3), to(#c7c7c7)); -moz-border-radius:5px; -webkit-border-radius:5px; -moz-box-shadow:0.5px 0.5px #fff;  -webkit-box-shadow:0.5px 0.5px #fff;border-top:1px solid #b6b6b6; border-left:1px solid #cac8c8; }

.pagination ol li a.next { background: url('images/button-newer.png') no-repeat; right:0px; top:-24px;}
.pagination ol li a.prev { background: url('images/button-older.png') no-repeat; left:0px; top:-24px;}

.pagination a.next,.pagination a.prev { display: block; ;text-indent: -99009px; width:64px; height:102px; position:absolute; -moz-box-shadow:none; -webkit-box-shadow:none; border:0px; }

.pagination ol li a.next:hover, .pagination ol li a.prev:hover {  background:none;  background: url('images/button-newer.png') no-repeat 0 -142px;   border:0px;}
.pagination ol li a.next:hover { background: url('images/button-newer.png') no-repeat 0 -142px; }
 .pagination ol li a.prev:hover {  background: url('images/button-older.png') no-repeat 0 -142px; }

.pagination ol li .current  { color:#e7e7e7; background: #858585 -moz-linear-gradient(top, #858585, #5b5b5b); background: -webkit-gradient(linear, left top, left bottom, from(#858585), to(#5b5b5b));  text-shadow:1px 1px #000; text-decoration:none;  font-weight:bold; font-size:22px; -moz-border-radius:5px; -moz-box-shadow:0.5px 0.5px #fff;  -webkit-border-radius:5px; -webkit-box-shadow:0.5px 0.5px #fff; border-top:1px solid #636363; border-left:1px solid #777; padding:8px 3px 12px 3px ; }

.pagination ol li a:hover { color:#fff; background: #991740 -moz-linear-gradient(top, #991740, #6e1334);  background: -webkit-gradient(linear, left top, left bottom, from(#991740), to(#6e1334)); border-top:1px solid #390918; border-left:1px solid #390918; }
.pagination ol li .cufon-canvas { padding:14px 8px 10px 8px ;}



#container { width:600px; margin:0 auto;}

.more-posts { background:url('images/bg-paper.png') repeat-y;width:505px; padding-left:50px;}
.more-posts h3 { font-weight:lighter;  font-size:22px; text-transform:uppercase; margin-bottom:0px;
 color:#aaa; background:url('images/bg-border.png') repeat-x bottom; padding:0 0 4px 0;}
.more-posts ul { padding:0; margin:0;}
.more-posts ul li { list-style:none; margin:0 0 9px 0; background:url('images/bg-border.png') repeat-x bottom; padding:0 0 10px 0;}
.more-posts ul li:first-child {  padding-top:8px;}
.more-posts .column { width:210px; margin-right:40px; float:left; }

#footer { width:490px; margin-left:30px;  margin-top:20px; margin-bottom:40px; }
#footer h3,#footer h4,#footer h5,#footer h6 { color:#fff;  text-shadow:1px 1px #3e001f;}
#footer h4, #footer h5, #footer h6 { font-weight:normal;}
#footer h4 { font-size:16px; margin-bottom:10px;}
#footer h3 { font-size:25px; margin-bottom:15px;}
#footer p, #footer li { color:#fff; text-shadow:1px 1px #3e001f;}
#footer .block { border-bottom:1px solid rgb(255,255,255); border-bottom:1px solid rgba(255,255,255,0.1); margin-bottom:30px;}

#footer a { color:#ffd4e4; text-decoration:underline;}
#footer a:hover { text-decoration:none;}
#footer ul a { }

#footer .bio { margin:0 0 10px; padding:10px 0px 0 0;}
#footer .bio img { float:left; margin:0 15px 15px 0; border:0px solid #e4e4e4; padding:10px; background: #fff; background:rgba(255,255,255,0.1); position:relative; top:-10px;}

#footer .top-5 .column{ float:left; width:153px; margin-right:15px; }
#footer .top-5 .column ul { margin:0 0 25px 0; padding:0;}
#footer .top-5 .column ul li { list-style:none; margin:0 0 5px 0;}

#footer .goal-stat { width:110%;}
#footer .goal-stat p { float:left; width:235px; margin-right:30px;}
#footer .goal-stat p strong { font-size:55px; display:block; font-weight:normal; margin-top:5px; }
#footer .goal-stat p strong em { color:#e4e4e4; font-weight:bold; }

#footer .goals ul { margin-left:20px; margin-bottom:25px; width:110%;}
#footer .goals ul li { float:left;width:220px; margin-right:35px; margin-bottom:8px; }
#footer .goals ul li a { text-decoration:underline;}
#footer .goals ul li a:hover { text-decoration:none;}

#end-of-paper {  background:  url('images/bg-paperend.png') no-repeat bottom left; height:56px;}

#footer .social-networks, #footer .projects { width:240px; float:left;}
#footer .social-networks ul li, #footer .projects ul li {list-style-type:none; margin:0 0 7px 0;}
#footer .social-networks ul li a, #footer .projects ul li a { text-decoration:none; background:rgba(255, 255, 255, 0.1); display:block;padding:8px 5px 8px 35px; color:#fff; -moz-border-radius:3px; }
#footer .social-networks ul li a:hover, #footer .projects ul li a:hover { text-decoration:none; background:rgba(255, 255, 255, 0.3); display:block;padding:8px 5px 8px 35px; }
#footer .social-networks ul , #footer .projects ul  { margin:0px 0 30px 0;}
#footer .social-networks { margin-right:10px;}

#footer .social-networks ul li.lastfm a { background-image:url('images/icons/last.png'); background-position: 10px center; background-repeat:no-repeat;}
#footer .social-networks ul li.flickr a { background-image:url('images/icons/flickr.png'); background-position: 10px center; background-repeat:no-repeat;}
#footer .social-networks ul li.dribble a { background-image:url('images/icons/dribbler.png'); background-position: 10px center; background-repeat:no-repeat;}
#footer .social-networks ul li.twitter a { background-image:url('images/icons/twitter.png'); background-position: 10px center; background-repeat:no-repeat;}

#footer .projects ul li.shopify a { background-image:url('images/icons/shopify.png'); background-position: 10px center; background-repeat:no-repeat;}
#footer .projects ul li.cheat a { background-image:url('images/icons/cheat.png'); background-position: 10px center; background-repeat:no-repeat;}
#footer .projects ul li.fordesigners a { background-image:url('images/icons/designer.png'); background-position: 10px center; background-repeat:no-repeat;}
#footer .projects ul li.opendata a { background-image:url('images/icons/data.png'); background-position: 10px center; background-repeat:no-repeat;}

#footer .photos { width:110%; margin:0 0 30px 0; }
#footer .photos a { margin:0 10px 10px 0; float:left;}
#footer .photos a img { border:7px solid rgba(255, 255, 255, 0.1);}
#footer .photos a:hover img { border:7px solid rgba(255, 255, 255, 0.3);}


/* ==================== */
/* = Individual pages = */
/* ==================== */
#comments { margin-top:30px; }
#comments ol { margin:0 0 35px 0; padding:0;}
#comments ol li { list-style-type:none;  background:url('images/bg-border.png') repeat-x top; padding: 25px 0 0  0 ; margin:0 0 0px;}
#comments ol li:first-child { background:none; padding-top:7px;}
#comments ol li img {float:left; border: 3px solid #d5d5d5; }
#comments ol li .comment-body { padding-left:45px; color:#444;  font-size:12px;}

#comments ol li .comment-meta strong { color:#747474; line-height:1.3em; }

#comments ol li .comment-meta { margin: 0px 0 3px 0; color:#444; font-size:13px; padding:1px 0 0;}
#comments ol li .comment-meta a {color:#747474; font-weight:bold;}
#comments ol li .comment-meta a:hover {background-color:#eee;}
#comments ol li  .comment-meta .comment-date { font-size:11px;color:#adadad; text-shadow:0.5px 0.5px #fff;}

#comments dl dt {  clear:both;   position:relative; display:none; }
#comments dl dt small { color:#666;}
#comments dl dt label { position: absolute; top:12px; left:13px; color:gray; text-shadow:1px 1px #eee;}
#comments dl dd { margin-bottom:8px; }
#comments dl dd input { -moz-border-radius:5px; -webkit-border-radius:5px; border:1px solid #bbb; padding:10px; font-size:14px; background:-moz-linear-gradient(top, #d7d7d7, #e3e3e3); background:-webkit-gradient(linear, left top, left bottom, from(#d7d7d7), to(#e3e3e3)); -moz-box-shadow:0px 1px 0.5px #fff; width:250px; display:block; }
#comments dl dd textarea { -moz-border-radius:5px; -webkit-border-radius:5px; border:1px solid #bbb; padding:10px; font-family:helvetica, arial; background:-moz-linear-gradient(top, #d7d7d7, #e3e3e3);background:-webkit-gradient(linear, left top, left bottom, from(#d7d7d7), to(#e3e3e3)); -moz-box-shadow:0px 1px 0.5px #fff; margin-bottom:10px; font-size:14px;}

#comments dl dd input:focus,#comments dl dd textarea:focus{ background:#fff;}

#comments input[type="submit"] { background:-moz-linear-gradient(top, #991740, #6e1334); background:-webkit-gradient(linear, left top, left bottom, from(#991740), to(#6e1334)); font-weight:bold; padding:10px; -moz-box-shadow:1px 1px 0px #555; color:#fff; font-size:16px; letter-spacing:-1px; -moz-border-radius:7px; -webkit-border-radius:7px; cursor:pointer;}
#comments input[type="submit"]:hover { background:-moz-linear-gradient(bottom, #991740, #6e1334);}

#comments label.error { display:inline-block; background:red; color:#fff;}

.post-content ul { padding-left:20px }