.before-after {
	padding: 5em 0;
}

.before-after h2 {
  margin-bottom: 0.6em;
  text-align: center;
  font-weight: 500;
  color: #8F9092;
  font-size: 2.43em;
  text-transform: uppercase;
}

#before-after-slider {
  width:100%;
  position:relative;
  overflow:hidden;
  border:3px solid white;
}

#before-after-slider img {
	height: 100%;
	object-fit: cover;
	object-position: left;
	display: block;
  width: 100%;
}

#after-image {
  display:block
}

#before-image {
  position:absolute;
  height:100%;
  width:50%;
  max-width: 100%;
  top:0;
  left:0;
  overflow:hidden;
  z-index:2;
}

#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;
}

#resizer::after {
	background-color: #121F47;
	content: "";
	font-weight: 900;
	display: flex;
	justify-content: center;
	align-items: center;
	color: white;
	position: absolute;
	margin: 0 0 0 -18px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 3px solid white;
	background-image: url("data:image/svg+xml,%3Csvg width='26' height='9' viewBox='0 0 26 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.48011e-06 4.4751C6.48466e-06 4.37105 0.0366625 4.2669 0.109881 4.18747L3.85988 0.119225C4.00641 -0.0397417 4.24369 -0.0397417 4.39013 0.119225C4.53657 0.278192 4.53666 0.53561 4.39013 0.694475L0.905256 4.4751L4.39013 8.25572C4.53666 8.41469 4.53666 8.67211 4.39013 8.83097C4.2436 8.98984 4.00632 8.98994 3.85988 8.83097L0.109881 4.76272C0.0366624 4.68329 6.47556e-06 4.57914 6.48011e-06 4.4751Z' fill='white'/%3E%3Cpath d='M25.5 4.4751C25.5 4.57914 25.4634 4.68329 25.3901 4.76272L21.6401 8.83097C21.4936 8.98994 21.2563 8.98994 21.1099 8.83097C20.9635 8.672 20.9634 8.41459 21.1099 8.25572L24.5948 4.4751L21.1099 0.694475C20.9634 0.535509 20.9634 0.27809 21.1099 0.119225C21.2564 -0.0396404 21.4937 -0.0397415 21.6401 0.119225L25.3901 4.18747C25.4634 4.26691 25.5 4.37105 25.5 4.4751Z' fill='white'/%3E%3Cline x1='1' y1='4.5' x2='25' y2='4.5' stroke='white'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
}

#before-after-slider.half {
  width: 50%;
  margin: auto;
}

@media (max-width: 767px){
  #before-after-slider.half {
    width: 50%;
  }  
}