/* vim: set ft=css: 
Theme Name: DNZM2K9
Theme URI: http://doenietzomoeilijk.nl/
Description: DNZM theme voor 2009
Version: 2009
Author: Max Roeleveld
Author URI: max@doenietzomoeilijk.nl
*/

/*
										GRID STUFF
*/
/* 12 cols, 70px wide, 10px gutter */
.span1, .span2, .span3, .span35, .span4, .span6, .span7, .span8, .span9, .span10, .span12,
	article header time, article header h1, article aside, .articlebody, #recent_comments header, #elsewhere header { float: left; margin-right: 10px; padding: 0 }
.span1 { width: 70px; }
.span2, article header time, article aside, #recent_comments header, #elsewhere header { width: 150px; }
.span3 { width: 230px; }
.span35 { width: 270px; }
.span4 { width: 310px; }
.span6, article header h1, .articlebody, #recent_comments ul { width: 470px; }
.span7 { width: 550px; }
.span8 { width: 630px; }
.span9 { width: 710px; }
.span10 { width: 790px; }
.span12, #container, #topbar, #header, #footer { width: 950px; }
/* #container { background: white url(images/gridbg.png) top left repeat-y } 12x70+10 grid */
/* #container { background: white url(images/gridbg.png) top left repeat-y } */
.pull2 { margin-left: -150px; float: left; text-align: right; width:130px;}
a[rel=licence] { display:block; text-align: right; }

.last, article header h1, .articlebody {  margin-right: 0; clear: right; }
.row { display: block; clear: both; }
.col { display: block; }
.articlebody p, .articlebody ul, .articlebody ol, .articlebody pre, .articlebody blockquote, article header time span, article aside p, #comments p, #comments .span2 h3, #respondrow .span2 h3, #comments .pings, #recent_comments ul, #recent_comments ul li, #recent_comments h1, #elsewhere h3, #elsewhere h1, #elsewhere p { margin-left: 5px; margin-right: 5px; }
.articlebody blockquote p { margin-left: 0; }

/*
										FONT STUFF
*/

@font-face { font-family: "GrauBlau Web"; src: url("fonts/GraublauWeb.eot"); }
@font-face { font-family: "GrauBlau Web"; src: url("fonts/GraublauWeb.otf"); }

/*
@font-face {
	font-family: "GrauBlau Web";
	src: url("GraublauWeb.otf");
}
*/

