Código de legenda

Qual é minha questão:
Queria o código css desse fórum > http://institutorpg.forumeiros.com/forum < Não é o código inteiro, eu só quero aquele efeito da legenda lá em baixo, e também como colocar o efeito que ta nas imagens do ministério da magia '-'

Medidas que eu tomei para corrigir o problema:
Tendei abrir o css do fórum, mais não sei qual código pegar e.e'

Imagens do meu problema:


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

Versão do meu fórum:
PHPBB2

Olá!

Aceda à:
Painel...-> Visualização -> Templates -> Geral
Lá terá index_body, localize o código abaixo:

Código:

        <td class="row1"><span class="gensmall">{LEGEND} : {GROUP_LEGEND}</span></td>

Substitua por este:

Código:

          <td class="row1"><span class="gensmall"><div id="maraudeur"><div id="contenu_rpg"><div id="bouton_maraudeur">Legenda do rpg:</div><div id="grupos_rpg">
            {LEGEND} : {GROUP_LEGEND}</div></div></div></span></td>

E clique em publicar
Agora aceda à:
Painel...-> Visualização -> Imagens e cores -> Cores / Folha estilo CSS
E adicione este código abaixo:

Código:

#maraudeur{
width: 700px;
margin: auto;
}
#contenu_maraudeur
{
width: 100px;
height: 15px;
overflow: hidden;
transition: all 2s;
-moz-transition: all 2s;
-o-transition: all 2s;
-webkit-transition: all 2s;
-htm-transition: all 2s;
}

#bouton_maraudeur
{
width: 100px;
height: 10px;
background: url(http://i29.servimg.com/u/f29/16/29/53/03/ngg10.png) top center no-repeat;
border: 1px solid #121212;
}

#contenu_maraudeur:hover{
width: 600px;
height: 500px;
overflow: none;
transition: all 2s;
-moz-transition: all 2s;
-o-transition: all 2s;
-webkit-transition: all 2s;
-htm-transition: all 2s;
}

#contenu_rpg{
width: 100px;
height: 15px;
overflow: hidden;
transition: all 2s;
-moz-transition: all 2s;
-o-transition: all 2s;
-webkit-transition: all 2s;
-htm-transition: all 2s;
}

#contenu_rpg:hover{
width: 700px;
height: 78px;
overflow: none;
transition: all 2s;
-moz-transition: all 2s;
-o-transition: all 2s;
-webkit-transition: all 2s;
-htm-transition: all 2s;
}

#grupos_rpg{
width: 700px;
margin-top: 15px;
margin-left: 0px;
margin-right: auto;
background: url(http://i45.servimg.com/u/f45/15/65/31/89/201n5c12.jpg);
overflow: hidden;
box-shadow: 0px 0px 14px #000000;
-moz-box-shadow: 0px 0px 14px #000000;
-o-box-shadow: 0px 0px 14px #000000;
-webkit-box-shadow: 0px 0px 14px #000000;
-htm-box-shadow: 0px 0px 14px #000000;
border: 1px solid #000;
text-align: justify;
}

Carregue em Salvar.

Melhores cumprimentos,
seender

Olá.

Seender poderia me informar se é possivel ao invez de aparecer "Legenda do RPG" eu inserir uma imagem no local?

aguardo.

Olá!

Substitua aquele código por esse:

Código:

          <td class="row1"><span class="gensmall"><div id="maraudeur"><div id="contenu_rpg"><div id="bouton_maraudeur"><img src="IMAGEM"></div><div id="grupos_rpg">
            {LEGEND} : {GROUP_LEGEND}</div></div></div></span></td>

IMAGEM = Link da imagem que aparecerá ali no lugar de "Legenda do rpg:".

Até mais.

Luciano, veja oque aconteceu:

http://akasukibr-rpg.forumeiros.com/forum

gostaria q o botao ficasse inteiro ali, e nn com a metade esondido.

Tenho outra duvida, tem como tiral essas bordas em degrade encima e embaixo dos grupos?

Olá!

É necessário o cadastro para ter acesso ao início do fórum.

Até mais.