/*
*  Styles for Essential Blocks Image Comparison.
*
*  Require using important flags to override inline css added by Essential Blocks.
*/
/* stylelint-disable declaration-no-important */
/* Divider */
.wp-block-essential-blocks-image-comparison.is-style-grunge .eb-image-comparison-wrapper > div > div > div:nth-child(1),
.wp-block-essential-blocks-image-comparison.is-style-grunge .eb-image-comparison-wrapper > div > div > div:nth-child(3) {
	background: transparent url("../images/cd-divider-line.png") !important;
	box-shadow: none !important;
	height: 100% !important;
	width: 2px !important;
}

@media (min-width: 991px) {
	.wp-block-essential-blocks-image-comparison.is-style-grunge .eb-image-comparison-wrapper > div > div > div:nth-child(1),
	.wp-block-essential-blocks-image-comparison.is-style-grunge .eb-image-comparison-wrapper > div > div > div:nth-child(3) {
		width: 4px !important;
	}
}

/* Circle */
.wp-block-essential-blocks-image-comparison.is-style-grunge .eb-image-comparison-wrapper > div > div > div:nth-child(2) {
	background-color: transparent;
	background-image: url("../images/cd-image-comparison-circle.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-position: center;
	border: 3px solid transparent !important;
	box-shadow: none !important;
	cursor: pointer;
	height: clamp(40px, 4vw, 70px) !important;
	margin: -15px 0;
	position: relative;
	transition: all 300ms ease;
	-webkit-tap-highlight-color: transparent;
	width: clamp(40px, 4vw, 70px) !important;
}
/* Arrows */
.wp-block-essential-blocks-image-comparison.is-style-grunge .eb-image-comparison-wrapper > div > div > div:nth-child(2) div {
	display: none;
}

/* stylelint-enable declaration-no-important */