/*********************
BREAKPOINTS
*********************/
.PageLinks figure, .zone_pages figure {
  background-color: transparent !important;
}
.PageLinks figure figcaption, .zone_pages figure figcaption {
  padding: 0.625rem 0 1.25rem 0 !important;
}
@media (min-width: 600px) {
  .PageLinks figure figcaption, .zone_pages figure figcaption {
    padding: 1.25rem 0 1.25rem 0 !important;
  }
  .PageLinks figure figcaption span, .zone_pages figure figcaption span {
    display: block;
    font-weight: 300;
  }
}

.TextOver figure {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}
.TextOver figure p {
  display: none;
}
.TextOver figure img {
  position: relative;
  z-index: 0;
  transition: all 0.5s linear;
}
.TextOver figure figcaption {
  position: absolute;
  z-index: 9999;
  bottom: 0;
  left: 0px;
  width: 100%;
  padding: 0px !important;
  height: 100%;
}
.TextOver figure figcaption h4, .TextOver figure figcaption h4 a {
  color: #f0f1f1 !important;
}
.TextOver figure figcaption h4 {
  transition: all 0.2s linear;
  position: absolute;
  bottom: 0px;
  width: 100%;
  padding: 6rem 1.6rem 1.5rem 1.6rem !important;
  margin: 0px !important;
  opacity: 0;
  filter: alpha(opacity=0);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.88) 100%);
}
@media (min-width: 600px) {
  .TextOver figure figcaption h4 {
    font-size: 1.4em;
    line-height: 1.25em;
    letter-spacing: -0.5px;
  }
}
.TextOver figure figcaption:hover h4 {
  opacity: 1;
  filter: alpha(opacity=100);
}
.TextOver figure .btn {
  display: none;
}

.zone_pages .Tags, .splide__list .Tags, .mix-container .Tags {
  margin-top: 1.25rem;
  position: absolute;
  bottom: 2.5rem;
}
.zone_pages figure, .splide__list figure, .mix-container figure {
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  background-color: var(--white);
  color: var(--text);
  text-align: left;
  overflow: hidden;
  margin-bottom: 1.25rem;
}
.zone_pages figure figcaption, .splide__list figure figcaption, .mix-container figure figcaption {
  padding: 5.5vw;
}
@media (min-width: 600px) {
  .zone_pages figure figcaption, .splide__list figure figcaption, .mix-container figure figcaption {
    padding: 2.5rem;
  }
}
.zone_pages figure figcaption h4, .zone_pages figure figcaption h4 a, .splide__list figure figcaption h4, .splide__list figure figcaption h4 a, .mix-container figure figcaption h4, .mix-container figure figcaption h4 a {
  color: var(--subs);
}
.zone_pages figure figcaption a, .zone_pages figure figcaption p, .splide__list figure figcaption a, .splide__list figure figcaption p, .mix-container figure figcaption a, .mix-container figure figcaption p {
  color: var(--text);
}
.zone_pages figure figcaption .datePub, .splide__list figure figcaption .datePub, .mix-container figure figcaption .datePub {
  color: var(--subs);
  margin-bottom: 0.3125rem;
}
.zone_pages figure figcaption p, .splide__list figure figcaption p, .mix-container figure figcaption p {
  margin-bottom: 0.625rem;
}
.zone_pages figure figcaption .btn, .splide__list figure figcaption .btn, .mix-container figure figcaption .btn {
  bottom: 1.25rem;
}
.zone_pages figure img, .splide__list figure img, .mix-container figure img {
  -webkit-border-top-left-radius: 0px;
  -webkit-border-top-right-radius: 0px;
  -moz-border-radius-topleft: 0px;
  -moz-border-radius-topright: 0px;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
}
.zone_pages figure:hover, .splide__list figure:hover, .mix-container figure:hover {
  transition: all 0.2s linear;
}
.zone_pages figure:hover .btn, .splide__list figure:hover .btn, .mix-container figure:hover .btn {
  background: var(--grey-dark);
  color: var(--white);
}

.splide__list figure {
  margin-bottom: 0px;
}

/* 2. Filters
---------------------------------------------------------------------- */
.PageLinks_Filters {
  padding: 0;
  list-style: none;
  font-weight: 300;
  font-size: 21px;
  margin: 0 0 2.5rem 0;
  color: var(--text) !important;
}
@media (min-width: 1300px) {
  .PageLinks_Filters {
    font-size: 1.4em;
  }
}
.PageLinks_Filters li {
  display: inline-block;
  margin: 0 0.3125rem 0 0.3125rem;
}
.PageLinks_Filters li span {
  color: var(--black);
  opacity: 0.6;
  filter: alpha(opacity=60);
}
.PageLinks_Filters li span:hover, .PageLinks_Filters li span.mixitup-control-active {
  opacity: 1;
  filter: alpha(opacity=100);
}
.PageLinks_Filters li span:hover {
  cursor: pointer;
}
.PageLinks_Filters li.mixitup-control-active span {
  opacity: 1;
  filter: alpha(opacity=100);
}
.PageLinks_Filters.PageLinks_Align-left {
  text-align: left;
}
.PageLinks_Filters.PageLinks_Align-left li:first-child {
  margin-left: 0;
}
.PageLinks_Filters.PageLinks_Align-right {
  text-align: right;
}
.PageLinks_Filters.PageLinks_Align-right li:last-child {
  margin-right: 0;
}
.PageLinks_Filters.PageLinks_Align-centered {
  text-align: center;
}

