Como personalizar esse efeito

Qual é minha questão:
Olá eu fiz um tutorial de abrir e fechar o perfil da SP Design que foi recomendando hoje em uma duvida, Beleza erá oque eu queria
mas gostaria de personalizar exatamente igual ao dos prints abaixo:

Perfil Fechado:


Perfil Aberto:


Atenciosamente.

GabeAHero.

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

Versão do fórum:
PUNBB

Olá!

Utilize esse código CSS:

Código:

.postmain{position:relative}.pun .post .user{position:static!important}.user-ident{padding:8px!important;position:relative;z-index:500}.postbody .user .user-info{-moz-border-radius:7px;-o-border-radius:7px;-webkit-border-radius:7px;background:#fff;border:12px solid gray;border-radius:7px;left:15px;max-width:300px;padding:7px;position:absolute;top:30px;z-index:999}.user .user-info span{color:red!important}

Até mais!

Obrigado Today funcionou perfeitamente xD vlw ae