Barra de pesquisa

Qual é minha questão:
Olá, eu queria saber como deixo minha "barra de pesquisa" igual ao do FDF, imagem abaixo:
Esperando respostas

Endereço do meu fórum:
http://kingstreetnwd.forumeiros.com/

Versão do fórum:
PHPBB3

Olá,

DKazinho safadinho (8.. HUEHEU

Código:

/* Botão Buscar -> Ungreli */
#search-box input.button2{-webkit-border-radius:2px;-webkit-user-select:none;background-color:#f5f5f5;background-image:-o-linear-gradient(top,whiteSmoke,#F1F1F1);border:1px solid rgba(0,0,0,0.1);border-radius:2px;color:#666;cursor:pointer;font-size:11px;font-weight:700;height:29px;line-height:18px;margin:11px 6px;min-width:54px;padding:0 8px;text-align:center}#search-box input{-moz-box-sizing:content-box;background:#fff;border:1px solid #D9D9D9;border-width:1px;color:#000;height:23px}
#search #keywords:focus{width:300px}#search #keywords{-moz-transition:all 1s ease-in-out;-ms-transition:all 1s ease-in-out;-o-transition:all 1s ease-in-out;-webkit-transition:all 1s ease-in-out;transition:all 1s ease-in-out;width:150px}img[src="http://i66.servimg.com/u/f66/15/86/37/09/suppor10.png"]{height:auto;width:46px}

/* Efeito Botão Buscar -> Ungreli */
#search-box input.button2 {
font-size: 12px !important;
}

Ou:

Código:

#search #keywords {
-moz-transition: all 1s ease-in-out;
-ms-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
width: 150px;
}
#search-box #keywords {
background-color: white;
width: 95px;
}
#search-box input {
-moz-box-sizing: content-box;
background: white;
border: 1px solid #D9D9D9;
border-width: 1px;
color: black;
height: 23px;
}
input.search {
background: url(http://2img.net/i/fa/sprite_prosilver_navbar.png) no-repeat top left;
background-position: 0 -701px;
padding-left: 17px;
}

Até +

Olá,

Adicione este código a sua Folha de Estilo CSS:

Código:

#search #keywords {
transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
width: 150px;
}
#search-box #keywords {
background-color: rgb(255, 255, 255);
width: 95px;
}
#search-box input {
background: rgb(255, 255, 255);
border: 1px solid rgb(217, 217, 217);
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
color: rgb(0, 0, 0);
height: 23px;
}
#search-box input.button2 {
-webkit-user-select: none;
background-color: rgb(245, 245, 245);
border: 1px solid rgba(0, 0, 0, 0.0980392);
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
border-radius: 2px;
color: rgb(102, 102, 102);
cursor: pointer;
font-size: 11px;
font-weight: 700;
height: 29px;
line-height: 27px;
margin: 11px 6px;
min-width: 54px;
padding: 0px 8px;
text-align: center;
}
#search #keywords:focus {
width:290px;
}

Até mais.

Obrigado, pode fechar o tópico *-*