How to change part of the border color

[Rain Lover]

Here's a sample navigation menu:


nav {
border-top: 5px solid;
}

nav a {
font-size: 12px;
padding: 1em;
}


<nav>
<a href="#">Page 1</a>
<a href="#" id="current">Page 2</a>
<a href="#">Page 3</a>
<a href="#">Page 4</a>
</nav>

DEMO (https://jsfiddle.net/Mori/38fL5y7c/)

How can I change the part of the border color above the current page so it looks like this:

6344

[Deadweight]

This should be how you want it.
https://jsfiddle.net/a6cjsqbL/

(I have it on hover but i can change it to current page - lack of info to know what you want)