Qeel par onglet

[Amallia]

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox, Google Chrome, Internet Explorer, Opera, Safari
Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : 11/12/2014
Lien du forum : http://designgotc.forumactif.org/

Description du problème

Bonsoir,

J'ai suivit un excellent tutoriel pour faire des onglets assez facilement:
https://forum.forumactif.com/t310879-tableaux-a-onglets

Je me suis donc servit de ce tutoriel pour pouvoir faire mon QEEL personnalisé, le soucis étant c'est que lorsque j'ajoute les codes pour afficher les membres connecter dans les 24h ça me donne ça:

https://2img.net/r/hpimg15/pics/966158Sanstitre2.jpg

Et lorsque je veux mettre les codes pour les anniversaire ça m'affiche ça:

https://2img.net/r/hpimg15/pics/469460Sanstitre1.jpg

Du coup actuellement sur le forum j'arrive à afficher les personnes connectés et les statistiques:

http://designgotc.forumactif.org/

Autre petit bug que j'ai remarqué, c'est que j'avais personnalisé les textes et que visiblement, il me les prends plus en compte.

Voici mon template Index_body:

Code:

{JAVASCRIPT}
<!-- BEGIN message_admin_index -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
   <!-- BEGIN message_admin_titre -->
   <tr>
      <td class="catHead" height="28"><span class="cattitle">{message_admin_index.message_admin_titre.MES_TITRE}</span></td>
   </tr>
   <!-- END message_admin_titre -->
   <!-- BEGIN message_admin_txt -->
   <tr>
      <td class="row1" rowspan="3" align="center" valign="middle">
      <div class="gensmall">{message_admin_index.message_admin_txt.MES_TXT}</div>
      </td>
   </tr>
   <!-- END message_admin_txt -->
</table>
<!-- END message_admin_index -->

<!-- BEGIN switch_user_login_form_header -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
   <!-- BEGIN switch_fb_connect_no -->
   <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
      <tr>
         <td class="row1" align="center">
            <table border="0" cellspacing="0" cellpadding="0">
               <tr>
                  <td><span class="genmed">{L_USERNAME}:</span>&nbsp;</td>
                  <td><input class="post" type="text" size="10" name="username"/>&nbsp;</td>
                  <td>
                     <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                     <span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
                  </td>
               </tr>

               <tr>
                  <td><span class="genmed">{L_PASSWORD}:</span>&nbsp;</td>
                  <td><input class="post" type="password" size="10" name="password"/>&nbsp;</td>
                  <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
               </tr>
            </table>
         </td>
      </tr>
   </table>
   <!-- END switch_fb_connect_no -->

   <!-- BEGIN switch_fb_connect -->
   <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
      <tr>
         <td valign="top" width="100%" class="row1" align="center">
            <table width="100%">
               <tr>
                  <td width="55%" valign="middle" align="right">
                     <table class="right">
                        <tr>
                           <td><span class="genmed">{L_USERNAME}:</span>&nbsp;</td>
                           <td><input class="post" type="text" size="10" name="username"/>&nbsp;</td>
                           <td>
                              <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                              <span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
                           </td>
                        </tr>

                        <tr>
                           <td><span class="genmed">{L_PASSWORD}:</span>&nbsp;</td>
                           <td><input class="post" type="password" size="10" name="password"/>&nbsp;</td>
                           <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
                        </tr>
                     </table>
                  </td>
                  <td width="10%" align="center" valign="middle">
                     <span class="genmed fb_or">{switch_user_login_form_header.switch_fb_connect.L_OR}</span>
                  </td>
                  <td width="35%" class="align_gauche"><fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" v="2" scope="{switch_user_login_form_header.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_header.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button></td>
               </tr>
            </table>
         </td>
      </tr>
   </table>
   <!-- END switch_fb_connect -->
</form>
<!-- END switch_user_login_form_header -->

{CHATBOX_TOP}
{BOARD_INDEX}
<table width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>
      <td width="50%" valign="top">
         <!-- BEGIN switch_user_logged_in -->
         <span class="gensmall"><a href="{U_MARK_READ}" class="gensmall">{L_MARK_FORUMS_READ}</a></span>
         <!-- END switch_user_logged_in -->
         <!-- BEGIN switch_delete_cookies -->
         <br /><span class="gensmall"><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_delete_cookies.L_DELETE_COOKIES}</a></span>
         <!-- END switch_delete_cookies -->
      </td>
      <td width="50%" align="right">
         <span class="gensmall">
            <a href="{U_TODAY_ACTIVE}" class="gensmall">{L_TODAY_ACTIVE}</a><br />
            <a href="{U_TODAY_POSTERS}" class="gensmall">{L_TODAY_POSTERS}</a><br />
            <a href="{U_OVERALL_POSTERS}" class="gensmall">{L_OVERALL_POSTERS}</a>
            <!-- BEGIN switch_on_index -->
               <!-- BEGIN switch_delete_cookies -->
               <br /><a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
               <!-- END switch_delete_cookies -->
            <!-- END switch_on_index -->
         </span>
      </td>
   </tr>
</table>

