Detalhes da questão

Endereço do fórum: http://istdurmstrangonline.forumeiros.com
Versão do fórum: phpBB3

Descrição

Olá de novo.

Tenho aqui o seguinte problema:

https://i.imgur.com/eLg4puZ.png

Não tenho ideia sobre como fazer isso. Poderiam me ajudar por favor?


Código Index-Body

Código:

{JAVASCRIPT}
<!-- BEGIN switch_user_logged_in --><p class="right rightside">{LAST_VISIT_DATE}</p><!-- END switch_user_logged_in -->
<p>{CURRENT_TIME}</p>
<br class="clear" />

<!-- BEGIN switch_user_login_form_header -->
<div class="panel">
   <div class="inner"><span class="corners-top"><span></span></span>
      <form action="{S_LOGIN_ACTION}" method="post" name="form_login">
         <div class="user_login_form center">
            <label>{L_USERNAME} : <input class="post" type="text" size="10" name="username" /></label>
            <label>{L_PASSWORD} : <input class="post" type="password" size="10" name="password" /></label>
            <label>{L_AUTO_LOGIN} : <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
            {S_HIDDEN_FIELDS}<input class="mainoption button1" type="submit" name="login" value="{L_LOGIN}" />
            <!-- BEGIN switch_fb_connect -->
            <span class="fb_or">{switch_user_login_form_header.switch_fb_connect.L_OR}</span>
            <fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button>
            <!-- END switch_fb_connect -->
         </div>
      </form>
   <span class="corners-bottom"><span></span></span></div>
</div>
<!-- END switch_user_login_form_header -->

<!-- BEGIN message_admin_index -->
   <div class="panel introduction">
      <div class="inner"><span class="corners-top"><span></span></span>
   <!-- BEGIN message_admin_titre -->
      <div class="h3">{message_admin_index.message_admin_titre.MES_TITRE}</div>
   <!-- END message_admin_titre -->

   <!-- BEGIN message_admin_txt -->
      <div class="mes-txt">{message_admin_index.message_admin_txt.MES_TXT}</div>
   <!-- END message_admin_txt -->
      <span class="corners-bottom"><span></span></span></div>
   </div>
<!-- END message_admin_index -->

{CHATBOX_TOP}
{BOARD_INDEX}

<!-- BEGIN disable_viewonline -->
<div class="h3"></div>
<div id="es-cuerpo">
<table><tr><td>
  <div id="es-caja1">
  <div id="es-tit">Conectados</div>
  <div id="es-con">
    {LOGGED_IN_USER_LIST}

    {L_ONLINE_USERS}
    {L_CONNECTED_MEMBERS}<br />
    {L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}
  </div>
  </div>
</td><td>
  <div id="es-caja2">
  <div id="es-tit">Legenda</div>
  <div id="box-ley">
    
      <div id="box-grup1"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
      <div id="box-grup2"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
      <div id="box-grup3"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
      <div id="box-grup4"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
      <div id="box-grup5"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
      <div id="box-grup6"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
      <div id="box-grup7"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
      <div id="box-grup8"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
      <div id="box-grup9"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
      <div id="box-grup10"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
      <div id="box-grup11"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
      <div id="box-grup12"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
      <div id="box-grup13"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
          <div id="box-grup14"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
    
          <div id="box-grup15"><div id="gru-nom">
        <div id="cen">Nome</div>
      </div></div>
  </div>
  </div>
</td></tr></table>
  <div id="es-tit">Estatísticas</div>
  <div id="es-ult">
    <div id="box1">{TOTAL_POSTS}</div>
    <div id="box2">{TOTAL_USERS}</div>
    <div id="box3">{NEWEST_USER}</div>
    <div id="box4">{TOTAL_USERS_ONLINE}</div>
  </div>
</div>

  
   <!-- BEGIN switch_chatbox_activate -->
   <div class="h3"><a href="{S_JOIN_CHAT}" target="ChatBox">{CHATBOX_NAME}</a></div>
   <div class="page-bottom">
   {TOTAL_CHATTERS_ONLINE} :
   {CHATTERS_LIST}<br />
   </div>
      <!-- BEGIN switch_chatbox_popup -->
      <div id="chatbox_popup"></div>
      <script type="text/javascript">
      insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
      </script>
      <!-- END switch_chatbox_popup -->
   <!-- END switch_chatbox_activate -->
<!-- END disable_viewonline -->

{CHATBOX_BOTTOM}

