icon on custom menu disappears – why?

I created a custom menu and added a class to styles.css an item like below. it works great, except when hovered over the icon disappears. I tried adding a:hover to the .home-icon element but that didn’t work. can anyone please help me keep the icon on hover and mouseover?

.home-icon a{
list-style-type:none;
padding-left: 30px !important;
background-image: url(images/home.png);
background-position: left;
background-repeat: no-repeat;
}