/*
Theme Name: Code to Customer
Theme URI: http://codetocustomer.com/
Description: Awesome Code to Customer Wordpress theme, for our awesome website
Version: 1.0
Author: Nik Wakelin
Author URI: http://nik.wakelin.geek.nz/
*/

*, html {
  margin: 0;
  padding: 0;
  
}

body, html { min-height: 100%; }

body {
  
  height: 100%;

  color: #252525;
  
  font-size: 92%;
  font-family: "Lucida Grande", Helvetica, Verdana, sans-serif;

  background: #eef6fe;

}

/* LAYOUT */

  div#main-wrap {
  
    width: 960px;
    min-height: 100%;
    margin: 0 auto;
  
    background: #fff url("images/page_background.png");
  
  }

  div#main {
    padding-left: 11px;
    padding-right: 11px;
  
    padding-bottom: 2em;
  }

  div#main div#header {
  
    background: #1e5fa7 url("images/header_fade.png") bottom left repeat-x;
  
    padding-top: 70px;
    padding-left: 1.5em;
  
  }

  div#main div#header img {
    position: relative;
    top: 11px;
  }
  
  /* Safari 3.0 hack from http://themechanism.com/blog/2008/01/08/safari-css-hack-redux/ */
  
  @media screen and (-webkit-min-device-pixel-ratio:0) {
  
    div#main div#header img {
      top: 7px;
    }
  }

  div#content {
    padding: 1em;
  
    padding-top: 2em;
    padding-left: 27px;
    padding-right: 50px;

  }


  div#leftcol {
    float: left;
    width: 33%;
  }

  div#rightcol {
    float: left;
    width: 66%;
  }

  div#leftcol ul {
  
    margin: 0;
    margin-top: 0.8em;
    margin-right: 1em;
    padding: 0;
  
    list-style: none;
    font-size: 140%;
  
  }

  div#leftcol ul li a,
  div#leftcol ul li a:visited {
    display: block;
  
    color: #555;
    padding: 17px 0 20px 30px;
  
    text-decoration: none;
    height: 20px; 
    overflow: hidden;
    
    font-weight: normal;
    
  }

  div#leftcol ul li.current a,
  div#leftcol ul li.current a:visited,
  div#leftcol ul li.current a:hover,
  div#leftcol ul li.current a:visited:hover
   { 
    color: #333;
    background: url("images/roundarrow.png") no-repeat;
    
    padding: 17px 0 20px 30px;    
  }
  
  div#leftcol ul li a:hover,
  div#leftcol ul li a:visited:hover {
   background-color: transparent;
   
   padding: 17px 0 20px 30px;
  }

/* END LAYOUT */

