/* ===================================== */
/*   MarkWunsch.com (v3.0) Style Sheet   */
/*   Copyright (c) 2009 Mark Wunsch      */
/*   All Rights Reserved                 */
/* ===================================== */


/* ============== */
/* = @Font-Face = */
/* ============== */
@font-face {
  font-family: 'Droid Serif';
  src: local('DroidSerif'), url('../fonts/DroidSerif-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Droid Serif';
  src: local('DroidSerif-Bold'), url('../fonts/DroidSerif-Bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: 'Droid Serif';
  src: local('DroidSerif-Italic'), url('../fonts/DroidSerif-Italic.ttf') format('truetype');
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: 'Droid Serif';
  src: local('DroidSerif-BoldItalic'), url('../fonts/DroidSerif-BoldItalic.ttf') format('truetype');
  font-weight: bold;
  font-style: italic;
}
@font-face {
  font-family: 'Inconsolata';
  src: local('Inconsolata'), url('../fonts/Inconsolata.otf') format('opentype');
}

/* ========= */
/* = Reset = */
/* ========= */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header, 
hgroup, menu, nav, section, menu,
time, mark, audio, video { margin:0; padding:0;	border:0;	outline:0; font-size:100%; vertical-align: baseline; background: transparent; }
article, aside, dialog, figure, footer, header, 
hgroup, nav, section { display:block; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after { content:''; content:none; }
table {	border-collapse:collapse;	border-spacing:0; }
hr { display:block; height:1px; border:0; margin:1em 0; padding:0; }
input, select {	vertical-align: middle; }
.clrfix:after,
.group:after { content:"."; display:block; height:0; width:0; line-height:0; font-size:0px; clear:both; visibility:hidden; }

body { font-size: 16px; line-height: 1.3; font-family: 'Helvetica Neue',Helvetica, Arial, sans-serif; margin: 12px; background: #fafafa; color: #333; }
/****************************/
/** Font Sizes from 16px
    
    10px        63%
    11px        69%
    12px        75%
    13px        81%
    14px        88%
    15px        94%
    16px        100%
    17px        106%
    18px        113%
    19px        119%
    20px        125%
    21px        131%
    22px        138%
    23px        144%
    24px        150%
                           **/
/****************************/

q:before { content: '“'; }
q:after { content: '”'; }

ins {	text-decoration: none; }
del {	text-decoration: line-through; }
strong,kbd,b {font-weight: bold;}
em,dfn,var,cite,i {font-style: italic;}
mark { font-style:italic;	font-weight:bold; }
code,samp,kbd,var {font-family: 'Inconsolata',monospace;}
abbr[title], dfn[title] {	cursor:help; border-bottom: 1px dotted; }
address { font-style:normal;}

ul.menu li, ol.menu li { float:left; list-style: none; }
ul.menu a, ol.menu a { display: block;}
ul.menu:after, ol.menu:after {content:"."; display:block; height:0; width:0; line-height:0; font-size:0px; clear:both; visibility:hidden;}

.minor, small { font-size: 69%; color: #666;}

a:link, a:visited { text-decoration: none; color: #2680cc; }
a:hover { color: #983b7e;}
a:active { color: #be2e2e;}

button.link {}
a.button, button, input[type=submit] {}

a.tag {}
a.approve {}
a.dissaprove {}

a.img, a.img img, figure img { display: block;}

sup.footnote { font-size: smaller; font-family: Georgia, Times, serif; vertical-align: super;}

span.normal { font-style: normal;}

/* ============== */
/* = Sectioning = */
/* ============== */
#main,#header,#footer { width: 760px; margin: 0 auto; /*background: url(../images/grid.png);*/}
img.full, figure.full {width: 760px; display: block;}

#major {float: left; width: 424px; }
#minor {float: right; width: 280px; padding-top: 21px;}

#major h1 { font-family: 'Droid Serif', Georgia, Times, serif; font-style: italic; font-size: 200%; border-bottom: 1px solid #ebebeb; padding: 0 4px; margin-bottom: 21px; }

#minor .sub-section { padding-bottom: 21px; border-bottom: 1px dotted #ddd; margin-bottom: 21px; }
#minor .sub-section ol, #minor .sub-section ul { margin-left: 23px;}

#header { margin-bottom: 36px;}
#header h1 { font-weight: bold; text-transform: uppercase; float: left; }
#header h1 a { color: #333; }
#header h1 a:hover { color: #000;}

#navigation { float: right;  }
#navigation a { font-weight: bold; font-size: 81%; line-height: 1.46; color: #6ad; }
#navigation a:hover { border-bottom: 1px dotted #aaa;}
#navigation a.active { border-bottom: 2px solid #000; color: #aaa;}
#navigation li { margin-left: 14px;}
#navigation li:first-child { margin-left: 0px;}

#content { padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid #ddd; }

#secondary h1, #minor h1 { text-transform: uppercase; margin-bottom: 12px; border-bottom: 1px solid #ddd; line-height: 23px; padding: 0 2px;}
#secondary .sub-section { margin-bottom: 21px; float: left; width: 184px; margin-right: 56px; }
#secondary .last-section {margin-right: 0; width: auto;}
#secondary .sub-section ol, #secondary .sub-section ul { margin-left: 23px;} 

.other-posts ol { font-size: 81%; font-weight: bold;}
.other-posts li { margin: 8px 0;}
.other-posts .pubdate { display: block; font-weight: normal; font-family: Georgia, Times, serif; font-style: italic; color: #6d6d6d;}

#secondary #elsewhere ul { margin-left: 0px; list-style: none;}
#elsewhere li { margin-bottom: 4px;}
#elsewhere a { background: no-repeat 0px top; padding-left: 22px; display: block; height: 21px; font-size: 81%; font-weight: bold; background-image: url(../images/website-16x16.png);}
#elsewhere .twitter a { background-image: url(../images/twitter-16x16.png);}
#elsewhere .delicious a { background-image: url(../images/delicious-16x16.png);}
#elsewhere .linkedin a { background-image: url(../images/linkedin-16x16.png);}
#elsewhere .github a { background-image: url(../images/github.png); }
#elsewhere .stackoverflow a { background-image: url(../images/stackoverflow.png); }
#elsewhere .tumblr a { background-image: url(../images/tumblr-16x16.png);}
#elsewhere .friendfeed a {background-image: url(../images/friendfeed_16.png);}

#advertisement { width: 280px; text-align: center; font-family: 'Droid Serif', Georgia, Times, serif; font-style: italic; }

#footer { margin-top: 21px; padding-top: 14px; border-top: 1px solid #ddd;}
#footer a { color: #000; }
#footer a:hover { color: #666;}
#footer .copyright { padding: 0 4px; font-size: 69%; color: #999; float: left;}
#footer .powered { padding: 0 4px; font-size: 69%; color: #999; float: right; }

/* ======== */
/* = Post = */
/* ======== */
.post {}
.post .post-head {float: left;}
.post .with-title {margin-bottom: 21px; float: none; }
.post .post-head h1 { font-family: 'Droid Serif', Georgia, Times, serif; font-style: italic; font-size: 144%;  }
.post .post-head h1 a { color: #000; display: block; margin-left: 144px; }
.post .post-head h1 a:hover { color: #6a6a6a;}
.post-home .post-head h1 { border-bottom: 1px solid #ebebeb; font-size: 200%; }
.post-home .with-title { width: 568px; margin-left: 144px;}

.post .pubdate { 
  float: left; 
  width: 136px;
  font-size: 81%; 
  margin-right: 8px; 
  text-align: right;
  border-bottom: 1px solid #ddd;
  line-height: 23px;
}
.post .pubdate a { padding: 0 4px; color: #999; }
.post .pubdate a:hover { color: #333;}

.post .content { margin-left: 144px; width: 568px; line-height: 1.4;}
.post .content p {margin-bottom: 21px; }
.post .content a:link, .post .content a:visited { color: #2680cc; }
.post .content a:hover { border-bottom: 1px dotted #aaa; color: #983b7e;}
.post .content a:active { color: #be2e2e;}
.post .content ul, .post .content ol { margin-bottom: 21px;}
.post .content ul ul, 
.post .content ul ol, 
.post .content ol ol,
.post .content ol ul  { margin-left: 21px; margin-bottom: 0;}

.post .content dl { margin-bottom: 21px;}
.post .content dl dd { margin-left: 16px; font-size: 88%; }

.post .content h1 { font-family: 'Droid Serif', Georgia, Times, serif; font-size: 131%; margin-bottom: 21px; font-style: italic;}
.post .content h2 {font-family: 'Droid Serif', Georgia, Times, serif; font-size: 131%; font-weight: normal; font-style: italic; margin-bottom: 21px;}
.post .content h3 {text-transform: uppercase; font-weight: normal; font-size: 125%; margin-bottom: 21px; font-family: 'HelveticaNeue-UltraLight', 'Helvetica Neue', Helvetica, Arial, sans-serif; letter-spacing: 2px;}
.post .content h4 {font-weight: normal; font-size: 125%;}
.post .content h5 {font-weight: normal; text-transform: uppercase;}
.post .content h6 {}

.post .content blockquote { border-left: 2px solid #ccc; padding-left: 21px; font-family: 'Droid Serif', Georgia, Times, serif; }

.post .content code { color: #666;}
.post .content .code-block { display: block; margin-bottom: 21px; background-color: #fff; border: 1px solid #eee; overflow: auto;}
.post .content .code-block:hover { border-color: #ddd; }
.post .content .code-block pre {font-family: 'Inconsolata',monospace; padding: 4px;}
.post .content .terminal { margin-bottom: 21px; border: 1px solid #000; padding: 4px; background: #3f3f3f; overflow: auto; }
.post .content .terminal code { color: #fff; }

.post .content img.full, .post .content figure.full {margin-left: -144px; margin-bottom: 21px;}
.post .content img.slug, .post .content figure.slug { width: 568px; margin-bottom: 21px; }
.post .content img.leading { float: left; margin: 16px 16px 21px -144px; }
.post .content img.trailing { float: right; margin: 16px -48px 21px 16px; }
.post .content a.img img { border: 1px solid #ddd; background: #fff; padding: 1px;}
.post .content a.img:hover { border: none;}
.post .content a.img:hover img { border-color: #aaa;}
.post .content a.img img.full { width: 756px;}
.post .content a.img img.slug { width: 564px ;}

.post .content .footnotes { border-top: 1px dotted #ccc; padding-top: 13px; font-size: 81%; color: #666; font-family: 'Droid Serif', Georgia, Times, serif;}

.post .post-footer { border-top: 1px solid #ebebeb; padding: 8px 4px 16px;}
.post .meta { font-size: 75%; color: #8f8f8f; }

/* ARCHIVE */
.archive-by-year { padding-bottom: 21px; border-bottom: 1px dotted #ddd; margin-bottom: 21px;}
.archive-by-year h2 { font-weight: normal; font-size: 131%; margin-bottom: 8px; color: #000; font-family: 'HelveticaNeue-UltraLight', 'Helvetica Neue', Helvetica, Arial, sans-serif; letter-spacing: 1px;}
.archive-by-year ol {margin-left: 23px;}
.archive-by-year li { padding: 2px 0; clear: both; font-size: 88%;}
.archive-by-year li .pubdate { padding: 0 8px; font-family: Georgia, Times, serif; font-style: italic; color: #999; }


/* ================================== */
/* = Code Syntax Highlighting       = */
/* = http://github.com/mojombo/tpw/ = */
/* ================================== */
.code-block .c { color: #999988; font-style: italic } /* Comment */
.code-block .err { color: #a61717; background-color: #e3d2d2 } /* Error */
.code-block .k { font-weight: bold } /* Keyword */
.code-block .o { font-weight: bold } /* Operator */
.code-block .cm { color: #999988; font-style: italic } /* Comment.Multiline */
.code-block .cp { color: #999999; font-weight: bold } /* Comment.Preproc */
.code-block .c1 { color: #999988; font-style: italic } /* Comment.Single */
.code-block .cs { color: #999999; font-weight: bold; font-style: italic } /* Comment.Special */
.code-block .gd { color: #000000; background-color: #ffdddd } /* Generic.Deleted */
.code-block .gd .x { color: #000000; background-color: #ffaaaa } /* Generic.Deleted.Specific */
.code-block .ge { font-style: italic } /* Generic.Emph */
.code-block .gr { color: #aa0000 } /* Generic.Error */
.code-block .gh { color: #999999 } /* Generic.Heading */
.code-block .gi { color: #000000; background-color: #ddffdd } /* Generic.Inserted */
.code-block .gi .x { color: #000000; background-color: #aaffaa } /* Generic.Inserted.Specific */
.code-block .go { color: #888888 } /* Generic.Output */
.code-block .gp { color: #555555 } /* Generic.Prompt */
.code-block .gs { font-weight: bold } /* Generic.Strong */
.code-block .gu { color: #aaaaaa } /* Generic.Subheading */
.code-block .gt { color: #aa0000 } /* Generic.Traceback */
.code-block .kc { font-weight: bold } /* Keyword.Constant */
.code-block .kd { font-weight: bold } /* Keyword.Declaration */
.code-block .kp { font-weight: bold } /* Keyword.Pseudo */
.code-block .kr { font-weight: bold } /* Keyword.Reserved */
.code-block .kt { color: #445588; font-weight: bold } /* Keyword.Type */
.code-block .m { color: #009999 } /* Literal.Number */
.code-block .s { color: #d14 } /* Literal.String */
.code-block .na { color: #008080 } /* Name.Attribute */
.code-block .nb { color: #0086B3 } /* Name.Builtin */
.code-block .nc { color: #445588; font-weight: bold } /* Name.Class */
.code-block .no { color: #008080 } /* Name.Constant */
.code-block .ni { color: #800080 } /* Name.Entity */
.code-block .ne { color: #990000; font-weight: bold } /* Name.Exception */
.code-block .nf { color: #990000; font-weight: bold } /* Name.Function */
.code-block .nn { color: #555555 } /* Name.Namespace */
.code-block .nt { color: #000080 } /* Name.Tag */
.code-block .nv { color: #008080 } /* Name.Variable */
.code-block .ow { font-weight: bold } /* Operator.Word */
.code-block .w { color: #bbbbbb } /* Text.Whitespace */
.code-block .mf { color: #009999 } /* Literal.Number.Float */
.code-block .mh { color: #009999 } /* Literal.Number.Hex */
.code-block .mi { color: #009999 } /* Literal.Number.Integer */
.code-block .mo { color: #009999 } /* Literal.Number.Oct */
.code-block .sb { color: #d14 } /* Literal.String.Backtick */
.code-block .sc { color: #d14 } /* Literal.String.Char */
.code-block .sd { color: #d14 } /* Literal.String.Doc */
.code-block .s2 { color: #d14 } /* Literal.String.Double */
.code-block .se { color: #d14 } /* Literal.String.Escape */
.code-block .sh { color: #d14 } /* Literal.String.Heredoc */
.code-block .si { color: #d14 } /* Literal.String.Interpol */
.code-block .sx { color: #d14 } /* Literal.String.Other */
.code-block .sr { color: #009926 } /* Literal.String.Regex */
.code-block .s1 { color: #d14 } /* Literal.String.Single */
.code-block .ss { color: #990073 } /* Literal.String.Symbol */
.code-block .bp { color: #999999 } /* Name.Builtin.Pseudo */
.code-block .vc { color: #008080 } /* Name.Variable.Class */
.code-block .vg { color: #008080 } /* Name.Variable.Global */
.code-block .vi { color: #008080 } /* Name.Variable.Instance */
.code-block .il { color: #009999 } /* Literal.Number.Integer.Long */