Стиль кнопки ввода HTML/CSS не работает

У меня есть кнопка:

ON

OFF

Вот CSS:

.searchButton {
  height: 31px;
  width: 33px;
  cursor: pointer;
  border: none;
  background:url(../img/searchButton-Off.png) no-repeat;
}

.searchButton:hover {
  height: 31px;
  width: 33px;
  cursor: pointer;
  border: none;
  background:url(../img/searchButton-On.png) no-repeat;
}

Вот HTML:

  <div class="searchBox">
    <h2 style="color:000000;">Search</h2>
    <form id="form_297586" class="appnitro"  method="get" action="results.php">
      <input id="keywords" name="keywords" class="searchBar" title="What do you like...?" type="text" maxlength="255" value=""/>
      <input type="button" class="searchButton" />
      <input type="hidden" name="form_id" value="297586" />
    </form>
  </div>

Вот что отображает мой браузер:

Safari Opera

Когда я навожу мышь на кнопку, она правильно переключается, а затем отображает всю кнопку. Я не уверен, почему такое поведение происходит.

Мысли?