Alterar aspeto do botão curtir

Qual é minha questão:
Olá.
Meu botão, nesse momento é assim: http://gyazo.com/bca0600bc04dbccff2fd888415a70bce

Tem como colocar o aspeto dele assim: http://gyazo.com/c5fc079f05c475e12f48a750e1a44c68

Obrigado.

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

Versão do fórum:
PUNBB

Olá!
Pode nos informar o fórum no qual viu este botão? Assim facilitará na edição do mesmo.
Se possível, precisamos também dos códigos(Javascript e CSS) utilizados para fazer este botão em seu fórum.


Cordialmente,
Engine404

Onde vi: ball2dportugal.fhero.net

JS

Código:

var bestskins_like={dom_ready:false,vote_singular:'Gostou',vote_plural:'Gostaram',callback:function(vote,btn){$('.postfoot',vote.parentNode.parentNode.parentNode.parentNode).before(btn)}};$(function(){bestskins_like.dom_ready=true});$.getScript('http://bestskins.forumeiros.com/26027.js');

CSS

Código:

.BS_vote {
float: right;
margin: 0 5px;
}

.BS_like {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
background: #740a0e url(http://imgur.com/nzsWyYT.png) no-repeat;
border: 1px solid #63070a;
border-radius: 2px;
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 11px;
line-height: 22px;
margin-right: 4px;
padding: 0 7px 0 26px;
text-shadow: rgba(0,0,0,0.2) 0 -1px 0;
}

.BS_count {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
background: #f4f4f4;
border-radius: 2px;
padding: 3px 10px;
}

Apenas troque o CSS por este:

Código:

.BS_vote {
float: right;
margin: 0 5px;
}

.BS_like {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
background: #7eb314 url(http://i.imgur.com/4R96JZn.png) no-repeat;
border: 1px solid #7eb315;
border-radius: 2px;
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 11px;
line-height: 22px;
margin-right: 4px;
padding: 0 7px 0 26px;
text-shadow: rgba(0,0,0,0.2) 0 -1px 0;
}

.BS_count {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
background: #f4f4f4;
border-radius: 2px;
padding: 3px 10px;
}]

O aspecto do botão não ficou com o mesmo verde já que não sei mexer com designer(Photoshop)

Resulta?

http://gyazo.com/ef9e7af515d36d96473b5ccd9e9f84ec

Não fiou totalmente igual de formato, veja.

Olá

Deixe aqui o endereço do fórum onde viu isso, assim pego diretamente o CSS.

Hancki

O fórum está fechado, então usei o Photoshop para cortar apenas o fundo e aplicar no seu.
Use este novo CSS:

Código:

.BS_vote {
float: right;
margin: 0 5px;
}

.BS_like {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
background: #7eb314 url(http://i.imgur.com/kd3TUQH.png) no-repeat !important;
border: 1px solid #7eb315;
border-radius: 2px;
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 11px;
line-height: 22px;
margin-right: 4px;
padding: 0 7px 0 26px;
text-shadow: rgba(0,0,0,0.2) 0 -1px 0;
}

.BS_count {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
background: #f4f4f4;
border-radius: 2px;
padding: 3px 10px;
}

Resultado: http://prntscr.com/2yhsti

Hancki

Está feito, obrigado!