Submenu hover does not extend to full width of menu

After upgrading to version 7.x-1.8, the submenu link area does not extend the full width of the submenu. See attachment, I'm hovering over the "Donate" item. All the submenu items behave this way. In the "Superfish Settings" to I've set the Style to "Default" and played with the CSS for hours. Everything worked as expected in ver 7.x-1.7x, but with all the changes in 7.x-1.8, I may be overlooking something. Here is a sample of my CSS for the menu. I have not touched any of the Superfish or Styles/Default CSS.

Any ideas? Is this the proper approach to styling Superfish menus? This is all new to me and any help is greatly appreciated.

--------------------- Begin CSS -------------------
#region-menu ul.main-menu {
padding: 0;
margin-bottom: 1.5em;
list-style-type: none;
}

#region-menu ul.main-menu,
#region-menu ul.main-menu li {
margin: 0;
padding: 0;
}
#region-menu ul.main-menu li {
position: relative;
display: inline-block;
}
#region-menu ul.main-menu li a {
display: inline-block;
border:0;
border-right: 1px solid #666;
text-decoration: none;
background-image: url("/sites/default/files/images/nav-bg.jpg");
color:#FFF;
}

#region-menu ul.main-menu li a:hover,
#region-menu ul.main-menu li:hover > a {

background-image: url("/sites/default/files/images/nav-bg-hov.jpg");
}
/* Level 2 Submenus*/
#region-menu ul.main-menu li ul li a {
display: inline-block;
border:0;
text-decoration: none;
background-image: none;
color:#FFF;
width:auto;
}

#region-menu ul.main-menu li ul li a:hover,
#region-menu ul.main-menu li ul li:hover > a {

background-image: none;
background-color: #EFAA10;
width:auto;

}
-------- End CSS -------------------