/*
Theme Name: Reeder
Theme URI: http://cardeo.ca
Description: A minimal theme designed for readability
Author: Matt Lambert
Author URI: http://mattlambert.org
Version: 1.0
Tags: white, black, grey, red, minimal, simple, basic, clean, cardeo

License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html

General comments:
For support please hit me up on twitter @cardeo
Copyright: (c) 2004-2012 Cardeo Creative
*/
/***************************
CONTENTS

01. BASE
02. LAYOUT
03. MODULES
04. THEME
05. MOBILE

***************************/

/***************************
00. RESET
***************************/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
 margin:0;
 padding:0;
 border:0;
 font-weight:inherit;
 font-style:inherit;
 font-size:100%;
 font-family:inherit;
 vertical-align:baseline;
}

body { line-height:1.5; }

table {
 border-collapse:separate;
 border-spacing:0;
}

caption, th, td {
 text-align:left;
 font-weight:normal;
}

table, td, th { vertical-align:middle; }
blockquote:before, blockquote:after, q:before, q:after { content:""; }
blockquote, q { quotes:"" ""; }
a img { border:none; }

/***************************
01. BASE
***************************/

body {
 background: #fff;
 font-family: 'Helvetica Neue', helvetica, arial, verdana, sans-serif;
 font-size: 12px;
 font-style: normal;
 font-variant: normal;
 font-weight: normal;
 line-height: 18px;
 color: #333; 
}

img,
a img {
 border: 0;
}

img.size-full {
 width: 100%;
 max-width: 100%;
 height: auto;
 padding-bottom: 18px;
 background: url(images/tile.png) 0 0 repeat;
}

a, a:link, a:visited {
 color: #d94c4c;
 text-decoration: none;
}

a:hover {
 color: #252626;
}

p {
 padding-bottom: 12px;
}

strong {
 font-weight: bold;
}

blockquote {
 font-size: 14px;
 border-left: 3px solid #d94c4c;
 padding-left: 3%;
 margin-left: 5%;
 margin-top: 12px;
 margin-bottom: 12px;
 color: #999;
}

blockquote > p {
 padding: 0;
}

ul,
ol {
 padding: 0;
 margin-bottom: 12px;
 margin-left: 5%;
}

ul ul,
ul ol,
ol ol,
ol ul {
 margin-bottom: 0;
}

ul {
 list-style: disc;
}

ol {
 list-style: decimal;
}

li {
 line-height: 1.5;
}

hr {
 margin: 18px 0;
 border: 0;
 border-top: 1px solid #ccc;
}

form {
 margin: 0;
 padding: 0;
 float: left;
 padding-bottom: 12px;
}

fieldset {
}

input,
textarea {
 background: #fff;
 padding: 5px;
 margin: 0;
 line-height: 1;
 border: 1px solid #b8bebf;

 -moz-box-sizing: border-box; 
 -webkit-box-sizing: border-box; 
 box-sizing: border-box; 
 -webkit-appearance: none;
}

input[type=submit] {
 background: #d94c4c;
 padding: 8px 18px;
 color: #fff;
 margin: 12px 0px 0px 0px;
 font-size: 12px;
 font-weight: bold;
 outline: none;
 border: 0;
 cursor: pointer;

 -moz-border-radius: 3px;
 -o-border-radius: 3px;
 -ms-border-radius: 3px;
 border-radius: 3px;
 -webkit-appearance: none;
}

label {
 display: block;
 margin-bottom: 12px;
 color: #333333;
 font-weight: bold;
}

#sidebar form {
 width: 100%;
 padding-bottom: 0;
}

#sidebar input[type=text] {
 width: 100%;
}

cite {
 font-family: 'Amaranth', 'Helvetica Neue', helvetica, sans-serif;
 font-style: italic;
}

/***************************
02. LAYOUT
***************************/

#container {
 width: 60%; 
 margin: 0 auto;
}

#header {
 width: 100%;
 margin-top: 36px;
}

#logo {
 width: 50%;
 float: left;
}

#logoImg {
 float: left;
 margin-top: 3px;
}

#descrip {
 float: left;
 border-left: 1px dotted #b8bebf;
 height: 36px;
 line-height: 36px;
 margin-left: 10px;
 padding-left: 10px;
}

#nav {
 width: 50%;
 float: left;
 margin-top: 10px;
 text-align: right;
}

#content {
 background: url(images/bar.png) 0 0 repeat-x;
 padding-top: 60px;
 width: 100%;
 clear: both;
 margin-top: 36px;
 float: left;
}

#blog {
 width: 68%;
 float: left;
}

#sidebar {
 width: 26%;
 margin-left: 6%;
 float: left;
}

#tweets li a {
 display: block;
}

#categories {
}

#archives {
}

.ad {
}

#postNav {
 width: 100%;
 float: left;
}

#footer {
 background: url(images/bar.png) 0 0 repeat-x;
 padding-top: 36px;
 width: 100%;
 float: left;
 margin-top: 78px;
}

#footer div {
 width: 29.3%;
 margin-right: 4%;
 float: left;
}

#footer div:last-child {
 width: 33%;
 margin-right: 0;
}

#footer div div.left {
 width: 50%;
 margin-right: 0;
 float: left;
}

#footer div div.right {
 width: 48%;
 margin-right: 0;
 margin-left: 2%;
 float: left;
}

#subFooter {
 margin-top: 36px;
 width: 100%;
 float: left;
 color: #999;
 padding-bottom: 100px;
}

