html {
   font: normal normal normal 1em/1.6 Georgia, "Times New Roman", "Bitstream Charter", Times, serif;
   color: #222;
   margin: 0;
   padding: 0;
   background: #2c1b16 url("../img/background.jpg") no-repeat fixed 50% 0;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
   -webkit-text-size-adjust: 100%;
}

@media screen and (max-width: 30em) {
   html {
      font-size: 0.875em;
   }
}

@media screen and (min-width: 85em) and (min-height: 40em) {
   html {
      font-size: 1.125em;
   }
}

@media screen and (min-width: 95em) and (min-height: 50em) {
   html {
      font-size: 1.25em;
   }
}

@media screen and (min-width: 110em) and (min-height: 60em) {
   html {
      font-size: 1.375em;
   }
}

@media screen and (min-width: 120em) and (min-height: 70em) {
   html {
      font-size: 1.5em;
   }
}

body {
   margin: 0;
   padding: 0;
}

.page {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
   width: 63em;
   margin: 0 auto;
   padding: 0 1.5em;
}

@media screen and (min-width: 1px) {
   .page {
      width: 100%;
      max-width: 63em;
   }
}

@media screen and (max-width: 46em) {
   .page {
      padding-left: 1em;
      padding-right: 1em;
   }
}


h1,
h2,
h3,
h4,
h5,
h6 {
   line-height: 1.2;
}

p,
ol,
ul {
   margin: 0.8em 0 0;
}

.tweet {
   font-size: 0.8em;
}

.twitter-timestamp {
   margin: 0 0 1em 0;
   font-size: 0.7em;
   text-align: right;
}

   p:first-child,
   ol:first-child,
   ul:first-child {
      margin-top: 0;
   }

ul {
   list-style: square;
   padding: 0 0 0 1.6em;
}

a {
   -webkit-transition: text-shadow 0.24s ease;
   -moz-transition: text-shadow 0.24s ease;
   transition: text-shadow 0.24s ease;
   color: #be3c0e;
   text-decoration: none;
}

   a:hover {
      color: #da430e;
   }

   a:focus {
      outline-color: #be3c0e;
   }

   a img {
      display: block;
   }

blockquote {
   font-size: 1.25em;
   font-style: italic;
   border-left: 3px solid #ddd;
   margin: 0.8em 0 0;
   padding: 0.65em 1.25em;
}

   blockquote:first-child {
      margin-top: 0;
   }

hr {
   border: none;
   border-top: 1px solid #ddd;
   margin: 1.25em 0 1.5em;
}


/**
 * Header
 */

.header h1 {
   font-weight: normal;
   letter-spacing: -1px;
   font-size: 3em;
   text-align: center;
   text-shadow: 0 0.05em 0.5em #bbb;
   margin: 0 0 0.5em;
   padding-top: 0.5em;
}

@media screen and (max-width: 48em) {
   .header h1 {
      font-size: 2.6em;
   }
}

@media screen and (max-width: 42em) {
   .header h1 {
      font-size: 2.1em;
   }
}

@media screen and (max-width: 36em) {
   .header h1 {
      font-size: 1.8em;
   }
}

@media screen and (max-width: 30em) {
   .header h1 {
      font-size: 1.5em;
   }
}

   .header h1 a {
      -webkit-transition: text-shadow 0.24s ease;
      -moz-transition: text-shadow 0.24s ease;
      transition: text-shadow 0.24s ease;
      color: #222;
      padding: 0 0.25em;
      margin: 0 -0.25em;
   }

      .header h1 a:hover {
         text-shadow: 0 0 1em #fff;
      }


/**
 * Torso
 */

.torso {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
   background-color: #f7f4f1;
   -webkit-box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.2);
   -moz-box-shadow: 0 0.1em 0.25em rgba(0, 0, 0, 0.2);
   box-shadow: 0 0.1em 1em rgba(0, 0, 0, 0.2);
}


/* reused styles */

.sorry {
   font-style: italic;
}

.figure {
   margin: 0.8em 0 1.2em;
}

   .figure:first-child {
      margin-top: 0;
   }

   .figure p {
      font-size: 0.875em;
      text-align: center;
      color: #737373;
      margin-top: 0.5em;
      font-style: italic;
   }


/* nav */

