Me has tomado con algo de tiempo, así que hice esto para ti:
Código HTML:
<!DOCTYPE html>
<html lang = 'ES'>
<head>
<meta charset = 'UTF-8'/>
<style type = 'text/css' media = 'screen'>
a:visited {
color: #000;
}
#menu > li {
display: inline;
border-bottom: solid 5px #F00;
padding: 0px 5px;
}
#menu > li a {
color: #666;
text-transform: uppercase;
text-decoration: none;
}
#menu li:hover {
border-top: solid 5px #F00;
border-bottom: none;
}
#menu li:hover a {
color: #111;
}
</style>
<title>
</title>
</head>
<body>
<div id = 'bar'>
<ul id = 'menu'>
<li>
<a href = '#'>
Inicio
</a>
</li>
<li>
<a href = '#'>
Servicios
</a>
</li>
</ul>
</div>
</body>
</html> Espero te sirva.
Buena suerte.