.hvp-zoom img {
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hvp-zoom:hover img {
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
}

/* Zoom Out #1 */
.hvp-zoom03 img {
  -webkit-transform: scale(1.5);
  transform: scale(1.5);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hvp-zoom03:hover img {
  -webkit-transform: scale(1);
  transform: scale(1);
}

/* Slide */
.hvp-slide img {
  margin-left: 15px;
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hvp-slide:hover img {
  margin-left: 0;
}

/* Rotate */
.hvp-hover06 img {
  -webkit-transform: rotate(15deg) scale(1.4);
  transform: rotate(15deg) scale(1.4);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hvp-hover06:hover img {
  -webkit-transform: rotate(0) scale(1);
  transform: rotate(0) scale(1);
}

/* Blur */
.hvp-hover07 img {
  -webkit-filter: blur(3px);
  filter: blur(3px);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hvp-hover07:hover img {
  -webkit-filter: blur(0);
  filter: blur(0);
}

/* Gray Scale */
.hvp-hover08 img {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hvp-hover08:hover img {
  -webkit-filter: grayscale(0);
  filter: grayscale(0);
}

/* Sepia */
.hvp-hover09 img {
  -webkit-filter: sepia(100%);
  filter: sepia(100%);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hvp-hover09:hover img {
  -webkit-filter: sepia(0);
  filter: sepia(0);
}

/* Blur + Gray Scale */
.hvp-hover10 img {
  -webkit-filter: grayscale(0) blur(0);
  filter: grayscale(0) blur(0);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hvp-hover10:hover img {
  -webkit-filter: grayscale(100%) blur(3px);
  filter: grayscale(100%) blur(3px);
}

/* Opacity #1 */
.hvp-hover11 img {
  opacity: 1;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hvp-hover11:hover img {
  opacity: .5;
}

/* Opacity #2 */
.hvp-hover12 {
  background: #1abc9c;
}

.hvp-hover12 img {
  opacity: 1;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hvp-hover12:hover img {
  opacity: .5;
}

/* Flashing */
.hvp-hover13:hover img {
  opacity: 1;
  -webkit-animation: hvp-flash 1.5s;
  animation: hvp-flash 1.5s;
}

@-webkit-keyframes hvp-flash {
  0% {
    opacity: .4;
  }

  100% {
    opacity: 1;
  }
}

@keyframes hvp-flash {
  0% {
    opacity: .4;
  }

  100% {
    opacity: 1;
  }
}

/* Shine */
.hvp-hover14 {
  position: relative;
}

.hvp-hover14::before {
  position: absolute;
  top: 0;
  left: -75%;
  z-index: 2;
  display: block;
  content: '';
  width: 50%;
  height: 100%;
  background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%);
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .3) 100%);
  -webkit-transform: skewX(-25deg);
  transform: skewX(-25deg);
}

.hvp-hover14:hover::before {
  -webkit-animation: hvp-shine .75s;
  animation: hvp-shine .75s;
}

@-webkit-keyframes hvp-shine {
  100% {
    left: 125%;
  }
}

@keyframes hvp-shine {
  100% {
    left: 125%;
  }
}

/* Circle */
.hvp-hover15 {
  position: relative;
}

.hvp-hover15::before {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  display: block;
  content: '';
  width: 0;
  height: 0;
  background: rgba(255, 255, 255, .2);
  border-radius: 100%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 0;
}

.hvp-hover15:hover::before {
  -webkit-animation: hvp-circle .75s;
  animation: hvp-circle .75s;
}

@-webkit-keyframes hvp-circle {
  0% {
    opacity: 1;
  }

  40% {
    opacity: 1;
  }

  100% {
    width: 200%;
    height: 200%;
    opacity: 0;
  }
}

@keyframes hvp-circle {
  0% {
    opacity: 1;
  }

  40% {
    opacity: 1;
  }

  100% {
    width: 200%;
    height: 200%;
    opacity: 0;
  }
}

/** Zoom In + Grayscale **/
.hvp-hover16 img {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hvp-hover16:hover img {
  -webkit-filter: grayscale(0);
  filter: grayscale(0);
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
}

/** Blur + Zoom In **/
.hvp-hover17 img {
  -webkit-filter: blur(3px);
  filter: blur(3px);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hvp-hover17:hover img {
  -webkit-filter: blur(0);
  filter: blur(0);
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
}

/** Single Image Hover styles  **/
.hvp-container {
  position: relative !important;
  display: inline-block !important;
  cursor: pointer !important;
  width: 100%;
  overflow: hidden;
}

/* shared image positioning */
.hvp-container .img-front,
.hvp-container .img-back,
.splide__slide img {
  width: 100% !important;
  height: auto;
  object-fit: cover;
  top: 0;
  left: 0;
  position: absolute;
}

.hvp-container.hvp-fade .img-front {
  opacity: 1;
}

.hvp-container.hvp-fade .img-back {
  opacity: 0;
}

.hvp-container.hvp-instant .img-back {
  display: none;
}

.hvp-container.hvp-instant .img-front {
  display: block;
}

/* faded variant */
.hvp-fade .img-front,
.hvp-fade .img-back {
  transition: opacity var(--hvp-fade-duration, 300ms) ease-in-out;
}

.hvp-alternate-processed:hover .hvp-fade .img-front {
  opacity: 0;
}

.hvp-alternate-processed:hover .hvp-fade .img-back {
  opacity: 1;
}

/* instant switch variant */
.hvp-alternate-processed:hover .hvp-instant .img-front {
  display: none;
}

.hvp-alternate-processed:hover .hvp-instant .img-back {
  display: block;
}

.hvp-instant.hvp-active .img-front {
  display: none;
}

.hvp-instant.hvp-active .img-back {
  display: block;
}

.hvp-fade.hvp-active .img-front {
  opacity: 0;
}

.hvp-fade.hvp-active .img-back {
  opacity: 1;
}

/* Splide settings */
.splide__track {
  height: 100%;
}

.splide img {
  cursor: var(--hvp-click-cursor) !important;
}

body.hvp-gallery-open .hvp-container img,
body.hvp-gallery-open .hvp-container,
body.hvp-gallery-open .splide:not(.hvp-gallery-main):not(.hvp-gallery-thumbs) img {
  cursor: zoom-in !important;
}

.splide__arrow svg {
  fill: var(--hvp-arrow-color) !important;
}

.splide__arrows--hover {
  opacity: 0;
  transition: opacity 0.1s;
}

.splide:hover .splide__arrows--hover {
  opacity: 1;
}

.splide__arrow--top {
  top: 20px !important;
}

.splide__arrow--middle {
  top: 50% !important;
}

.splide__arrow--bottom {
  bottom: 20px !important;
  top: auto !important;
}


@media (max-width: 640px) {
  .splide__arrows--no-mobile {
    display: none;
  }
}

.splide__arrow--prev svg {
  transform: none !important;
}


.splide__pagination__page {
  background: var(--hvp-unselected-bullet-color) !important;
}

.splide__pagination__page.is-active {
  background: var(--hvp-selected-bullet-color) !important;
}

.splide__pagination--top {
  top: 0.5em;
  bottom: auto !important;
}

.splide__pagination--bottom {
  bottom: 0.5em;
  top: auto !important;
}

.splide__pagination--hover {
  opacity: 0;
  transition: opacity 0.3s;
}

.splide:hover .splide__pagination--hover {
  opacity: 1;
}


.splide__pagination.none {
  display: none;
}


/* Minimal */
.splide__pagination.minimal .splide__pagination__page {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--hvp-unselected-bullet-color) !important;
  border: 1px solid var(--hvp-unselected-bullet-color) !important;
}

.splide__pagination.minimal .splide__pagination__page.is-active {
  background: var(--hvp-selected-bullet-color) !important;
  border-color: var(--hvp-selected-bullet-color) !important;
}

/* Outlined */
.splide__pagination.outlined .splide__pagination__page {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff !important;
  border: 1px solid var(--hvp-unselected-bullet-color) !important;
}

.splide__pagination.outlined .splide__pagination__page.is-active {
  background: var(--hvp-selected-bullet-color) !important;
  border-color: var(--hvp-selected-bullet-color) !important;
}

/* Zoomed */
.splide__pagination.zoomed .splide__pagination__page {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.splide__pagination.zoomed .splide__pagination__page.is-active {
  width: 12px;
  height: 12px;
}

/* Pillar */
.splide__pagination.pillar .splide__pagination__page {
  width: 20px;
  height: 4px;
  border-radius: 2px;
}

/* Pillar Half */
.splide__pagination.pillar-half .splide__pagination__page {
  width: 10px;
  height: 4px;
  border-radius: 2px;
}

.splide__pagination.numbered .splide__pagination__page {
  position: relative;
  background: transparent;
  width: 20px;
  height: 20px;
  border: none;
  font-size: 12px;
  font-weight: normal;
}

/* Gallery styles */

.hvp-gallery-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.hvp-gallery-content {
  position: relative;
  width: 95vw;
  max-width: 1200px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.hvp-gallery-close {
  position: absolute;
  top: -40px;
  right: 0;
  font-size: 32px;
  background: none;
  border: none;
  color: white;
  cursor: pointer;
}

.hvp-gallery-main {
  width: 100%;
}

.hvp-gallery-main img {
  width: auto;
  max-width: 100%;
  max-height: 80vh;
  /* prevents cut-off */
  object-fit: contain;
  display: block;
  margin: 0 auto;
  position: relative !important;
}

.hvp-gallery-thumbs {
  margin-top: 8px;
  /* reduced spacing */
  width: 100%;
}

.hvp-gallery-thumbs img {
  width: var(--hvp-thumb-size, 80px);
  height: var(--hvp-thumb-size, 80px);
  object-fit: cover;
  cursor: pointer;
  border-radius: 3px;
  position: relative !important;
}

.hvp-gallery-thumbs .splide__track--nav>.splide__list>.splide__slide.is-active {
  border: 2px solid var(--hvp-gallery-main-color);
}

.hvp-gallery-main .splide__arrow {
  background: var(--hvp-gallery-main-color) !important;
  height: var(--hvp-gallery-arrow-size);
  width: var(--hvp-gallery-arrow-size);
}

.hvp-gallery-main .splide__arrow svg {
  stroke-linecap: square;
  stroke-width: 8px;
  vertical-align: middle;
  fill: var(--hvp-gallery-secondary-color) !important;
  transform: none;
}

.hvp-gallery-main .splide__arrow--prev svg {
  transform: scaleX(-1) !important;
}