HTML <input type="search"> com defeito visual

[Renan Leite BL]

Fala galera deem uma olhada nesse sistema de busca, eu coloquei border-radius: 10px no CSS mas quando eu clico aparece uma leve seleção retangular envolta!! Como posso resolver isso ? 

Meu código está assim:

--------- HTML ------------
<div class="pesquisa">
	<input type="search" name="busca" placeholder="Buscar no site" id="textoBusca">
</div>
----------- CSS -------------
#textoBusca{
  display: inline-block;  	
  text-align: center;
  margin-left: 600px;
  margin-top: 18px; 
  border-radius: 10px; 
  border: solid 0.5px;   
  background-color:white;
  font-size:14px;  
  height:24px;
  width:400px;
}

 

[iHollyZinhO]

Para fazer isso, você precisa alterar o CSS do ID textoBusca quando ele tiver com foco(focus, em inglês), ou seja, quando o elemento for clicado. 

#textoBusca:focus
{
	outline: none;
	border: 2px solid #000;
	border-radius: 10px;
}

Com esse código você vai tirar a seleção retangular e vai engrossar a borda do input. Caso queira apenas remover a seleção, deixe apenas o outline: none;.