.column-counter {
  font-size: 1px;
}

/* 3. Grid Breakpoints & Column Counts
---------------------------------------------------------------------- */
@media (max-width: 599px) {
  .XS-1 .mix, .XS-1 .gap {
    width: calc(100%);
  }

  .XS-2 .mix, .XS-2 .gap {
    width: calc(100%/2 - (((2 - 1) * 1.25rem) / 2));
  }

  .XS-3 .mix, .XS-3 .gap {
    width: calc(100%/3 - (((3 - 1) * 1.25rem) / 2));
  }

  .XS-4 .mix, .XS-4 .gap {
    width: calc(100%/4 - (((4 - 1) * 1.25rem) / 2));
  }

  .XS-5 .mix, .XS-5 .gap {
    width: calc(100%/5 - (((5 - 1) * 1.25rem) / 2));
  }
}
@media (min-width: 600px) {
  .SM-1 .mix, .SM-1 .gap {
    width: calc(100%);
  }

  .SM-2 .mix, .SM-2 .gap {
    width: calc(100%/2 - (((2 - 1) * 1.25rem) / 2));
  }

  .SM-3 .mix, .SM-3 .gap {
    width: calc(100%/3 - (((3 - 1) * 1.25rem) / 2));
  }

  .SM-4 .mix, .SM-4 .gap {
    width: calc(100%/4 - (((4 - 1) * 1.25rem) / 2));
  }

  .SM-5 .mix, .SM-5 .gap {
    width: calc(100%/5 - (((5 - 1) * 1.25rem) / 2));
  }
}
@media (min-width: 1024px) {
  .MD-1 .mix, .MD-1 .gap {
    width: calc(100%);
  }

  .MD-2 .mix, .MD-2 .gap {
    width: calc(100%/2 - (((2 - 1) * 1.25rem) / 2));
  }

  .MD-3 .mix, .MD-3 .gap {
    width: calc(100%/3 - (((3 - 1) * 1.25rem) / 2));
  }

  .MD-4 .mix, .MD-4 .gap {
    width: calc(100%/4 - (((4 - 1) * 1.25rem) / 2));
  }

  .MD-5 .mix, .MD-5 .gap {
    width: calc(100%/5 - (((5 - 1) * 1.25rem) / 2));
  }
}
@media (min-width: 1300px) {
  .ST-1 .mix, .ST-1 .gap {
    width: calc(100%);
  }

  .ST-2 .mix, .ST-2 .gap {
    width: calc(100%/2 - (((2 - 1) * 1.25rem) / 2));
  }

  .ST-3 .mix, .ST-3 .gap {
    width: calc(100%/3 - (((3 - 1) * 1.25rem) / 2));
  }

  .ST-4 .mix, .ST-4 .gap {
    width: calc(100%/4 - (((4 - 1) * 1.25rem) / 2));
  }

  .ST-5 .mix, .ST-5 .gap {
    width: calc(100%/5 - (((5 - 1) * 1.25rem) / 2));
  }
}
@media (min-width: 1800px) {
  .LG-1 .mix, .LG-1 .gap {
    width: calc(100%);
  }

  .LG-2 .mix, .LG-2 .gap {
    width: calc(100%/2 - (((2 - 1) * 1.25rem) / 3));
  }

  .LG-3 .mix, .LG-3 .gap {
    width: calc(100%/3 - (((3 - 1) * 1.25rem) / 3));
  }

  .LG-4 .mix, .LG-4 .gap {
    width: calc(100%/4 - (((4 - 1) * 1.25rem) / 3));
  }

  .LG-5 .mix, .LG-5 .gap {
    width: calc(100%/5 - (((5 - 1) * 1.25rem) / 3));
  }

  .LG-6 .mix, .LG-6 .gap {
    width: calc(100%/6 - (((6 - 1) * 1.25rem) / 3));
  }
}
.BWImages img, .BWImages .jarallax, .BWImages:hover img, .BWImages:hover .jarallax, .BWImages:active img, .BWImages:active .jarallax, .BWImages:focus img, .BWImages:focus .jarallax, .BWOnHover img, .BWOnHover .jarallax, .ColourOnHover:hover img, .ColourOnHover:hover .jarallax, .ColourOnHover:active img, .ColourOnHover:active .jarallax, .ColourOnHover:focus img, .ColourOnHover:focus .jarallax {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
  transform: scale(1.1, 1.1);
  -ms-transform: scale(1.1, 1.1);
  -webkit-transform: scale(1.1, 1.1);
  -webkit-transform: translateZ(0);
  -webkit-perspective: 1000;
  -webkit-backface-visibility: hidden;
  transition: all 0.2s linear;
}

.BWOnHover:hover img, .BWOnHover:hover .jarallax, .BWOnHover:active img, .BWOnHover:active .jarallax, .BWOnHover:focus img, .BWOnHover:focus .jarallax {
  -webkit-filter: grayscale(0%);
  -moz-filter: grayscale(0%);
  -ms-filter: grayscale(0%);
  -o-filter: grayscale(0%);
  filter: grayscale(0%);
  transform: scale(1.1, 1.1);
  -ms-transform: scale(1.1, 1.1);
  -webkit-transform: scale(1.1, 1.1);
  -webkit-transform: translateZ(0);
  -webkit-perspective: 1000;
  -webkit-backface-visibility: hidden;
  transition: all 0.2s linear;
}
