.before-after {
  position: relative;
  display: inline-block;
  vertical-align: top;
  user-select: none; }
  .before-after .photo img {
    display: block;
    max-width: 100%;
    height: auto; }
  .before-after .photo.before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    transform: translate(-50%); }
    .before-after .photo.before img, .before-after .photo.before .layer {
      transform: translate(50%); }
  .before-after .drag-handler {
    width: 8px;
    background-color: #f17f04;
    margin: 0 0 0 -4px;
    position: absolute;
    left: 50%;
    top: 0;
    height: 100%;
    opacity: 0.25; }
    .before-after .drag-handler .drag-element {
      position: absolute;
      left: -16px;
      top: 50%;
      width: 32px;
      height: 32px;
      margin: -16px 0 0 0;
      background-color: #ffffff;
      border: 4px #f17f04 solid;
      cursor: pointer;
      transform: rotate(45deg); }
  .before-after:hover .drag-handler {
    opacity: 1; }

/*# sourceMappingURL=before-after.css.map */