/*
 Bold Three Images Hover
 */
.brxe-bld-three-images-hover {
  --bld-three-images-gap: max(9rem, 8vw);
  --bld-three-images-small: 20%;
  --bld-three-images-large: 33.333%;
  --bld-three-images-small-height: 60%;
  --bld-three-images-large-height: 100%;
  --bld-three-images-aspect-ratio: 12 / 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--bld-three-images-gap);
  width: 100%;
  aspect-ratio: var(--bld-three-images-aspect-ratio);
}
@media (max-width: 1200px) {
  .brxe-bld-three-images-hover {
    --bld-three-images-gap: 5vw;
    --bld-three-images-small: 22%;
    --bld-three-images-large: 36%;
    --bld-three-images-aspect-ratio: 20 / 9;
  }
}
@media (max-width: 991px) {
  .brxe-bld-three-images-hover {
    --bld-three-images-gap: 3vw;
    --bld-three-images-small: 24%;
    --bld-three-images-large: 40%;
    --bld-three-images-aspect-ratio: 2 / 1;
  }
}
@media (max-width: 767px) {
  .brxe-bld-three-images-hover {
    --bld-three-images-gap: 0.8rem;
    --bld-three-images-small: 25%;
    --bld-three-images-large: 44%;
    --bld-three-images-small-height: 57%;
    --bld-three-images-aspect-ratio: 20 / 11;
  }
}
.brxe-bld-three-images-hover .image-wrapper {
  flex: 0 1 var(--bld-three-images-small);
  height: var(--bld-three-images-small-height);
  min-width: 0;
  overflow: hidden;
  transition: flex-basis 0.45s ease, height 0.45s ease;
}
@media (max-width: 767px) {
  .brxe-bld-three-images-hover .image-wrapper {
    transition-duration: 0.7s;
  }
}
@media (prefers-reduced-motion: reduce) {
  .brxe-bld-three-images-hover .image-wrapper {
    transition: none;
  }
}
.brxe-bld-three-images-hover .image-wrapper img,
.brxe-bld-three-images-hover .image-wrapper video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.brxe-bld-three-images-hover.middle-image-large .leftImage,
.brxe-bld-three-images-hover.middle-image-large .rightImage {
  flex-basis: var(--bld-three-images-small);
  height: var(--bld-three-images-small-height);
}
.brxe-bld-three-images-hover.middle-image-large .middleImage {
  flex-basis: var(--bld-three-images-large);
  height: var(--bld-three-images-large-height);
}
.brxe-bld-three-images-hover.middle-image-large.is-active .leftImage,
.brxe-bld-three-images-hover.middle-image-large.is-active .rightImage {
  flex-basis: var(--bld-three-images-large);
  height: var(--bld-three-images-large-height);
}
.brxe-bld-three-images-hover.middle-image-large.is-active .middleImage {
  flex-basis: var(--bld-three-images-small);
  height: var(--bld-three-images-small-height);
}
@media (hover: hover) and (pointer: fine) {
  .brxe-bld-three-images-hover.middle-image-large:hover .leftImage,
  .brxe-bld-three-images-hover.middle-image-large:hover .rightImage {
    flex-basis: var(--bld-three-images-large);
    height: var(--bld-three-images-large-height);
  }
  .brxe-bld-three-images-hover.middle-image-large:hover .middleImage {
    flex-basis: var(--bld-three-images-small);
    height: var(--bld-three-images-small-height);
  }
}
.brxe-bld-three-images-hover.middle-image-small .leftImage,
.brxe-bld-three-images-hover.middle-image-small .rightImage {
  flex-basis: var(--bld-three-images-large);
  height: var(--bld-three-images-large-height);
}
.brxe-bld-three-images-hover.middle-image-small .middleImage {
  flex-basis: var(--bld-three-images-small);
  height: var(--bld-three-images-small-height);
}
.brxe-bld-three-images-hover.middle-image-small.is-active .leftImage,
.brxe-bld-three-images-hover.middle-image-small.is-active .rightImage {
  flex-basis: var(--bld-three-images-small);
  height: var(--bld-three-images-small-height);
}
.brxe-bld-three-images-hover.middle-image-small.is-active .middleImage {
  flex-basis: var(--bld-three-images-large);
  height: var(--bld-three-images-large-height);
}
@media (hover: hover) and (pointer: fine) {
  .brxe-bld-three-images-hover.middle-image-small:hover .leftImage,
  .brxe-bld-three-images-hover.middle-image-small:hover .rightImage {
    flex-basis: var(--bld-three-images-small);
    height: var(--bld-three-images-small-height);
  }
  .brxe-bld-three-images-hover.middle-image-small:hover .middleImage {
    flex-basis: var(--bld-three-images-large);
    height: var(--bld-three-images-large-height);
  }
}

/*# sourceMappingURL=bld_three_images_hover.css.map */