.nav {
   background-color: #000;
   text-align: center;
}

   .small-screen {
      display: none;
   }

   .small-screen-nav {
      background-color: #000;
      text-align: center;
      display: none;
   }

      .small-screen-nav h3 {
         margin: 0;
         font-size: 0.875em;
         letter-spacing: 4px;
         text-transform: uppercase;
         color: #a78b7d;
         line-height: 1.6;
         padding: 0.25em 0;
      }

      .small-screen-nav a {
         display: block;
         border-top: 1px solid #7b5e4f;
         background-color: #684c3f;
         color: #fff;
         padding: 0.25em 0 0.35em;
      }

      .small-screen-nav a:hover {
         background-color: #66423b;
      }

   .nav a {
      display: inline-block;
      padding: 0.5em 0.85em;
      text-decoration: none;
      color: #fff;
      white-space: nowrap;
      position: relative;
   }

   .nav a:hover {
      background-color: #8d372d;
   }

   .nav a.on {
      background-color: #8d372d;
   }

      .nav a.on:after {
         content: '';
         width: 0;
         height: 0;
         display: block;
         position: absolute;
         border-top: 8px solid #8d372d;
         border-left: 8px solid transparent;
         border-right: 8px solid transparent;
         bottom: -8px;
         left: 50%;
         margin-left: -8px;
      }

      .nav a.on:hover {
         background-color: #9d382e;
      }

         .nav a.on:hover:after {
            border-top-color: #9d382e;
         }

@media screen and (max-width: 43.125em) {
   .nav .large-screen {
      display: none;
   }

   .nav .small-screen {
      display: inline-block;
   }

   .small-screen-nav {
      display: block;
   }
}

.sub-nav {
   background-color: #fff;
   padding: 1em 1.5em;
   margin: -1em -3.15em 2.5em -0.6em;
   -webkit-transform: rotate(-3deg);
   -moz-transform: rotate(-3deg);
   transform: rotate(-3deg);
   -webkit-box-shadow: -0.1em 0.1em 0.45em rgba(0, 0, 0, 0.2);
   -moz-box-shadow: -0.1em 0.1em 0.45em rgba(0, 0, 0, 0.2);
   box-shadow: -0.1em 0.1em 0.45em rgba(0, 0, 0, 0.2);
   position: relative;
}
   .sub-nav:after {
      content: '';
      position: absolute;
      display: block;
      width: 45px;
      height: 82px;
      top: -26px;
      right: -2px;
      background: transparent url("../img/paperclip.png") no-repeat scroll 50% 50%;
      -webkit-transform: rotate(-1deg);
      -moz-transform: rotate(-1deg);
      transform: rotate(-1deg);
   }

   .sub-nav ul {
      list-style: none;
      padding: 0;
      font-size: 1.125em;
      line-height: 1.3;
   }

   .sub-nav ul ul {
      padding: 0 0 0 1.5em;
      font-size: 0.83333em;
      margin: 0.4em 0 0;
   }

   .sub-nav li {
      margin: 0.5em 0 0;
   }

      .sub-nav li:first-child {
         margin-top: 0;
      }

   .sub-nav .on {
      color: #81352b;
   }

@media screen and (max-width: 46em) {
   .sub-nav {
      -webkit-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      transform: rotate(0deg);
      margin: 0 -2em 1.5em;
   }
}

.breadcrumbs {
   font-size: 0.9375em;
}

   .breadcrumbs span {
      margin: 0 0.25em;
      color: #c3bea9;
   }

   .breadcrumbs a {
      margin-bottom: 0.3125em;
      display: inline-block;
   }


ol.tree > li {
   font-size: 1.125em;
}

ol.tree li {
   line-height: 1.25em;
   margin: 0.425em 0;
}

ol.tree ol {
   margin: 0 0 1.2em;
   padding: 0 0 0 2em;
   font-size: 0.83333em;
}

   ol.tree ol li {
      font-style: italic;
   }

   ol.tree ol li a {
      font-style: normal;
   }

ol.roman {
   list-style-type: upper-roman;
}

ol.roman ol {
   list-style-type: lower-roman;
}


.main {
   padding: 1.5em 36px 2.125em;
}

@media screen and (max-width: 46em) {
   .main {
      padding-left: 21px;
      padding-right: 21px;
   }

   .columns {
      width: 100% !important;
      float: none;
      margin: 1.5em 0 0;
   }

      .columns:first-child {
         margin-top: 0;
      }
}