html, body, input, textarea, em strong, strong em, #search h4 { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif; color: #222; }
body { background: #eee url(http://media.doenietzomoeilijk.nl/_ui/corkd512.jpg) fixed; }
blockquote, p em, #latesttweet .tweet { font-style: italic; font-family: 'Palatino', 'Georgia', serif; font-size: 107%; }
blockquote em, blockquote p em { font-style: normal; /*font-size: 91%;*/ }
h1, h2, h3, h4, #intro, article header time { font-family:  'GrauBlau Web','Helvetica', 'Arial', sans-serif; font-weight: normal; word-spacing: -1pt; }
pre, code { font-family: 'Consolas', 'Monaco', 'Lucida Console', monospace; font-size: 90%;}

/*
										ELEMENTS STUFF
*/
/* Set default display for some HTML5 elements */
section, header, footer, sidebar, article { display: block; }

html, body { margin:0; padding: 0; font-size: 10pt; line-height: 15pt; text-align: center; /* text-shadow: rgba(255, 255, 255, 0.5) 1px 1px 2px; */ }
a { color: #039; background-color: transparent; background-color: rgba(255, 255, 255, 0); }
a:visited { color: #36c; }
a img { border: none; }
h1, h2, h3, h4, p, blockquote, code, pre, #intro, article { margin: 15pt 0; }
h1, h2, h3, h4 { color: #36c; text-transform: none; text-align: left; }
h1 a, h2 a, h3 a, h4 a { color: #36c; text-decoration: none; background-color: transparent; background-color: rgba(255, 255, 255, 0); }
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover { color: black; background-color: #df0;
background-color: rgba(221, 255, 0, 0.5); }
h2, .postdate, header time, .posttitle, article header h1 { font-size: 20pt; line-height: 30pt; }
h3, .archivepost h2, .archivepost .postdate, .archivepost .posttitle, #recent_comments h1, #elsewhere h1, #intro { font-size: 16pt; line-height: 30pt; margin-bottom: 15pt; }
blockquote { padding-left: 20px; background: transparent url(images/quotes.png) 0px 3px no-repeat; }
cite { display: block; text-align: right; }
ul  { list-style-image: url(images/nixel.gif); padding-left: 0px; }
#container ul li { background: transparent url(images/arrow.png) 0 3px no-repeat; padding: 0 5px 0 20px; }
#container ul li p /*, ol li p*/ { margin-left: 0px; }
blockquote ul li { margin-left: -5px; padding-left: 20px; }
pre { border-left: 2px solid #eee; padding-left: 20px; }
small, .small { font-size: 8.5pt; line-height: 10pt; }
hr { height: 1px; border: none; background: #eee; margin: 0; }
button, input, textarea, #searchform, a.button { font-size: 9pt; border: 1px inset #999; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; }
button, input, a.button { height: 20px; }
abbr, acronym { border-bottom: 1px dashed #999; font-size: 9pt; cursor: help; }
button, input, textarea { background: rgba(255, 255, 255, 0.5); }

header hr { display: none; }
hr.clearfix { visibility: hidden; }

#header, #footer, #wp-admin-bar { text-shadow: rgba(0, 0, 0, 0.5) -1px -1px 1px; }

#search h4, #latesttweet h4 { text-align: center; text-transform: uppercase; margin: 0; color: #999; font-size: 10pt; text-shadow: rgba(255, 255, 255, 0.5) 1px 1px 1px; }
#search, #tipjar { text-align: center; line-height: 15pt; }
#searchform { border-style: none; width: 250px; margin-left: auto; margin-right: auto; height: 20px; }
button, #searchform #s_submit, input#submit, a.button {  background: #f30 url(images/orangebar3.png) 50% 50% repeat-x; color: white; border: 1px outset #f60; font-weight: bold; text-shadow: rgba(255, 0, 0, 0.5) 1px 1px 1px; }
#searchform #s { width: 195px; font-weight: bold; font-size: 10pt; float: left; padding: none; }
#s:focus { /* outline: none;*/ background: #ffe; }
#searchform #s_submit { width: 50px; float: right; }
#subscribe { border: none; margin: 0; }

#tipjar { width: 250px; margin: 3em auto; margin-bottom: 0; text-shadow: rgba(255,255,255,0.5) 1px 1px 1px; font-size: 14pt; text-align: left; }
#tipjar h4, #tipjar p { margin: 0; }
#tipjar p { font-size: 10pt; }
#tipjar img { float: left; margin-right: 10pt; width: 45px; height: 72px; }
#tipjar small { color: #999; }

#container { position: relative; margin: 0 auto; text-align: left; }
#header { position: fixed; height: 20px; }
.logged-in #header { position: absolute; }
/* article header time, article header h1 { margin: 15pt 0; } */

/*
										HEADER / SIDEBAR STUFF
*/

#sidebar { display: block; position: absolute; right: 0px; margin: 0; padding: 0; /* margin-top: -20px; */ text-align: center; width: 320px; }
#topbar, #footer, #subfooter { height: 20px; background: transparent url(images/graybar75.png) top left repeat-x; color: white; text-transform: uppercase; font-size: 9pt; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
#topbar { -moz-border-radius-topleft: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 0; -webkit-border-top-right-radius: 0; position: absolute;}
#footer, #subfooter { -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-bottomright: 0; -webkit-border-bottom-right-radius: 0; }

#topbar a { color: white; font-weight: bold; text-decoration: none; }
#topbar .span2, #footer .span2 { text-align: right; }
#topbar .col p, #footer .col p, #subfooter p, #subfooter h1 { margin: 0 5px; }
.homelink span { display: none; }
.homelink:hover span { display: inline; }

#subfooter { height: auto; margin: 2em 0 0 0; padding-bottom: 25px; background: #eee url(images/papertexture4.jpg) 0 0 no-repeat; color: #444; text-transform: none; border-top: 1px solid #ddd; }
#subfooter a { color: #444; }
#subfooter p, #subfooter ul { margin-top: 1em; margin-bottom: 1em; }
#subfooter small, #subfooter .small { line-height: 15pt; }
#subfooter .postdate { margin: 0; font-size: 10pt; line-height: 15pt; font-weight: bold; }
#subfooter .postdate p { margin: 1em 0; }
#subfooter h3 { margin-top: 0.5em; margin-bottom: 0; color: #444; }
.ontheweb a { font-weight: bold; text-decoration: none; }
.ontheweb a img { vertical-align: bottom; margin-right: 3px; position: relative; top: -3px; }
.ontheweb ul li { background: none; padding-left: 5px; }
.widget { margin: 0 5px; }
.widget h3 { margin-bottom: 0 }
.widget ul { margin: 0 }

#footer { margin: 20px 0 0 0; background: transparent url(images/graybar75.png) 0 0 repeat-x; clear: both; }
#footer a, #footer a.homelink:hover { color: white; font-weight: bold; text-decoration: none;}
#footer a:hover { color: #333 }
#footer select { font-size: 90% }

#topmenu { width: 300px; height: 400px; position: relative; margin: -65px 12px 0 12px; background: transparent url(images/notepad.png) top left no-repeat; }
#topmenu h1 { background: transparent url(images/dnzm-logotype2.png) 00% 100% no-repeat; margin: 0; z-index: 100; position: absolute; top: 48px; left: 15px; }
#topmenu h1 a { width: 250px; height: 111px; display: block; }
#topmenu h1 a span { display: none; }
#topmenu h1 a:hover { background: none; }
#home-tab, #archief-tab, #wordpress-tab, #lifestream-tab, #over-tab, #rss-tab { position: absolute; background-position: top left; background-repeat: no-repeat; }
#home-tab span, #archief-tab span, #wordpress-tab span, #lifestream-tab span, #over-tab span, #rss-tab span { display: none; }
/* #home-tab:hover, #archief-tab:hover, #wordpress-tab:hover, #lifestream-tab:hover, #over-tab:hover, #rss-tab:hover, */
#home-body #home-tab, #archief-body #archief-tab, #wordpress-body #wordpress-tab, #lifestream-body #lifestream-tab, #over-body #over-tab { background-position: bottom left; }
#home-tab       { top: 160px; left:  50px; width:  92px; height: 38px; background-image: url(images/menu-weblog.png); }
#archief-tab    { top: 167px; left: 157px; width:  97px; height: 40px; background-image: url(images/menu-archief.png); }
#lifestream-tab { top: 218px; left:  30px; width: 136px; height: 42px; background-image: url(images/menu-lifestream.png); }
#over-tab       { top: 234px; left: 193px; width:  80px; height: 30px; background-image: url(images/menu-over.png); }
#wordpress-tab  { top: 261px; left:  43px; width: 142px; height: 38px; background-image: url(images/menu-wordpress.png); }
#rss-tab        { top: 300px; left: 120px; width: 116px; height: 34px; background-image: url(images/menu-rss.png); }

/*
										CONTENT STUFF
*/

  
#intro { color: #999; }
#intro p { margin: 30px 5px; }
#intro p span, #intro a { color: #666; }

#content { margin-top: 15pt; margin-bottom: 15pt; text-align: left; float: left; min-height: 500px;}
article { margin-bottom: 30pt; }
.postdate, .postmeta, article footer, article header time, article aside, #recent_comments header h1, #elsewhere header h1 { text-align: right !important }
.postdate, .postdate a, article header time, #recent_comments header h1, #elsewhere header h1 { color: #f96; }
article aside, footer, .wp-caption-text { text-transform: uppercase; padding-top: 1px; }
article aside, article aside a, article aside a:visited, footer, .wp-caption-text { color: #999; font-size: 9pt; line-height: 15pt; }
article aside p { margin-top: 15pt; margin-bottom: 15pt; }
.postdate, .posttitle, article header h1, article header time { margin-bottom: 0; }
.posttitle, article header h1 a { display: block; margin-left: 5px; margin-right: 5px; }
body.archive article header h1, body.archive article header time { font-size: 16pt; }
.archivepost h2+p { margin: 0 5px 1em 5px }

.articlebody a { color: #36c; padding-left: 1px; padding-right: 1px; }
.articlebody a:hover, #recent_comments a:hover, #elsewhere a:hover { color: black; background: #df0;
background-color: rgba(221, 255, 0, 0.5); }
.articlebody a[rel=lightbox] { background: none; padding: 0; }
a.button { font-size: 9pt; border: 1px inset #999; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; height: 20px; background: #f30 url(images/orangebar3.png) 50% 50% repeat-x; color: white; border: 1px outset #f60; font-weight: bold; text-decoration: none; }
#moreposts a { padding: 4px; font-size: 11pt; font-weight: bold; background-position: top left; } 
.postmetainfo, .postmetainfo a { color: #666; }
.articlebody h2, .articlebody h3 { margin-left: 5px; margin-right: 5px; }
/* .articlebody p, #comments p, #intro p { text-align: justify; } */
.articlebody footer { padding-right: 5px; }
article header h1 { margin-left: 0; margin-right: 0; }
article header h1 a { padding-left: 5px; padding-right: 5px; margin-left: 0; margin-right: 0; }

#recent_comments ul { padding: 8pt 0 0 0; }
#recent_comments ul li { padding: 0px; background: none; }
.current_page_item>a { font-weight: bold; }
.tags { line-height: 25pt; }
.tags a { text-decoration: none; height: 25pt; vertical-align: middle; padding: 0 0.1em; background:transparent; background: rgba(221,255,0,0); }
.tags a:hover { background: rgba(221,255,0,0.5); colour: black; }

/*
#latesttweet { width: 250px; margin: 2em auto; text-align: center; }
#latesttweet p { background: #eee; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-top: 1px solid #ddd; border-bottom: 1px solid #ccc; }
#latesttweet p { margin-top: 0; }
#latesttweet, #latesttweet a, #latesttweet .postdate { color: #444; }
#latesttweet img { vertical-align: bottom; }
*/

/*
										COMMENT STUFF
*/

.pings li { background: none; } 
.pings .favatar { margin-left: -20px; }

.comment { border-top: 1px solid #eee; padding-top: 15pt; overflow: hidden; }
.comment .comment { margin-left: 20px; }
textarea#comment { width: 100%; }
#commentform p { float: left; margin-left: 5px; margin-right: 5px; }
#commentform p.last { margin-right: 0; width: 140px; }
#commentform label { display: block; }
#commentform label span { font-weight: bold; display: block; } 
#commentform label span small { font-weight: normal; }
.authorcomment .postmeta { background: #eee; }
.authorname { font-weight: bold; }
.comment-author, .cancel-comment-reply { padding: 0 0 0 5px; clear: both; }
.comment-author img.avatar { float: left; margin-right: 10px; padding: 2px; border: 1px solid #ccc; }
.comment-author .fn { text-align: left; display: inline; font-style: normal; font-weight: bold; line-height: 10pt; }
.comment-author span { display: none }
.comment-author cite span { display: inline; }
.bypostauthor .comment-author a, .bypostauthor .comment-author a:hover { color: #f60; }
.comment-meta { margin-left: 5px; margin-top: 0.3em }
.comment-meta a, .reply a { color: #666; text-decoration: none; }
p+.reply { margin-top: -1em; }
.comment-meta+p { margin-top: 15pt; }
.comment #respond { margin-left: 20px; }
.reply { margin-left: 5px; }
#commentform p.formsubmit { float: right; }


#recent_comments ul, #elsewhere article { margin-left: 160px; }

.favatar { top: 2px; position: relative; width: 16px; height: 16px; }
img#wpstats{width:0px;height:0px;padding:0px;border:none;overflow:hidden}

.subscription-manager fieldset { margin: 0; padding: 1em 0; border: none; }
.subscription-manager legend { display: block; margin: 0.7em 0; padding: 0 5px; font-weight: bold; }

#bydate .col p { margin-bottom: 0; }

/* In series stuff */
.inseriesmeta { font-size: 8.5pt; }

.aligncenter { text-align: center; margin-left: auto; margin-right: auto; } 
.alignright { margin-left: 12px; float: right; }
.alignleft, .runin-left { margin-right: 12px; float: left; }
.runin-left { margin-left: -168px };

.tar { text-align: right; }
.flushtop { margin-top: 0; }
.size-thumbnail { border: 1px solid #ccc; }
.breaker { margin: 0; padding: 0; height: 1px; line-height: 1px; }
.spaced, .comment+.comment, .comment+#respond, .reply+.comment { margin-top: 15pt; margin-bottom: 15pt; }
article>.spaced .postdate, article header time, article>.spaced .posttitle, article header h1, #comments, #recent_comments h1, #elsewhere h1 { margin-top: 0; }

.transparent_class {
	opacity: 0.5; /* the standards compliant attribute that all browsers should recognize, but... */
	filter:alpha(opacity=50); /* for IE */
	-khtml-opacity: 0.5; /* for old Safari (1.x) */
	-moz-opacity:0.5; /* for old skool Netscape Navigator */
}
::-moz-selection {background: black; color: white;}  
::selection {background: black; color: white;}  




/* WP Typography stuff */
sup { vertical-align: 60%; font-size: 75%; line-height: 100%; }
sub { vertical-align: -10%; font-size: 75%; line-height: 100%; }
.amp { font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", "Warnock Pro", "Goudy Old Style", serif; font-weight: normal; font-style: italic; font-size: 1.1em; line-height: 1em; }
.caps { font-size: 85%; }
.dquo { margin-left:-.40em; }
.quo { margin-left:-.2em; }
.numbers { /* lowercase numbers for body text */ font-family: Georgia, serif; }
  
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
/* hackish fix for header-like things that shouldn't appear too low, mostly left column stuff */
.tightleading { line-height: 15pt !important; }
#themeswitcher { display: none; }
/* Edit comment stuff */
.edit-comment-admin-links, .edit-comment-user-link { float: right; }
.lifestream td.lifestream_text { max-width: 430px; overflow: auto; }
.flickrthumb { width: 220px; height: 80px; margin: 0 0 10px 0; display: block; float: left; outline 1px solid black }
.flickrthumb img { width: 75px; height: 75px; display: block; float: left; margin: 5px; }
#lasttweet, #lastflickr, #lastrss, #lastscuttle { margin-bottom: 0px; }
.tweet, #flickrstream { margin-top: 0; }
#flickrstream .odd { margin-right: 10px; }
#flickrstream .even { margin-left: 10px; }
#ttrssstream ul, #scuttlestream ul { margin: 0 5px }
.linkedImage, .size-medium { width: 100%; outline: 1px solid #ddd; }
/* img.size-full { width: 100%; max-width: 492px; height: auto; } */
nav.postcontent, .prevnext { margin-left: 165px; margin-bottom: 2em; }
p.wp-caption-text { margin: 0; }
a:hover, a {
	-webkit-transition-property: background, color;
	-webkit-transition-duration: 0.7s, 0.7s;
}
.nonfloat { float: none; }
.linkdumplink { font-weight: bold; }

/* http://orderedlist.com/our-writing/resources/html-css/thinning-text-in-webkit-safari/ */
/*
body { -webkit-text-stroke:1px transparent; }
@media only screen and (max-device-width:480px) {body{-webkit-text-stroke:0 black;}}
*/