<!-- BEGIN switch_user_login_form_footer -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
   <!-- BEGIN switch_fb_connect_no -->
   <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
      <tr>
         <td class="row1" align="center">
            <table border="0" cellspacing="0" cellpadding="0">
               <tr>
                  <td><span class="genmed">{L_USERNAME}:</span>&nbsp;</td>
                  <td><input class="post" type="text" size="10" name="username"/>&nbsp;</td>
                  <td>
                     <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                     <span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
                  </td>
               </tr>

               <tr>
                  <td><span class="genmed">{L_PASSWORD}:</span>&nbsp;</td>
                  <td><input class="post" type="password" size="10" name="password"/>&nbsp;</td>
                  <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
               </tr>
            </table>
         </td>
      </tr>
   </table>
   <!-- END switch_fb_connect_no -->

   <!-- BEGIN switch_fb_connect -->
   <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
      <tr>
         <td valign="top" width="100%" class="row1" align="center">
            <table width="100%">
               <tr>
                  <td width="55%" valign="middle">
                     <table class="right">
                        <tr>
                           <td><span class="genmed">{L_USERNAME}:</span>&nbsp;</td>
                           <td><input class="post" type="text" size="10" name="username"/>&nbsp;</td>
                           <td>
                              <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                              <span class="gensmall">{L_AUTO_LOGIN}</span>&nbsp;
                           </td>
                        </tr>

                        <tr>
                           <td><span class="genmed">{L_PASSWORD}:</span>&nbsp;</td>
                           <td><input class="post" type="password" size="10" name="password"/>&nbsp;</td>
                           <td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
                        </tr>
                     </table>
                  </td>
                  <td width="10%" align="center" valign="middle">
                     <span class="genmed fb_or">{switch_user_login_form_footer.switch_fb_connect.L_OR}</span>
                  </td>
                  <td width="35%" class="align_gauche"><fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" v="2" 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></td>
               </tr>
            </table>
         </td>
      </tr>
   </table>
   <!-- END switch_fb_connect -->
</form>
<!-- END switch_user_login_form_footer -->

  <!-- BEGIN disable_viewonline -->
<table class="footertable" width="100%" border="0" cellspacing="0" cellpadding="0" align="center"><tr><td>
<center><table margin="-200px" class="qeeltable" width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td>
<center><div width="100%" class="bg_qeel" align="center">
  <img src="http://nsa33.casimages.com/img/2014/12/02/141202071230557413.png" class="rotate"></div>
  <table class="tablegpes" border="0" cellpadding="3" cellspacing="0"><tbody>       
    <tr><td colspan="3" align="center"><span class="titreqeel"><a class="titreqeel" href="/viewonline" rel="nofollow">You Win Or You Die</a></span> </td></tr>
  <tr><td style="width: 30%;" valign="bottom" align="left">
  <a class="groupes" href="http://game-of-thrones.1fr1.net/g25-peuple-libre"><span class="groupes" style="color: #678238;">Peuple Libre </span></a>
    <br><a class="groupes" href="http://game-of-thrones.1fr1.net/g3-garde-de-nuit"><span class="groupes" style="color: #000000;"> Garde de Nuit </span></a><br>
      <a class="groupes" href="http://game-of-thrones.1fr1.net/g8-le-nord"><span class="groupes" style="color: #808080;"> Nord </span></a><br>
      <a class="groupes" href="http://game-of-thrones.1fr1.net/g10-le-conflans"><span class="groupes" style="color: #202A85;"> Conflans</span></a><br>
      <a class="groupes" href="http://game-of-thrones.1fr1.net/g20-val-d-arryn"><span class="groupes" style="color: #55A0FE;"> Val D'Arryn </span></a><br>
      <a class="groupes" href="http://game-of-thrones.1fr1.net/g18-ile-de-fer"><span class="groupes" style="color: #3F6B6B;"> Ile de Fer </span></a></td><td style="width: 40%;" valign="top" align="center">
        <div class="systab">
          <div class="selected">
            <span>En ligne</span>
          {LOGGED_IN_USER_LIST}
          </div> 
          <div>   
            <span>Dernière 24h</span>
            24h ici
          </div>
          <div>
            <span>Statistiques</span>
            {TOTAL_POSTS}. {TOTAL_USERS}<br>
          {NEWEST_USER}<br>
            {TOTAL_USERS_ONLINE}
          </div>
          <div>
    <span>Anniversaire</span>
            Anniversaire ici
  </div></div></td><td style="width: 30%;" valign="bottom" align="right"><a class="groupes" href="http://game-of-thrones.1fr1.net/g12-terres-de-l-ouest"><span class="groupes" style="color: #8B0000;"> Terres de l'Ouest</span></a><br>
          <a class="groupes" href="http://game-of-thrones.1fr1.net/g5-terres-de-la-couronne"><span class="groupes" style="color: #B8860B;"> Terres de la Couronne</span></a><br> 
<a class="groupes" href="http://game-of-thrones.1fr1.net/g16-le-bief"><span class="groupes" style="color: #0A660A;"> Le Bief</span></a><br>         
<a class="groupes" href="http://game-of-thrones.1fr1.net/g14-terres-de-l-orage"><span class="groupes" style="color: #FFCC00;"> Terres de l'Orage</span></a><br>
<a class="groupes" href="http://game-of-thrones.1fr1.net/g22-dorne"><span class="groupes" style="color: #D73600;"> Dorne</span></a><br>
<a class="groupes" href="http://game-of-thrones.1fr1.net/g23-essos"><span class="groupes" style="color: #850066;"> Essos</span></a></td></tr></tbody></table>
<script type="text/javascript">
document.getElementById('TotalMembres').innerHTML=document.getElementById('TotalMembres').innerHTML.replace(/membres enregistrés/,"habitants nobles et roturiers");
document.getElementById('TotalMembres').innerHTML=document.getElementById('TotalMembres').innerHTML.replace(/Nous avons/,"Westeros et Essos sont peuplés de");
document.getElementById('DernierInscrit').innerHTML=document.getElementById('DernierInscrit').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Le dernier aspirant au trône est");
document.getElementById('TotalMessages').innerHTML=document.getElementById('TotalMessages').innerHTML.replace(/Nos membres ont posté/,"Les Mestres ont recensé");
document.getElementById('TotalMessages').innerHTML=document.getElementById('TotalMessages').innerHTML.replace(/messages/,"corbeaux");
document.getElementById('TotalUsersOnline').innerHTML=document.getElementById('TotalUsersOnline').innerHTML.replace(/utilisateur en ligne/,"personne parcourant la Route Royale.");
document.getElementById('TotalUsersOnline').innerHTML=document.getElementById('TotalUsersOnline').innerHTML.replace(/utilisateurs en ligne/,"personnes parcourant la Route Royale.");
document.getElementById('TotalUsersOnline').innerHTML=document.getElementById('TotalUsersOnline').innerHTML.replace(/Enregistré/,"sujet");
document.getElementById('TotalUsersOnline').innerHTML=document.getElementById('TotalUsersOnline').innerHTML.replace(/Enregistrés/,"sujets");
document.getElementById('TotalUsersOnline').innerHTML=document.getElementById('TotalUsersOnline').innerHTML.replace(/Invisible/,"sans visage");
document.getElementById('TotalUsersOnline').innerHTML=document.getElementById('TotalUsersOnline').innerHTML.replace(/Invisibles/,"sans visages");
document.getElementById('TotalUsersOnline').innerHTML=document.getElementById('TotalUsersOnline').innerHTML.replace(/Invité/,"vagabond");
document.getElementById('TotalUsersOnline').innerHTML=document.getElementById('TotalUsersOnline').innerHTML.replace(/Invités/,"vagabonds");
</script>

