How to change hover color is background of selected item?

 

 

 

 

Css Code

 

 

.top-nav ul li
{

list-style:none;
}
.top-nav ul li a {
display:block;
outline: none;
color: black;
text-decoration: none;
font-size: 1.3em;
padding: 1em;
text-align: right;
background: #333b3e;

}
.top-nav ul li a.black{
background: white;

}
.top-nav ul li a.black1
{
background: white;

}
.top-nav ul li a.black2
{
background:white;
}
.top-nav ul li a.black3
{
background:white;
}
.top-nav ul li a.black4
{
background:white;
}
.top-nav ul li a.black5
{
background:white;
}

.top-nav ul li a:hover,.top-nav ul li.active a {
width: 91%;
padding-left: 0px;
background: gray;
}
.top-nav ul li.active a
{
width: 91%;
padding-left: 0px;
background: #23aeac;
}