Como fazer esse painel?

Detalhes da dúvida

Versão do fórum : phpBB2
Nível de acesso : Fundador
Navegador usado : Google Chrome
Imagem :

Imagem da minha dúvida:

Membros afetados : Somente comigo
Endereço do fórum : http://rpgbb.forumeiros.com/

Descrição do problema

Eu gostaria de conseguir uma parte deste painel que está anexado como imagem, apenas a parte de Fundador e Conselho Administrativo. Bem, se for ajudar, o link do fórum em que encontrei é esse: http://rpgnewage.forumeiros.com/

Boas,

Aqui esta:

Código:

<table>
         
         <tbody>
            
            <tr>
               
               <td>
                  
                  <center>
                      <span style="font: 28px Astloch; color: #fff;">Fundador</span>
                  </center>
                  
                  <div style="width: 418px; height: 160px; padding: 5px; background: #151312; font: 12px tahoma; text-align: justify;">
                      <style type="text/css">.staff{width: 199px; height: 144px; padding: 3px; font-size: 12px; line-height:12px; font-family: Calibri; color: #fff; text-align: center; opacity:0.0; transition-duration: 0.6s;-moz-transition-duration: 0.6s;-webkit-transition-duration: 0.6s;-o-transition-duration: 0.6s; background: #151312; overflow:auto; scrollbar:true;} .staff:hover {opacity: 1;} .tittle1 {font-size:15px; font-family: arial; text-align:center; color:white; text-transform:uppercase; padding-top: 60px;} .subtittle {font-size: 11px; font-family: Calibri; text-align:center; color:white; text-transform:uppercase; margin-top:-10px; letter-spacing:2px;}</style>
                     <table>
                        
                        <tbody>
                           
                           <tr>
                              
                              <td>
                                 
                                 <div style="width: 205px; height: 150px; background: url(http://i.imgur.com/3891tR2.png); border: 2px solid #3f3937; ">
                                    
                                    <div class="staff">
                                        <br><br><br><br><span style="font-family: Oswald; font-size: 17px; letter-spacing: 2px;">Luiz &amp; Yasmim</span><br>
                                       <center>
                                           <a href="/u1">Perfil</a> - <a href="/privmsg?mode=post&amp;u=1">MP</a>
                                       </center>
                                       
                                    </div>
                                    
                                 </div>
                                 
                              </td>
                              
                              <td>
                                 
                                 <div style="width: 205px; height: 150px; background: url(http://i.imgur.com/aNG0bWY.png); border: 2px solid #3f3937; ">
                                    
                                    <div class="staff">
                                        <br><br><span style="font-family: Oswald; font-size: 12px; letter-spacing: 2px;">Preparem-se seres mágicos e armados, uma nova era está prestes a surgir! Saquem suas varinhas e suas granadas. Montem as vassouras e os tanques de guerra. A batalha está prestes a se firmar.</span>
                                    </div>
                                    
                                 </div>
                                 
                              </td>
                              
                           </tr>
                           
                        </tbody>
                        
                     </table>
                     
                  </div>
                  
               </td>
               
               <td>
                  
                  <center>
                      <span style="font: 28px Astloch; color: #fff;">Conselho Administrativo</span>
                  </center>
                  
                  <div style="width: 418px; height: 160px; padding: 5px; background: #151312; font: 12px tahoma; text-align: justify;">
                      <style type="text/css">.mod{width: 69px; height: 144px; padding: 3px; font-size: 12px; line-height:12px; font-family: Calibri; color: #fff; text-align: center; opacity:0.0; transition-duration: 0.6s;-moz-transition-duration: 0.6s;-webkit-transition-duration: 0.6s;-o-transition-duration: 0.6s; background: #151312; overflow:auto; scrollbar:true;} .mod:hover {opacity: 1;} .tittle1 {font-size:15px; font-family: arial; text-align:center; color:white; text-transform:uppercase; padding-top: 60px;} .subtittle {font-size: 11px; font-family: Calibri; text-align:center; color:white; text-transform:uppercase; margin-top:-10px; letter-spacing:2px;}</style>
                     <table>
                        
                        <tbody>
                           
                           <tr>
                              
                              <td>
                                 
                                 <div style="width: 75px; height: 150px; background: url(http://i.imgur.com/zbRn4qw.png); border: 2px solid #3f3937; ">
                                    
                                    <div class="mod">
                                        <br><br><br><br><span style="font-family: Oswald; font-size: 18px; letter-spacing: 2px;">Spirit</span><br> <br>Thay<br>
                                       <center>
                                           <a href="u7">Perfil</a> - <a href="/privmsg?mode=post&amp;u=7">MP</a>
                                       </center>
                                       
                                    </div>
                                    
                                 </div>
                                 
                              </td>
                              
                              <td>
                                 
                                 <div style="width: 75px; height: 150px; background: url(http://i.imgur.com/gkYs5uL.png); border: 2px solid #3f3937; ">
                                    
                                    <div class="mod">
                                        <br><br><br><br><span style="font-family: Oswald; font-size: 18px; letter-spacing: 2px;">Air</span><br> <br>Becca<br>
                                       <center>
                                           <a href="/u5">Perfil</a> - <a href="/privmsg?mode=post&amp;u=5">MP</a>
                                       </center>
                                       
                                    </div>
                                    
                                 </div>
                                 
                              </td>
                              
                              <td>
                                 
                                 <div style="width: 75px; height: 150px; background: url(http://i.imgur.com/P0u0ePI.png); border: 2px solid #3f3937; ">
                                    
                                    <div class="mod">
                                        <br><br><br><br><span style="font-family: Oswald; font-size: 18px; letter-spacing: 2px;">Earth</span><br> <br>Mary<br>
                                       <center>
                                           <a href="/u6">Perfil</a> - <a href="/privmsg?mode=post&amp;u=6">MP</a>
                                       </center>
                                       
                                    </div>
                                    
                                 </div>
                                 
                              </td>
                              
                              <td>
                                 
                                 <div style="width: 75px; height: 150px; background: url(http://i.imgur.com/1gg5Rcg.png); border: 2px solid #3f3937; ">
                                    
                                    <div class="mod">
                                        <br><br><br><br><span style="font-family: Oswald; font-size: 18px; letter-spacing: 2px;">Fire</span><br> <br>Alysson<br>
                                       <center>
                                           <a href="/u3">Perfil</a> - <a href="/privmsg?mode=post&amp;u=3">MP</a>
                                       </center>
                                       
                                    </div>
                                    
                                 </div>
                                 
                              </td>
                              
                              <td>
                                 
                                 <div style="width: 75px; height: 150px; background: url(http://i.imgur.com/AcqJmcy.png); border: 2px solid #3f3937; ">
                                    
                                    <div class="mod">
                                        <br><br><br><br><span style="font-family: Oswald; font-size: 18px; letter-spacing: 2px;">Water</span><br> <br>Yas<br>
                                       <center>
                                           <a href="/u2">Perfil</a> - <a href="/privmsg?mode=post&amp;u=2">MP</a>
                                       </center>
                                       
                                    </div>
                                    
                                 </div>
                                 
                              </td>
                              
                           </tr>
                           
                        </tbody>
                        
                     </table>
                     
                  </div>
                  
               </td>
               
            </tr>
            
         </tbody>
         
      </table>

Até mais.

Deu certo!