<!-- END disable_viewonline -->
{CHATBOX_BOTTOM}
<br clear="all" />
<!-- BEGIN switch_legend -->
<table border="0" cellspacing="3" cellpadding="0" align="center">
   <tr>
      <td align="center" width="20"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
      <td><span class="gensmall">{L_NEW_POSTS}</span></td>
      <td></td>
      <td align="center" width="20"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
      <td><span class="gensmall">{L_NO_NEW_POSTS}</span></td>
      <td>&nbsp;&nbsp;</td>
      <td align="center" width="20"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
      <td><span class="gensmall">{L_FORUM_LOCKED}</span></td>
   </tr>
</table>
<!-- END switch_legend -->

{AUTO_DST}

<!-- BEGIN switch_fb_index_login -->
<div id="fb-root"></div>
<script type="text/javascript">
//<![CDATA[
FB.init({
   appId: '{switch_fb_index_login.FACEBOOK_APP_ID}',
    status: true,
    cookie: true,
    xfbml: true,
   oauth: true
});
//]]>
</script>
<!-- END switch_fb_index_login -->


Ainsi que mon css:

Code:

/* ------------- TITRES ET CODES ADMIN */

.grandtitre {
font-family: "Trajan Pro", "Trajan Pro 3", "Serif", Serif;
font-size: 30px;
font-weight: bold;
color: #0a171d; 
text-shadow: 1px 1px 0px #010504!important;
  display: block;
text-align: center;
  line-height: 110%;
}

.grandtitre:first-letter {
color: #3F6B6B;
}

.mj {
width: 80%;
border-right: 6px solid #3F6B6B;
border-left: 6px solid #3F6B6B;
padding: 2px;
font-size:12px;
text-align: justify;
}

.bloss {
background-color: #d2ecd3;
padding: 5px;
border-radius: 20px 0px 0px 20px;
-webkit-border-radius: 20px 0px 0px 20px; /* notamment pour Safari et Google Chrome */
-moz-border-radius: 20px 0px 0px 20px;
border-bottom: 2px #010504 solid;
border-top: 1px #010504 solid;
border-right: 1px #010504 solid;
border-left: 1px #010504 solid;
  width: 440px;
  height: 110px;
  overflow-y: auto;
}

/* ------------- FICHE PERSO ----------- */
div.cssactif_fiche {
width: 500px;
background-color: #d2ecd3;
border: 2px simple #010504;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
-webkit-box-shadow: 0px 0px 10px 0px #010504;
-moz-box-shadow: 0px 0px 10px 0px #010504;
box-shadow: 0px 0px 10px 0px #010504;
}

div.cssactif_fiche_header {
background-repeat: no-repeat!important;
background-position: top center !important;
width: 500px;
height: 200px;
border-bottom: 15px double #0a171d;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
}

div.cssactif_fiche_titre h1 {
font-family: "Trajan Pro", "Trajan Pro 3", "Serif", Serif;
font-size: 35px;
text-shadow: 1px 1px 0px #010504!important;
color: #3F6B6B;
margin: 0;
text-align: right;
}

div.cssactif_fiche_titre {
position: relative;
top: -32px;
text-align: right;
padding-right: 30px;
color: #3F6B6B;
}

div.cssactif_fiche h2 {
background-color: #d2ecd3;
border-color: #010504;
border-width: 1px 0px;
border-style: solid;
-webkit-box-shadow: 0px 0px 3px 0px #010504;
-moz-box-shadow: 0px 0px 3px 0px #010504;
box-shadow: 0px 0px 3px 0px #010504;
text-align: center;
font-variant: small-caps;
font-family: "Trajan Pro", "Trajan Pro 3", "Serif", Serif;
color: #0a171d;
margin: 0;
font-size: 20px;
font-weight: normal;
text-shadow: 1px 1px 0px #010504!important;
letter-spacing: 5px;
}

.cssactif_pv_content {
padding: 10px;
text-align: justify;
}

.cssactif_fiche em {
font-family: "Trajan Pro", "Trajan Pro 3", "Serif", Serif;
color: #3F6B6B;
font-style: normal;
font-variant: small-caps;
}

.cssactif_pv {
background-color: #d2ecd3;
border: 2px simple #010504;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
-webkit-box-shadow: 0px 0px 10px 0px #010504;
-moz-box-shadow: 0px 0px 10px 0px #010504;
box-shadow: 0px 0px 10px 0px #010504;
}

td.cssactif_pv_header {
background-repeat: no-repeat;
background-position: top center;
width: 200px;
height: 320px;
border-right: 15px double #0a171d;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-left-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomleft: 20px;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
text-shadow: 1px 1px 0px #010504!important;
font-size: 10px;
}

div.cssactif_pv_titre h1 {
font-family: "Trajan Pro", "Trajan Pro 3", "Serif", Serif;
font-size: 20px;
text-shadow: 1px 1px 0px #010504!important;
color: #0a171d;
margin: 0;
text-align: right;
font-variant: small-caps;
}

div.cssactif_pv_titre {
position: relative;
top: -14px;
text-align: right;
padding-right: 20px;
color: #0a171d;
}