<!-- BEGIN switch_user_login_form_footer -->
<div class="panel">
   <div class="inner"><span class="corners-top"><span></span></span>
      <form action="{S_LOGIN_ACTION}" method="post" name="form_login">
         <div class="user_login_form center">
            <label>{L_USERNAME} : <input class="post" type="text" size="10" name="username" /></label>
            <label>{L_PASSWORD} : <input class="post" type="password" size="10" name="password" /></label>
            <label>{L_AUTO_LOGIN} : <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
            {S_HIDDEN_FIELDS}<input class="mainoption button1" type="submit" name="login" value="{L_LOGIN}" />
            <!-- BEGIN switch_fb_connect -->
            <span class="fb_or">{switch_user_login_form_footer.switch_fb_connect.L_OR}</span>
            <fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button>
            <!-- END switch_fb_connect -->
         </div>
      </form>
   <span class="corners-bottom"><span></span></span></div>
</div>
<!-- END switch_user_login_form_footer -->

<br style="clear:both" />

<!-- BEGIN switch_legend -->
<ul id="picture_legend">
   <li><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" />{L_NEW_POSTS}</li>
   <li><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" />{L_NO_NEW_POSTS}</li>
   <li><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" />{L_FORUM_LOCKED}</li>
</ul>
<!-- END switch_legend -->

{AUTO_DST}

<!-- BEGIN switch_fb_index_login -->
<div id="fb-root"></div>
<script>
    FB.init({
      appId      : {switch_fb_index_login.FACEBOOK_APP_ID},
      cookie    : true,
      xfbml      : true,
      oauth      : true,
      version    : 'v2.3'
    });

  (function(d, s, id){
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) {return;}
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));
</script>
<!-- END switch_fb_index_login -->

@Nyxanya, coloque os códigos utilizados em seu CSS, no index_body e JavaScript, caso use.

Assim que for te ajudar, irá já ter as informações e será mais rápido.

CSS

Código:

/* latin-ext */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  src: local('Oswald Regular'), local('Oswald-Regular'), url(https://fonts.gstatic.com/s/oswald/v10/yg0glPPxXUISnKUejCX4qfesZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 400;
  src: local('Oswald Regular'), local('Oswald-Regular'), url(https://fonts.gstatic.com/s/oswald/v10/pEobIV_lL25TKBpqVI_a2w.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

/* latin-ext */
@font-face {
  font-family: 'Abril Fatface';
  font-style: normal;
  font-weight: 400;
  src: local('Abril Fatface'), local('AbrilFatface-Regular'), url(https://fonts.gstatic.com/s/abrilfatface/v8/X1g_KwGeBV3ajZIXQ9VnDn1PgMwFt2V-WJ2uOZ4WXLU.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Abril Fatface';
  font-style: normal;
  font-weight: 400;
  src: local('Abril Fatface'), local('AbrilFatface-Regular'), url(https://fonts.gstatic.com/s/abrilfatface/v8/X1g_KwGeBV3ajZIXQ9VnDjxObtw73-qQgbr7Be51v5c.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

/****************** S K I N  D E L  F O R O *******************/
/*Cuerpo del Foro*/
#wrap {
padding: 10px!important;
width: 1100px;
max-width: 1100px;
min-width: 1100px;
margin-top: 10px;
}
 
/*mueve la imagen del logo para que cuadre con el foro*/
#logo img {
float: none;
width: 1120px; !important;
margin-top: -20px;
margin-left: -20px;
}

/*elimina el titulo del foro y el subtitulo*/
#site-title, #site-title h1 {
font-size: 0px;
padding-top: 0px;
}

#logo-desc p {
font-size: 0px;
margin: 0;
padding: 0;
}
 
/*elimina el buscar*/
#search-box {
display: none;
}
 
