CSS menu list with underline hover animation
.nav-links ul li a{
/* update color of link text to white, size to 13px and
delete underline of link-text*/
color: #fff;
text-decoration: none;
font-size: 13px;
}
.nav-links ul li::after{
/* underline red as a after content it equal a div
with background color,..*/
content: '';
width: 0;
height: 2px;
background: #f44336;
display: block;
margin: auto;
transition: 0.5s;
}
.nav-links ul li:hover::after{
/* ul li ::after when hover */
width:100%;
}