/*
Theme Name: Markup is Beautiful
Theme URI: http://darowski.com/
Description: Finally, a Darowski.com redesign
Version: 1.1
Author: Adam Darowski
Author URI: http://darowski.com/
Tags: gray, variable width, two column, markup
*/


body { background-color: #FFF; font-size: large; font-family: 'OFLSortsMillGoudyRegular', "Goudy Old Style", Palatino, "Adobe Garamond Pro", Garamond, Baskerville, Georgia, serif; margin: 0; }
html {-webkit-text-size-adjust: none}
a:link, a:visited, a:active { color: #CB0000; }
a:hover { color: #D94040; }
img { border: 0; }
blockquote { color: #666; font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; font-size: 80%; margin: 0; padding: 15px 30px; background-color: #FFC; line-height: 2.0; }
code { font-family: Inconsolata-dz, Inconsolata; color: #666; }
ul { padding-left: 15px; list-style-type: square; }
ol { padding-left: 20px; }
em { font-family: 'OFLSortsMillGoudyItalic'; font-style: normal; }
*:before, *:after { color: #CECECE; font-family: 'OFLSortsMillGoudyItalic'; }

h1 { font-size: 300%; font-weight: normal; font-family: 'OFLSortsMillGoudyItalic'; margin: 0 20px 20px 40px; text-indent: -55px; }
h1 a:link, h1 a:hover, h1 a:active, h1 a:visited { color: #333; text-decoration: none; }
h1:before { content: '<h1>'; font-size: 50%; }
h1:after { content: '</h1>'; font-size: 50%; }

h2 { font-size: 200%; }
h3 { font-size: 150%; }
h4 { font-size: 120%; }
h5, h6 { font-size: 100%; }
h1, h2, h3, h4, h5, h6 { color: #333; line-height: 1.2; }

a.button { border: 3px solid #CCC; padding: 5px 30px; color: #333; text-decoration: none; font-size: 90%; font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;  background-color: #EAEAEA; display: inline-block; margin: 10px 0;
	border-radius: 25px; -moz-border-radius: 25px; -webkit-border-radius: 25px; 
}
a.button:hover { background-color: #CCC; }
a.button:active { background-color: #333; color: #CCC; border-color: #333; }

div#sidebar h2:before { content: '<h2>'; font-size: 80%; }
div#sidebar h2:after { content: '</h2>'; font-size: 80%; }
div#sidebar h2 { font-weight: normal; margin: 20px 0; font-size: 125%; }

div#sidebar h3:before { content: '<h3>'; font-size: 80%; }
div#sidebar h3:after { content: '</h3>'; font-size: 80%; }
div#sidebar h3 { font-weight: normal; margin: 20px 0; font-size: 110%; }

dl#recent-projects:before { content: '<dl id="recent-projects">';  }
dl#recent-projects:after { content: '</dl> <!-- close #recent-projects -->';  }

dl#recent-projects dt:before { content: '<dt>'; font-size: 80%; }
dl#recent-projects dt:after { content: '</dt>'; font-size: 80%; }
dl#recent-projects dt { margin: 10px 0 10px 24px; font-size: 140%; }

dl#recent-projects dd:before { content: '<dd>';  }
dl#recent-projects dd:after { content: '</dd>';  }
dl#recent-projects dd { text-indent: -38px; margin-bottom: 4px; padding-left: 56px; color: #333; }

p.beauty { float: left; color: #FFF; margin: 10px 0 0 40px; font-family: 'OFLSortsMillGoudyItalic'; }
p.beauty a { color: #FFF; text-decoration: none; }
div#copyright { clear: both; background: #000; color: #CECECE; padding: 5px 40px; margin-top: 80px; font-family: 'OFLSortsMillGoudyItalic'; }

div#sidebar { float: left; width: 270px; margin: 10px 0 40px -300px; }
div#sidebar p { line-height: 1.4; margin: 5px 0 5px 20px; }
div#sidebar img.portrait { border: 5px solid #000; padding: 1px; }
div#bio:before { content: '<p class="vcard">'; }
div#bio:after { content: '</p> <!-- close .vcard -->'; }
div#bio { font-size: 90%; }

span.title:before { content: '<span class="title">'; }
span.title:after { content: '</span>'; }
a.fn { text-decoration: none; }
a.fn:before { content: '<a class="fn url">'; }
a.fn:after { content: '</a>'; }
a.org { text-decoration: none; }
a.org:before { content: '<a class="org url">'; }
a.org:after { content: '</a>'; }

div#content { padding: 30px 40px 30px 0; margin-left: 340px; }

img.sample-small { border: 5px solid #999; padding: 1px; }

div.post, div.project { line-height: 1.6; padding-bottom: 10px; }
ul.post-metadata, ul.project-metadata { list-style: none; padding: 10px 40px; margin-left: 0; color: #666; font-size: 90%; border-top: 5px solid #CCC; border-bottom: 5px solid #CCC; background-color: #EAEAEA; }
li.post-comments, li.project-date { float: right; font-size: 150%; margin: 0 0 0 30px; font-family: 'OFLSortsMillGoudyItalic'; }
span.click-fullsize { font-size: 80%; }

p.older { float: left; }
p.newer { float: right; margin-right: 50px; }

p.image-float { float: right; margin: 5px 0 25px 25px; }
p.image-float img, img.framed { padding: 1px; border: 5px solid #999; }

ul#links {
  list-style: none;
  padding: 0;
  font-size: 80%;
  margin: 20px 0;
}

ul#links li {
  padding: 4px 0 4px 28px;
}

li.feed { background: url(images/services/feedburner.png) no-repeat 4px 50%; }
li.batchblog { background: url(images/services/batchblue.png) no-repeat 4px 50%; }
li.facebook { background: url(images/services/facebook.png) no-repeat 4px 50%; }
li.dribbble { background: url(images/services/dribbble.png) no-repeat 4px 50%; }
li.lastfm { background: url(images/services/lastfm.png) no-repeat 4px 50%; }
li.patientslikeme { background: url(images/services/patientslikeme.png) no-repeat 4px 50%; }
li.linkedin { background: url(images/services/linkedin.png) no-repeat 4px 50%; }
li.twitter { background: url(images/services/twitter.png) no-repeat 4px 50%; }
li.dandyid { background: url(images/services/dandyid.png) no-repeat 4px 50%; }
li.favstar { background: url(images/services/favstar.png) no-repeat 4px 50%; }
li.btb { background: url(images/services/btb.png) no-repeat 4px 50%; }

div#navigation { background-color: #000; overflow: auto; }
div#navigation ul { padding: 10px 0 0 330px; margin: 0; list-style: none; }
div#navigation ul li { float: left; }
div#navigation ul li a { display: block; padding: 4px 10px; margin: 0 2px; text-decoration: none; outline: none;
	border-radius: 4px 4px 0 0;
	-moz-border-radius: 4px 4px 0 0;
	-webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; 
}

body#home li#nav-home a,
body.blog li#nav-blog a,
body.single li#nav-blog a,
body.page-id-45 li#nav-portfolio a,
body.parent-pageid-45 li#nav-portfolio a,
body.page-id-2 li#nav-about a
{ 
	background-color: #FFF; 
}

div#navigation form#searchform { float: right; margin: 10px 40px 0 10px; }

/*
------------------------------------------------------------------
COMMENTS
------------------------------------------------------------------
*/

ol.commentlist { padding: 0; }

ol.commentlist li {
  border: 1px dotted #999;
  padding: 10px;
  margin-bottom: 10px;
}

ol.commentlist li.comment-me {
  background-color: #ffc;
}

p.awaitingmoderation { color: red; }

form#commentform input[type="text"] { width: 50%; }
form#commentform textarea { width: 100%; }

code.block { display: block; font-size: 13px; padding: 15px 30px; background-color: #FFC; line-height: 1.8; }
ul.post-list li { margin-bottom: 8px; }

div#post-731 ol li { margin: 40px 0; }
div#post-731 ol ul li { margin: 0; }
div#post-731 ol li.atreplies ul { list-style: none; margin: 20px 0; }

div#blogroll { clear: left; padding-top: 60px; }
div#blogroll h3 { font-size: 250%; line-height: 1.2; font-weight: normal; font-style: italic; margin: 0 20px 0 40px; text-indent: -55px; }
div#blogroll h3 a:link, div#blogroll h3 a:hover, div#blogroll h3 a:active, div#blogroll h3 a:visited { color: #333; text-decoration: none; }
div#blogroll h3:before { content: '<h3>'; font-size: 50%; }
div#blogroll h3:after { content: '</h3>'; font-size: 50%; }
div#blogroll ul { list-style: none; padding: 0; }
div#blogroll ul li a { padding: 0 0 0 22px; background-repeat: no-repeat; background-position: left 50%; text-decoration: none; }
div#blogroll li a:after { content: '</a>'; }
div#blogroll li a:hover { border-bottom: 1px dotted #CCC; }


li.amos a { background-image: url(images/homies/amos.png); }
li.amos a:before { content: '<a href="http://marcamos.com/" rel="met friend colleague">'; } 
li.brigham a { background-image: url(images/homies/brigham.png); }
li.brigham a:before { content: '<a href="http://www.katebrigham.com/" rel="met friend colleague">'; }
li.camara a { background-image: url(images/homies/camara.png); }
li.camara a:before { content: '<a href="http://www.jakecamara.com/" rel="friend colleague">'; }
li.cederholm a { background-image: url(images/homies/cederholm.png); }
li.cederholm a:before { content: '<a href="http://www.simplebits.com/" rel="met friend colleague">'; }
li.chapman a { background-image: url(images/homies/chapman.png); }
li.chapman a:before { content: '<a href="http://www.dannychapman.com/" rel="met friend colleague">'; }
li.ganz a { background-image: url(images/homies/ganz.png); }
li.ganz a:before { content: '<a href="http://steve.ganz.name/" rel="met friend colleague">'; }
li.harrington a { background-image: url(images/homies/harrington.png); }
li.harrington a:before { content: '<a href="http://crawlspacemedia.com/" rel="met friend colleague">'; }
li.hougland a { background-image: url(images/homies/hougland.png); }
li.hougland a:before { content: '<a href="http://www.lamikey.com/" rel="met friend colleague">'; }
li.leblanc a { background-image: url(images/homies/leblanc.png); }
li.leblanc a:before { content: '<a href="http://www.suredev.com/" rel="met friend colleague">'; }
li.luxmoore a { background-image: url(images/homies/luxmoore.png); }
li.luxmoore a:before { content: '<a href="http://www.luxmoore.com/" rel="met friend colleague">'; }
li.mccracken a { background-image: url(images/homies/mccracken.png); }
li.mccracken a:before { content: '<a href="http://www.scottmccracken.org/" rel="met friend colleague">'; }
li.menard a { background-image: url(images/homies/menard.png); }
li.menard a:before { content: '<a href="http://www.soliduncoated.com/" rel="met friend colleague">'; }
li.merrill a { background-image: url(images/homies/merrill.png); }
li.merrill a:before { content: '<a href="http://wonderwheelcreative.com/" rel="friend colleague">'; }
li.necochea a { background-image: url(images/homies/necochea.png); }
li.necochea a:before { content: '<a href="http://www.patientslikeme.com/members/view/91" rel="met friend colleague">'; }
li.oberkirch a { background-image: url(images/homies/oberkirch.png); }
li.oberkirch a:before { content: '<a href="http://www.brianoberkirch.com/" rel="met friend colleague">'; }
li.porter a { background-image: url(images/homies/porter.png); }
li.porter a:before { content: '<a href="http://bokardo.com/" rel="met friend colleague">'; }
li.shaw a { background-image: url(images/homies/shaw.png); }
li.shaw a:before { content: '<a href="http://traydiggz.com/" rel="met friend colleague">'; }
li.taylor a { background-image: url(images/homies/taylor.png); }
li.taylor a:before { content: '<a href="http://www.bigringdesign.com/" rel="met friend colleague">'; }
li.zbinski a { background-image: url(images/homies/zbinski.png); }
li.zbinski a:before { content: '<a href="http://zbinski.com/" rel="met friend colleague">'; }

li.gillooly a { background-image: url(images/homies/gillooly.png); }
li.gillooly a:before { content: '<a href="http://mattgillooly.com/" rel="met friend co-worker">'; }
li.ohara a { background-image: url(images/homies/ohara.png); }
li.ohara a:before { content: '<a href="http://sbbuzz.biz/" rel="met friend co-worker">'; }
li.ransom a { background-image: url(images/homies/ransom.png); }
li.ransom a:before { content: '<a href="http://speypages.com/" rel="met friend co-worker">'; }
li.riggen a { background-image: url(images/homies/riggen.png); }
li.riggen a:before { content: '<a href="http://card.ly/mriggen" rel="met friend co-worker">'; }
li.sondermann a { background-image: url(images/homies/sondermann.png); }
li.sondermann a:before { content: '<a href="http://www.dandyid.org/id/tsondermann" rel="met friend colleague">'; }
li.tucker a { background-image: url(images/homies/tucker.png); }
li.tucker a:before { content: '<a href="http://adamjt.net/" rel="met friend co-worker">'; }

body#home div#bio { font-size: 150%; }
body#home div#bio p { font-size: 120%; line-height: 1.5; margin: 25px; }
body#home div#bio, body#home div#recent-work { margin-bottom: 60px; }
body#home div#featured-writing { margin-bottom: 100px; }

form#publicForm dl { margin: 0; }
form#publicForm dt { display: inline-block; width: 20%; vertical-align: top; margin-bottom: 20px; }
form#publicForm dd { display: inline-block; width: 75%; margin: 0; }
form#publicForm input[type=text],
form#publicForm textarea { width: 80%; }
form#publicForm textarea { height: 100px; }
form#publicForm p.submit { margin-left: 20%; }

abbr[title=and] { font-family: 'OFLSortsMillGoudyItalic'; border-bottom: none; }

div#flood-2010 img.framed { width: 98%; height: auto; max-width: 1024px; }



body#home h1 { font-size: 450%; }
body#home h2 { font-size: 300%; line-height: 100%; font-weight: normal; font-family: 'OFLSortsMillGoudyItalic'; margin: 0 20px 0 40px; text-indent: -55px; }
body#home h2 a:link, body#home h2 a:hover, body#home h2 a:active, body#home h2 a:visited { color: #333; text-decoration: none; }
body#home h2:before { content: '<h2>'; font-size: 50%; }
body#home h2:after { content: '</h2>'; font-size: 50%; }
div#recent-work p { clear: left; padding: 20px 0 0 25px; }
div#recent-work dl { min-height: 105px; padding: 15px 0 0 180px; margin-left: 10px; position: relative; }
div#recent-work dl dt { font-size: 140%; margin-bottom: 5px; }
div#recent-work dl dd { margin: 0; line-height: 1.4; color: #777; }
div#recent-work dl dd a:link,
div#recent-work dl dd a:visited,
div#recent-work dl dd a:active { color: #000; }
div#recent-work dl dd a:hover { color: #D94040; }
div#recent-work dl dd.thumb { position: absolute; top: 0; left: 0; }
div#recent-work dl dd.thumb img { border: 5px solid #999; padding: 1px; background-color: #FFF; }

p#translation,
p.sports-blog-notice,
p.simulation-notice { background-color: #FFC; padding: 20px; color: #666; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; }


@font-face {
	font-family: 'OFLSortsMillGoudyRegular';
	src: url('fonts/OFLGoudyStM-webfont.eot');
	src: local('☺'), url('fonts/OFLGoudyStM-webfont.woff') format('woff'), url('fonts/OFLGoudyStM-webfont.ttf') format('truetype'), url('fonts/OFLGoudyStM-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'OFLSortsMillGoudyItalic';
	src: url('fonts/OFLGoudyStM-Italic-webfont.eot');
	src: local('☺'), url('fonts/OFLGoudyStM-Italic-webfont.woff') format('woff'), url('fonts/OFLGoudyStM-Italic-webfont.ttf') format('truetype'), url('fonts/OFLGoudyStM-Italic-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}



#infographics img { border: 1px solid #CCC; padding: 10px; background-color: #fff; }