/* CONTENT STYLES */

  div#content div#rightcol p {
    line-height: 150%;
  }

  a img {
    border: 0 !important;
    text-decoration: none;
  }
  
  a:hover img {
    background: 0 !important;
  }

  abbr {
    border-bottom: dotted #555 1px;
  }

  h1 {
    letter-spacing: -2px;
    font-size: 2em;
    font-weight: normal;
  
      margin-bottom: 0.8em;

  }

  h1 em {
  
    font-weight: normal;
    font-size: 170%;
  
    font-family: "Georgia", sans-serif;

    color: #cc0000;
    font-style: italic;
    position: relative;
  
    top: 0.1em;
  }
  
  h1 a,
  h1 a:visited {
    color: #252525;
    text-decoration: none;
    font-weight: normal;
  }

  h1 a:hover,
  h1 a:visited:hover {
    background: 0;
    color: #252525;
  }
  
  h2 { 
    letter-spacing: -2px;
    font-size: 2em;
    font-weight: normal;  

    margin-bottom: 0.4em;
    margin-top: 0.8em;
  }
  
  h3 {
    
    font-size: 120%;
    
    margin-bottom: 0.4em;
    margin-top: 0.8em;
    
    letter-spacing: -2px;
    font-weight: normal;
  }
  
  div#rightcol ul {
    padding-left: 2em;
  }
  
  div#rightcol ul li {
    margin-bottom: 0.8em;
        line-height: 150%;
  }

  div#content p {
    margin-bottom: 1.8em;
  }

  p img,
  img.left {
    float: left;
    padding: 2px;
    margin-right: 1em;
    margin-bottom: 0.4em;
    margin-top: 0.2em;
    border: solid #d5d5d5 1px;
  }
  
  p a img.left {
    border: solid #d5d5d5 1px;
  }

  p img.right {
    float: right;
    margin-right: 0;
    margin-left: 1em;
  }
  
  a,
  a:visited {
    color: #215EA6;
    text-decoration: underline;
    font-weight: bold;
    padding: 2px;
  }
  
  a:hover,
  a:visited:hover {
    color: #fff;
    background: #215EA6;
    text-decoration: none;
  }
  
  a.nohover:hover {
    background: 0;
  }
  
  blockquote {
    margin: 1em;
    padding: 1em;
    padding-left: 2em;
    padding-top: 2em;
    color: #404040;
    background: #f5f5f5 url("images/blockquote.png") 5px 5px no-repeat;
  }
  
  blockquote span.attr {
    color: #555555;
    text-align: right;
    margin-top: 0;
  }
  
  code {
  	margin: 1em 0 0 0;
  	padding: 5px;
  	font-family: Monaco, monospace;
  	line-height: 1.7em;
  	word-wrap: break-word;
  	white-space: pre;
  	white-space: pre-wrap;
  	white-space: -moz-pre-wrap;
  	white-space: -o-pre-wrap;
  	color: #FFFFFF;
  	background-color: #000000;
  	
  	font-size: 80%;
  	display: block;
  }
  
/* END GENERAL CONTENT */

/* BLOG STYLES */

  div.post {
    margin-bottom: 2em;
  }
  
  div.post h1 {
    margin-bottom: 0.2em;
    padding: 0 !important;
  }
  
  div.post h1 a {
    padding: 0;
  }
  
  div.post div.postmetadata {
    font-size: 150%;
    letter-spacing: -2px;
    color: #AACEF4;
  }
  
  div.post div.postmetadata em {
    color: #aaa;
    font-style: normal;
    font-size: 70%;
  }
  
  div.post div.content {
    margin-top: 0.8em;
    margin-bottom: 0.8em;
  }
  
  div.post hr {
    
    width: 35%;
    
    height: 1px;
    background-color: #ddd;
    color: #ddd;
    border: none;
    
    padding: 0;
    margin: 1.8em auto 1.8em auto;
  }
  
  div.post div.comments-link em {
    font-weight: normal;
    font-size: 170%;
  
    font-family: "Georgia", sans-serif;

    color: #404040;
    font-style: italic;
    position: relative;
  
    top: 0.1em;
  }
  
  div.post ol {
    margin-left: 4em;
    margin-bottom: 2em;
  }
  
  div.post ol li {
    margin-bottom: 0.8em;
  }
  
  /* BLOG COMMENTS */
  
    .comment, .author-comment { 
      width: 90%;
      margin-top: 1em;
      margin-bottom: 2em;
    }
    
    
    .author-comment {
      margin-left: 10%;
    }

    .comment .container {
      background: #c9d7ec url("images/top_left_blue.gif") top left no-repeat;
    }
    
    .author-comment .container {
      background: #e5ecc9 url("images/top_left_green.gif") top left no-repeat;
    }

    .comment .container div,
    .author-comment .container div {
      background: transparent url("images/top_right_blue.gif") top right no-repeat;
      margin-left: 8px; /* sliding doors */

      padding: 1em;

    }
    
    
    div.comment div.container div p,
    div.author-comment div.container div p {
      margin-bottom: 0 !important;
    }
    

    .author-comment .container div {
      background: transparent url("images/top_right_green.gif") top right no-repeat;
    }

    .comment .base,
    .author-comment .base {
      background: #c9d7ec url("images/bottom_left_blue.gif") bottom left no-repeat;
      height: 8px;
    }

    .author-comment .base {
      background: #e5ecc9 url("images/bottom_left_green.gif") bottom left no-repeat;
    }

    .comment .base div,
    .author-comment .base div {
      background: transparent url("images/bottom_right_blue.gif") bottom right no-repeat;
      margin-left: 8px; /* sliding doors */  
      height: 8px;
    }

    .author-comment .base div {
      background: transparent url("images/bottom_right_green.gif") bottom right no-repeat;
    }

    .comment .point {

      margin: 0;
      padding: 0;
      height: 10px;

      padding-left: 65px;
      background: transparent url("images/point_blue.gif") 25px 0 no-repeat;

    }

    .comment cite {
      padding-left: 15px;
      font-style: normal;
      font-size: 90%;
    }

    .author-comment .point {

      margin: 0;
      padding: 0;
      height: 10px;

      background: transparent url("images/point_green.gif") 465px 0 no-repeat;

    }

    .author-comment cite {
      text-align: right;
      
      font-style: normal;
      font-size: 90%;
      
      display: block;

      padding-right: 15px;
    }

    input, select, textarea {
       font-family: "Lucida Grande", Helvetica, Verdana, sans-serif;

       font-size: 110%;

       line-height: 150%;
    }

    #comment-form label {
      color: #404040;
      display: block;
      font-weight: bold;
      padding-bottom: 0.5em;
      font-size: 90%;
    }

    #comment-form input,
    #comment-form textarea {
      padding: 0.5em;
    }
    
    #comment-form textarea {
      height: 5em;
      width: 100%;
    }
    
    #comment-form input {
      width: 65%;
    }
  
  /* END BLOG COMMENTS */


