//
// Thumbnails
// --------------------------------------------------


// Mixin and adjust the regular image class
.thumbnail {
   display: block;
   padding: $thumbnail-padding;
   margin-bottom: $line-height-computed;
   line-height: $line-height-base;
   background-color: $thumbnail-bg;
   border-radius: $thumbnail-border-radius;
   box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
   transition: border .2s ease-in-out;

   > img,
   a > img {
      @include img-responsive;

      margin-left: auto;
      margin-right: auto;
   }

   // Image captions
   .caption {
      padding: $thumbnail-caption-padding;
      color: $thumbnail-caption-color;
      font-size: 14px;
   }

   .caption h1,
   .caption h2,
   .caption h3,
   .caption h4,
   .caption h5,
   .caption h6 {
      margin: 5px 0 10px;
      font-size: 16px;
   }
}

// Add a hover state for linked versions only
a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
   border-color: $link-color;
}