Boarders









nav
{
margin-top:40px;
padding:24px;
text-align:center;
box-shadow:2px 2px 8px rgba(0,0,0,0.5);
}

#nav-1
{
background-color:red;
}

.link-1
{
background-color:red;
color:#fff;
font-size:20px;
text-decoration:none;
border-top:4px solid red;
border-bottom:4px solid red;
padding:20px 0;
margin:0 20px;
transition:all 0.3s ease;
}

.link-1:hover
{
border-top:4px solid #fff;
border-bottom:4px solid #fff;
padding:6px 0;
}

#nav-2
{
background-color:blue;
}

.link-2
{
color:#fff;
font-size:20px;
text-decoration:none;
padding:0 10px;
margin:0 10px;
transition:all 0.5s ease-in-out;
-webkit-transition:all 0.5s ease-in-out;
-ms-transition:all 0.5s ease-in-out;
-moz-transition:all 0.3s ease-in-out;
-o-transition:all 0.3s ease-in-out;
}

.link-2:hover
{
background-color:#fff;
color:#000;
padding:24px 10px;
}