.view-image-gallery img {
  max-width: 100%;
  height: auto;
  display: block;
}

.view-image-gallery + .views-query-info {
  clear: both;
}

.view-image-gallery a.imagefield {
  float: left;
  margin: 0 20px 20px 0;
}

.view-image-gallery .views-field-field-album-image-fid a:hover,
.view-image-gallery .views-field-field-album-image-fid a:active,
.view-image-gallery .views-field-field-album-image-fid a:focus {
  background-color: transparent;
  outline: 0 none;
}

.view-image-gallery a > img {
  border: 6px solid #e9e9e9;
  opacity: 0.85;
  -webkit-transform: translateZ(0px);
  -webkit-transition: all 0.6s ease 0s;
  transition: all 0.6s ease 0s;
}

.view-image-gallery a:hover > img,
.view-image-gallery a:active > img,
.view-image-gallery a:focus > img {
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
  opacity: 1;
  -webkit-transform: scale(1.15) rotate(-5deg);
  transform: scale(1.15) rotate(-5deg);
  -webkit-transition-delay: 0.4s;
  transition-delay: 0.4s;
  z-index: 999;
}

/* IE8 and higher Simple Gried System */
.view-image-gallery [class*='col-'] {
  float: left;
}

.view-image-gallery .grid {
  margin-bottom: 20px;
}

.view-image-gallery .grid:after {
  content: "";
  display: table;
  clear: both;
}

/* Equal sizing for gutters */
.view-image-gallery div,
.view-image-gallery div:after,
.view-image-gallery div:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* Padding being added */
.view-image-gallery [class*='col-'] {
  padding-right: 20px;
}

/* normally we can use this, but not working well with gallery
[class*='col-']:last-of-type {
  padding-right: 0;
}
*/

/* Equal Size columns */
.view-image-gallery .col-2 {
  width: 50%;
}

.view-image-gallery .col-3 {
  width: 33.333333%;
}

.view-image-gallery .col-4 {
  width: 25%;
}

.view-image-gallery .col-5 {
  width: 20%;
}