@import url("https://fonts.googleapis.com/icon?family=Material+Icons");
@font-face {
  font-family: "Heading Now Variable";
  src: url("https://s1.quebecormedia.com/infojdem/fonts/heading-now/woff2/HeadingNowVarVF.woff2") format("woff2-variations"), url("https://s1.quebecormedia.com/infojdem/fonts/heading-now/ttf/Heading-Now-Variable.ttf") format("truetype-variations");
  font-weight: 110 1000;
  font-stretch: 100% 1000%;
}
.before-after-slider-container > * {
  box-sizing: border-box;
}

.before-after-slider-container {
  width: 98%;
  max-width: 800px;
  display: block;
  margin: 0 auto 32px;
  border-bottom: 2px solid lightgray;
  padding-bottom: 16px;
}
.before-after-slider-container .before-after-slider {
  width: 100%;
  position: relative;
  overflow: hidden;
  border: 3px solid white;
}
.before-after-slider-container .before-after-slider img {
  width: 100%;
  display: block;
  margin: 0;
  object-fit: cover;
  object-position: left;
  height: 100%;
  max-width: unset;
}
.before-after-slider-container .before-image {
  position: absolute;
  height: 100%;
  width: 50%;
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: 2;
}
.before-after-slider-container .after-image {
  display: block;
}
.before-after-slider-container .resizer {
  position: absolute;
  display: flex;
  align-items: center;
  z-index: 5;
  top: 0;
  left: 50%;
  height: 100%;
  width: 4px;
  background: white;
  /*Stop vertical scrolling on touch*/
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}
.before-after-slider-container .resizer:after {
  background: red;
  font-family: "Material Icons";
  content: "code";
  -webkit-font-feature-settings: "liga";
  font-size: 30px;
  font-weight: 300;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  position: absolute;
  margin: 0 0 0 -21px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 3px solid white;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: "liga";
}
.before-after-slider-container .bdv {
  font-family: "Heading Now Variable", sans-serif;
  margin: 0;
  font-style: normal;
  font-weight: 400;
  font-size: 15px;
  line-height: 135%;
  font-stretch: 550%;
  color: #000;
  padding-top: 7px;
  text-align: left;
  opacity: 0.5;
  letter-spacing: -0.25px;
}
@media (max-width: 1300px) {
  .before-after-slider-container .bdv {
    font-size: 13px;
    line-height: 17px;
    margin: 0;
  }
}
.before-after-slider-container .bdv .credit-photo {
  font-weight: 300;
  text-transform: uppercase;
  font-size: 13px;
}
@media (max-width: 1300px) {
  .before-after-slider-container .bdv .credit-photo {
    font-size: 11px;
  }
}

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