img {
       -khtml-user-select: none;
      -o-user-select: none;
      -moz-user-select: none;
      -webkit-user-select: none;
      user-select: none;
    }

    .slider-container {
      position: relative;
      width: 100%;
      max-width: 460px;
      aspect-ratio: 460 / 260;
      overflow: hidden;
      border: 1px solid #ccc;
      touch-action: none;
      z-index: 2;
    }

    .slider-image {
      width: 100%;
      height: 100%;
      object-fit: cover;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 2;
    }

    .after-image {
      clip-path: inset(0 100% 0 0);
      transition: clip-path 0s ease-out;
    }

    .slider-handle {
      position: absolute;
      top: 0;
      bottom: 0;
      width: 4px;
      background: white;
      cursor: ew-resize;
      z-index: 3;
      transform: translateX(-2px);
    }


.bg3 {
  position: absolute;
  left: 0;
  top: 0%;
  width: 100%;
  height: auto;
  z-index: 1;
}


.engage {
	position: absolute;
	height: auto;
	top: 75%;
	left: 2%;
	width: 81%;
	z-index: 2000;
}

.hand {
	position: absolute;
	height: auto;
	top: 69%;
	left: 62%;
	width: 10%;
	transform: rotate(-45deg);
	z-index: 2000;
	pointer-events: none;
}

.final {
	display: none;
}

.hl1 {
	position: absolute;
	height: auto;
	top: 7%;
	left: 0%;
	width: 40%;
	z-index: 2000;
	pointer-events: none;
}

.hl2 {
	position: absolute;
	height: auto;
	top: 7%;
	left: 0%;
	width: 50%;
	z-index: 20;
}

.hl3 {
	position: absolute;
	height: auto;
	top: 7%;
	left: 0%;
	width: 40%;
	z-index: 2000;
}

.shl {
	position: absolute;
	height: auto;
	top: 45%;
	left: 11%;
	width: 80%;
	z-index: 3;
}

.dis {
	position: absolute;
	height: auto;
	top: 95%;
	left: 53%;
	width: 46%;
	z-index: 40;
}

.cta {
	position: absolute;
	height: auto;
	top: 71%;
	left: 6%;
	width: 36%;
	opacity: 0;
	z-index: 100;
}



@media only screen and (max-width:400px) { 

}