/* END */

/* FOOTER STYLES */

  div#footer-wrap {
    clear: both;
  
    width: 960px;
    margin-top: 2em;
  
    background: url("images/footer_background.png");
  }

  div#footer {
  
    background: url("images/footer_fade.png") top left repeat-x;
  
    margin-left: 10px;
    margin-right: 10px;
  
    padding-top: 2em;
    padding-bottom: 2em;
    padding-left: 50px;
    padding-right: 50px;
  
    font-size: 90%;
    color: #102e4f;
  
  }

  div#footer div.contact {
    margin-bottom: 2em;
    line-height: 135%;
  }

  div#footer h3 {
    font-size: 150%;
    margin-bottom: 0.8em;
    letter-spacing: -2px;
  }

  div#footer div.contact img {
    float: left;
  
    padding: 1px;
    border: solid #252525 1px;
    margin-right: 0.5em;
  }

  div#footer a, 
  div#footer a:visited {
    color: #252525;
    padding: 0;
  }


  div#footer a:hover, 
  div#footer a:visited:hover {
    color: #333;
    text-decoration: none;
    background: 0;
  }

  div#footer div.left-col {
    float: left;
    width: 30%;
  }

  div#footer div.right-col {
    float: right;
    width: 30%;
  }

  div#footer div.right-col ul {
    list-style: none;
    margin-top: 0;
  }

  div#footer div.right-col ul.posts  {
   margin: 0;
   padding: 0;
   margin-left: -20px;
  }

  div#footer div.right-col ul.posts li {
    padding-left: 24px;
    background: url("images/blog_post.png") 0px 4px no-repeat;
  }

  div#footer div.right-col ul li {
    margin-bottom: 1em;
    clear: left;
  } 

  div#footer div.right-col ul li em {
    display: block;
    color: #555;
    font-style: normal;
    margin-top: 0.2em;
  }
  
  div#footer div.right-col ul li a em,
  div#footer div.right-col ul li a:visited em {
    display: inline;
    color: #252525;
    margin-top: 0;
  }
  

/* END FOOTER STYLES */