codage noono

.profile_user {
    background: url(https://i.imgur.com/1yixhCD.png) no-repeat;
    border: 1px solid #ededed;
    border-radius: 3px;
    box-shadow: 0 0 3px 1px #ededed;
    font-size: 12px;
    padding: 20px;
    position: relative;
}


.profile_user .header {
    border-radius: 3px;
    padding: 20px;
    text-align: center;
    background: rgba(255,255,255,0.8);
    margin-bottom: 20px;
    border: 1px solid #ededed;
}


.profile_user .header .pseudo { font: italic 400 32px/24px 'oswald'; }
.profile_user .header .rang { text-transform: uppercase; font: 11px/11px 'Courier New'; height: 22px; }
.profile_user .header .rang img {
    position: absolute;
    bottom: 385px;
    right: 21px;
    z-index: 0;
}

.profile_user .liens { display: flex; justify-content: space-around; margin: 0 auto 10px; width: 50%; }
.profile_user .liens a { text-transform: uppercase; /*background: #17bda3;*/ color: #ffffff; font: 700 italic 16px 'Calibri'; }
.profile_user .stats,
.profile_user .others { display: inline-block; vertical-align: middle; width: 50%; margin: 0 auto; font: 600 10px/10px Open Sans; text-transform: uppercase; }

.profile_user .contact { float: left; width: 10px; position: relative; }

.profile_user .bloc_left, .profile_user .bloc_right {
    display: inline-block;
    background: rgba(255,255,255,0.8);
    border-radius: 3px;
    padding: 10px;
    vertical-align: top;
    border: 1px solid #ededed;
}



.profile_user .header a { color: #d46d73;;; }

.profile_user .bloc_left { width: calc(100% - 230px); overflow: auto; height: 297px; }
.profile_user .bloc_left .infos { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #BFBFDC; }
.profile_user .bloc_left .infos .label,
.profile_user .bloc_left .rpg_field .label { font-size: 10px; letter-spacing: -1px; text-align: right; padding-right: 25px; }
.profile_user .bloc_left .infos .champ,
.profile_user .bloc_left .rpg_field .champ { width: 200px !important; font-size: 10px !important; text-align: justify; }
.profile_user .bloc_left .infos .champ img { max-width: 200px; }
.profile_user .bloc_left .infos .champ textarea { width: 220px; }

.profile_user .bloc_left .rpg_field .label .gen,
.profile_user .bloc_left .rpg_field .champ .gen { font-size: 10px !important; }

.profile_user .bloc_right { width: 200px; text-align: center; margin-left: 20px; }
.profile_user .bloc_right .avatar { width: 150px; border: 0px solid; margin: 0 auto; }
.profile_user .bloc_right .avatar img { width: 150px; position: relative; }
.profile_user .bloc_right .statut { font: 600 10px 'Open Sans'; text-transform: uppercase; position: relative; margin: 10px 0 0; }

.profil_content .content .profil_champs {
    font-size: 9px;
}

<table width="100%" border="0" cellspacing="2" cellpadding="0" align="center">
<tr>
<td><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a></span></td>
</tr>
</table>

<div class="profile_user">
  <div class="header">
    <div class="pseudo">{USERNAME}</div>
    <div class="rang">{POSTER_RANK}</div>
   
    <div class="liens">
      <a rel="nofollow" class="genmed" href="/st/{PUSERNAME}">Sujets créés</a>
      <a rel="nofollow" class="genmed" href="/sta/{PUSERNAME}">Sujets</a>
      <a rel="nofollow" class="genmed" href="/spa/{PUSERNAME}">Messages</a>
    </div>
    <div class="stats">
      {POST_PERCENT_STATS} / {POST_DAY_STATS} <br />
      {FRIENDSFOES}
    </div>
    <div class="others">
      {PRIVATE_MSG} messages privés envoyés<br />
      {L_ADMINISTRATE_USER}:&nbsp;{ADMINISTRATE_USER}{BAN_USER}
    </div>
  </div> 
 
  <div class="contact">
    <!-- BEGIN contact_field -->
    <div id="field_id{contact_field.ID}">
       {contact_field.CONTENT}
    </div>
    <!-- END contact_field -->
  </div>
 
  <div class="bloc_left custom_scroll">
    <div class="infos">
         <!-- BEGIN profile_field -->
         <div id="field_id{profile_field.ID}">
          <table width="100%" border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td width="50%" valign="top"><div class="gen label">{profile_field.LABEL}</div></td>
              <td valign="top"><div class="champ">{profile_field.CONTENT}</div></td>
            </tr>
          </table>
        </div>
      <!-- END profile_field -->
    </div>
    <table width="100%" class="rpg_field">
      <!-- BEGIN switch_rpg -->
      <tr>
          <td colspan="2" align="center"><b><span class="gen">{L_VIEWING_RPG}</span></b></td>
      </tr>
      <tr>
          <td align="center" valign="top" height="6">
              {RPG_IMAGE}<br /><br />
              <table width="100%" border="0" cellspacing="1" cellpadding="0">
                  <!-- BEGIN rpg_fields_left -->
                  <tr>
                      <td align="right" valign="middle" nowrap="nowrap" width="50%">
                      <div class="gen label">{switch_rpg.rpg_fields_left.F_NAME} : </div>
                      </td>
                      <td width="100%" valign="middle" nowrap="nowrap">
                      <div class="gen champ">{switch_rpg.rpg_fields_left.F_VALUE_NEW}</div>
                      </td>
                  </tr>
                  <!-- END rpg_fields_left -->
              </table>
          </td>
          <td align="center" valign="top" height="6">
              <table width="100%" border="0" cellspacing="1" cellpadding="0">
                  <!-- BEGIN rpg_fields -->
                  <tr>
                      <td align="right" valign="middle" nowrap="nowrap" width="50%">
                          <div class="gen label">{switch_rpg.rpg_fields.F_NAME} : </div>
                      </td>
                      <td width="100%" valign="baseline">
                          <div class="gen champ">{switch_rpg.rpg_fields.F_VALUE_NEW}</div>
                      </td>
                  </tr>
                  <!-- END rpg_fields -->
              </table>
          </td>
      </tr>
      <tr>
          <td colspan="2" align="center">
              {U_ADMIN_RPG}
          </td>
      </tr>
      <!-- END switch_rpg -->
    </table>
   
  </div>
  <div class="bloc_right">
    <div class="avatar" id="avatarMember">{AVATAR_IMG}</div>
    <div class="statut">{USER_ONLINE} <br/>
      {LAST_VISIT_TIME}</div>
  </div>
</div>

<br />
<script src="{JS_DIR}jquery/json/jquery.json-1.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
   $(document).ready(function(){
      $('[id^=field_id]').each(function(){
         if ( $(this).find('.field_editable').is('span, div') )
         {
            $(this).hover(function()
            {
               if( $(this).find('.field_editable.invisible').is('span, div') )
               {
                  $(this).find('.field_editable').prev().addClass('ajax-profil_hover').parent().addClass('ajax-profil_parent').append('<div class="ajax-profil_edit"><img src="{AJAX_EDIT_IMG}" /></div>');
                  $(this).find('.ajax-profil_edit').attr({
                        alt: "{L_FIELD_EDIT_VALUE}",
                        title: "{L_FIELD_EDIT_VALUE}"
                     }).click(function(){
                     $(this).prev().prev().removeClass('ajax-profil_hover').addClass('invisible').next().removeClass('invisible').append('<img src="{AJAX_VALID_IMG}" class="ajax-profil_valid" />').find('input,select');
                     $(this).prev().find('.ajax-profil_valid').attr({
                        alt: "{L_VALIDATE}",
                        title: "{L_VALIDATE}"
                     }).click(function(){
                        var content = new Array();
                        $(this).parent().find('[name]').each(function(){
                           var type_special = $(this).is('input[type=radio],input[type=checkbox]');
                           if ( (type_special && $(this).is(':checked')) || !type_special )
                           {
                              content.push(new Array($(this).attr('name'), $(this).attr('value')));
                           }
                        });
                        var id_name = $(this).parents('[id^=field_id]').attr('id');
                        var id = id_name.substring(8, id_name.length);
                        $.post(
                           "{U_AJAX_PROFILE}",
                           {id:id,user:"{CUR_USER_ID}",active:"{CUR_USER_ACTIVE}",content:$.toJSON(content),tid:"{TID}"},
                           function(data){
                              $.each(data, function(i, item){
                                 $('[id=field_id' + i + ']').find('.field_uneditable').html(item).end().find('.ajax-profil_valid').remove().end().find('.field_editable').addClass('invisible').end().find('.field_uneditable').removeClass('invisible');
                              });
                           },
                           "json"
                        );
                     });
                     $(this).remove();
                  });
               }
            },function()
            {
               if( $(this).find('.field_editable.invisible').is('span, div') )
               {
                  $(this).find('.field_editable').prev().removeClass('ajax-profil_hover');
                  $(this).find('.ajax-profil_edit').remove();
               }
            });
         }
      });
   });
//]]>
</script>

/* ==================== QUI EST EN LIGNE ==================== */
.margintop { margin-top: 10px; }
table.trans { text-align: justify!important; }
table.trans td.row1 { background-color: transparent !important; }

.qeel {
    position: relative;
    width: 724px;
    height: 500px;
    margin: 0 auto;
    background: url(https://i.imgur.com/7VVkXTS.png);
    border-radius: 25px;
}

.qeel .intro {
  position: absolute;
  top: 15px;
  right: 0;
  text-align: justify;
  width: 258px;
  height: 341px;
}

.qeel .intro .onglets {
    position: absolute;
    top: 191px;
    right: 44px;
    width: 35px;
}

.qeel .intro .onglets .onglet {
    display: block;
    width: 35px;
    height: 94px;
    margin-bottom: 5px;
}

.qeel .intro .onglets .onglet img { opacity: 0; transition: .3s all ease-in-out; }
.qeel .intro .onglets .onglet.active img { opacity: 0; }

.qeel .intro .contents .content {
    opacity: 0;
    position: absolute;
    right: 72px;
    top: 197px;
    width: 500px;
    height: 185px;
    text-align: justify;
    overflow: auto;
    z-index: 1;
    transition: all .5s ease-in-out;
    background: rgba(255,255,255,0.8);
    border-radius: 3px;
    border: 1px lightgrey solid;
}

.qeel .intro .contents .content.active {
  opacity: 1;
  z-index: 10;
  transition: all .5s ease-in-out;
}

.qeel .actu {
  position: absolute;
  padding: 15px 10px 5px;
  text-align: justify;
  font-size: 9px !important;
  line-height: 10px;
  font-family: verdana;
}

.qeel .connected {
  position: absolute;
  padding: 10px;
  text-align: justify;
  font-size: 10px !important;
  line-height: 10px;
  font-family: Verdana;
}

.qeel #av_newestMember {
    position: absolute;
    top: 25px;
    left: 25px;
}

.qeel #av_newestMember img { width: 95px; border-radius: 3pxpx; opacity: .8; transition: all .5s ease-in-out; /*box-shadow: 1px 1px 1px #000; */}
.qeel #av_newestMember img:hover { opacity: 1; }

.qeel .stats {
    position: absolute;
    z-index: 201;
    width: 141px;
    height: 155px;
    padding: 10px;
    text-align: center;
    font-size: 11px !important;
    line-height: 12px;
    font-family: 'Open Sans', sans-serif;
    left: 134px;
    top: 25px;
    background: rgba(255,255,255,0.8);
    border-radius: 3px;
    border: 1px solid #dddddd;
}

.qeel .stats .qeelStats {
    display: inline-block;
    font-family: 'Open Sans', sans-serif;
    text-transform: uppercase;
    width: 100%;
    border-bottom: 1px solid lightgrey;
  padding-bottom: 4px;
}

.qeel .stats .qeelStats strong {
    font-size: 12px;
    line-height: 18px;
    display: inline-block;
    font-family: 'oswald', sans-serif;
    font-weight: 700;
    color: #8e0b12;
}

.qeel .stats #qeelNbOnline {
  font-size: 11px;
  line-height: 12px;
  width: 100%;
  display: block;
  padding-top: 20px;
  position: relative;
}

.qeel .stats #qeelNbOnline div {
  position: absolute;
  display: block;
  height: 35px;
  top: 8px; right: 21px;
}

.qeel .stats #qeelNbOnline div strong {
    font-size: 12px;
    line-height: 14px;
    font-family: 'oswald', sans-serif;
    font-weight: 700;
    position: absolute;
    right: 70px;
}

.qeel .stats #qeelNbOnline div.membre {
    position: absolute;
    top: 8px;
    font-family: Lato, 'Open Sans', sans-serif;
    text-transform: uppercase;
    height: auto;
}

