Hover not working on menu

I'm hoping someone on this forum can help me. I had to change the default font on my SMTheme menu bar. I simply did this in the style.css sheet, under:

/*------------------------------ MENU ------------------------------*/

#mainmenu li a {
text-align:center;
display:block;
text-decoration:none;
padding:12px 31px 0px;
font-size:19px;
color:#64b9cf;
font-family: 'PT Sans Narrow', sans-serif;
}

After this change was made, the menu bar now has a half size hover. So for instance, if the menu container is 40 px in height, the hover is 20 px. Here is the website:

www.holistic-vet.ca

When I view 'inspect element', there is a class called 'menu-item' that seems to be able to control this; however, when searching all files for this line, it states none where found, so it's coding that's inaccessible - typical of a Wordpress site.

Within style.css what can I change that would help this?

This section controls the hover but there's no indication of height and when I force the height, it pushes the 'white' section of the menu bar down to make room for the enlarged hover:

#mainmenu li a:hover{
background:url(images/menu-li-a.png) left top repeat-x;
color:#ffffff;
}

Thanks!

I figured it out!!! Yay!!

Ok, if this helps others, this is what I had to do. I had to change one of the padding values in the menu section of style.css:

#mainmenu li a {
text-align:center;
display:block;
text-decoration:none;
padding:12px 34px 15px;
font-size:19px;
color:#64b9cf;
font-family: 'PT Sans Narrow', sans-serif
}

Where it states padding:12px 31px 0px;
is now: padding:12px 34px 15px;

Although the 31 is now 34, disregard that. It's controlled by the 0 to 15 value.