/*barra del menu*/
ul.navlinks {
width: 1090px;
display: block;
padding: 10px;
padding-left: 20px;
background: url(https://i.imgur.com/0Gg7FIA.jpg);
font-family: 'Calibri';
font-size: 9px;
line-height: 30px;
text-align: right;
letter-spacing: 1px;
word-spacing: 1px;
font-weight: lighter;
margin-left: -20px;
margin-top: -17px;
}
 
ul.navlinks a {
color: #fff;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: lighter;
cursor: pointer;
}
 
ul.navlinks a:hover {
text-decoration: none;
}

/*edita comandos del menu*/
#menu-logout, #menu-login, #menu-perfil, #menu-home {display: inline-block;}
#menu-none {display: none;}
#menu-home {float: left;}

/*titulo de los foros - subforos - ultimos mensajes*/
ul.topiclist li {
display: block;
margin: 0;
}
 
li.header {
background: url(https://i.imgur.com/0Gg7FIA.jpg);
font-size: 0;
line-height: 90px;
text-align: center;
text-transform: none;
padding: 15px;
}
 
.table-title, .table-title h2 {
color: #fff;
font-family: 'Oswald';
font-size: 20px;
font-variant: normal;
font-weight: normal;
text-shadow: 1px 1px 1px #000;
text-transform: uppercase;
line-height: 80px;
}

.forabg li.header dd.dterm {
text-align: center;
width: 100%;
}

/*parte de los foros*/
ul.forums {
background: #0F0F0F;
border-bottom: 10px solid #590000;
}

/*desaparece la cabera*/
    .forabg li.header dd.lastpost {
    display:none;
    }
 
    .forabg li.header dd.posts {
    display:none;}
 
    .forabg li.header dd.topics {
    display:none;
    }

/*titulo de los subforos*/
a.forumtitle {
  width: 670px;
  padding: 5px 10px;
  border-bottom: 1px solid #590000;
  margin-top: 4px;
  margin-left: 28px;
  line-height: 20px;
  font-size: 16px;
  letter-spacing: 0px;
  color: #fff;
  font-family: 'Abril Fatface';
  text-align: center;
  text-decoration: none;
  font-weight: lighter;
  display: block;
  -moz-transition: all 1.7s ease-in-out;
  -webkit-transition: all 1.7s ease-in-out;
  transition: all 1.7s ease-in-out;
}
 
a.forumtitle:hover {
  text-decoration: none;
  color: #590000;
  letter-spacing: 2px;
  -moz-transition: all 1.7s ease-in-out;
  -webkit-transition: all 1.7s ease-in-out;
  transition: all 1.7s ease-in-out;
}

/*cantidad de temas*/
.forabg dd.topics {
  background: #3f3f3f;
  line-height: 10px;
  padding: 15px 10px;
  width: 80px;
  margin-top: 120px;
  margin-left: 170px;
  font-size: 8px;
  letter-spacing: 2px;
  color: #fff;
  font-family: 'verdana';
  text-transform: uppercase;
}
 
.forabg li.row dd.topics:after {content: "Tópicos"; display: block;}
.forabg li.row dd.posts:after {content: "Mensagens"; display: block;}
 
/*cantidad de post*/
.forabg dd.posts {
  background: #590000;
  line-height: 10px;
  padding: 15px 10px;
  width: 80px;
  margin-top: 70px;
  margin-left: 2px;
  font-size: 8px;
  letter-spacing: 2px;
  color: #fff;
  font-family: 'verdana';
  text-transform: uppercase;
}
 
/*ultimo mensaje*/
.forabg dd.lastpost {
  width: 184px;
  position: abolute;
  float: right;
  background: #0F0F0F;
  border-bottom: 10px solid #590000;
  margin-right: 50px;
  margin-top: 2px;
  height: 30px;
  line-height: 12px;
  text-transform: uppercase;
  font-family: verdana;
  color: #555;
  font-size: 7px;
  letter-spacing: 2px;
  text-align: center;
  padding: 10px;
  border-left: 0px;
}

li dd.lastpost span a {
  display: inline-block;
  line-height: 10px;
  text-transform: uppercase;
  font-family: verdana;
  color: #555;
  font-size: 8px;
  letter-spacing: 2px;
}

/*descripción de los temas*/
#link1 {
  width: 200px;
  margin-left: 28px;
}

#link1 a {
  width: 200px;
  margin: 1px;
  display: inline-block;
  font-size: 8px;
  letter-spacing: 2px;
  color: #fff;
  font-family: 'verdana';
  text-transform: uppercase;
  text-align: center;
  padding: 4px;
  background: #590000;
  -moz-transition: all 1.7s ease-in-out;
  -webkit-transition: all 1.7s ease-in-out;
  transition: all 1.7s ease-in-out;
}

#link1 a:hover {
  background: #A1BBAC;
  -moz-transition: all 1.7s ease-in-out;
  -webkit-transition: all 1.7s ease-in-out;
  transition: all 1.7s ease-in-out;
}

#img1, #img2 {
  width: 650px;
  height: 150px;
  padding: 10px;
  outline: #590000 solid 1px;
  border: 10px solid #000;
  margin: 1px;
  margin-left: 29px;
  overflow: hidden;
}

#tex3 {
  background: #000;
  width: 170px;
  height: 150px;
  overflow: auto;
  text-align: justify;
  padding: 10px;
  line-height: 12px;
  margin-left: 680px;
  margin-top: -150px;
  -moz-transition: all 1.7s ease-in-out;
  -webkit-transition: all 1.7s ease-in-out;
  transition: all 1.7s ease-in-out;
}

#img1:hover #tex3 {
  margin-left: 470px;
  -moz-transition: all 1.7s ease-in-out;
  -webkit-transition: all 1.7s ease-in-out;
  transition: all 1.7s ease-in-out;
}

/*titulos*/
.h3 {
background: #590000;
color: #fff;
font-family: 'Verdana';
font-size: 10px;
font-variant: normal;
font-weight: normal;
text-transform: uppercase;
padding: 35px 10px;
text-align: center;
letter-spacing: 2px;
}
 
