ul {
	font-size:0;
	padding:0;
	position:relative;
	width:480px;
	margin:40px auto;
	user-select:none;
}
li {
	display:inline-block;
	width:160px;
	height:60px;
	background:#E95546;
	font-size:16px;
	text-align:center;
	line-height:60px;
	color:#fff;
	text-transform:uppercase;
	position:relative;
	overflow:hidden;
	cursor:pointer;
}
.slider {
	display:block;
	position:absolute;
	bottom:0;
	left:0;
	height:4px;
	background:#4FC2E5;
	transition:all 0.5s;
}
.ripple {
	width:0;
	height:0;
	border-radius:50%;
	background:rgba(255,255,255,0.4);
	-webkit-transform:scale(0);
	-ms-transform:scale(0);
	transform:scale(0);
	position:absolute;
	opacity:1;
}
.rippleEffect {
	-webkit-animation:ripple .4s linear;
	animation:ripple .4s linear;
}
@-webkit-keyframes 
	  ripple {
	100% {
	-webkit-transform:scale(2);
	transform:scale(2);
	opacity:0;
}
}@keyframes 
	  ripple {
	100% {
	-webkit-transform:scale(2);
	transform:scale(2);
	opacity:0;
}
}