On this website, you can see i've done this (some time ago actually) but you'll see in the screenshot that it also affects the drop down menu. In this case Im using the below code. The :last-child piece doesn't seem to do anything for me. Can anyone help resolve this affecting the drop down menus as well.
this template will change in the future; I realize its sun-setted, but for now, I'd like to resolve this. The website is: https://www.warpaintinternational.com/#about. See screenshot.
.main-nav ul li:nth-child(7) {
border: solid 0px;
padding: 5px;
a:hover {
padding: 10px;
background-color: #e04937;
}
a {
padding: 10px;
border: solid 2px;
color: #fff;
background-color: #e04937;
}
}