/* the containers */
.gallery {
  width: 100%;
  margin-top: 35px; }

.gallery-stage {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 768px;
  margin-bottom: 10px; }
  @media only screen and (max-width: 1280px) {
    .gallery-stage {
      height: 745px; } }
  @media only screen and (max-width: 980px) {
    .gallery-stage {
      height: 565px; } }
  @media only screen and (max-width: 800px) {
    .gallery-stage {
      height: 450px; } }
  @media only screen and (max-width: 768px) {
    .gallery-stage {
      height: 430px; } }
  @media only screen and (max-width: 640px) {
    .gallery-stage {
      height: 355px; } }
  @media only screen and (max-width: 570px) {
    .gallery-stage {
      height: 320px; } }
  @media only screen and (max-width: 480px) {
    .gallery-stage {
      height: 265px; } }
  @media only screen and (max-width: 360px) {
    .gallery-stage {
      height: 185px; } }
  @media only screen and (max-width: 320px) {
    .gallery-stage {
      height: 160px; } }

.gallery-slide {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #f8f8f8; }
  .gallery-slide img {
    display: block;
    height: 100%;
    width: auto;
    margin: 0px auto; }

/* the caption */
a.gallery-caption-toggle {
  position: absolute;
  bottom: 1%;
  right: 20px;
  z-index: 50;
  color: #fff; }

.gallery-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.4);
  color: white;
  width: 100%;
  padding: 5px 10px;
  margin: 0;
  font-style: italic; }

/* thumbnails and data */
.gallery-data {
  width: 100%;
  margin: 0;
  padding: 0; }
  .gallery-data li {
    list-style: none;
    float: left;
    box-sizing: border-box;
    width: 11.625%;
    margin-right: 1%;
    margin-bottom: 1%;
    padding: 0; }
    .gallery-data li:nth-of-type(8n) {
      margin-right: 0%; }
    @media only screen and (max-width: 570px) {
      .gallery-data li {
        float: left;
        box-sizing: border-box;
        width: 24.25%;
        margin-right: 1%;
        margin-bottom: 1%;
        padding: 0; }
        .gallery-data li:nth-of-type(4n) {
          margin-right: 0%; } }
    .gallery-data li .gallery-thumbnail {
      display: block;
      opacity: 0.7;
      width: 100%;
      height: auto; }
      .gallery-data li .gallery-thumbnail:hover {
        cursor: pointer;
        opacity: 1; }
    .gallery-data li .gallery-slide {
      display: none; }

/* pagination */
.gallery-pages ul {
  display: block;
  padding: 0px;
  width: auto;
  float: left; }
.gallery-pages li {
  float: left;
  list-style: none;
  margin-right: 10px; }