.o-image-gallery{
  position:relative;
  background-color:var(--c-black-5);
  padding-top:var(--h-space-15);
  padding-bottom:var(--h-space-10);
}

@media (min-width: 1280px){

.o-image-gallery{
    padding-top:var(--h-space-20);
    padding-bottom:var(--h-space-16)
}
  }

.c-image-gallery__item{
    cursor:pointer;
  }

@media (min-width: 768px){

.c-image-gallery__item{
      width:calc(50% - 1.75rem);
      padding-bottom:var(--h-space-4)
  }
    }

.c-image-gallery__item figure{
      overflow:hidden;
      opacity:1;
      -webkit-transition:opacity 0.50s var(--cubic-slow-in);
      transition:opacity 0.50s var(--cubic-slow-in);
    }

.c-image-gallery__item:hover figure, .c-image-gallery__item:focus figure{
        opacity:.75;
      }

.c-image-gallery__img{
    display:block;
    width:100%;
    height:auto;
    -o-object-fit:cover;
       object-fit:cover;
    -webkit-transition:-webkit-transform 0.3s ease;
    transition:-webkit-transform 0.3s ease;
    transition:transform 0.3s ease;
    transition:transform 0.3s ease, -webkit-transform 0.3s ease;
  }

.c-image-gallery__caption{
    display:block;
    color:var(--theme-color-secondary-text);
    margin-top:var(--h-space-2-5);
  }

@media (min-width: 1280px){

.c-image-gallery__caption{
      width:75%
  }
    }

.pswp img{
  -webkit-box-shadow:0 0 var(--h-space-5) var(--h-space-0-5) rgba(0, 0, 0, 0.20);
          box-shadow:0 0 var(--h-space-5) var(--h-space-0-5) rgba(0, 0, 0, 0.20);
}

.pswp__dynamic-caption{
  max-width:40.375rem;
  font-size:var(--f-size-body-xs);
  font-weight:300;
  line-height:145%;
  color:var(--c-white);
}

.pswp__dynamic-caption--mobile{
    padding:1rem 1rem var(--h-space-30) 1rem;
  }

.pswp__dynamic-caption p{
    font-size:var(--f-size-body-xs);
    font-weight:300;
    line-height:145%;
  }

.pswp__button--close{
    margin-right:var(--h-space-10);
    margin-top:var(--h-space-10);
    width:var(--h-space-6);
    height:var(--h-space-6);
  }

.pswp__button--arrow--prev,
  .pswp__button--arrow--next{
    position:absolute;
    bottom:var(--h-space-12);
    width:var(--h-space-5);
    height:var(--h-space-5);
    background:none !important;
    border:none;
    cursor:pointer;
  }

.pswp__button--arrow--prev svg, .pswp__button--arrow--next svg{
      width:100%;
      height:100%;
    }

.pswp__button--arrow--prev{
    left:calc(50% - var(--h-space-13));
  }

.pswp__button--arrow--next{
    left:calc(50% + var(--h-space-14));
  }

.pswp__counter{
  position:absolute;
  left:50%;
  margin:0;
  bottom:var(--h-space-10);
  color:var(--c-white);
  text-align:center;
  font-size:var(--f-size-base);
  font-weight:500;
  line-height:130%;
}