@import url('/css/reset-min.css');
@import url('/css/base-min.css');
  
html {
  background:#D8D8D8 url(/img/body-bg.jpg) top left repeat;
  }
  
body {
  color:#333;
  font-size:62.5%;
  font-family:"Helvetica Neue", Arial, sans-serif;
  margin:0;
  padding:20px 0 40px;
  }

h1 {
  font-weight:bold;
  font-size:30px;
  color:#333;
  line-height:1.2em;
  }
h2 {
  color:#888;
  font-weight:normal;
  font-size:22px;
  margin:0 0 1em;
  line-height:1.3em;
  }
  h2 span {
    font-size:16px;
    display:block;
  }
h3 {
  margin:0 0 1em;
  padding:0;
  }
a:link, a:visited {
  color:#F60;
  text-decoration:none;
  }
a:hover, a:active {
  color:#F30;
  }
  
/*-- SITE STRUCTURE--*/
.wrap {
  width:960px;
  margin:0 auto;
  font-size:1.3em;
  line-height:1.5em;
  background:url(/img/wrap-bg.jpg) center top repeat-y;
  }

#header {
  background:url(/img/header-bg.jpg) center top no-repeat;
  padding:0 20px 0px 30px;
  position:relative;
  }
  div#logo {
    float:left;
    margin:34px 0 20px 0;
    }
    div#logo a {
      float:left;
      height:0;
      width:318px;
      overflow:hidden;
      padding-top:110px;
      background:url(/img/logo.jpg) left top no-repeat;
      }
  ul#nav {
    margin:80px 0 0;
    padding:0;
    float:right;
    list-style:none;
    }
    ul#nav li {
      padding:0;margin:0;
      float:left;
      list-style:none;
      }
      ul#nav li a {
        text-decoration:none;
        font-size:16px;
        color:#F60;
        font-weight:bold;
        padding:0 15px;
        display:table-cell;
        text-align:center;
        height:60px;
        vertical-align:middle;
        }
        ul#nav li a:hover {
          color:#F30;
          }
          
/*-- Where am I? --*/
body.why-groundwork ul#nav li a.why-groundwork,
body.integrated-design ul#nav li a.integrated-design,
body.portfolio ul#nav li a.portfolio,
body.about ul#nav li a.about,
body.blog ul#nav li a.blog,
body.contact ul#nav li a.contact {
  color:#222;
  }
  
#content {
  background:url(/img/content-bg.jpg) center top no-repeat;
  padding:30px;
  }
#main {
  width:620px;
  float:left;
  }
#sidebar {
  float:right;
  width:220px;
  padding:20px 0 30px 30px;
  border-left:1px dotted #DDD;
  }
#bottom {
  background:url(/img/bottom-bg.jpg) center top no-repeat;
  height:10px;
  }
#sub-footer {
  width:960px;
  margin:0 auto;
  padding:20px 0;
  font-size:1.2em;
  text-align:center;
  color:#999;
  }
form#searchform {
  position:absolute;
  padding:2px 0;
  top:10px;
  right:40px;
  }
  form#searchform input {
    border:none;
    background:none;
    width:242px;
    margin:0;
    padding:0;
    color:#666;
    }
/*-- BLOG --*/
.posted-on {
  font-style:italic;
  color:#999;
  font-family:Georgia, serif;
  }
.postmetadata {
  padding-bottom:2em;
  margin-bottom:2em;
  border-bottom:1px dotted #CCC;
  }
.entry {
  margin:0 0 2em;
  }
  
form#commentform label {
  float:left;
  width:140px;
  text-transform:uppercase;
  font-size:90%;
  color:#777;
  }
em.required {
  color:#F60;
  font-weight:bold;
  font-size:20px;
  }
input.textbox,
textarea#comment {
  border:1px solid #CCC;
  background:#F9F9f9;
  padding:5px 10px;
  width:300px;
  }
input#submit {
  margin-left:140px;
  }
div.comment {
  border:1px solid #CCC;
  background:#F9F9f9;
  padding:20px;
  margin-bottom:1em;
  }
.comment-metadata {
  margin:0 0 1em;
  font-weight:bold;
  }
  .comment-metadata em {
    font-size:90%;
    color:#666;
    font-weight:normal;
    font-family:Georgia, serif;
    }
span.number {
  font-family:Georgia, serif;
  color:#666;
  font-weight:bold;
  margin-right:12px;
  }
/*-- SIDEBAR --*/
#sidebar h2 {
  font-size:18px;
  font-weight:normal;
  color:#666;
  }
a#rss {
  float:right;
  }
ul#from-the-blog {
  padding:0;margin:0;
  list-style:none;
  }
  ul#from-the-blog li {
    padding:0;margin:0 0 1em;
    list-style:none;
    }
    ul#from-the-blog li span.post-date {
      color:#666;
      font-size:90%;
      }

/*-- HOME --*/
body.home #content {
  background:none;
  }
#banner {
  padding:0 6px;
}
#main-message {
  margin:40px 0 0;
  color:#666;
  font-size:24px;
  line-height:1.5em;
}

/*-- PORTFOLIO --*/
#portfolio-content {
  margin:2em 0;
  }
.portfolio-entry {
  margin-bottom:2em;
  }
  .portfolio-entry a,
  .portfolio-entry img.thumb {
    float:left;
    }
  .portfolio-entry-info {
    float:right;
    width:440px;
    border-bottom:1px dotted #CCC;
    padding-bottom:1em;
    }
    .portfolio-entry-info a {
      float:none;
      }


/*-- UTILITIES --*/
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  }
.alignleft {float:left;}
.alignright {float:right;}

img.alignleft {
  float:left;
  margin:0 1em 1em 0;
  }
img.alignright {
  float:right;
  margin:0 0 1em 1em;
  }
a.icon {
  padding:2px 0 2px 20px;
  background-position:left center;
  background-repeat:no-repeat;
  }
a.document {background-image:url(/img/document.gif);}

/*-- MailChimp --*/
#mc_embed_signup {
  padding:1em 0;
  }
.mc-field-group {
  margin:0 0 1em;
  }
.mc-field-group label {
  float:left;
  width:120px;
  }
.mc-field-group .textbox {
  border:1px solid #CCC;
  padding:4px;
  width:250px;
  }
input.btn {
  margin-left:120px;
  }
div.mce_inline_error {
  margin-left:120px;
  color:red;
}