.gallery-items { font-size: 0px; }

.gallery-item {
  display: inline-block;
  vertical-align: top;
  -webkit-transition: height 500ms ease;
  -o-transition: height 500ms ease;
  transition: height 500ms ease;
}

.gallery-expander {
    position: absolute;
    left: 0px;
    right: 0px;
    margin-right: 20px;
    overflow: hidden;
    max-height: 0;
    -webkit-transition: max-height 500ms ease;
    -o-transition: max-height 500ms ease;
    transition: max-height 500ms ease;
}

.gallery-contents { 
    position: relative;
    margin: 0px 0px 20px 0px;
}

.gallery-contents:after {
  display: block;
  position: absolute;
  bottom: -40px;
  left: 50%;
  margin-left: -15px;
  width: 0;
  height: 0px;
  content: '';
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom-style: solid;
  border-bottom-width: 0px;
  -webkit-transition: border-bottom-width 500ms ease;
  -o-transition: border-bottom-width 500ms ease;
  transition: border-bottom-width 500ms ease;
}

.gallery-item.active .gallery-contents:after { 
    border-bottom-width: 26px; 
}

.gallery-item > ul {
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: center;
}

.gallery-item {
  text-align: left;
  margin: 0 0px;
  padding: 0px 0;
}

.gallery-item .thumbnail {
  position: relative;
  width: 300px;
  height: 300px;
  overflow: hidden;
  cursor: pointer;
}

.gallery-item .thumbnail > img {
  position: absolute;
  top: 50%;
  margin-top: -300px;
  max-width: 300px;
}

.gallery-expander-contents {
  margin: 0 auto;
  padding: 0px;
}

@media (min-width: 640px) and (max-width: 999px) {

}
@media (max-width: 639px) {

}

.gallery-expander-contents:after {
  clear: both;
  display: table;
  content: '';
}

@media (min-width: 640px) and (max-width: 999px) {

}
@media (max-width: 639px) {

}

@media (min-width: 640px) and (max-width: 999px) {

}
@media (max-width: 639px) {

}