.qeel .stats #qeelNewestUser {
  width: 100%;
  margin-bottom: 0;
  position: relative;
  padding-top: 20px;
  padding-left: 12px;
  text-align: left;
}

.qeel .stats #qeelNewestUser strong {
  font-family: 'oswald', sans-serif;
  /*text-shadow: -1px 1px 0 #ffffff; */
  color: #9e9e9e!important;
  text-transform: none;
  font-weight: 700;
  font-size: 16px;
  display: block;
  position: absolute;
  top: 0px;
  left: 3px;
  width: 135px;
}

.qeel .player {
    position: absolute;
    top: 420px;
    left: 10px;
    width: 720px;
    height: 75px;
    padding: 4px 0px;
    z-index: 1;
}

.qeel .groupes {
    position: absolute;
    top: 25px;
    right: 137px;
    width: 300px;
    height: 155px;
    z-index: 200;
    background: rgba(255,255,255,0.8);
    border-radius: 10px;
}

.qeel .groupes .onglets {
    position: relative;
    z-index: 200;
    margin-left: 40px;
    margin-top: 2px;
}

.qeel .groupes a.onglet {
    position: absolute;
    width: 15px;
    height: 15px;
}


.qeel .onglet.default {
    color: #8a8a8a !important;
    top: 160px;
    left: 7px;
    background-color: #444444;
}

.onglet.cabot {
    color: #8a8a8a !important;
    top: 160px;
    left: 25px;
    background-color: #ff7a95;
}

