targeted slider transition speed

Hi
I have created an image based menu which works fine with Logo left Menu right, but when I switch to Logo center Menu below the menu images overlap and are cropped as the menu will not go beyond about 50% width, as you can see in the link below. I can’t work out what I’m doing wrong.

Each menu image is 110 x 74px and the CSS I am using is:

.html_main_nav_header #top .main_menu .menu {width:100%!important; }
span.avia-menu-text { visibility: hidden; }
.main_menu ul:first-child > li a { height: 74px!important; }
.html_main_nav_header #top .main_menu .menu>li a { min-width: 110px!important; }

And each menu item has something like this:

#menu-item-869 a {
background-image: url(http://tinyartist.com/wp2/wp-content/uploads/2015/09/KPmenuTV2.png)!important;
background-repeat: no-repeat!important;
}