Поиск:hover ,не работает при наведение на кнопку

Как мне сделать, чтобы картинка кнопки была единым целым с оболочкой?? :(

Никак не пойму, как сделать. Просто раньше никогда не делал на сайтах поиск :crazy: теперь пришлось.

Когда пишу: z-index: 100; фигня получается.

[ATTACH]131449[/ATTACH]

<form class="form-search" method="get" action="/search" target="_blank">

			<input type="text" name="q" value="Что-то ищите?"  onfocus="if(this.value=='Что-то ищите?') this.value=''" onblur="if(this.value=='') this.value='Что-то ищите?'"/>

			<input src="/img/search.png" type="image" alt="поиск"/></form>

.form-search {

  display: inline-block;

  float: right;

  position: relative;

  right: 20px;

  top: 20px;

}



.form-search input {

  width: 100px;

  height: 25px;

  background:#2c2c2c; 

  outline: none;

  border: none;

  position: relative;

  right: 10px;

  top: 20px;

  border-radius: 15px;

}



.form-search input:hover {

	width: 200px;

}



.form-search input[type="image"]{

	background: url("/img/search.png") right no-repeat #2c2c2c;

	width: 19px;

	height: 17px;

	position: relative;

  	right: 35px;

  	top: 25px;

}



.form-search input[type="text"]{

	padding-left: 8px;

	color: #fff;

	font-size: 10px;

	font-family:'PF DinDisplay','Trebuchet MS',Arial;

}