div.thumbnail_widget.carousel { 
  position: relative;
  padding: 15px 25px 0;
  width: 510px;
}

  div.thumbnail_widget.carousel span.tn_left,
  div.thumbnail_widget.carousel span.tn_right {
    cursor: pointer;
    position: absolute;
    top: 80px;
  }

  div.thumbnail_widget.grid span.tn_left,
  div.thumbnail_widget.grid span.tn_right,
  div.thumbnail_widget.grid span.tn_pagination {
    display: none;
  }

  div.thumbnail_widget.carousel span.tn_left {
    display: none;
    left: 0px;
  }

  div.thumbnail_widget.carousel span.tn_right {
    right: 0px;
  }

  div.thumbnail_widget.carousel span.tn_pagination {
    position: absolute;
    right: 35px;
    top: 0px;
  }

  div.thumbnail_widget.carousel div.tn_container { 
    overflow: hidden;
    position: relative;
    width: 510px;
    z-index: 2;
  }

    div.tn_preview {
      float: left;
/*      min-height: 170px; */
      padding: 10px 0px 20px;
      text-align: center;
      width: 150px;
    }

    div.thumbnail_widget.carousel div.tn_container div.thumbnails {
      display: flex;
      left: 0px;
      overflow: hidden;
      position: relative;
      z-index: 1;
    }

      div.thumbnail_widget.grid div.tn_container div.thumbnails {
        align-items: center;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
      }

      div.thumbnail_widget.grid div.tn_container div.thumbnails div.tn_preview {
        padding-right: 15px;
      }

      div.tn_preview img {
        padding: 4px;
        cursor: pointer;
        display: block;
        margin: 0 auto;
      }
    
        div.tn_preview img.selected {
          padding: 0px;
          border: 4px solid #000;
        }
    
      div.tn_preview div {
        height: 1em;
        padding: .6em 0 0 0;
      }

span.show_all {
  margin-left: 5px;
}

div.overlay {
  background: #000;
  bottom: 0;
  left: 0;
  opacity: 0.6;
  position: fixed;
  right: 0;
  top: 0;
}

div.preview_window,
div.show_all_window { 
  display: none;
  left: 50%;
  position: fixed;
  top: 50%;
  z-index: 990011;
}

div.preview_window img,
div.show_all_window { 
  border: 6px solid #000;
}

div.preview_window div.preview_close {
  background: transparent url(/static/images/global/circle_close_black.png);
  height: 30px;
  left: -10px;
  position: absolute;
  top: -10px;
  width: 30px;
}

div.show_all_window { 
  background: #fff;
  padding: 40px;
}

  div.show_all_window div.tn_preview {
    height: 95px;
  }

  .show_all_close {
    cursor: pointer;
  }

  div.show_all_top {
    height: 30px;
    padding-bottom: 15px;
  }

    div.show_all_top span {
      display: block;
      float: left;
    }

      div.show_all_top span.title {
        font-size: 16px;
      }

    div.show_all_top div.show_all_close {
      float: right;
    }

  div.show_all_window div.tn_container {
    clear: both;
    height: 400px !important;
    overflow: auto;
  }

  div.show_all_window div.tn_container div.thumbnails {
    display: flex;
    flex-wrap: wrap;
    left: 0px;
    overflow: hidden;
    position: relative;
    z-index: 1;
  }

  div.show_all_bottom {
    height: 25px;
    padding: 25px 0;
    text-align: center;
  }

    div.show_all_bottom .button {
      float: none;
      padding-top: .2em;
      padding-bottom: .2em;
    }

      div.show_all_bottom .button span {
        display: inline;
      }

* html div.thumbnail_overlay { /* ie6 hack */
  position: absolute;
  height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

* html div.preview_window { /* ie6 hack */
  position: absolute;
  margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

/*--------------- Settings for PDF Design Thumbnails ----------------*/

div.thumbnail_widget.carousel.pdf_template_designs { 
  width: 600px;
}

div.thumbnail_widget.carousel.pdf_template_designs div.tn_container { 
  width: 600px;
}

/*--------------- Settings for Website Design Thumbnails ----------------*/

div.thumbnail_widget.carousel.website_designs { 
  width: 305px;
}

div.thumbnail_widget.carousel.website_designs div.tn_container { 
  width: 305px;
}

div.thumbnail_widget.carousel.website_designs span.tn_pagination {
  right: 0px;
}

div.thumbnail_widget.carousel.website_designs span.tn_left,
div.thumbnail_widget.carousel.website_designs span.tn_right {
  cursor: pointer;
  position: absolute;
  top: 55px;
}

    div.thumbnail_widget.website_designs div.tn_preview {
      font-size: .8em;
      width: 100px;
    }

div.thumbnail_widget.crm_email_templates div.tn_preview {
  width: 170px;
}

@media (max-width: 400px) {
  div.thumbnail_widget.carousel { 
    padding-left: 0;
    padding-right: 0;
  }
}

@media (max-width: 359px) {
  div.thumbnail_widget.carousel.website_designs {
    width: 290px;
  }

  div.thumbnail_widget.website_designs div.tn_preview {
    width: 95px;
  }
}