.h3 a {
  text-decoration: none;
  color: #fff;
}
 
.h3 a:hover {
  text-decoration: none;
  color: #fff;
}
 
h1.page-title {
background: #590000;
color: #fff;
font-family: 'Verdana';
font-size: 10px;
font-variant: normal;
font-weight: normal;
text-transform: uppercase;
padding: 35px 10px;
text-align: center;
letter-spacing: 2px;
}
 
h1.page-title a {
  text-decoration: none;
  color: #fff;
}
 
h1.page-title a:hover {
  text-decoration: none;
  color: #fff;
}

#tema-titulo a {
  width: 820px;
  display: block;
  padding: 22px 10px;
  background: #590000;
  color: #fff;
  font-family: 'Verdana';
  font-size: 9px;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 2px;
  margin-left: -10px;
  margin-top: -2px;
}

#tema-autor {
  width: 820px;
  display: block;
  background: transparent;
  color: #eee;
  font-family: 'Verdana';
  font-size: 7px;
  text-transform: uppercase;
  text-align: left;
  letter-spacing: 2px;
  margin-left: -10px;
  padding: 0px 10px;
  line-height: 23px;
  margin-top: 2px;
}

#tema-autor img {display: none}

#tema-opc {
  width: 820px;
  display: block;
  background: #121212;
  text-align: right;
  letter-spacing: 2px;
  margin-left: -10px;
  padding: 0px 10px;
  line-height: 23px;
  margin-top: 2px;
}

.boton {
  color: #eee;
  font-family: 'Verdana';
  font-size: 7px;
  text-transform: uppercase;
  display: inline-block;
  margin-right: 10px;
}

/*edita la respuesta*/
.postbody .content {
  font-size: 1.3em;
  width: 830px;
  text-align: justify;
  margin-top: 10px;
  margin-left: -5px;
}

/*PERFILES DE LOS PERSONAJES*/
#perfil-cuerpo {
    -moz-transition: all 1.7s ease-in-out;
    -webkit-transition: all 1.7s ease-in-out;
    background: #212121;
    height: auto;
    margin-left: -8px;
    margin-top: -7px;
    transition: all 1.7s ease-in-out;
    width: 250px;
}

#perfil-rotulo {width: 250px; height: 55px; overflow: hidden;}

#rotulo-nombre {
  width: 220px;
  height: 10px;
  padding: 5px;
  background: #212121;
  font-family: verdana;
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: 1px;
  word-spacing: 1px;
  line-height: 10px;
  text-align: center;
  position: absolute;
  margin-left: -2px;
  margin-top: 15px;
}
#rotulo-nombre a:hover {text-decoration: none;}

#rotulo-irango {
  width: 250px;
  height: 50px;
  blackground: #511;
}

#rotulo-nrango {
  width: 230px;
  padding: 10px;
  background: #212121;
  font-family: verdana;
  font-size: 7px;
  text-transform: uppercase;
  letter-spacing: 1px;
  word-spacing: 1px;
  line-height: 10px;
  text-align: center;
  color: #eee;
}

#perfil-data {
  width: 250px;
  height: 400px;
  overflow: hidden;
}

#data-label {
  opacity: 0;
  z-index: 999;
  position: absolute;
  width: 250px;
  height: 400px;
  overflow: hidden;
  margin-left: 15px;
  margin-top: 15px;
  -moz-transition: all 1.7s ease-in-out;
  -webkit-transition: all 1.7s ease-in-out;
  transition: all 1.7s ease-in-out;
}

#data-avatar {
  opacity: 1;
  position: static;
  -moz-transition: all 1.7s ease-in-out;
  -webkit-transition: all 1.7s ease-in-out;
  transition: all 1.7s ease-in-out;
  transition-delay: 1s;
}

#perfil-cuerpo:hover #data-avatar {
  opacity: 0.3;
  -moz-transition: all 1.7s ease-in-out;
  -webkit-transition: all 1.7s ease-in-out;
  transition: all 1.7s ease-in-out;
}

#perfil-cuerpo:hover #data-label {
  opacity: 1;
  -moz-transition: all 1.7s ease-in-out;
  -webkit-transition: all 1.7s ease-in-out;
  transition: all 1.7s ease-in-out;
  transition-delay: 1s;
}

#label-info {
  width: 180px;
  height: 130px;
  overflow: auto;
  border: 10px solid #0F0F0F;
  background: #0F0F0F;
  margin-top: 95px;
  margin-bottom: 5px;
}

#lab-dato {
  display: block;
  color: #333;
  font-family: verdana;
  font-size: 7px;
  line-height: 8px;
  padding: 4px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

#lab-sep {height: 1px; background: #777; margin: 0px;}

