/* ---- grid ---- */

.grid {
  display: block;
}

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

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

.item {
  float: left;
  height: auto;
}

.item img {
  width: 100%;
}

/*------------------------------------*\
  RESPONSIVE
  Media Queries Bootstrap 3
\*------------------------------------*/

@media(max-width:767px){

  /* 1 columns, percentage width */
  .item,
  .grid-sizer {
    width: 97.7%;
    margin-left: 1.15%;
    margin-right: 1.15%;
    margin-bottom: 2.3%;
  }

  .item-width2 { width: 97.7%; }

  .item, .grid-sizer, .item-width2 { margin-left: 1.15%; margin-right: 1.15%; margin-bottom: 2.3%; }

}
@media(min-width:768px){

  /* 2 columns, percentage width */
  .item,
  .grid-sizer {
    width: 47.7%;
    margin-left: 1.15%;
    margin-right: 1.15%;
    margin-bottom: 2.3%;
  }

  .item-width2 { width: 97.7%; }

  .item, .grid-sizer, .item-width2 { margin-left: 1.15%; margin-right: 1.15%; margin-bottom: 2.3%; }

}
@media(min-width:992px){
  
  /* 3 columns, percentage width */
  .item,
  .grid-sizer {
    width: 31%;
  }

  .item-width2 { width: 64.3%; }

  .item, .grid-sizer, .item-width2 { margin-left: 1.15%; margin-right: 1.15%; margin-bottom: 2.3%; }

}


@media(min-width:1200px){

  /* 3 columns, percentage width */
  .item,
  .grid-sizer {
    width: 31%;
  }

  .item-width2 { width: 64.3%; }

  .item, .grid-sizer, .item-width2 { margin-left: 1.15%; margin-right: 1.15%; margin-bottom: 2.3%; }

}