.wbox-gallery {
  width: 100%;
  background: #000;
}

/* clear fix */
.wbox-gallery:after {
  content: "";
  display: block;
  clear: both;
}

.wbox-gallery img {
  max-width: 100%;
  /* max-height: 100%; */
}

.wbg-element,
.wbg-element-sizer {
  width: 25%;
  line-height: 0;
  box-sizing: content-box;
}

.wbg-element-gutter-sizer {
  width: 0;
}

@media (max-width: 900px) {
  .wbg-element {
    width: 50%;
  }
}

/* ------------------------------------------------------------------------------------
Gutter Option 5, 10, 15, 20, 25, 30
------------------------------------------------------------------------------------ */
/* Gutter 5 */

.wbg-gutter5 .wbg-element,
.wbg-gutter5 .wbg-element-sizer {
  width: calc(25% - 3.666px);
  margin-bottom: 5px;
}

.wbg-gutter5 .wbg-element-gutter-sizer {
  width: 5px;
}
@media (max-width: 900px) {
  .wbg-gutter5 .wbg-element {
    width: calc(50% - 3px);
  }
}

/* Gutter 10 */

.wbg-gutter10 .wbg-element,
.wbg-gutter10 .wbg-element-sizer {
  width: calc(25% - 7.666px);
  margin-bottom: 10px;
}

.wbg-gutter10 .wbg-element-gutter-sizer {
  width: 10px;
}

@media (max-width: 900px) {
  .wbg-gutter10 .wbg-element {
    width: calc(50% - 5px);
  }
}

/* Gutter 15 */

.wbg-gutter15 .wbg-element,
.wbg-gutter15 .wbg-element-sizer {
  width: calc(25% - 11.333px);
  margin-bottom: 15px;
}

.wbg-gutter15 .wbg-element-gutter-sizer {
  width: 15px;
}

@media (max-width: 900px) {
  .wbg-gutter15 .wbg-element {
    width: calc(50% - 8px);
  }
}

/* Gutter 20 */

.wbg-gutter20 .wbg-element,
.wbg-gutter20 .wbg-element-sizer {
  width: calc(25% - 15.333px);
  margin-bottom: 20px;
}

.wbg-gutter20 .wbg-element-gutter-sizer {
  width: 20px;
}

@media (max-width: 900px) {
  .wbg-gutter20 .wbg-element {
    width: calc(50% - 10px);
  }
}

/* Gutter 25 */

.wbg-gutter25 .wbg-element,
.wbg-gutter25 .wbg-element-sizer {
  width: calc(25% - 18.666px);
  margin-bottom: 25px;
}

.wbg-gutter25 .wbg-element-gutter-sizer {
  width: 25px;
}

@media (max-width: 900px) {
  .wbg-gutter25 .wbg-element {
    width: calc(50% - 13.666px);
  }
}

/* Gutter 30 */

.wbg-gutter30 .wbg-element,
.wbg-gutter30 .wbg-element-sizer {
  width: calc(25% - 22.333px);
  margin-bottom: 30px;
}

.wbg-gutter30 .wbg-element-gutter-sizer {
  width: 30px;
}

@media (max-width: 900px) {
  .wbg-gutter30 .wbg-element {
    width: calc(50% - 16px);
  }
}