.ripple-element,
.ripple-target {
	position: relative;
	overflow: hidden;
	transform: translateZ(0);
}

.ripple-element::after,
.ripple-target::after {
	position: absolute;
	display: block;
	width: 200%;
	height: 0;
	top: 50%;
	left: -50%;
	-webkit-user-select: none;
	user-select: none;
	content: '';
	padding-bottom: 200%;
	background: rgba(170, 170, 170, 0.3);
	border-radius: 50%;
	opacity: 0;
	transform: translateY(-50%) scale(.05);
	animation: none;
	pointer-events: none
}

.ripple-element.ripple::after,
.ripple-target.ripple::after {
	animation: rippleanim 400ms cubic-bezier(.4, 0, .2, 1) backwards
}

.ripple-element.ripple-disabled,
.ripple-target.ripple-disabled {
	opacity: .3
}

.ripple-trigger.ripple .ripple-target::after {
	animation: rippleanim 400ms cubic-bezier(.4, 0, .2, 1) backwards
}

.ripple-trigger.ripple-disabled .ripple-target {
	opacity: .3
}

.ripple-dismiss.ripple::after {
	animation: none
}

.ripple-dismiss.ripple-trigger.ripple .ripple-target::after {
	animation: none
}

.ripple-icon,
.ripple-icon-big {
	position: relative;
	overflow: visible;
}

.ripple-icon::after,
.ripple-icon-big::after {
	padding-bottom: 200%;
	width: 200%;
	left: -50%
}

.ripple-icon.ripple,
.ripple-icon-big.ripple {
	z-index: 99
}

.ripple-light::after {
	background: rgba(207, 207, 207, 0.4)
}

.ripple-light.ripple-trigger .ripple-target::after {
	background: rgba(207, 207, 207, 0.4)
}

.ripple-dark::after {
	background: rgba(128, 128, 128, 0.4)
}

.ripple-dark.ripple-trigger .ripple-target::after {
	background: rgba(128, 128, 128, 0.4)
}

.ripple-icon.ripple::after {
	animation: rippleanim-icon 400ms cubic-bezier(.4, 0, .2, 1) backwards
}

.ripple-icon-big.ripple::after {
	animation: rippleanim-icon-big 400ms cubic-bezier(.4, 0, .2, 1) backwards
}

.ripple-icon-small.ripple::after {
	animation: rippleanim-icon-small 400ms cubic-bezier(.4, 0, .2, 1) backwards
}

@-moz-keyframes rippleanim {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(1.35)
	}
}

@-webkit-keyframes rippleanim {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(1.35)
	}
}

@-o-keyframes rippleanim {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(1.35)
	}
}

@keyframes rippleanim {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(1.35)
	}
}

@-moz-keyframes rippleanim-icon {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(.75)
	}
}

@-webkit-keyframes rippleanim-icon {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(.75)
	}
}

@-o-keyframes rippleanim-icon {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(.75)
	}
}

@keyframes rippleanim-icon {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(.75)
	}
}

@-moz-keyframes rippleanim-icon-big {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(1.25)
	}
}

@-webkit-keyframes rippleanim-icon-big {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(1.25)
	}
}

@-o-keyframes rippleanim-icon-big {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(1.25)
	}
}

@keyframes rippleanim-icon-big {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(1.25)
	}
}

@-moz-keyframes rippleanim-icon-small {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(.5)
	}
}

@-webkit-keyframes rippleanim-icon-small {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(.5)
	}
}

@-o-keyframes rippleanim-icon-small {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(.5)
	}
}

@keyframes rippleanim-icon-small {
	0% {
		opacity: 0;
		transform: translateY(-50%) scale(.01)
	}
	15% {
		opacity: 1
	}
	80% {
		opacity: 1
	}
	100% {
		opacity: 0;
		transform: translateY(-50%) scale(.5)
	}
}