/* -------------------------------------------------- Mixins */
/*
<div class="progress-circle p{VALUE_OF_PROGRESS} {if VALUE_OF_PROGRESS > 50}over50{/if}">
	<span>{VALUE_OF_PROGRESS}%</span>
	<div class="left-half-clipper">
		<div class="first50-bar"></div>
		<div class="value-bar"></div>
	</div>
</div>
*/
/* ---------------------------------------------------------------------- */
/* -------------------------------------------------- Collage */
.wkCollage {
  background: var(--primary--xlite);
  margin: 0 auto;
  max-width: 192rem;
  padding: 8rem 1.5rem 1.5rem 1.5rem;
}
@media (min-width: 576px) {
  .wkCollage {
    padding: 8rem 2.5rem 2.5rem 2.5rem;
  }
}
@media (min-width: 1366px) {
  .wkCollage {
    padding: 8rem 2.5rem 10rem 2.5rem;
  }
}
.wkCollage .heading {
  max-width: 128rem;
}
.wkCollage__grid {
  display: grid;
  margin: 0 auto;
  max-width: 128rem;
}
@media (min-width: 576px) {
  .wkCollage__grid {
    grid-gap: 0.2rem;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto auto;
  }
}
@media (min-width: 1024px) {
  .wkCollage__grid {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: auto auto;
  }
}
.wkCollage__image {
  align-items: center;
  display: flex;
  justify-content: center;
  overflow: hidden;
  position: relative;
}
@media (-ms-high-contrast: none) and (min-width: 768px), (-ms-high-contrast: active) and (min-width: 768px) {
  .wkCollage__image:nth-child(2) {
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
    -ms-grid-row: 1;
  }
}
@media (-ms-high-contrast: none) and (min-width: 1024px), (-ms-high-contrast: active) and (min-width: 1024px) {
  .wkCollage__image:nth-child(2) {
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
    -ms-grid-row: 1;
  }
}
@media (-ms-high-contrast: none) and (min-width: 768px), (-ms-high-contrast: active) and (min-width: 768px) {
  .wkCollage__image:nth-child(3) {
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
    -ms-grid-row: 2;
  }
}
@media (-ms-high-contrast: none) and (min-width: 1024px), (-ms-high-contrast: active) and (min-width: 1024px) {
  .wkCollage__image:nth-child(3) {
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    -ms-grid-row: 1;
  }
}
@media (-ms-high-contrast: none) and (min-width: 768px), (-ms-high-contrast: active) and (min-width: 768px) {
  .wkCollage__image:nth-child(4) {
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
    -ms-grid-row: 3;
  }
}
@media (-ms-high-contrast: none) and (min-width: 1024px), (-ms-high-contrast: active) and (min-width: 1024px) {
  .wkCollage__image:nth-child(4) {
    -ms-grid-column: 4;
    -ms-grid-column-span: 1;
    -ms-grid-row: 1;
  }
}
@media (-ms-high-contrast: none) and (min-width: 768px), (-ms-high-contrast: active) and (min-width: 768px) {
  .wkCollage__image:nth-child(5) {
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
    -ms-grid-row: 3;
  }
}
@media (-ms-high-contrast: none) and (min-width: 1024px), (-ms-high-contrast: active) and (min-width: 1024px) {
  .wkCollage__image:nth-child(5) {
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
    -ms-grid-row: 2;
  }
}
@media (-ms-high-contrast: none) and (min-width: 768px), (-ms-high-contrast: active) and (min-width: 768px) {
  .wkCollage__image:nth-child(6) {
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
    -ms-grid-row: 4;
  }
}
@media (-ms-high-contrast: none) and (min-width: 1024px), (-ms-high-contrast: active) and (min-width: 1024px) {
  .wkCollage__image:nth-child(6) {
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    -ms-grid-row: 2;
  }
}
@media (-ms-high-contrast: none) and (min-width: 768px), (-ms-high-contrast: active) and (min-width: 768px) {
  .wkCollage__image:nth-child(7) {
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
    -ms-grid-row: 4;
  }
}
@media (-ms-high-contrast: none) and (min-width: 1024px), (-ms-high-contrast: active) and (min-width: 1024px) {
  .wkCollage__image:nth-child(7) {
    -ms-grid-column: 4;
    -ms-grid-column-span: 1;
    -ms-grid-row: 2;
  }
}
.wkCollage__image.first {
  grid-row: span 2;
}
@media (-ms-high-contrast: none) and (min-width: 768px), (-ms-high-contrast: active) and (min-width: 768px) {
  .wkCollage__image.first {
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
  }
}
.wkCollage__image:hover a .wkCollage__title, .wkCollage__image:focus a .wkCollage__title, .wkCollage__image:active a .wkCollage__title {
  background: var(--primary--transparent);
}
.wkCollage__image:hover img, .wkCollage__image:focus img, .wkCollage__image:active img {
  transform: scale(1.1);
  transition: transform 0.6s ease-in-out;
}
.wkCollage__image img {
  transform: scale(1);
  transition: transform 0.6s ease-in-out;
}
.wkCollage__image a {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  position: relative;
  width: 100%;
}
.wkCollage__title {
  align-items: center;
  background: var(--primary--dark--transparent);
  bottom: 1.6rem;
  color: var(--white);
  display: flex;
  font-size: var(--font-size--small);
  font-weight: 500;
  justify-content: center;
  letter-spacing: 0.2rem;
  max-width: 50%;
  min-height: 4rem;
  padding: 1rem 2rem;
  position: absolute;
  text-transform: uppercase;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .wkCollage__title {
    height: 25%;
    left: 25%;
    top: calc(50% - 2rem);
    width: 75%;
  }
}
/*# sourceMappingURL=wkCollage.css.map */