a {
	font-size:2.5rem;
	margin:1rem;
	position:relative;
	color:darkslategray;
}
a:link {
	text-decoration:none;
}
a:after {
	content:"";
	position:absolute;
	bottom:-0.5rem;
	height:0.18rem;
	width:0%;
	transition:all 0.3s;
	left:0;
	background-color:blueviolet;
}
a:before {
	content:"";
	position:absolute;
	bottom:-0.5rem;
	height:0.18rem;
	width:0%;
	transition:all 0.3s;
	left:50%;
	background-color:#fff;
}
a:hover:after {
	animation-name:example;
	animation-duration:0.3s;
	animation-fill-mode:both;
}
a:hover:before {
	width:100%;
	left:0%;
	background-color:blueviolet;
}
@keyframes example {
	from {
	width:0%;
}
to {
	width:100%;
}
}