$border: inline-image('dotted-border.png');

 #articles {

   @media only screen and (max-width: 992px) {
     ul, ol { margin-left: 1.4em; }
   }

   > article {
     padding-bottom: 1em;
     &:last-child { margin-bottom: 0; border-bottom: none; }
     h2 {
       padding-top: 0.8em;

       background: $border top left repeat-x;

       &:first-child {
         background: none;
         padding-top: 0;
       }

     }

     .byline + time:before, time +time:before, .comments:before {
       @extend .separator;

     }
     header {

       position: relative;

       padding-top: 2em;
       margin-bottom: 1.5em;

       padding-bottom: 1em;

       background: $border bottom left repeat-x;

       h1 {
         margin: 0;
         a { text-decoration: none;
           &:hover { text-decoration: underline; } }
       }
       p {
         font-size: .9em;

         color: $text-color-light;

         margin: 0;

         @extend .sans;

         &.meta {
           text-transform: uppercase;
           position: absolute;
           top: 0;
         }
       }
       @media only screen and (max-width: 768px) {
         padding-bottom: 1em;
         margin-bottom: 1em;
         background: $border bottom left repeat-x;
         p.meta { position: static; }
       }
 
       &.feature h1 {
         font-size: 2.0em; font-style: italic;
         line-height: 1.3em;

       }
     }
     .entry-content {

       img, video { max-width: 100%; height: auto; }
       video { display: block; margin-bottom: 1.5em;
         padding: .8em; background: #fff; border: 1px solid #eee;
         @include box-sizing(border-box);
       }
       .flash-video {
         max-width: 100%;
         padding: .8em; background: #fff; border: 1px solid #eee;
         > div {
           position: relative;
           display: block;
           padding-bottom: 56.25%;
           padding-top: 1px;
           height: 0;
           overflow: hidden;
           iframe, object, embed {
             position: absolute;
             top: 0;
             left: 0;
             width: 100%;
             height: 100%;
           }
         }
       }

     }
     #disqus_thread { }
 

     iframe.twitter-share-button {
       //display: block;
       //margin-top: .5em;
       //padding: .2em 0;
       position: relative;
       top: .3em;
       padding-left: .5em;
     }

     footer {

       margin-top: 2em;
       padding-top: 1em;
       margin-bottom: 1.5em;
       background: $border top left repeat-x;
       time, .author { color: $text-color-light; @extend .sans; }

     }
   }
 }
 article + article {
   background: $border top left repeat-x;
 }
 #articles.blog-index {
   article header { background: none; padding-bottom: 0; }
   article h1 {
     font-size: 2.2em;
     a { color: inherit; &:hover{ color: $link-color-hover; } }
   }
   a[rel=full-article] {
     background: darken($main-bg, 5);
     display: inline-block;
     padding: .4em .8em;
     margin-right: .5em;
     text-decoration: none;

     color: mix($text-color, $text-color-light);
     @extend .serif;

     @include transition(background-color, .5s);
     &:hover {
       background: $link-color-hover;

       text-shadow: none;

       color: $main-bg;

     }
   }

   footer {
     @extend .sans;
     margin-top: 1em;
     p.meta { color: $text-color-light; }
     a { color: inherit; &:hover{ color: $link-color-hover;} }
   }
 }
 
 .separator {
   content: "\2022 ";
   padding: 0 .4em 0 .2em;
   display: inline-block;

 }