[Помогите] Стиль для кнопки меню

Ребята, подскажите пожалуйста, как избавится от проблемы: я решил добавить в меню "домик", который ссылается на главную страницу сайта. Без наведения на него мышкой он выглядит нормально (см. рис. а), но после того как курсор на нем - он закрашивается (см. рис. б). Как отменить для него стили :hover?

​

Мой код:
Для добавления пункта меню:

Код:

<li id="domik">
<a href="">Главная</a>
</li>

Стиль для этого пункта:

Код:

#domik {
  background-image:url(домик.png);
  background-position:40% 35%;
  background-repeat:no-repeat no-repeat;
  text-indent:-9999px;
  width:24px;
  }

P.S. Я пытался отменить закрашивание через:

Код:

#domik:hover  {
  background: none;
  }

Не помогло :(

 

Пробовали transparent?

тут ошибка
text-indent:-9999px; - это на всякий случай, а то вдруг не заметили.

 

Спасибо за ответ! Если вы про это:

Код:

#domik:hover  {
  background-color:transparent;
  } 

То пробовал - не вышло.

 

А если так ?

Код:

#domik:hover {
  background-image:url(домик.png);
  background-position:40% 35%;
  background-repeat:no-repeat no-repeat;
  text-indent:-9999px;
  width:24px;
  }