/* pagination */
.pagination {
   border-top: 1px solid #ddd;
   margin-top: 1.5em;
   padding-top: 1em;
   *zoom: 1;
}

   .pagination:before,
   .pagination:after {
      content: " ";
      display: table;
   }

   .pagination:after {
      clear: both;
   }

   .pagination a {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
      width: 45%;
      position: relative;
      line-height: 1.4;
   }

      .pagination a:before,
      .pagination a:after {
         display: block;
         position: absolute;
         top: 0;
      }

   .pagination .older {
      float: left;
      padding-left: 0.85em;
   }

      .pagination .older:before {
         content: "«";
         left: 0;
         -webkit-transition: left 0.24s ease;
         -moz-transition: left 0.24s ease;
         transition: left 0.24s ease;
      }

      .pagination .older:hover:before {
         left: -0.25em;
      }

   .pagination .newer {
      float: right;
      text-align: right;
      padding-right: 0.85em;
   }

      .pagination .newer:after {
         content: "»";
         right: 0;
         -webkit-transition: right 0.24s ease;
         -moz-transition: right 0.24s ease;
         transition: right 0.24s ease;
      }

      .pagination .newer:hover:after {
         right: -0.25em;
      }

   .pagination small {
      font-size: 0.875em;
   }


/* article */
.article {
   margin: 2em 0 0;
}

   .article:first-child {
      margin-top: 0;
   }

   .article h1 {
      margin: 0 0 0.5em;
      font-size: 2.2em;
      font-weight: normal;
   }

   .article h2 {
      font-size: 1.6em;
      font-weight: normal;
      margin: 1.25em 0 0;
   }

   .article .time {
      margin-top: -1em;
      font-style: italic;
      color: #a49b8c;
      font-size: 0.875em;
   }

   .article h3 {
      line-height: 1.4;
      font-weight: normal;
      font-style: italic;
   }

      .article h3 em {
         font-style: normal;
      }

   .article h1 a {
      text-decoration: none;
   }

   .article img {
      display: block;
      width: 100%;
      margin: 0.8em 0 0;
   }

   .article p img:first-child {
      margin-top: 0;
   }

@media screen and (max-width: 30em) {
   .article h1 {
      font-size: 1.65em;
   }

   .article h2 {
      font-size: 1.5em;
   }
}


/* sidebar */
.sidebar {
   padding-top: 1em;
}


/* side block */
.side-block {
   margin: 2em 0 0;
}

   .side-block:first-child {
      margin-top: 0;
   }

   .side-block:last-child {
      margin-bottom: 0;
   }

   .side-block h2 {
      font-size: 1.4em;
      font-weight: normal;
      margin: 0 0 0.35em;
      padding-bottom: 0.3em;
      border-bottom: 1px dotted #ccc;
   }

   .side-block h2 a {
      text-decoration: none;
   }

   .side-block ul {
      margin-top: 0.4em;
      list-style: square;
      padding: 0 0 0 1.5em;
   }


@media screen and (max-width: 46em) {
   .side-block {
      margin: 0 0 1.5em 4%;
      width: 48% !important;
      float: left;
   }

   .side-block.odd {
      margin-left: 0;
   }
}

@media screen and (max-width: 32em) {
   .side-block {
      margin: 0 0 1.5em;
      width: 100% !important;
      float: none;
   }
}



/* calendar */
.calendar ul {
   list-style: none;
   padding: 0;
}

   .calendar li {
      margin: 0.75em 0 0;
   }

      .calendar li:first-child {
         margin-top: 0;
      }

   .calendar small {
      color: #503c33;
      font-size: 0.875em;
      font-style: italic;
   }

   .calendar h3 {
      font-weight: normal;
      margin: 0.125em 0 0;
      font-size: 1.2em;
   }


/* big-calendar */
.big-calendar {
}

   .big-calendar .divider {
      font-size: 0.9125em;
      overflow: hidden;
      width: 100%;
      margin-top: 1.5em;
      margin-bottom: -0.75em;
   }

      .big-calendar .divider span {
         display: inline-block;
         position: relative;
         padding: 0 0.65em;
         color: #b7b29d;
         font-size: 1.125em;
         margin-left: 4.35em;
      }

      .big-calendar .divider span:before,
      .big-calendar .divider span:after {
         content: '';
         position: absolute;
         display: block;
         height: 0;
         width: 800px;
         border-top: 3px double #cbc9c0;
         top: 50%;
         margin-top: -1px;
      }

      .big-calendar .divider span:before {
         left: -800px;
      }

      .big-calendar .divider span:after {
         right: -800px;
      }

   .big-calendar .date-blob {
      width: 3.2em;
      float: left;
      text-align: center;
      -webkit-box-shadow: 0 0 0.6em rgba(0, 0, 0, 0.15);
      -moz-box-shadow: 0 0 0.6em rgba(0, 0, 0, 0.15);
      box-shadow: 0 0 0.6em rgba(0, 0, 0, 0.15);
      position: relative;
   }

      .big-calendar .date-blob strong {
         text-transform: uppercase;
         font-weight: bold;
         letter-spacing: 1px;
         padding: 0.1em 0 0;
         font-size: 0.8125em;
         background-color: #000;
         color: #fff;
         display: block;
      }

      .big-calendar .date-blob span {
         display: block;
         font-size: 1.5em;
         line-height: 1;
         background-color: #fff;
         padding: 0.125em 0 0.35em;
      }

   .big-calendar .event {
      margin: 1.5em 0 0;
   }

      .big-calendar .event:first-child {
         margin-top: 0;
      }

   .big-calendar .event h3 {
      line-height: 1.1;
      font-size: 1.65em;
      margin: 0 0 0.25em;
      font-style: normal;
   }

   .big-calendar .event p {
      margin-top: 0;

   }

   .big-calendar .event-description {
      margin-left: 5em;
   }

   @media screen and (max-width: 30em) {
      .big-calendar .date-blob {
         font-size: 0.825em;
      }

      .big-calendar .date-blob strong {
         letter-spacing: 0;
      }

      .big-calendar .event-description {
         margin-left: 3.8em;
      }
   }


