.x-ripple__container {
	border-radius: inherit;
	color: inherit;
	contain: strict;
	height: 100%;
	left: 0;
	overflow: hidden;
	pointer-events: none;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 0;
}

.x-ripple__animation {
	background: currentColor;
	border-radius: 50%;
	color: inherit;
	left: 0;
	opacity: 0;
	overflow: hidden;
	pointer-events: none;
	position: absolute;
	top: 0;
	will-change: transform, opacity;
}

.x-ripple__animation--enter {
	transition: none;
}

.x-ripple__animation--in {
	transition: transform 0.105s cubic-bezier(0, 0, 0.2, 1), opacity 0.15s cubic-bezier(0, 0, 0.2, 1);
}

.x-ripple__animation--out {
	transition: opacity 0.375s cubic-bezier(0, 0, 0.2, 1);
}