#lab-dato img {
  position: absolute;
  width: 85px;
  height: 85px;
  margin-top: -105px;
  background: #0F0F0F;
  padding: 10px;
  border-radius: 50%;
  margin-left: 33px;
}

/*Code, Spoiler y Quote*/
dl.codebox {
background-color: #fcfcfc;
border-top: none;
border-left: none;
border-right: none;
border-bottom: 3px solid #590000;
font-size: 11px;
}
 
dl.codebox dt {
display:block;
text-shadows: 1px 1px 1px #000;
text-align: center;
font: 8px 'verdana';
text-transform: uppercase;
background: #590000;
color:#fff;
padding: 10px;
letter-spacing: 1px;
}
 
dl.codebox code {
color:#333333;
font-size:11px;
padding: 5px;
}
 
blockquote {
background: #fcfcfc url(https://i.servimg.com/u/f42/09/02/12/09/commen10.png) 6px 12px no-repeat;
border-bottom: 5px solid #590000;
border-top: none;
border-left: none;
color: #333333;
border-right: none;
}
 
.content blockquote {
color:#333333;
font-family: verdana;
font-size: 11px;
padding: 5px;
}
 
blockquote cite {
display: block;
font-family: 'Oswald';
font-size: 18px;
line-height: 20px;
color: #590000;
font-style: normal;
font-weight: 700;
text-transform: uppercase;
font-weight: lighter;
letter-spacing: 1px;
padding: 5px;
}

blockquote blockquote {background: #0F0F0F; }

/*editar*/
#edit {display: none}

/*Color de las pestañas del Perfil*/
#tabs {
float: center;
width: 845px;
background-color: #590000;
padding: 5px 10px;
color: #eee;
font-size: 7px;
text-transform: uppercase;
text-align: center;
letter-spacing: 1px;
display: block;
font-weight: lighter;
}

#tabs a span {color: #eee; font-weight: lighter;}
#tabs .activetab a span {color: #A1BBAC; font-weight: lighter;}

/*Efecto en la numeracion de paginas*/
.pagination span a, .pagination span a:active, .pagination span a:link, .pagination span a:visited {
background-color: #590000;
border: 1px solid #590000;
color: #fff;
font-size: 10px;
font-weight: 400;
line-height: 1.5em;
margin: 0 2px;
padding: 0 2px;
text-decoration: none;
}
 
.pagination span strong {
background-color: #590000;
border: 1px solid #590000;
color: #fff;
font-size: 10px;
margin: 0 2px;
padding: 0 2px;
}
 
.pagination span a:hover {
background-color: #590000;
border: 1px solid #590000;
color: #fff;
font-size: 10px;
font-weight: 400;
line-height: 1.5em;
margin: 0 2px;
padding: 0 2px;
text-decoration: none;
}

#cp-main .panel.sig {background-color: #121212; }

/*botones*/
a.button1, a.button2, button.button2, input.button1, input.button2 {
background: #590000;
border: 0px;
color: #fff;
display: inline-block;
font-family: calibri;
font-size: 10px;
outline: medium none;
padding: 5px 8px;
text-transform: uppercase;
letter-spacing: 1px;
}
 
a.button1:hover, a.button2:hover, button.button2:hover, input.button1:hover, input.button2:hover {
background: #590000;
border: 0px;
color: #fff;
display: inline-block;
font-family: calibri;
font-size: 10px;
outline: medium none;
text-transform: uppercase;
}
 
/*formulario*/
.inputbox, select {
background-color: #fcfcfc;
border: 0px;
border-bottom: 1px solid #590000;
padding: 5px 10px;
color: #000;
display: inline-block;
font-family: verdana;
font-size: 10px;
}
 
#cp-main h1 {
border-bottom: none;
color: #fff;
margin-left: 10px;
padding: 20px;
}

.pathname-box, p.path {
  color: #590000;
  font-size: 7px;
  letter-spacing: 1px;
  font-family: 'verdana';
  text-transform: uppercase;
}

.pathname-box a, p.path a {color: #000; }

/*seleccionar asi todo mono*/
::selection {
  background: #A1BBAC;
  color: #000;
}
 
::-moz-selection {
  background: #4A5947;
  color: #fff;
}
 
/*barra lateral*/
::-webkit-scrollbar-thumb {
  background-color: #590000;
  border: 2px solid #fff;
  height: auto;
  width: 5px;
}
 
::-webkit-scrollbar {
  background-color: #590000;
  border: 4px solid #fff;
  height: 10px;
  width: 10px;
}

/*estadisticas del foro*/
#es-cuerpo {
  display: block;
  background: #0F0F0F;
  border-bottom: 10px solid #590000;
  padding: 10px;
}

#es-caja1, #es-caja2 {
  width: 525;
  height: 189px;
  overflow: hidden;
}

#es-caja1 {margin-right: 10px}