/* map */
.map {
   height: 20em;
   width: 100%;
   border: 1px solid #ccc;
}

.big-map .map {
   height: 24em;
}

   .map h2 {
      margin: 0;
      font-size: 1.4em;
   }

   .map h3 {
      margin: 0;
      font-style: normal;
      font-size: 1.125em;
   }

   .map p {
      margin: 0.4em 0 0;
   }

@media screen and (max-width: 46em) {
   .map {
      height: 20em;
   }
}


/* taxonomy results */

.taxonomy-results {
   border-top: 1px solid #ddd;
   padding-top: 1.5em;
}

   .taxonomy-results h1 {
      font-size: 1.9em;
   }

/* gallery */
.masonry .item {
   width: 286px;
   margin-bottom: 15px;
   overflow: hidden;
}
.masonry .item img {
   display: block;
   width: auto !important; /*override the width below*/
   width: 100%;
   max-width: 100%;
}

.masonry .item .caption {
   width: 100%;
   position: absolute;
   bottom: -5px;
   background: rgba(0,0,0,.3);
   padding: 25px 0;
   color: #fff;
   text-align: center;
   font-size: 21px;
   opacity: 0;
   -webkit-transition: ease-in-out all .2s;
}

.masonry .item:hover .caption {
   opacity: 1;
   bottom: 0px;
}


/**
 * Footer
 */
.footer {
   font-size: 0.8125em;
   line-height: 1.4;
   text-align: center;
   background-color: #000;
   padding: 1.25em 0;
   color: #777;
   margin-bottom: 2.5em;
}

   .footer small {
      font-style: italic;
   }

   .footer .delimiter {
      margin: 0 0.25em;
   }

   .footer a {
      color: #aaa;
   }

      .footer a:hover {
         color: #fff;
      }

/**
 * Gallery
 */
.gallery {
   border-top: 1px solid #ddd;
   margin-top: 1.5em;
   padding-top: 1.75em;
}

   .gallery img {
      display: block;
      width: 100%;
      margin: 0;
   }

   .gallery .row {
      margin-top: 1.5em;
   }

      .gallery .row:first-child {
         margin-top: 0;
      }

@media screen and (max-width: 400px) {
   .gallery .column {
      float: none;
      width: 100%;
      margin: 1.5em 0 0 !important;
   }

   .gallery {
      padding-top: 0.25em;
   }

   .gallery .row {
      margin-top: 0;
   }
}

/**
 * Contact Form
 */
.contact {
   border-top: 1px solid #ddd;
   margin-top: 1.5em;
   padding-top: 1.75em;
}

   .contact input[type="text"],
   .contact input[type="email"],
   .contact textarea {
      display: block;
      width: 100%;
      margin: 0;
      padding: .5em .25em;
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
   }

   .contact input[type="submit"] {
      border: none;
      text-transform: uppercase;
      font-weight: bold;
      letter-spacing: 1px;
      padding: .5em 1em;
      font-size: 0.8125em;
      background-color: #000;
      color: #fff;
      display: block;
      cursor: pointer;
   }

@media screen and (max-width: 400px) {

}

pre {
        font-family: "Courier 10 Pitch", Courier, monospace;
        font-size: 0.7em;
        line-height: 100%;
        white-space: pre;
        white-space: pre-wrap;
        white-space: -moz-pre-wrap;
        white-space: -o-pre-wrap;
    }       
    
    code {
        font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
        font-size: 0.7	em;
        line-height: 100%;
        white-space: pre;
        white-space: pre-wrap;
        white-space: -moz-pre-wrap;
        white-space: -o-pre-wrap;
        background: #faf8f0;
    }
    
    .article code {
        display: block;
        padding: 0.5em 1em;
        border: 1px solid #bebab0;
    }