.before-after {
	position: relative;
	display: inline-block;
	vertical-align: top;
	user-select: none;
}

.before-after .photo img {
	display: block;
	max-width: 100%;
	height: auto; 
	border:0 !important;
}

.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: 2px;
	background-color: #000;
	margin: 0 0 0 0;
	position: absolute;
	left: 50%;
	top: 0;
	height: 100%;
	opacity: 1;
}

.before-after .drag-handler .drag-element {
	position: absolute;
	left: -15px;
	top: 50%;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	margin: -15px 0 0 0px;
	background-color: #ffffff;
	border: 1px #000 solid;
	cursor: pointer;
}

.before-after .drag-handler .drag-element::before{
	content: '↔';
	position:absolute;
	margin: -5px 0 0 4px;
	font-size:22px;
}

.before-after:hover .drag-handler {
	opacity: 1; 
}