/***************************
03. MODULES
***************************/

.post {
 padding-bottom: 36px;
}

.postTitle {
 width: 100%;
}

.postMeta {
 width: 100%;
 margin-top: 24px;
 color: #999;
}

.postBody {
 font-family: 'Helvetica Neue', helvetica, sans-serif;
 background-image: url(images/red-line.png), url(images/diagonal-post.png);
 background-position: 0 0, left bottom;
 background-repeat: no-repeat, no-repeat;
 width: 100%;
 margin-top: 24px;
 font-size: 16px;
 font-weight: 400;
 line-height: 24px;
 padding-top: 24px;
 padding-bottom: 36px;
}

img.alignleft {
 margin-right: 3%;
 margin-bottom: 3%;
}

img.alignright {
 margin-left: 3%;
 margin-bottom: 3%;
}

.textWidget {
}

/***************************
04. THEME
***************************/

h1 {
display: none;
float: none;
font-size: 0;
line-height: 0;
margin: 0;
padding: 0;
text-indent: -9999px;
}

h2 {
 font-family: 'Amaranth', 'Helvetica Neue', helvetica, sans-serif;
 font-size: 36px;
 line-height: 1;
 font-weight: 700;
 color: #252626;
}

h3 {
 font-family: 'Amaranth', 'Helvetica Neue', helvetica, sans-serif;
 font-size: 14px;
 color: #b8bebf;
 font-style: italic;
 font-weight: 400;
}

#comments h3 {
 margin-bottom: 36px;
}

h4 {
 font-size: 18px;
 font-family: 'Amaranth', 'Helvetica Neue', helvetica, sans-serif;
 color: #252626;
 font-weight: 700;
 line-height: 24px;
 
}

h5 {
 font-size: 12px;
 font-weight: bold;
}

#sidebar h5,
#footer h5 {
 padding-bottom: 24px;
}

h6 {
 font-size: 12px;
 text-transform: uppercase;
 letter-spacing: 1px;
}

#sidebar p {
 padding-bottom: 24px;
}

.archiveTitle h4 {
 color: #d94c4c;
 padding-bottom: 24px;
}

/* LISTS */

#nav ul {
 list-style: none;
 margin: 0;
 padding: 0;
}

#nav li {
 display: inline;
 margin-left: 0px;
 margin-right: 12px;
}

#sidebar ul {
 list-style: none;
 margin: 0;
 padding: 0px 0px 24px 0px;
}

#footer ul {
 list-style: none;
 margin: 0;
 padding: 0px 0px 12px 0px;
}

ul.comment-list {
 margin-left: 0;
 list-style: none;
}

/* LINKS */

#postNav a {
 font-weight: bold;
}

#subFooter a {
 color: #999;
}

#subFooter a:hover {
 color: #333;
}

.post h2 a {
 color: #252626;
}

.post h2 a:hover {
 color: #d94c4c
}

/* FORMS */

.mailInput {
 width: 100%;
}


/* COMMENTS */

#comments article {
 margin-bottom: 24px;
 border-bottom: 1px solid #ccc;
 padding-bottom: 24px;
}

#comments header {
 margin-bottom: 12px;
}

#comments header img {
 display: block;
 margin-bottom: 12px; 
}

#comments cite {
 font-family: "Helvetica Neue", helvetica, arial, sans-serif;
 font-style: normal;
 font-weight: bold;
 text-transform: uppercase;
}

#comments span,
#comments time {
 font-size: 10px;
 text-transform: uppercase;
 color: #999;
 letter-spacing: 1px;
}

#comments time a {
 color: #999;
}

#comments time a:hover {
 color: #333;
}

#comments label {
 display: inline-block;
}

#comments input,
#comments textarea {
  display: block; 
}

/***************************
05. MOBILE
***************************/

@media handheld, only screen
and (max-width : 1024px) {
  #container {
      clear: both;
      float: none;
    margin-left: 8%;
      margin-right: 8%;
      width: 84%;   
  }

  img {
      max-width: 100%;
   }

  #header,
  #content,
  #blog,
  #sidebar,
  #footer,
  #logo,
    #nav,
  #postNav,
  #footer div,
  #footer div:last-child {
      width: 100%;
      clear: both;
      float:none;
  }

  #descrip {
    width: 100%;
    clear: both;
    border: 0;
    margin-left: 0;
    padding-left: 0;
    line-height: 1;
    float: none;
  }

  #nav {
      text-align: left;
  }

  #sidebar {
    background: url(images/bar.png) 0 0 repeat-x;
    margin-left: 0;
    padding-top: 48px;
  }

  #postNav {
    margin-top: 0px;
    padding-bottom: 36px;
  }

  #footer {
    margin-top: 36px;
    padding-top: 24px;
  }

  #footer div {
    border-bottom: 1px dotted #b8bebf;
    margin-top: 24px;
    padding-bottom: 12px;
    float: left;
  }

  #footer div div.left {
    border: 0;
    padding: 0;
    margin: 0;
  }

  #footer div div.left ul {
    padding: 0;
    margin: 0;
  }
 
  #footer div div.right {
    margin-top: 0;
    border: 0;
    padding: 0;
    margin-left: 0;
  }

  #footer div:last-child {
    float: left;
  }

  .mailInput {
    float: left;
    clear: both;
  }
 
  #mailSubmit {
    clear: both;
    float: left;
  }

  #subFooter {
    margin-top: 24px;
  }
}