.ligne_icones {
width: 100%;
border-bottom: 4px solid #0a171d;
margin-top: -85px;
margin-bottom: 100px;
position: relative;
}

.icones {
display: block;
width: 100px;
height: 100px;
align: center center;
border: 4px solid #0a171d;
-moz-border-radius: 100px;
border-radius: 100px;
-o-border-radius: 100px;
-htm-border-radius: 100px;
-webkit-border-radius: 100px;
margin: 10px;
position: relative;
z-index: 4;
}

.citation {
display: block;
text-align: right;
padding: 20px;
font-family: courier new;
font-size: 16px;
letter-spacing: 2px;
width: 500px;
float: right;
color: #3F6B6B;
text-shadow: 1px 1px 0px #010504!important;
margin-bottom:20px;
}
/* ------------- FIN FICHE PERSO */

/* ------------- FICHE PV ----------- */
div.fiche_titre h1 {
font-family: "Trajan Pro", "Trajan Pro 3", "Serif", Serif;
font-size: 35px;
text-shadow: 1px 1px 0px #010504!important;
color: #3F6B6B;
margin: 0;
text-align: right;
}

div.fiche_titre {
position: relative;
top: -32px;
text-align: right;
padding-right: 30px;
color: #3F6B6B;
}

td.pv_header {
background-color: #d2ecd3;
width: 250px;
height: 210px;
border-right: 15px double #0a171d;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-left-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomleft: 20px;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
font-size: 12px;
-webkit-box-shadow: 0px 0px 10px 0px #010504;
-moz-box-shadow: 0px 0px 10px 0px #010504;
box-shadow: 0px 0px 10px 0px #010504;
}

/* ------------- FIN FICHE PV */


/* QEEL */
.nobg td.row1 { background : none !important; }