#es-tit {
  display: block;
  padding: 5px 10px;
  border-bottom: 1px solid #590000;
  margin-top: 4px;
  line-height: 20px;
  font-size: 12px;
  letter-spacing: 2px;
  color: #590000;
  font-family: 'Oswald';
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  font-weight: lighter;
}

#es-con {
  display: block;
  margin: 10px;
  padding: 10px;
  padding-top: 0px;
  border: 1px solid #590000;
  overflow: auto;
  height: 130px;
  text-align: justify;
}

#es-con a {
  font-family: 'Abril Fatface';
  font-weight: normal;
  letter-spacing: 0px;
  word-spacing: 2px;
  line-height: 20px;
  font-size: 16px;
}

#box1, #box2, #box3 {
  width: 300px;
  padding: 10px;
  display: inline-block;
  margin-top: 10px;
  margin-left: 10px;
  background: #121212;
  font-family: 'Abril Fatface';
  font-weight: normal;
  letter-spacing: 0px;
  word-spacing: 2px;
  line-height: 20px;
  font-size: 16px;
  border-bottom: 5px solid #590000;
  text-align: center;
}

#box1:before, #box2:before, #box3:before {
  background: #590000;
  line-height: 10px;
  padding: 10px;
  width: 300px;
  margin-top: -10px;
  margin-left: -10px;
  margin-bottom: 10px;
  font-size: 8px;
  letter-spacing: 2px;
  color: #fff;
  font-family: 'verdana';
  text-transform: uppercase;
  display: block;
}

#box4 {
  background: #590000;
  line-height: 10px;
  padding: 10px;
  display: block;
  margin: 10px;
  font-size: 7px;
  letter-spacing: 2px;
  color: #fff;
  font-family: 'verdana';
  text-transform: uppercase;
  text-align: center;
}


#box1:before {content: "Mensagens Publicadas"}
#box2:before {content: "Usuários Registrados"}
#box3:before {content: "Bem vindo:"}
#box4:before {content: "Conectados recentemente:"}

#box-ley {
  display: block;
  margin: 10px;
  padding: 10px;
  border: 1px solid #590000;
  overflow: hidden;
  height: 120px;
  text-align: center;
}

#box-grup1, #box-grup2, #box-grup3, #box-grup4, #box-grup5, #box-grup6, #box-grup7, #box-grup8, #box-grup9 {
  width: 80px;
  height: 40px;
  margin: 1px;
  display: inline-block;
  overflow: hidden;
}

#box-grup1 {background: #a44857;}
#box-grup2 {background: #919653;}
#box-grup3 {background: #cea04b;}
#box-grup4 {background: #4a6a9b;}
#box-grup5 {background: #ca2d38;}
#box-grup6 {background: #777c65;}
#box-grup7 {background: #cb6034;}
#box-grup8 {background: #7d637c;}
#box-grup9 {background: #708a8b;}
#box-grup10 {background: #708a8b;}
#box-grup11 {background: #708a8b;}
#box-grup12 {background: #708a8b;}
#box-grup13 {background: #708a8b;}


#nom {
  background: #121212;
  line-height: 10px;
  padding: 4px;
  display: block;
  font-size: 8px;
  letter-spacing: 1px;
  font-family: 'verdana';
  text-transform: uppercase;
  text-align: center;
  color: #000;
  margin-left: 120px;
  -moz-transition: all 1.7s ease-in-out;
  -webkit-transition: all 1.7s ease-in-out;
  transition: all 1.7s ease-in-out;
}

#box-grup1:hover #nom
#box-grup2:hover #nom
#box-grup3:hover #nom
#box-grup4:hover #nom
#box-grup5:hover #nom
#box-grup6:hover #nom
#box-grup7:hover #nom
#box-grup8:hover #nom
#box-grup9:hover #nom


/* C H A T   B O X  */
.chatbox-title, .chatbox-title a.chat-title {
  font-family: Oswald;
  font-weight: normal;
  font-size: 15px;
  color: #fff;
  margin-left: 5px;
}

.chatbox-options li, .chatbox-options li a, .chatbox-options li label, .chatbox-options li strong {
  font-family: verdana;
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  color: #fff;
  letter-spacing: 1px;
  font-weight: lighter;
}
#chatbox_header{background: #590000;}
#chatbox_footer{background-color: #590000;}
#chatbox {background: #000;}

.chatbox_row_1,.chatbox_row_2,.chatbox_row_3{
  font-size:12px;
  font-family: Trebuchet MS;
  line-height: 12px;
}
#chatbox_footer label {
  font-family: verdana;
  font-size: 8px;
  font-weight: 700;
  text-transform: uppercase;
  color: #590000;
}
#chatbox_members{
  font-size: 12px;
  font-family: Trebuchet MS;
  line-height: 9px;
  letter-spacing: 0px;
}