.pres-cabot {
  background: url(https://i.imgur.com/DtZ98YQ.png) top no-repeat;
}

.onglet.dunster {
    color: #8a8a8a !important;
    top: 160px;
    left: 43px;
    background-color: #b39b00;
}

.pres-dunster {
  background: url(https://i.imgur.com/neZ3t7o.png) top no-repeat;
}

.onglet.eliot {
    color: #8a8a8a !important;
    top: 160px;
    left: 61px;
    background-color: #509eed;
}

.pres-eliot {
  background: url(https://i.imgur.com/3ICIj3j.png) top no-repeat;
}

.onglet.lowell {
    color: #8a8a8a !important;
    top: 160px;
    left: 79px;
    background-color: #965bef;
}

.pres-lowell {
  background: url(https://i.imgur.com/bVC8Ion.png) top no-repeat;
}

.onglet.mather {
    color: #8a8a8a !important;
    top: 160px;
    left: 97px;
    background-color: #76ad23;
}

.pres-mather {
  background: url(https://i.imgur.com/6FC6XYE.png) top no-repeat;
}

.onglet.quincy {
    color: #8a8a8a !important;
    top: 160px;
    left: 115px;
    background-color: #ed7b34;
}

.pres-quincy {
  background: url(https://i.imgur.com/0ppc41a.png) top no-repeat;
}

.onglet.winthrop {
    color: #8a8a8a !important;
    top: 160px;
    left: 133px;
    background-color: #c92724;
}

.pres-winthrop {
  background: url(https://i.imgur.com/4oaie9e.png) top no-repeat;
}


.onglet.student {
    color: #8a8a8a !important;
    top: 160px;
    left: 151px;
    background-color: #8a8a8a;
}

.pres-student {
  background: url(https://i.imgur.com/Sps3kTM.png) top no-repeat;
}

.onglet.citicambridge {
    color: #8a8a8a !important;
    top: 160px;
    left: 169px;
    background-color: #9e3474;
}

.fond-citicambridge {
  background: url(https://i.imgur.com/5JENjfx.png) top no-repeat;
}

.onglet.citiboston {
    color: #8a8a8a !important;
    top: 160px;
    left: 187px;
    background-color: #349e95;
}

.fond-citiboston {
  background: url(https://i.imgur.com/51KYgLr.png) top no-repeat;
}

.onglet.harvardstaff {
    color: #8a8a8a !important;
    top: 160px;
    left: 205px;
    background-color: #32368a;
}

.fond-staff {
  background: url(https://i.imgur.com/BUywGiB.png) top no-repeat;
}

.qeel .groupes .contents {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border: 1px solid #dddddd;
}

.qeel .groupes .content {
  position: absolute;
  z-index: 100;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  padding: 5px;
  transition: all .5s ease-in-out;
}

.qeel .groupes .content.active {
  opacity: 1;
  z-index: 500;
  transition: all .5s ease-in-out;
}

.qeel .groupes .content .house {
  display: block;
  text-align: center;
  font-family: 'Seaweed Script', sans-serif;
  font-weight: 700;
  font-size: 23px;
  line-height: 18px;
 /* text-shadow: -1px 1px 0 #ffffff; */
  border-bottom: 1px solid rgba(255,255,255,.05);
  margin-top: 5px;
 

}

.qeel .groupes .content.default .house {
  margin: 2px 0 2px;
}


.qeel ul {
  list-style-type: none;
  padding:0;
  margin: 0;
}

.qeel li {
  display: table;
  width: 90%;
  margin: 0 auto;
  line-height: 14px;
}

.qeel li span {
  display: table-cell;
}
.qeel li .house_c {
  width: 50%;
  text-transform: uppercase;
  text-align: right;
  font: 700 12px/12px Raleway;
  text-shadow: 0px 0px 2px #fff;

}
.qeel li .howmuch {
  width: 45%;
  text-align: right;
  font: 12px Courier;
}

.qeel li.groups span,
.qeel li.others span {
  text-align: center;
  width: 50%;
}

.qeel li.pres,
.qeel li.vp {
  width: 90% !important;
  text-align: center;
  display: flex;
  justify-content: space-between;
}

.qeel li.pres span:first-child,
.qeel li.vp span:first-child {
  font: 600 12px/10px 'Open Sans';
  text-transform: uppercase;
  text-shadow: 1px -1px 0 #fff;
}

.qeel li.pres span:last-child {
  text-transform: uppercase;
  font: 700 italic 11px 'Calibri';
  color: #9A9A9A;
}

.qeel li.vp span:last-child {
  text-transform: uppercase;
  font: 700 italic 11px 'Calibri';
  color: #9A9A9A;
}


.qeel li.maison {
  letter-spacing: 1px;
  font-family: 'Hind', sans-serif;
  font-size:12px;
  line-height: 14px;
  text-transform: uppercase;
  font-weight:700px;
  text-align: center;
  padding-top: 90px;
}

.qeel li.maison i {
  font-style: normal;
  letter-spacing: 0;
  font-family: Courier New;
}

.qeel li.groups span {
  letter-spacing: 1px;
  font-family: 'Hind', sans-serif;
  font-size:12px;
  font-weight:700px;
  text-transform: uppercase;
  text-align: center;
  padding-top: 90px;
}

.qeel li.groups i {
  font-style: normal;
  letter-spacing: 0;
  font-family: Courier New;
}

.qeel li.groups span:first-child {
  text-align: center;
  padding: 0 19px 0 0;
}

.qeel li.one span {
  display: block;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 1px;
  font: 12px Raleway;
}

.qeel li.cta span {
  margin: 10px auto 0;
  width: 75%;
  border: 1px solid rgba(255,255,255,.15);
  font-weight: 700;
}

.qeel li.groups span.pnj {
  letter-spacing: 0;
}

<!-- BEGIN disable_viewonline -->
<div id="qeel-ilh" class="qeel">
    <div class="stats">
        <span id="qeelNbPosts" class="qeelStats">{TOTAL_POSTS}</span>
        <span id="qeelNbUsers" class="qeelStats">{TOTAL_USERS}</span>
        <span id="qeelNbOnline" class="qeelStats">
          {TOTAL_USERS_ONLINE} <div class="membre">connectés</div>
        </span>
        <span id="qeelNewestUser" class="qeelStats">{NEWEST_USER}</span>
    </div>
    <div id="av_newestMember"></div>
    <div class="intro">
        <div class="onglets">
            <a href="#" class="onglet active" data-intro-onglet="actu">
                <img src="http://www.clker.com/cliparts/2/e/8/p/D/3/purple-snowflake-hi.png" style="width:50px;">
            </a>
            <a href="#" class="onglet" data-intro-onglet="connected">
                <img src="http://www.clker.com/cliparts/2/e/8/p/D/3/purple-snowflake-hi.png" style="width:50px;">
            </a>
        </div>
        <div class="contents">
            <div class="content actu active custom_scroll">
                <span id="qeelRecord">{RECORD_USERS}</span>
                <br />
                <br />
                <span id="qeelLoggedUsers">{LOGGED_IN_USER_LIST}</span>
            </div>

            <div class="content connected custom_scroll">
                <table class="trans">
                    <tr>
                        <td>
                            <div style="font-size:11px;">{L_CONNECTED_MEMBERS}</div>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>

    <div class="groupes">
        <div class="onglets">
            <a href="#" class="onglet default" data-name="default"></a>
            <a href="#" class="onglet cabot" data-name="cabot"></a>
            <a href="#" class="onglet dunster" data-name="dunster"></a>
            <a href="#" class="onglet eliot" data-name="eliot"></a>
            <a href="#" class="onglet lowell" data-name="lowell"></a>
            <a href="#" class="onglet mather" data-name="mather"></a>
            <a href="#" class="onglet quincy" data-name="quincy"></a>
            <a href="#" class="onglet winthrop" data-name="winthrop"></a>
          <a href="#" class="onglet student" data-name="student"></a>
            <a href="#" class="onglet citicambridge" data-name="citicambridge"></a>
          <a href="#" class="onglet citiboston" data-name="citiboston"></a>
          <a href="#" class="onglet harvardstaff" data-name="harvardstaff"></a>

        </div>
        <br/>
        <div class="lignegroupes"></div>
        <div class="contents">
            <div class="content default">
                <span class="house"> Les compétitions </span>
                <ul>
                  <li><span class="house_c winthrop">Winthrop House</span><span class="howmuch"> 30 406 $</span></li>
                  <li><span class="house_c mather">Mather House</span><span class="howmuch"> 21 861 $</span></li>
                  <li><span class="house_c eliot">Eliot House</span><span class="howmuch"> 21 050 $</span></li>
                  <li><span class="house_c dunster">Dunster House</span><span class="howmuch">  12 107 $</span></li>
                  <li><span class="house_c cabot">Cabot House</span><span class="howmuch">  11 162 $</span></li>
                  <li><span class="house_c quincy">Quincy House</span><span class="howmuch">  9 246 $</span></li>
                  <li><span class="house_c lowell">Lowell House</span><span class="howmuch">  3 733 $</span></li>                                   
                  <li><span class="house_c citiboston">Boston</span><span class="howmuch">  41 840 $</span></li>
                  <li><span class="house_c citicambridge">Cambridge</span><span class="howmuch">  7 049 $</span></li>
                                               
                </ul>
            </div>
            <div class="content cabot pres-cabot">
              <span class="house cabot"> </span>
                <br/>
                <ul class="details">
                    <li class="maison">
                      <span><a href="http://www.i-love-harvard.com/g5-cabot-house" style="color:#8a8a8a">Members</a><br/>(<i class="cabot">#FF7A95</i>)</span>•<span><a href="http://www.i-love-harvard.com/g133-bizuts-cabots" style="color:#8a8a8a">Bizuts</a> <br/>(<i class="cabot">#F0B7C2</i>)</span>•<span><a href="http://www.i-love-harvard.com/f90-flood-prive-cabot-house" style="color:#8a8a8a">Flood privé</a></span>
                    </li>
                </ul>
            </div>
            <div class="content dunster pres-dunster">
                <span class="house dunster"> </span>
                <br/>
                <ul class="details">
                    <li class="maison">
                      <span><a href="http://www.i-love-harvard.com/g9-dunster-house" style="color:#8a8a8a">Members</a><br/>(<i class="dunster">#B39B00</i>)</span>•<span><a href="http://www.i-love-harvard.com/g130-bizuts-dunsters" style="color:#8a8a8a">Bizuts</a> <br/>(<i class="dunster">#C2B97C</i>)</span>•<span><a href="http://www.i-love-harvard.com/f87-flood-prive-dunster-house" style="color:#8a8a8a">Flood privé</a></span>
                    </li>
                </ul>
            </div>
            <div class="content eliot pres-eliot">
                <span class="house eliot"> </span>
                <br/>
                <ul class="details">
                    <li class="maison">
                      <span><a href="http://www.i-love-harvard.com/g2-eliot-house" style="color:#8a8a8a">Members</a><br/>(<i class="eliot">#509EED</i>)</span>•<span><a href="http://www.i-love-harvard.com/g128-bizuts-eliots" style="color:#8a8a8a">Bizuts</a> <br/>(<i class="eliot">#95BADB</i>)</span>•<span><a href="http://www.i-love-harvard.com/f86-flood-prive-eliot-house" style="color:#8a8a8a">Flood privé</a></span>
                    </li>
                </ul>
            </div>
            <div class="content lowell pres-lowell">
                <span class="house lowell"> </span>
                <br/>
              <ul class="details">
                    <li class="maison">
                      <span><a href="http://www.i-love-harvard.com/g64-lowell-house" style="color:#8a8a8a">Members</a><br/>(<i class="lowell">#965BEF</i>)</span>•<span><a href="http://www.i-love-harvard.com/g134-bizuts-lowells" style="color:#8a8a8a">Bizuts</a> <br/>(<i class="lowell">#B39FCC</i>)</span>•<span><a href="http://www.i-love-harvard.com/f217-flood-prive-lowell-house" style="color:#8a8a8a">Flood privé</a></span>
                    </li>
                </ul>
            </div>
            <div class="content mather pres-mather">
                <span class="house mather"></span>
                <br/>
              <ul class="details">
                    <li class="maison">
                      <span><a href="http://www.i-love-harvard.com/g6-mather-house" style="color:#8a8a8a">Members</a><br/>(<i class="mather">#76AD23</i>)</span>•<span><a href="http://www.i-love-harvard.com/g132-bizuts-mathers" style="color:#8a8a8a">Bizuts</a> <br/>(<i class="mather">#A9BA88</i>)</span>•<span><a href="http://www.i-love-harvard.com/f91-flood-prive-mather-house" style="color:#8a8a8a">Flood privé</a></span>
                    </li>
                </ul>
            </div>
            <div class="content quincy pres-quincy">
                <span class="house quincy"></span>
                <br/>
              <ul class="details">
                    <li class="maison">
                      <span><a href="http://www.i-love-harvard.com/g4-quincy-house" style="color:#8a8a8a">Members</a><br/>(<i class="quincy">#ED7B34</i>)</span>•<span><a href="http://www.i-love-harvard.com/g131-bizuts-quincys" style="color:#8a8a8a">Bizuts</a> <br/>(<i class="quincy">#E6A77C</i>)</span>•<span><a href="http://www.i-love-harvard.com/f88-flood-prive-quincy-house" style="color:#8a8a8a">Flood privé</a></span>
                    </li>
                </ul>
            </div>
            <div class="content winthrop pres-winthrop">
                <span class="house winthrop"></span>
                <br/>
            <ul class="details">
                    <li class="maison">
                      <span><a href="http://www.i-love-harvard.com/g3-winthrop-house" style="color:#8a8a8a">Members</a><br/>(<i class="winthrop">#C92724</i>)</span>•<span><a href="http://www.i-love-harvard.com/g129-bizuts-winthrops" style="color:#8a8a8a">Bizuts</a> <br/>(<i class="winthrop">#C98787</i>)</span>•<span><a href="http://www.i-love-harvard.com/f89-flood-prive-winthrop-house" style="color:#8a8a8a">Flood privé</a></span>
                    </li>
                </ul>
            </div>
            <div class="content student pres-student">
                <span class="house student"> </span>
                <br/>
                <ul class="details">
                  <li class="groups"><span><a href="http://www.i-love-harvard.com/g7-students" style="color:#8a8a8a">Members</a> <br/>(<i class="student">#8A8A8A</i>)</span>•<span><a href="http://www.i-love-harvard.com/f206-flood-prive-students" style="color:#8a8a8a">Flood privé</a></span></li>
                </ul>
            </div>
          <div class="content citicambridge fond-citicambridge">
                <span class="house citicambridge"> </span>
                <br/>
                <ul class="details">
                  <li class="groups"><span><a href="http://www.i-love-harvard.com/g8-citizens-of-cambridge" style="color:#8a8a8a">Members</a> <br/>(<i class="citicambridge">#9E3474</i>)</span>•<span><a href="http://www.i-love-harvard.com/f258-flood-prive-cambridge-citizen" style="color:#8a8a8a">Flood privé</a></span></li>
                </ul>
            </div>
          <div class="content citiboston fond-citiboston">
                <span class="house citiboston"> </span>
                <br/>
                <ul class="details">
                  <li class="groups"><span><a href="http://www.i-love-harvard.com/g309-citizen-of-boston" style="color:#8a8a8a">Members</a> <br/>(<i class="citiboston">#349e95</i>)</span>•<span><a href="http://www.i-love-harvard.com/f129-flood-prive-boston-citizen" style="color:#8a8a8a">Flood privé</a></span></li>
                </ul>
            </div>
          <div class="content harvardstaff fond-staff">
                <span class="house staff"> </span>
                <br/>
                <ul class="details">
                  <li class="groups"><span><a href="http://www.i-love-harvard.com/g257-harvard-s-staff" style="color:#8a8a8a">Members</a> <br/>(<i class="staff">#32368A</i>)</span>•<span><a href="http://www.i-love-harvard.com/f126-flood-prive-staff-d-harvard" style="color:#8a8a8a">Flood privé</a></span></li>
                </ul>
            </div>
         
        </div>
    </div>
   
    <div class="player">
 <iframe style="border:none" src="https://s3.amazonaws.com/files.podsnack.com/iframe/embed.html?hash=a1hjqjck&t=1522442267" width="370" height="60" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>
    </div>
    <script type="text/javascript">
    $(function() {
        $.get($("#qeelNewestUser a[href^='/u']")[0].href, function(d) {
            (a = $("#avatarMember img", $(d))).length && $("#av_newestMember").html(a);
        })
    });

    document.getElementById('qeelNbOnline').innerHTML = document.getElementById('qeelNbOnline').innerHTML.replace("Il y a en tout", "<div>");
    document.getElementById('qeelNbOnline').innerHTML = document.getElementById('qeelNbOnline').innerHTML.replace("utilisateur en ligne :: ", "</div>");
    document.getElementById('qeelNbOnline').innerHTML = document.getElementById('qeelNbOnline').innerHTML.replace("utilisateurs en ligne :: ", "</div>");
    document.getElementById('qeelNbOnline').innerHTML = document.getElementById('qeelNbOnline').innerHTML.replace("et", "");
    document.getElementById('qeelNbOnline').innerHTML = document.getElementById('qeelNbOnline').innerHTML.replace(", ", "");
    document.getElementById('qeelNbOnline').innerHTML = document.getElementById('qeelNbOnline').innerHTML.replace("Enregistrés", "membres<br />");
    document.getElementById('qeelNbOnline').innerHTML = document.getElementById('qeelNbOnline').innerHTML.replace("Enregistré", "membre<br/>");
    document.getElementById('qeelNbOnline').innerHTML = document.getElementById('qeelNbOnline').innerHTML.replace("Invisible", "fantôme<br/>");
    document.getElementById('qeelNbOnline').innerHTML = document.getElementById('qeelNbOnline').innerHTML.replace("Invité", "visiteur");

    document.getElementById('qeelNbPosts').innerHTML = document.getElementById('qeelNbPosts').innerHTML.replace("Nos membres ont posté un total de", "");
    document.getElementById('qeelNbPosts').innerHTML = document.getElementById('qeelNbPosts').innerHTML.replace("messages", "messages");

    document.getElementById('qeelNbUsers').innerHTML = document.getElementById('qeelNbUsers').innerHTML.replace("Nous avons", "");
    document.getElementById('qeelNbUsers').innerHTML = document.getElementById('qeelNbUsers').innerHTML.replace("membres enregistrés", "membres");

    document.getElementById('qeelNewestUser').innerHTML = document.getElementById('qeelNewestUser').innerHTML.replace("L\'utilisateur enregistré le plus récent est", "Dernier inscrit");

    document.getElementById('qeelNbOnline').innerHTML = document.getElementById('qeelNbOnline').innerHTML.replace("Utilisateurs enregistrés :", "");

    document.getElementById('qeelRecord').innerHTML = document.getElementById('qeelRecord').innerHTML.replace("Le record du nombre d\'utilisateurs en ligne est de", "Record de connexions : ");
    document.getElementById('qeelRecord').innerHTML = document.getElementById('qeelRecord').innerHTML.replace("le", "membres le");
    </script>
</div>



<!-- END disable_viewonline -->

 <script type="text/javascript">
    //<![CDATA[
    var multiquote_img_off = '{JS_MULTIQUOTE_IMG_OFF}', multiquote_img_on = '{JS_MULTIQUOTE_IMG_ON}', _atr = '{JS_DIR}addthis/', _ati = '{PATH_IMG_FA}addthis/'{ADDTHIS_LANG}, addthis_localize = { share_caption: "{L_SHARE_CAPTION}", email: "{L_EMAIL}", email_caption: "{L_EMAIL_CAPTION}", favorites: "{L_SHARE_BOOKMARKS}", print: "{L_PRINT}", more: "{L_MORE}" };
    $(function(){
    _atc.cwait = 0;
    $('.addthis_button').mouseup(function(){
    if ($('#at15s').css('display') == 'block') {
    addthis_close();
    }
    });
    });

    var hiddenMsgLabel = { visible:'{JS_HIDE_HIDDEN_MESSAGE}', hidden:'{JS_SHOW_HIDDEN_MESSAGE}' };
    showHiddenMessage = function(id)
    {
        try
        {
            var regId = parseInt(id, 10);
            if( isNaN(regId) ) { regId = 0; }
           
            if( regId > 0)
            {
                $('.post--' + id).toggle(0, function()
    {
    if( $(this).is(":visible") )
    {
    $('#hidden-title--' + id).html(hiddenMsgLabel.visible);
    }
    else
    {
    $('#hidden-title--' + id).html(hiddenMsgLabel.hidden);
    }
    });
            }
        }
        catch(e) { }
       
    return false;
    };

    //]]>
    </script>

    <table width="100%" border="0" cellspacing="2" cellpadding="0">
    <tr>
    <td align="left" valign="middle" nowrap="nowrap">
    <span class="nav2">
    <!-- BEGIN switch_user_authpost -->
    <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" id="{POST_IMG_ID}one" alt="{L_POST_NEW_TOPIC}" align="middle" border="0" /></a> 
    <!-- END switch_user_authpost --><br>
    <!-- BEGIN switch_user_authreply -->
    <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" id="i_reply" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /></a>
    <!-- END switch_user_authreply -->
    </span>
    </td>
    <td align="left" valign="middle" nowrap="nowrap">
    <!-- BEGIN switch_twitter_btn -->
    <span id="twitter_btn" style="margin-left: 6px; ">
    <a href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal">Tweet</a>
    <script type="text/javascript" src="https://platform.twitter.com/widgets.js"></script>
    </span>
    <!-- END switch_twitter_btn -->
    <!-- BEGIN switch_fb_likebtn -->
    <span id="fb_likebtn" style="margin-left: 6px; ">
    <iframe src="https://www.facebook.com/plugins/like.php?href={FORUM_URL}{TOPIC_URL}&layout=button_count&show_faces=false&width=100&action=like&colorscheme=light&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:21px;" allowTransparency="true"></iframe>
    </span>
    <!-- END switch_fb_likebtn -->
    </td>
    <td class="nav" valign="middle" width="100%"><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC_SECOND}</span></td>
    <td align="right" valign="bottom" nowrap="nowrap" width="100%">
    <span class="gensmall bold">
    <a class="addthis_button" href="https://www.addthis.com/bookmark.php?v=250&pub=forumotion">{L_SHARE}</a>
    <!-- BEGIN switch_plus_menu -->
      | .
    <script type="text/javascript">//<![CDATA[
    var url_favourite = '{U_FAVOURITE_JS_PLUS_MENU}';
    var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';
    var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';
    var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';
    var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';
   
    insert_plus_menu('f{FORUM_ID}&t={TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
    //]]>
    </script>
    <!-- END switch_plus_menu -->
    </span>
    </td>
    </tr>
</table><div class="hautecate"><div style="position:relative;margin: 0 auto 20px; width: 350px;padding: 3px;text-align:center;text-transform:lowercase;font-family: 'Open Sans', 'Shadows Into Light Two', cursive;font-size: 18px;color: #e57d83;letter-spacing: -1px;box-shadow: lightgrey 2px 2px 1px;transform: rotate(-1deg);background-color: #f1f1f1;text-transform:uppercase;">
      {TOPIC_TITLE}</div></div>
    <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0" >
    <!-- BEGIN topicpagination -->
    <tr>
    <td class="row1 pagination" colspan="2" align="right" valign="top"><span class="gensmall">{PAGINATION}</span></td>
    </tr>
    <!-- END topicpagination -->
    {POLL_DISPLAY}
    <!-- BEGIN postrow -->
    <!-- BEGIN hidden -->
    <tr>
    <td class="postdetails {postrow.hidden.ROW_CLASS}" colspan="3" align="center">{postrow.hidden.MESSAGE}</td>
    </tr>
    <!-- END hidden -->
      <!-- BEGIN displayed -->
    <tr class="post post--{postrow.displayed.U_POST_ID}" id="p{postrow.displayed.U_POST_ID}" style="{postrow.displayed.DISPLAYABLE_STATE}">
            <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="150">
                    <div class="profil_perso">
                      <center>{postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}</center>
                      <span class="postdetails poster-profile">
                 
                        <a name="{postrow.displayed.U_POST_ID}"></a>
                        <div class="profil_pseudo">{postrow.displayed.POSTER_NAME}</div>
                        <div class="profil_rank">{postrow.displayed.POSTER_RANK}</div>
                        <div class="profil_avatar">{postrow.displayed.POSTER_AVATAR}</div>
                            <div class="profil_online">{postrow.displayed.ONLINE_IMG}</div>
                        <div class="profil_rank_img">{postrow.displayed.RANK_IMAGE}</div>
                       
                        <div class="profil_content profile-{postrow.displayed.U_POST_ID}">
                           <div class="onglets" style="height:30px;width: 200px;position:relative;top:-10px;left:-2px;border-bottom: 2px solid #d7d9d0;">
                                  <a href="#" class="onglet active">id card </a>
                                  <a href="#" class="onglet">jobs</a>
                             </div>
                             <div class="contenus" style="position:relative;top:-5px;">
                                  <div class="content infos custom_scroll">
                                        <!-- BEGIN profile_field -->
                                        <span class="profil_champs"> {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}</span>
                                         
                                         
                                          <!-- END profile_field -->
                                    </div>
                                  <div class="content perso">
                                             {postrow.displayed.POSTER_RPG}
                                     </div>
                             </div>
                         
                        </div>
                        <div class="profil_links"><!-- BEGIN contact_field --> {postrow.displayed.contact_field.CONTENT}<!-- END contact_field --></div>
                       
                       
         </span>
         <img src="https://2img.net/i/fa/empty.gif" alt="" style="width:150px;height:1px" />
                    </div>
      </td>
    <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="100%" height="28" colspan="2">
            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="bulle">
                                   
                                    <tr>
                                        <td colspan="2" align="center">
                                            <div class="container_post">
                                                <div class="post-options">
                                                    {postrow.displayed.THANK_IMG} {postrow.displayed.MULTIQUOTE_IMG} {postrow.displayed.QUOTE_IMG} {postrow.displayed.EDIT_IMG} {postrow.displayed.DELETE_IMG} {postrow.displayed.IP_IMG} {postrow.displayed.REPORT_IMG}
                                                  <br><span class="postdetails"><img src="{postrow.displayed.MINI_POST_IMG}" alt="{postrow.displayed.L_MINI_POST_ALT}" title="{postrow.displayed.L_MINI_POST_ALT}" border="0" />(<a href="#{postrow.displayed.U_POST_ID}">#</a>) {postrow.displayed.POST_DATE}</span>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
    <!--<tr>
            <td colspan="2" align="center"><span class="postdetails"><img src="{postrow.displayed.MINI_POST_IMG}" alt="{postrow.displayed.L_MINI_POST_ALT}" title="{postrow.displayed.L_MINI_POST_ALT}" border="0" />(<a href="#{postrow.displayed.U_POST_ID}">#</a>) {L_POST_SUBJECT}:    <img src="{postrow.displayed.MINI_TIME_IMG}" alt="" border="0" />{postrow.displayed.POST_DATE}</span>
              <br>{postrow.displayed.POST_DATE}</td>
              </tr>
              <tr>
    <td colspan="2" align="center" valign="top" nowrap="nowrap" class="post-options">
    {postrow.displayed.THANK_IMG} {postrow.displayed.MULTIQUOTE_IMG} {postrow.displayed.QUOTE_IMG} {postrow.displayed.EDIT_IMG} {postrow.displayed.DELETE_IMG} {postrow.displayed.IP_IMG} {postrow.displayed.REPORT_IMG}
    </td>
    </tr>-->
</table><table>
    <tr>
    <td colspan="2">
    <!-- BEGIN switch_vote_active -->
    <div class="vote gensmall">
    <!-- BEGIN switch_vote -->
    <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}">+</a></div>
    <!-- END switch_vote -->

    <!-- BEGIN switch_bar -->
    <div class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">
    <!-- BEGIN switch_vote_plus -->
    <div class="vote-bar-plus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div>
    <!-- END switch_vote_plus -->

    <!-- BEGIN switch_vote_minus -->
    <div class="vote-bar-minus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
    <!-- END switch_vote_minus -->
    </div>
    <!-- END switch_bar -->

    <!-- BEGIN switch_no_bar -->
    <div title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-no-bar">----</div>
    <!-- END switch_no_bar -->

    <!-- BEGIN switch_vote -->
    <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}">-</a></div>
    <!-- END switch_vote -->
    </div>
    <!-- END switch_vote_active -->

    <div class="postbody">
    <div>{postrow.displayed.MESSAGE}</div>

    <!-- BEGIN switch_attachments -->
    <dl class="attachbox">
    <dt>{postrow.displayed.switch_attachments.L_ATTACHMENTS}</dt>
    <dd>
    <!-- BEGIN switch_post_attachments -->
    <dl class="file">
    <dt>
    <img src="{postrow.displayed.switch_attachments.switch_post_attachments.U_IMG}" alt="" />

    <!-- BEGIN switch_dl_att -->
    <a class="postlink" href="{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}">{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a> {postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL}
    <!-- END switch_dl_att -->

    <!-- BEGIN switch_no_dl_att -->
    {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT} {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL}
    <!-- END switch_no_dl_att -->
    </dt>

    <!-- BEGIN switch_no_comment -->
    <dd>
    <em>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}</em>
    </dd>
    <!-- END switch_no_comment -->

    <!-- BEGIN switch_no_dl_att -->
    <dd>
    <em><strong>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></em>
    </dd>
    <!-- END switch_no_dl_att -->

    <dd>({postrow.displayed.switch_attachments.switch_post_attachments.FILE_SIZE}) {postrow.displayed.switch_attachments.switch_post_attachments.NB_DL}</dd>
    </dl>
    <!-- END switch_post_attachments -->
    </dd>
    </dl>
    <!-- END switch_attachments -->

    <div class="clear"></div>
    <!-- BEGIN switch_signature -->
    <div class="signature_div">
    {postrow.displayed.SIGNATURE}
    </div>
    <!-- END switch_signature -->

    </div>
    <span class="gensmall"></span>
    </td>
    </tr>
    </table>
    </td>
    </tr>
    <tr class="post--{postrow.displayed.U_POST_ID}" style="{postrow.displayed.DISPLAYABLE_STATE}">
    <td class="{postrow.displayed.ROW_CLASS} browse-arrows"{postrow.displayed.THANK_BGCOLOR} align="center" valign="middle" width="150">
    <a href="#top">{L_BACK_TO_TOP}</a> <a href="#bottom">{L_GOTO_DOWN}</a>
    </td>
    <td class="{postrow.displayed.ROW_CLASS} messaging gensmall"{postrow.displayed.THANK_BGCOLOR} width="100%" height="28">
    <table border="0" cellspacing="0" cellpadding="0">
    <tr>
    <!--<td valign="middle">
    {postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}--><!-- BEGIN contact_field --> <!--{postrow.displayed.contact_field.CONTENT}--><!-- END contact_field --> <!--{postrow.displayed.ONLINE_IMG}
    </td>-->
    </tr>
    </table>
    </td>
    </tr>
    <!-- BEGIN first_post_br -->
    </table>
    <hr />
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
    <tr>
    <th class="thLeft" nowrap="nowrap" width="150px" height="26">{L_AUTHOR}</th>
    <th class="thRight" nowrap="nowrap" colspan="2">{L_MESSAGE}</th>
    </tr>
    <!-- END first_post_br -->
    <!-- END displayed -->
    <!-- END postrow -->
    <!-- BEGIN no_post -->
    <tr align="center">
    <td class="row1" colspan="3" height="28">
    <span class="genmed">{no_post.L_NO_POST}</span>
    </td>
    </tr>
    <!-- END no_post -->
    <tr align="right">
   
    </tr>
      </table>
    <table style ="margin: 0 auto; border-top: 0px;" class="forumline noprint" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin: 0 0 1px 0; border-top: 0px;">
    <tr>
    <td class="row2" valign="top" {COLSPAN_PAGINATION} width="150"><span class="gensmall">{PAGE_NUMBER}</span></td>
    <!-- BEGIN topicpagination -->
    <td class="row1" align="right" valign="top" ><span class="gensmall">{PAGINATION}</span></td>
    <!-- END topicpagination -->
    </tr>
    <!-- BEGIN switch_user_logged_in -->
    <!-- BEGIN watchtopic -->
    <tr>
    <td class="row2" colspan="2" align="right" valign="top"><span class="gensmall">{S_WATCH_TOPIC}</span></td>
    </tr>
    <!-- END watchtopic -->
    <!-- END switch_user_logged_in -->
    </table>

    <!-- BEGIN promot_trafic -->
    <table class="forumline" width="100%" border="0" cellpadding="1" cellspacing="0" id="ptrafic_close" style="display:none;margin: 1px 0px 1px 0px">
    <tr>
    <td class="catBottom" height="28">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td valign="top"><h1 class="cattitle"> {PROMOT_TRAFIC_TITLE}</h1></td>
    <td align="right" valign="middle" width="10"><span class="gensmall"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><img src="{TABS_MORE_IMG}" alt="+" align="middle" border="0" /></a></span></td>
    </tr>
    </table>
    </td>
    </tr>
    </table>
    <table class="forumline" width="100%" border="0" cellpadding="1" cellspacing="0" id="ptrafic_open" style="display:'';margin: 1px 0px 1px 0px">
    <tr>
    <td class="catBottom" height="28">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td valign="top"><h1 class="cattitle"> {PROMOT_TRAFIC_TITLE}</h1></td>
    <td align="right" valign="middle" width="10"><span class="gensmall"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><img src="{TABS_LESS_IMG}" alt="-" align="middle" border="0" /></a></span></td>
    </tr>
    </table>
    </td>
    </tr>
    <tr>
    <td class="row2 postbody" valign="top">
    <!-- BEGIN link -->
    » <a style="text-decoration:none" href="{promot_trafic.link.U_HREF}" target="_blank" title="{promot_trafic.link.TITLE}">{promot_trafic.link.TITLE}</a><br />
    <!-- END link -->
    </td>
    </tr>
    </table>
    <!-- END promot_trafic -->
    <!-- BEGIN switch_forum_rules -->
    <table id="forum_rules" class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0" style="margin: 1px 0px 1px 0px">
    <tbody>
    <tr>
    <td class="catBottom">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tbody>
    <tr>
    <td valign="top">
    <h1 class="cattitle"> {L_FORUM_RULES}</h1>
    </td>
    </tr>
    </tbody>
    </table>
    </td>
    </tr>
    <tr>
    <td class="row1 clearfix">
    <table>
    <tr>
    <!-- BEGIN switch_forum_rule_image -->
    <td class="logo">
    <img src="{RULE_IMG_URL}" alt="" />
    </td>
    <!-- END switch_forum_rule_image -->
    <td class="rules postbody">
    {RULE_MSG}
    </td>
    </tr>
    </table>
    </td>
    </tr>
    </tbody>
    </table>
    <!-- END switch_forum_rules -->

    <table class="forumline noprint" width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td class="row2" colspan="2" align="center" style="padding:0px">
    <!-- BEGIN switch_user_logged_in -->
    <a name="quickreply"></a>
    {QUICK_REPLY_FORM}<br />
    <!-- END switch_user_logged_in -->
    </td>
    </tr>
    <tr>
    <td style="margin:0; padding: 0;" colspan="2">
    <table border="0" cellpadding="0" width="100%" cellspacing="0" id="info_open" style="display:''">
    <tbody>
    <!-- BEGIN show_permissions -->
    <tr>
    <td class="row2" valign="top" width="25%"><span class="gensmall">{L_TABS_PERMISSIONS}</span></td>
    <td class="row1" valign="top" width="75%"><span class="gensmall">{S_AUTH_LIST}</span></td>
    </tr>
    <!-- END show_permissions -->
    <tr>
    <td class="catBottom" style="background:#f1f1f2;text-align:center;" colspan="2" height="28">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td valign="middle" width="100%"><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC_SECOND}</span></td>
    <!-- BEGIN show_permissions -->
    <td align="right" valign="middle"><span class="gensmall"><a href="javascript:ShowHideLayer('info_open','info_close');"><img src="{TABS_LESS_IMG}" alt="-" align="middle" border="0" /></a></span></td>
    <!-- END show_permissions -->
    </tr>
    </table>
    </td>
    </tr>
    </tbody>
    </table>
    </td>
    </tr>
    <tr>
    <td style="margin:0; padding: 0;" colspan="2">
    <table border="0" cellpadding="0" cellspacing="0" width="100%" id="info_close" style="display:none;">
    <tbody>
    <tr>
    <td class="catBottom" colspan="2" height="28">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td valign="middle" width="100%"><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC_SECOND}</span></td>
    <td align="right" valign="middle"><span class="gensmall"><a href="javascript:ShowHideLayer('info_open','info_close');"><img src="{TABS_MORE_IMG}" alt="+" align="middle" border="0" /></a></span></td>
    </tr>
    </table>
    </td>
    </tr>
    </tbody>
    </table>
    </td>
    </tr>
    </table>
      <div class="bassecate"></div>
     
    <form action="{S_JUMPBOX_ACTION}" method="get" name="jumpbox" onsubmit="if(document.jumpbox.f.value == -1){return false;}">
    <div class="basecate"></div><table class="noprint" width="100%" border="0" cellspacing="2" cellpadding="0" align="center">
    <tr>
    <td align="left" valign="middle" nowrap="nowrap" {WIDTH_GALLERY}>
   
    <!-- BEGIN switch_user_authpost -->
    <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" id="{POST_IMG_ID}Newtopic" alt="{L_POST_NEW_TOPIC}" align="middle" border="0" /></a> 
    <!-- END switch_user_authpost -->
    <!-- BEGIN switch_user_authreply -->
    <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /></a>
    <!-- END switch_user_authreply -->
    </td>

    <!-- BEGIN viewtopic_bottom -->
    <td align="right" nowrap="nowrap"><span class="gensmall">{L_JUMP_TO}: {S_JUMPBOX_SELECT} <input class="liteoption" type="submit" value="{L_GO}" /></span></td>
    <!-- END viewtopic_bottom -->

    <!-- BEGIN moderation_panel -->
    <td align="center">
    <span class="gensmall">{moderation_panel.U_YOUR_PERSONAL_MODERATE}</span>
    </td>
    <td align="center" width="250">
    <span class="gensmall"> </span>
    </td>
    <!-- END moderation_panel -->
    </tr>
    </table>
    </form>

    <!-- BEGIN viewtopic_bottom -->
    <table class="noprint" width="100%" border="0" cellspacing="2" cellpadding="0" align="center">
    <tr>
    <td colspan="2" align="left" valign="top" nowrap="nowrap"><br />{S_TOPIC_ADMIN}<br />
    <form name="action" method="get" action="{S_FORM_MOD_ACTION}">
    <input type="hidden" name="t" value="{TOPIC_ID}" />

    <!-- <input type="hidden" name="sid" value="{S_SID}" /> -->
    <input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" />

    <span class="gen">{L_MOD_TOOLS}<br />{S_SELECT_MOD}&nbsp;<input class="liteoption" type="submit" value="{L_GO}" /></span>
    </form>
    </td>
    </tr>
    </table>
    <!-- END viewtopic_bottom -->

    <!-- BEGIN switch_image_resize -->
    <script type="text/javascript">
    //<![CDATA[
    $(resize_images({ 'selector' : '.postbody', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} }));
    //]]>
    </script>
    <!-- END switch_image_resize -->
    <script src="{JS_DIR}addthis/addthis_widget.js" type="text/javascript"></script>
    <script type="text/javascript" src="http://sd-2.archive-host.com/membres/up/184686991814117660/jquerymCustomScrollbarconcatmin.js"></script>
    <script>
    (function($) {
     
        $(document).ready(function(){
      $(".profilInfos").mCustomScrollbar({
      theme: 'minimal-dark',
      advanced:{ updateOnContentResize: true },
      scrollButtons:{ enable: true }
      });
          });
    })(jQuery);
    </script>

/* ==================== PROFILES ====================== */
.profil_perso {
    background: url(https://i.imgur.com/K6jUfwP.png) no-repeat;
    background-size: cover;
    box-shadow: 0 0 1px #ededed, inset 0 0 20px #ededed;
    max-width: 230px;
    padding: 5px 2px;
    position: relative;
}

.profil_avatar img {
    -moz-transition: all .25s ease-in-out;
    -webkit-transition: all .25s ease-in-out;
    box-sizing: content-box;
    display: block;
    height: 320px;
    margin: 0 auto;
    opacity: 1;
    transition: all .25s ease-in-out;
  z-index: 999;
  position:relative;
}


.profil_avatar img:hover {
    opacity: 1;
    transition: all .25s ease-in-out;
    transform: rotate(1deg);
}

.profil_content {
    background: rgba(255,255,255,0.8);
    margin-left: -2px;
    padding: 10px 2px;
    width: 220px;
}


.profil_online {
    width: 100px;
    padding-left: 7px;
}

.profil_pseudo {
    background-color: #f1f1f1;
    font-family: 'Open Sans';
    font-size: 15px;
    letter-spacing: -1px;
    padding: 5px;
    text-align: center;
    text-transform: uppercase;
    width: 200px;
    height: 30px;
    margin: 1px auto 5px;
}

.profil_ava_rank {
    position: relative;
    /* height: 70px;
    width: 230px; */
}

.profil_rank_img img {
    display: block;
    left: -20px;
    margin: 10px auto 0;
    position: absolute;
    top: 150px;
    transition: all .5s ease-in-out;
    z-index: 2;
}

.profil_rank_img img:hover {
    display: block;
    left: -85px;
    transition: all .5s ease-in-out;
}

.profil_rank {
  text-align: center;
  font: 600 10px/10px oswald;
  text-transform: uppercase;
    font-size: 9px;
    font-style: normal;
    font-variant: normal;
    line-height: 10px;
    text-align: center;
    border-bottom: 1px solid rgba(59,106,104,0.3);
    border-top: 1px solid rgba(59,106,104,0.3);
    letter-spacing: 1px;
    margin-bottom: 5px;
}

.profil_links {
    margin: 10px auto 5px;
    text-align: center;
    width: 190px;
}

.profil_content .onglets { display: flex; justify-content: space-around; }

.profil_content .onglets .onglet.active {
    color: #ee858a;
    font-family: 'Open Sans', 'Shadows Into Light Two',cursive;
    font-size: 12px;
    font-weight: 700;
    padding-top: 5px;
    text-shadow: 1px 1px 0 #fff;
    text-transform: uppercase;
    transform: rotate(-5deg);
}

.profil_content .onglets .onglet {
    font-family: Lato, 'Shadows Into Light Two',cursive;
    font-size: 12px;
    font-weight: 700;
    padding-top: 5px;
    text-shadow: 1px 1px 0 #fff;
    text-transform: uppercase;
}

.profil_content .contenus { position: relative; }
.profil_content .content { max-width: 220px; text-align: justify; padding: 5px; max-height: 350px; transition: all .5s ease-in-out; }
.profil_content .content:last-child { display: none; }
.profil_champs > span { white-space:normal!important; font-size:0px; }
.profil_champs > span > span { font-size:9px; line-height: 10px; }
.profil_champs  img { max-width: 200px; }
/* On transforme la liste et les items de liste en éléments inline */
ul.profile_field_list { display:inline; }
ul.profile_field_list > li {display:inline;}
/* on rajoute une virgule après chaque item */
ul.profile_field_list > li:after {
 content:", ";
}
/* on ne rajoute rien du tout après le dernier item */
ul.profile_field_list > li:last-child:after {
  content:"";
}