.titreqeel { color: #3F6B6B; }

a.titreqeel {
color: #3F6B6B;
font-family: "Trajan Pro", "Trajan Pro 3", "Serif", Serif;
font-weight: bold;
font-size: 34px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease; }

a.titreqeel:hover {
color: #0a171d ;
text-shadow: 0px 0px 5px #010504!important; }

.tablegpes {
position: relative;
width: 100%;
margin-top: -350px;
z-index: 99;
padding-right: 10px;
margin-bottom: 100px;
}

bg_qeel {
position: absolute;
width: 100%;
z-index: 1;
margin-right: -10px; }

.groupes {
margin-bottom: 5px;
font-family: "Trajan Pro", "Trajan Pro 3", "Serif", Serif;
font-variant: small-caps;
font-size: 18px;
font-weight: bold;
color: #0a171d; 
text-shadow: 1px 1px 1px #010504!important;
}

        /*------ ONGLETS DU QEEL ------*/
       
            /* .systab .tab => les onglet */
        .systab .tab {
  width: 308px;
  font-weight: bold;
  font-variant: small-caps;
  font-size: 12px;
  padding-left: 5px;
  padding-right: 5px;
  margin-right: 3px;
  margin-left: 3px;
        border: 2px solid #010504;
            color: #d2ecd3;                         
-webkit-border-top-right-radius: 10px;
-webkit-border-top-left-radius: 10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-topleft: 10px;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
background-color: #3f6b6b;
-webkit-box-shadow: 0px 0px 3px 0px #010504;
box-shadow: 0px 0px 3px 0px #010504;       
          cursor: pointer;
        }
        /* .systab .tab:hover => les onglets survolés */
        .systab .tab:hover {
          background: #d2ecd3;
          color: #3f6b6b;
          border-color: #3f6b6b;
        }
        /* .systab .tab.selected => les onglets sélectionnés */
        .systab .tab.selected{
          color: #a6d6b8;
          background: #0a171d;
        }
        /* .systab .contents => les conteneurs des contenus associés aux onglets  */
        .systab .contents {
  font-size: 12px;
          margin-top: 1px;
          margin-bottom: 1px;
          color: #000;
          background: #fff;
          border: 2px solid #010504;
          padding: 10px;
  width: 308px;
  height: 100px;
  -webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
  -webkit-box-shadow: 0px 0px 3px 0px #010504;
box-shadow: 0px 0px 3px 0px #010504;
  overflow: auto;
        }
        /* style des onglets si ils sont à gauche ou à droite */
        .systab.s_float .tab,.systab.s_float .tab {
          display: block;
          margin: 5px;
        }
        /* flottement des conteneurs si les onglets sont à gauche où à droite */
        .systab.s_float .tabs,.systab.s_float .contents {
          float: left;
        }

.opacity { opacity: 0.6;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease; }

.opacity:hover { opacity: 1; }

.margin_bottom {
margin-bottom: 400px; }

.rotate {
    -webkit-transition: all 1s linear;
      -moz-transition: all 1s linear;
        -o-transition: all 1s linear;
            transition: all 1s linear;
}

.rotate:hover {
    -webkit-transform: rotate(90deg);
      -moz-transform: rotate(90deg);
        -o-transform: rotate(90deg);
            transform: rotate(90deg);
}

.img-zoom {
    width: 40px; /*largeur image réduite*/

    /* Effet de transition du changement de valeur */
    -moz-transition: width 1s linear;
    -o-transition: width 1s linear;
    -webkit-transition: width 1s linear;
    transition: width 1s linear;
}

.img-zoom:hover {
    width: 60px; /*largeur image agrandie*/
}

/* Bloc principal */
.monBloc {
  position: relative; /* important ! */
  overflow: hidden; /* cache tout ce qui dépasse du bloc. Si vous voulez que votre volet dépasse, retirez cette ligne */
  width: 310px;
  height: 60px;
  border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px; /* notamment pour Safari et Google Chrome */
-moz-border-radius: 5px 5px 5px 5px;
border-bottom: 2px #010504 solid;
border-top: 1px #010504 solid;
border-right: 1px #010504 solid;
border-left: 1px #010504 solid;
}

/* Bloc de recouvrement */
.blocVolet {
  position: absolute; /* positionnement absolu (important) */
  top: 0; /* (important) */
  left: 0; /* (important) */
  width: 310px;
  height: 60px;
  /* réglage de la transition */
  -webkit-transition: all 1s linear;
  -moz-transition: all 1s linear;
  -ms-transition: all 1s linear;
  -o-transition: all 1s linear;
  transition: all 1s linear;
  border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px; /* notamment pour Safari et Google Chrome */
-moz-border-radius: 5px 5px 5px 5px;
border-bottom: 2px #010504 solid;
border-top: 1px #010504 solid;
border-right: 1px #010504 solid;
border-left: 1px #010504 solid;
}

/* Changement au survol */
.monBloc:hover > .blocVolet {
  left: 310px; /* le bloc se décalera vers la gauche de 250px; (largeur du bloc) */
}

/* PAGE D'ACCUEIL by CSS actif */

a.apa {
 color: #d2ecd3!important;
 }
a.apa:hover {
 color: #d2ecd3!important;
 }
.forumline .row1 {
    padding: 0;
}
.patable {
 background-image: url(http://img11.hostingpics.net/pics/416831Fondpa.png);
 background-repeat: repeat;
width: 100%;
  padding: -1px;
  margin-left: -1px;
  margin-top: -1px;
  margin-bottom: -1px;
}

.patable h2 {
font-family: "Trajan Pro", "Trajan Pro 3", "Serif", Serif;
text-align: center;
 font-weight: bold;
 margin: 2px;
 padding: 0;
 padding-bottom: 4px; 
 font-variant: small-caps;
 font-size: 180%;
color: #0a171d; 
 text-shadow: 1px 1px 0px #010504!important;
}

.patable h2:first-letter {
 color: #D2ECD3;
}

a.palink {
  background-color: #D2ECD3;
  text-align: right;
  display: block;
  color: #010504;
  text-decoration: none;
  padding: 2px;
  -webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
margin: 5px;
}

a.palink:hover {
      background-color: #010504;
  color: #D2ECD3;
}

a.palink:after {
 content: " >>"; 
}

.panav {
 border-top: 3px solid #3F6B6B; 
 padding-bottom: 5px;
}

.paboutons {
    background-image:url('http://img11.hostingpics.net/pics/546308fondcat.png');
  width:90%;
  font-size:10px;
  margin:1px 1px 1px 1px;
  padding:0px;
}

.paoverflow {
 overflow: auto;
 margin-bottom: 5px;
}

.panav a {
 background-color: #3F6B6B;
 padding: 3px 10px;
margin: 0 2px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
color: #010504;
text-decoration: none;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}

.panav a:hover {
  background-color: #d2ecd3;
color: #010504;
}

.papv img {
  -webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
opacity: 0.7;
border: 1px solid #010504;
}

.papv img:hover {
border-color: #3F6B6B;
opacity: 1;
}

.papartenaire img {
  opacity: 0.7;
  -webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}

.papartenaire img:hover {
  opacity: 1;
}

.papartenaire td div {
 display: none; 
 background-color: #3F6B6B;
 border: 2px solid : #0c2319;
 border-bottom: 5px solid : #0c2319;
 text-align: center;
 width: 100px;
 z-index: 990;
 padding: 5px;
 text-shadow: 1px 1px 0px #d2ecd3!important;
 -webkit-box-shadow: 0px 0px 3px 0px #d2ecd3;
box-shadow: 0px 0px 3px 0px #d2ecd3;
}

.papartenaire td div strong, .papartenaire td div a {
 display: block; 
}

.papartenaire td:hover div {
  display: block;
  position: absolute;
  margin-top: -10px;
  margin-left: 30px;
}

.dcontenu_onglet, .bcontenu_onglet, .contenu_onglet {
                border: 2px solid #010504;
            color: black;
                display:none;
            width: 90%;
            height: 180px;
            overflow: auto;
            padding: 10px;
            -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
background-color: #3F6B6B;
-webkit-box-shadow: 0px 0px 3px 0px #010504;
box-shadow: 0px 0px 3px 0px #010504;
opacity: 0.8;
  -webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
text-align: justify;
        }
     
      .dcontenu_onglet:hover, .bcontenu_onglet:hover, .contenu_onglet:hover {
    opacity: 1;
        }
     
      .dcontenu_onglet {
      height: 170px;
      }

.panew {
 background-color: #010504;
color: #d2ecd3;
font-size: 10px;
  padding: 5px;
  -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

.panew em {
  color: #75a992;
}

.bonglets {
 position: absolute;
 margin-left: -90px;
 margin-top: 10px;
}

 .bonglet {
              display: block;
                margin-bottom: 10px;
                padding:5px;
                cursor:pointer;
border:2px solid #010504;
-webkit-box-shadow: 0px 0px 3px 0px #010504;
box-shadow: 0px 0px 3px 0px #010504;
        }

        .bonglet_0 {
                  background-color: #3F6B6B;
            color: #010504;
              margin-bottom: 10px;
              -webkit-border-top-left-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomleft: 10px;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
width: 80px;
}

        .bonglet_1 {
                background-color: #3F6B6B;
            color: #d2ecd3;
              margin-bottom: 10px;
              -webkit-border-top-left-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomleft: 10px;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
width: 80px;
        }
     
      .onglet {
                display:inline-block;
                margin-left:1px;
                margin-right:1px;
                padding:5px;
                cursor:pointer;
border:2px solid #010504;
-webkit-box-shadow: 0px 0px 3px 0px #010504;
box-shadow: 0px 0px 3px 0px #010504;
        }
 
      .donglets, .onglets {
      padding-left: 8px; 
      }

      .donglet {
                display:inline-block;
                margin-left:1px;
                margin-right:1px;
                padding:3px;
                border:1px solid black;
                cursor:pointer;
border:2px solid #010504;
-webkit-box-shadow: 0px 0px 3px 0px #010504;
box-shadow: 0px 0px 3px 0px #010504;
        }

        .donglet_0,  .onglet_0 {
                  background-color: #3F6B6B;
            color: #010504;
            font-size: 10px;
            -webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
        }

        .donglet_1, .onglet_1 {
                background-color: #3F6B6B;
            color: #d2ecd3;
            font-size: 10px;
            -webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
        }

/*INFOBULLE colonne*/
* a.info {
  position: relative;
  text-decoration: none; }

a.info span {
  display: none; /* on masque l'infobulle */ }

a.info:hover {
  background: none; /* correction d'un bug IE */
  z-index: 998; /* on définit une valeur pour l'ordre d'affichage */}

a.info:hover span {
visibility: visible;
  display: inline; /* on affiche l'infobulle */
  position: absolute;
top: 1px;/*position par rapport au haut de l'image*/
left: -25px;/*position par rapport au bord gauche de l'image*/
  background-color: #d2ecd3;
-moz-border-radius:5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
  padding: 3px;
width: 110px;
  border: 4px double #d2ecd3 ;
color : #d2ecd3;
}

* a.lien {
  position: relative;
  text-decoration: none;
}

a.lien span {
  display: none; /* on masque l'infobulle */
}

a.lien:hover {
  background: none; /* correction d'un bug IE */
  z-index: 997; /* on définit une valeur pour l'ordre d'affichage */
  cursor: help; /* on change le curseur par défaut en curseur d'aide */
}

a.lien:hover span {
visibility: visible;
  display: inline; /* on affiche l'infobulle */
  position: absolute;
  top: 25px;
  left: 10px;
-moz-border-radius:5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
  padding: 3px;
  border: 2px solid #d2ecd3 ;
width: 500px; }
/*fin infobulle */
/** Fin PA **/

/* PROFILS */

.profilentour {
position: center;
padding:5px;
padding-top: 15px;
padding-bottom: 10px;
background-image:url('http://img4.hostingpics.net/pics/684930pattern2.png');
color: #010504;
}
.rangs {
  font-size: 15px;
  text-align:center;
text-shadow: 0px 0px 4px #d2ecd3!important;}
 
.profilchamps {
  background-color: #3F6B6B;
  border:1px solid #010504;
  font-family: calibri;
  font-size:11px;
  line-height:11px;
  padding:3px;
  width:200px;
}

.profilchamps img { max-width: 200px; }

.usernamefont {
  text-transform: small-caps;
  font-size: 15px;
  text-align:center;
font-family: "Trajan Pro", "Trajan Pro 3", "Serif", Serif;
  border-bottom: 7px solid #3F6B6B;
text-shadow: 1px 1px 0px #010504!important;
}

/* AVATAR QUI DESCEND pour afficher fiche perso et liens contactes
Code par Hiro pour CSSACTIF
  Merci de ne pas supprimer cette mention
  (http://www.css-actif.com) */

#englob { /* Encadrement global des 2 divs */
  margin-left: 4px;
    position:relative;
    width:200px;
    height:320px;
border: 1px simple #010504!important; /* La vilaine bordure rouge */
    overflow:hidden; /* Permet de cacher ce qui dépasse */
}

.imgp {
    background: #3F6B6B; /* le bg  de la div qui contient l'avatar */
    position:absolute; /* Laissez comme ceci */
    top:0;/* Laissez comme ceci */
    left:0;/* Laissez comme ceci */
    width:100%;/* Laissez comme ceci */
    height:100%;/* Laissez comme ceci */
  border: 1px simple #d2ecd3!important;
    z-index:1;/* La position par rapport à l'autre div qui contient les infos */
    -webkit-transition:all 1s;/* Laissez comme ceci */
    -moz-transition:all 1s;/* Laissez comme ceci */
    -o-transition:all 1s;/* Laissez comme ceci */
    -ms-transition:all 1s;/* Laissez comme ceci */
    transition:all 1s;/* Laissez comme ceci */
}

#englob:hover > .imgp {
    margin-top:320px; /* Lorsque la souris passe sur la div #englob, on fait glisser l'image vers le bas de 200px */
}

.infosp {
    position:absolute;/* Laissez comme ceci */
    top:0;/* Laissez comme ceci */
    left:0;/* Laissez comme ceci */
    width:94%;/* Laissez comme ceci */
    height:95%;/* Laissez comme ceci */
    z-index:0;/* La position par rapport à l'autre div qui contient les infos (ici en dessous)*/
    opacity:0;/* on met l'opacité à zero pour un effet stylé ;) */
    margin-left:-200px;/* on décale la div de 200px, elle est invisible grâce a l'overflow:hidden de #englob */
    -webkit-transition:all 1s;/* Laissez comme ceci */
    -moz-transition:all 1s;/* Laissez comme ceci */
    -o-transition:all 1s;/* Laissez comme ceci */
    -ms-transition:all 1s;/* Laissez comme ceci */
    transition:all 1s;/* Laissez comme ceci */
  color: #010504;
  padding: 5px;
  background-color: #3F6B6B;
  border:1px solid #010504;
font-size: 12px;
}

#englob:hover > .infosp {
  opacity:1;/* Lorsque la souris passe sur la div #englob, on augmente l'opacité des infos */
  margin-left:0px;/* et on décale cette div à 0px (position par défaut) */
}
/* FIN PROFILS */

/* PRESENTATION FORUMS */
.titrecategorie h2 {
font-family: "Trajan Pro", "Trajan Pro 3", "Serif", Serif;
  font-size: 25px;
font-weight: bold;
color: #0a171d; 
text-shadow: 1px 1px 0px #010504!important;
font-variant: small-caps;
padding-right: 50px;
  text-align: right;
  margin-bottom: -12px;
}

.titrecategorie h2:first-letter {
color: #D2ECD3;
}

.row3{
background-color: #0a171d;}

.forumlink {
font-family: "Trajan Pro", "Trajan Pro 3", "Serif", Serif;
font-size: 16px;
font-weight: bold;
text-align: center;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
}

.forumlink:first-letter {
color: #3F6B6B;
  font-weight: bold;
  letter-spacing: 2px;
}

a.forumlink {
  display:block;
border-radius: 20px 20px 20px 20px;
-webkit-border-radius: 20px 20px 20px 20px; /* notamment pour Safari et Google Chrome */
-moz-border-radius: 20px 20px 20px 20px;
border-bottom: 5px #0a171d solid;
border-top: 1px #0a171d solid;
border-right: 1px #0a171d solid;
border-left: 1px #0a171d solid;
background-color: #d2ecd3;
color: #0a171d!important;
text-shadow: 1px 1px 0px #010504!important;
}

a.forumlink:hover {
color: #3F6B6B!important; 
text-shadow: 1px 1px 0px #010504!important;
  background-color : #d2ecd3;
}

.block {
font-size: 12px;
  color: black;
  cellspacing: 0px;
  cellpadding: 0px;
  height: 62px;
border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;/* notamment pour Safari et Google Chrome */
-moz-border-radius: 5px 5px 5px 5px;
border-bottom: 2px #010504 solid;
border-top: 1px #010504 solid;
border-right: 1px #010504 solid;
border-left: 1px #010504 solid;
background-image: url(http://img11.hostingpics.net/pics/546308fondcat.png);
khtml-opacity:0.7;
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);
filter : alpha(opacity=70);
opacity : 0.7;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
  font-weight : bold;
}

.block:hover {
  khtml-opacity:1;
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
filter : alpha(opacity=100);
opacity : 1;
}

.tite {
background-image: url(http://nsa34.casimages.com/img/2014/12/02/141202084608651323.jpg);
font-size: 12px;
text-transform: uppercase;
border-radius: 20px 20px 20px 20px;
-webkit-border-radius: 20px 20px 20px 20px; /* pour Safari et Google Chrome */
-moz-border-radius: 20px 20px 20px 20px;
border-bottom: 1px #010504 solid;
border-top: 1px #010504 solid;
border-right: 1px #010504 solid;
border-left: 1px #010504 solid;
  text-align : center;
  font-weight : bold;
}

.desc_forum {
width: 310px;
height: 60px;
  border-radius: 5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px; /* notamment pour Safari et Google Chrome */
-moz-border-radius: 5px 5px 5px 5px;
border-bottom: 2px #010504 solid;
border-top: 1px #010504 solid;
border-right: 1px #010504 solid;
border-left: 1px #010504 solid; }

/***** BARRE DE NAVIGATION ****/
/***** Retire les images de la barre de navigation ****/
        a.mainmenu img {
        display:none;
        }

/***** Mise en forme (template modifié) ****/
.navigation {
position: fixed;
left: 0px;
top: 0px;
right: 0px;
z-index: 999;
width: 100%;
text-decoration: none;
font-variant: small-caps;
font-size : 12px;
background-color: #3f6b6b;
border-bottom: 1px solid #0a171d;
khtml-opacity:1;
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
filter : alpha(opacity=100);
opacity : 1;
box-shadow: 0px 0px 3px #0a171d!important;
  color: #d2ecd3!important;
}

.navigation:hover {
text-decoration:none;
font-variant: small-caps;
background-color: #3f6b6b;
border-bottom: 1px solid #0a171d;
khtml-opacity:1;
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
filter : alpha(opacity=100);
opacity : 1;
-webkit-transition: opacity 0.5s ease-in-out;/*chrome*/
-moz-transition: opacity 0.5s ease-in-out;/*mozilla*/
  transition: opacity 0.5s ease-in-out;/*autre navigateur*/
box-shadow: 0px 0px 3px #0a171d;
  color: #d2ecd3!important;
}

.mainmenu {
padding-right: 5px;
padding-left: 5px;
  text-shadow: 3px 3px 3px #0a171d!important;
  color: #d2ecd3!important;
}

a.mainmenu:hover {
color: #a5d4b8;
text-shadow: 3px 3px 3px #0a171d!important;
-webkit-transition: opacity 0.5s ease-in-out;/*chrome*/
-moz-transition: opacity 0.5s ease-in-out;/*mozilla*/
  transition: opacity 0.5s ease-in-out;/*autre navigateur*/
}


/* SELECTIONNER LE CONTENU */
.selectCode { float:right; text-transform: uppercase; cursor:pointer; }

/*NOUVEL EDITEUR barre du haut*/
        div.sceditor-toolbar{
        background-color: #0a171d!important;
        text-align: center!important; /* là, je centre les boutons pour que ce soit plus jolie */
        margin:1px !important; /* là je réduis la marge pour un côté plus esthétique */}
       
        /*nouvel éditeur textarea*/
        .sceditor-container iframe, .sceditor-container textarea{
        background-color: #d2ecd3 !important;
        border: solid 1px #010504 !important; /* toujours un cadre */
        color:#000000 !important; /* là c'est la couleur de ton texte dans la boite de dialogue */
        margin:1px !important; /* là encore j'enlève de la marge pour que ce soit plus jolie */}
       
        /*nouvel éditeur gp bouton*/
        div.sceditor-group{
        background-color: #3F6B6B!important;
        border: solid 1px #3F6B6B!important;}
       
        .sceditor-container.ltr.wysiwygMode {
        border: solid 1px #010504;
        background-color: #d2ecd3 !important; /*COULEUR DE FOND DE LA SORTE DE BORDURE BLANCHE*/
        width:100% !important;}
       
        .sceditor-container.ltr.sourceMode{
        border: solid 1px #010504;
        background-color: #d2ecd3 !important;
        width:100% !important;}
       
        /* Permettre d'avoir des smileys  à la bonne taille */
        .sceditor-emoticons {width: 250px !important; height: 250px !important; overflow: auto !important;}
        img.smiley {width: auto !important; height : auto !important;}
        a.sceditor-button.hover
        {background-color: #d2ecd3!important;}

/* BACKGROUND du forum*/ 
/*Body_Fix-------------------------------------------------*/
#i_logo { padding-top: -10px; }
/*Double_Fond-------------------------------------------------*/
#bodybottom {
background:transparent url(http://img11.hostingpics.net/pics/916578Hautdepage2.png) center top no-repeat;
}

body {
background-color: #d2ecd3;
background-image: url(http://img15.hostingpics.net/pics/764687BGeau.png);
margin: 0;
padding: 0;
text-align:justify;
}

.bodybg {
  background-image: url(http://img4.hostingpics.net/pics/862091Pattern.png);
  background-position: center;
  background-repeat: repeat-y;
}

.bodylinewidth {
  position: relative;
  left: 2px;
  width: 850px;
}

bodyline {
  margin: 0;
  padding: 0;
}

.forumline { border-radius: 20px 20px 20px 20px; /* pour Opera et autres standards */
-webkit-border-radius: 20px 20px 20px 20px; /* notamment pour Safari et Google Chrome */
-moz-border-radius: 20px 20px 20px 20px;
border-bottom: 12px #3F6B6B solid;
border-top: 10px #3F6B6B solid;
border-right: 1px #3F6B6B solid;
border-left: 1px #3F6B6B solid;
}

td.catBottom, th.thBottom {
    border-width: 0px 0px 0px!important;
}

body.chatbox {
    background-color: #d2ecd3;}
#chatbox_header .cattitle strong { display: none; }
#chatbox_header .cattitle:before { content: "Missives au-delà du territoire !"; }

.footerbg {
background-image : url('http://img4.hostingpics.net/pics/449782pieddepage.png');
background-position: bottom center;
background-repeat: no-repeat;
}

/* MESSAGES */   
div.postbody { display: block; padding: 30px;
color: #000000!important; }
a:hover{text-decoration: none !important;}
a{text-decoration: none !important;}

/* ------------- Menu déroulant */
#menu, #menu ul /* Liste */   
{
        padding : 0px; /* pas de marge intérieure */
        margin : 0px; /* ni extérieure */
        list-style : none; /* on supprime le style par défaut de la liste */
        line-height : 16px; /* on définit une hauteur pour chaque élément */
        text-align : center; /* on centre le texte qui se trouve dans la liste */
       
}
 
#menu /* Ensemble du menu */
{
        font-weight : bold; /* on met le texte en gras */
  font-size : 11px; /* hauteur du texte : 12 pixels */
  margin-left : 5px; /* ni extérieure */
}

#menu a /* Contenu des listes */
{
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding : 0; /* aucune marge intérieure */
        background : #0a171d; /* couleur de fond */     
        color : #d2ecd3; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
        width : 150px; /* largeur */
       border : 1px solid #d2ecd3;
}

#menu li /* Éléments des listes */   
{
        float : left;
        /* pour IE qui ne reconnaît pas "transparent" */
        border-right : 1px solid #d2ecd3; /* on met une bordure blanche à droite de chaque élément */
}
 
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu li
{
        border-right: 1px solid transparent ; /* on met une bordure transparente à droite de chaque élément */
}
 
#menu li ul /* Sous-listes */
{
        position: absolute; /* Position absolue */
        width: 150px; /* Largeur des sous-listes */
        left: -999em; /* Hop, on envoie loin du champ de vision */
}
 
 
#menu li ul li /* Eléments de sous-listes */
{
        /* pour ie qui ne reconnaît pas "transparent" (comme précédemment) */
        border-top : 1px solid #d2ecd3; /* on met une bordure blanche en haut de chaque élément d'une sous-liste */
}
 
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu li ul li               
{
        border-top : 1px solid transparent; /* on met une bordure transparente en haut de chaque élément */
   margin-top: -22px;
   margin-left: 150px;
}
 
#menu li ul ul
{
        /* On décale les sous-sous-listes pour qu'elles ne soient pas au dessus des sous-listes */
        /* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
        border-left    : 1px solid #d2ecd3; /* Petite bordure à gauche pour ne pas coller ... */   
}
 
/* IE ne reconnaissant pas le sélecteur ">" ... je me répète ;-) */
html>body #menu li ul ul               
{
        border-left    : 1px solid transparent ; /* on met une bordure transparente sur la gauche de chaque élément */
}

#menu a:hover /* Lorsque la souris passe sur un des liens */ 
{
        color: #0a171d; /* On passe le texte en noir... */
        background: #d2ecd3; /* ... et au contraire, le fond en blanc */
  left: -999em;
}

#menu li:hover ul ul, #menu li.sfhover ul ul /* Sous-sous-listes lorsque la souris passe sur un élément de liste */
{
        left: -999em; /* On expédie les sous-sous-listes hors du champ de vision */
}
 
#menu li:hover ul, #menu li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul  /* Sous-listes lorsque la souris passe sur un élément de liste ET sous-sous-lites lorsque la souris passe sur un élément de sous-liste */
{
        left: auto; /* Repositionnement normal */
        min-height: 0; /* Corrige un bug sous IE */
}


J'ai vraiment beaucoup de mal à voir où est le soucis...
J'espère qu'un âme charitable pourra m'éclairer.

Merci d'avance.

[[Nihil]]

Pourrais tu s'il te plait mettre sur ton forum test la version "qui bug" ^^ ? Pour qu'on voit directement le problème

Je pense que c'est juste par ce qu'il faut entourer ces variables là avec une balise table

[Amallia]

OMG en effet tu as raison !!!

Merciiii =D

Bon bah il me reste le soucis que le texte ne se modifie pas ( ")
J'ai personnalisé le texte mais pour une raison que j'ignore, ça s'affiche pas et j'ai le texte de base...

[Neptunia]

Bonjour ^^

Votre template comporte divers scripts de remplacement pour les id TotalMembres, DernierInscrit, TotalMessages etc etc mais ces identifiants n'ont été déclarés nulle part.

Vous cherchez à remplacer des chaînes à l'intérieur d'un élément qui n'existe pas et forcément le script ne remplace rien.
Pour que le script fonctionne vous devriez avoir un code de ce style

Code:

<span id="DernierInscrit">{NEWEST_USER}</span>

[Amallia]

Ah oui en effet !

Merci beaucoup ! Je vous réserve une place à tous les deux dans la PA section remerciement !