@charset "UTF-8";
/* ---- isotope ---- */

.isotope {
}

/* clear fix */
.isotope:after {
  content: '';
  display: block;
  clear: both;
}

/* ---- .item ---- */

.item {
  float: left;
  width: 100%;
  height: 150px;
  margin-bottom: 20px;
  background-color: #f9f9f9;
}

@media screen and (min-width: 768px) {
  .item {
    width: 150px;
  }
}

.isotope-img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-size: cover;
  background-position: center;
}

/* 2 cols + 1 gutter = 100 + 20 + 100 */
.item.width2 { width: 100%; }
@media screen and (min-width: 768px) {
  .item.width2 { width: 320px; }
}
.item.height2 { height: 320px; }