/*AFILIADOS AL PIE DEL FORO*/
#afi-nom {
  display: block;
  background: #590000;
  line-height: 10px;
  padding: 10px;
  font-size: 8px;
  letter-spacing: 2px;
  color: #fff;
  font-family: 'verdana';
  text-transform: uppercase;
  text-align: center;
}

#afi-nor a {
  display: block;
  width: 440px;
  background: #590000;
  line-height: 10px;
  padding: 10px;
  font-size: 8px;
  line-height: 66px;
  letter-spacing: 2px;
  color: #fff;
  font-family: 'verdana';
  text-transform: uppercase;
  text-align: center;
}

#afi-mano, #afi-vip {
  display: block;
  width: 300px;
  padding: 0px;
  background: #eee;
  margin-bottom: 10px;
}

#afi-vip {width: 460px; margin-right: 10px;}
#afi-cu1, #afi-cu2, #afi-cu4 {display:block; padding: 20px; background: #0F0F0F;}
#afi-cu1 {width: 260px;}
#afi-cu2 {width: 420px;}
#afi-cu4 {width: 260px;}
#afi-cu1 img {width: 50px; height: 90px; margin: 1px;}
#afi-cu2 img {width: 40px; height: 40px; margin: 1px;}
#afi-cu4 img {width: 50px; height: 50px; margin: 1px;}

/* T A B L O N   D E   A N U N C I O S */
.wid {
  margin-top: 70px;
  margin-left: 10px;
  width: 140px;
  height: 180px;
  padding: 20px;
  background: #121212;
  margin-bottom: -10px;
  overflow: hidden;
}

#wid-u {
  display: block;
  background: #590000;
  line-height: 10px;
  padding: 10px;
  width: 160px;
  margin-top: -20px;
  margin-left: -20px;
  margin-bottom: 20px;
  font-size: 8px;
  letter-spacing: 2px;
  color: #fff;
  font-family: 'verdana';
  text-transform: uppercase;
}

#wid-u strong {color: #fff; font-weight: lighter;}

#wid-ava img {
  width: 115px;
  height: 150px;
  margin-top: -7px;
  margin-left: 2px;
}

.bot1, .bot2, .bot3, .bot4, .bot5 {
  width: 25px;
  line-height: 20px;
  height: 20px;
  text-align: center;
  color: #000;
}

#caja1, #caja2, #caja3, #caja4, #caja5 {
  position: fixed;
  top: 20%;
  left: 30%;
  width: 500px;
  height: 350px;
  padding: 10px;
  display: none;
  background: #121212;
  border: 10px solid #590000;
}

#cont-img {
  width: 208px;
  height: 310px;
  padding: 20px;
}

#img-texto {
  width: 188px;
  height: 150px;
  padding: 10px;
  background: #121212;
  margin-top: 140px;
  font-size: 10px;
  line-height: 11px;
  text-align: justify;
  overflow: auto;
}

#cont-link {
  width: 248px;
  height: 198px;
}

#cont-link a {
  display: block;
  background: #590000;
  line-height: 10px;
  padding: 5px;
  margin-bottom: 2px;
  font-size: 8px;
  letter-spacing: 2px;
  color: #fff;
  font-family: 'verdana';
  text-transform: uppercase;
  text-aling: center;
}

#tit-img {
  width: 228px;
  height: 132px;
  padding: 10px;
}

#tit-tex, #tit-jef {
  display: block;
  background: #121212;
  line-height: 10px;
  padding: 5px;
  margin-top: 60px;
  font-size: 8px;
  letter-spacing: 2px;
  color: #000;
  font-family: 'verdana';
  text-transform: uppercase;
  text-aling: center;
}

#img-r1, #img-r2, #img-r3, #img-r4, #img-r {
  width: 188px;
  height: 35px;
  padding: 20px 10px;
  background: #121212;
  margin-bottom: 3px;
  font-size: 20px;
  line-height: 25px;
  font-family: 'Abril Fatface';
  text-align: center;  
}

#img-r1 p, #img-r2 p, #img-r3 p, #img-r4 p, #img-r p {
  display: block;
  line-height: 10px;
  font-size: 8px;
  letter-spacing: 2px;
  color: #000;
  font-family: 'verdana';
  text-transform: uppercase;
  text-aling: center;
}

#img-r1 {color: #d1111a;}
#img-r2 {color: #008080;}
#img-r3 {color: #f4a611;}
#img-r4 {color: #148444;}

#cont-jefes {
  width: 248px;
  height: 350px;
}

#jefes {
  width: 100px;
  height: 152px;
  padding: 10px;
  display: inline-block;
  margin-bottom: 5px;
  -moz-transition: all .7s ease-in-out;
  -webkit-transition: all .7s ease-in-out;
  transition: all .7s ease-in-out;
}

