
.twentytwenty-horizontal .ib-image-comparison .twentytwenty-before-label:before, .twentytwenty-horizontal .ib-image-comparison .twentytwenty-after-label:before {
	top: 50%;
	transform: translateY(-50%);
	margin-top: 0;
}

.twentytwenty-horizontal .ib-image-comparison.label-pos--top .twentytwenty-before-label:before, .twentytwenty-horizontal .ib-image-comparison.label-pos--top .twentytwenty-after-label:before {
	transform: translateY(0);
	top: 10px;
}

.twentytwenty-horizontal .ib-image-comparison.label-pos--bottom .twentytwenty-before-label:before, .twentytwenty-horizontal .ib-image-comparison.label-pos--bottom .twentytwenty-after-label:before {
	bottom: 10px;
	transform: translateY(0);
	top: auto;
}

.twentytwenty-vertical .ib-image-comparison .twentytwenty-before-label:before, .twentytwenty-vertical .ib-image-comparison .twentytwenty-after-label:before {
	left: 50%;
	transform: translateX(-50%);
	text-align: center;
	margin-left: 0;
}

.twentytwenty-vertical .ib-image-comparison.label-pos--left .twentytwenty-before-label:before, .twentytwenty-vertical .ib-image-comparison.label-pos--left .twentytwenty-after-label:before {
	left: 10px;
	transform: translateX(0);
}

.twentytwenty-vertical .ib-image-comparison.label-pos--right .twentytwenty-before-label:before, .twentytwenty-vertical .ib-image-comparison.label-pos--right .twentytwenty-after-label:before {
	left: auto;
	right: 10px;
	transform: translateX(0);
}

.ib-image-comparison .twentytwenty-before-label:before, .ib-image-comparison .twentytwenty-after-label:before {
	color: #fff;
	color: var(--ibic-label-color, #fff);
	background-color: rgba(255, 255, 255, .2);
	background-color: var(--ibic-label-bg-color, rgba(255, 255, 255, .2));
	font-size: 13px;
	font-size: var(--ibic-label-size, 13px);
	border: 0px solid;
	border: var(--ibic-label-border, 0px) solid;
	width: auto;
}

.ib-image-comparison .twentytwenty-handle {
	background: #fff;
	border: 2px solid #fff;
}

.ib-image-comparison .twentytwenty-handle .twentytwenty-left-arrow, .ib-image-comparison .twentytwenty-handle:hover .twentytwenty-left-arrow {
	border-right-color: #333;
}

.ib-image-comparison .twentytwenty-handle .twentytwenty-right-arrow, .ib-image-comparison .twentytwenty-handle:hover .twentytwenty-right-arrow {
	border-left-color: #333;
}

.ib-image-comparison .twentytwenty-handle .twentytwenty-down-arrow, .ib-image-comparison .twentytwenty-handle:hover .twentytwenty-down-arrow {
	border-top-color: #333;
}

.ib-image-comparison .twentytwenty-handle .twentytwenty-up-arrow, .ib-image-comparison .twentytwenty-handle:hover .twentytwenty-up-arrow {
	border-bottom-color: #333;
}

.ib-image-comparison .twentytwenty-overlay {
	background: rgba(0, 0, 0, 0);
	background: var(--ibic-overlay-color, rgba(0, 0, 0, 0));
}

.ib-image-comparison .twentytwenty-overlay:hover {
	background: rgba(0, 0, 0, .5);
	background: var(--ibic-overlay-hover-color, rgba(0, 0, 0, .5));
}
