I am using a free wordpress theme ,named Pitch (http://siteorigin.com/theme/pitch/) . I redesign the menu bar , so that the background of first element of the menu bar will show an image (the logo). To do so , I just add a simple block of code

ul#mainmenu-menu li.menu-item:first-child {
  background:url(images/logo.png) no-repeat ;
  text-indent:-9999px;
  width:200px;


  border:none;
  }
ul#mainmenu-menu li.menu-item:first-child a:hover  {
  background:none;

}

But the problem is , that image also appear in first element of the dropdown item too . Like the image

What did I do wrong , How can I fix this ?

Here is the complete CSS code http://pastebin.com/edsYrqWF

Plz help me out