#tit-jef strong {display: block; letter-spacing: 0px;}
#tit-jef {width: 100px; margin-top: 0px; padding: 0px; height: 0px; overflow: hidden; position: absolute; -moz-transition: all .7s ease-in-out; -webkit-transition: all .7s ease-in-out; transition: all .7s ease-in-out;}
#jefes:hover #tit-jef {width: 90px; margin-top: 0px; padding: 5px; height: auto; -moz-transition: all .7s ease-in-out; -webkit-transition: all .7s ease-in-out; transition: all .7s ease-in-out;}

/*tablon en el índice*/
#in-caja {
  width: 900px;
  text-align:center;
  display: block;
  padding: 20px;
  background: #000;
  border: 7px solid #590000;
}

#in-staff {width: 188px; height: 108px}
#in-staff img {margin: 2px; width: 90px; height: 50px}

#in-clima {
  width: 400px;
  height: 88px;
  padding: 10px;
  overflow: auto;
  text-align: justify;
  font-size: 10px;
  line-height: 11px;
}
  
#in-nov {
  width: 238px;
  height: 88px;
  padding: 10px;
  overflow: auto;
  text-align: justify;
  font-size: 10px;
  line-height: 11px;
}

#in-clima strong {
  font-size: 18px;
  line-height: 20px;
  font-family: 'Abril Fatface';
}


a.mainmenu[href="/faq"]{
display: none !important;
}
a.mainmenu[href="/calendar"]{
display: none !important;
}

Boa noite.

O template informado no primeiro tópico é semelhante a este: https://pages.shiftactif.com/?&id=4&title=estatisticas-t112098
O CSS é:

Código:

/* estadisticas */
 #let-b2b {
    border-top: 1px solid #f3f3f3;
    color: #1c1c1c;
    font-family: montserrat;
    font-size: 20px;
    font-style: normal;
    font-variant: normal;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 30px;
    padding-right: 10px;
    text-align: right;
    text-transform: uppercase;
}
#let-b2b t {
color: #d8da22;
}
.Saturn {
    width: 920px;
    padding: 10px;
    height: 350px;
    margin: 20px;
    background: #000;
}
.Meteor {
    width: 200px;
    padding: 10px;
    margin: 20px;
    background: #fcfcfc;
    border: 1px solid #ddd;
}
 
.Estats {
    background: #fcfcfc;
    display: block;
    text-align: center;
    font-size: 0;
    padding: 10px;
}
 
.Estats span.Est1 {
    font-size: 9px;
    font-family: calibri;
    letter-spacing: 1px;
}
 
.Estats strong {
    font-size: 12px;
    font-family: montserrat;
    text-transform: uppercase;
}
 
.Planets {
    width: 420x;
    padding: 10px;
    margin: 20px;
    border: 1px solid #ddd;
    background: #fcfcfc;
}
 /*grupos*/
#grup1, #grup2, #grup3, #grup4, #grup5, #grup6 {
outline: 1px solid #f3f3f3;
border: 5px solid #fcfcfc;
margin: 1px;
display: inline-block;
width: 62px;
height: 40px;
overflow: hidden;
margin-right: 3px;
margin-top: 3px;
}
 
#grup1 {background: #6b524e;}
#grup2 {background: #53002c;}
#grup3 {background: #d7bc2e;}
#grup4 {background: #86af77;}
#grup5 {background: #c76e1c;}
#grup6 {background: #8f3922;}
 
#g1, #g2, #g3, #g4, #g5, #g6 {
  background: #fff;
  height: 20px;
  line-height: 20px;
  width: 62px;
  font-family: verdana;
  font-size: 7px;
  text-transform: uppercase;
  text-align: center;
  color: #333;
  margin-top: 50px;
  -moz-transition: all .7s ease-in-out;
  -webkit-transition: all .7s ease-in-out;
  transition: all .7s ease-in-out;
}
 
#grup1:hover #g1, #grup2:hover #g2, #grup3:hover #g3, #grup4:hover #g4, #grup5:hover #g5, #grup6:hover #g6 {
  margin-top: 10px;
  -moz-transition: all .7s ease-in-out;
  -webkit-transition: all .7s ease-in-out;
  transition: all .7s ease-in-out;
}
 .Solar {
    background: #fcfcfc;
    width: 350px;
    height: 150px;
    padding: 10px;
    margin: 20px;
    border: 1px solid #ddd;
    text-align: justify;
    text-transform: uppercase;
    color : #000;
    font-size: 9px;
}
.Stars {
    background: #fcfcfc;
    width: 250px;
    padding: 10px;
    margin: 30px;
    border: 1px solid #ddd;
}

Att. Shek

Tópico movido de 'Questões sobre códigos' para 'Questões sobre a aparência do fórum'