Code:

/*******CATEGORIES********/
.forabg .header {background: var(--gradient2);}
.cate_h h2 {
  text-align:center;
  color:var(--fontcolor);
  font-family: var(--texte2);
  text-transform:uppercase;
  font-size:calc(var(--titleCat) * 1px);;
}
.cate_h {
 padding-top:20px;
  padding-bottom:20px;
}
#general_cat {
  width:100%;
  display:inline-block;
}
#general_cat bloc1 {
  display:inline-block;
  vertical-align:top;
  width:500px;
}
.degrade {
  background-image: var(--gradient2);
    height: 10px;
    margin-left: 5px;
    margin-top: 12px;
    width: 100%;
}
#general_cat bloc1 titre {
  background:var(--invertedFond);
  color:var(--invertedFontColor);
  text-transform:uppercase;
  font-family:var(--texte1);
  font-size:calc(var(--titleForum) * 1px);
  position:relative;
  top:-10px;
  padding-right:3px;
}
#general_cat bloc1 titre a {color:var(--invertedFontColor);}
#general_cat bloc1 desc {
  display:block;
  height:50px;
  width:500px;
  padding:3px;
  border:2px solid var(--invertedFontColor);
  margin:5px;
  text-align:justify;
  font-size:calc(var(--sizeTxt1) * 1px);
  line-height:12px;
  overflow:auto;
  color:var(--invertedFontColor);
}
#general_cat bloc1 sfo {
  display:block;
  height:20px;
  width:500px;
  padding:3px;
  background:var(--fond);
  text-align:left;
  margin:5px;
  line-height:12px;
}
#general_cat bloc1 sfo a {
  color:var(--fontcolor);
  font-family: var(--texte2);
  text-transform:uppercase;
  font-size:8px;
}
#general_cat avatar {
  display:inline-block;
  height:100px;
  width:63px;
  margin:3px;
  overflow:hidden;
  margin-left:10px;
  background-image: var(--gradient2);
}
#general_cat avatar img {
  height:100px;
  width:63px;
}
#general_cat fin {
  display:inline-block;
  vertical-align:top;
}
#general_cat fin stat {
  width:200px;
  display:block;
  overflow:hidden;
  background: var(--gradient2);
  color:var(--fontcolor);
  font-family: var(--texte2);
  text-transform:uppercase;
  font-size:calc(var(--sizeTxt2) * 1px);
  text-align:center;
  margin:5px;
}
#general_cat fin last {
  width:200px;
  height:62px;
  display:block;
  color:var(--fontcolor);
  background:var(--fond);
  text-align:center;
  margin:5px;
  line-height:20px;
}
#general_cat fin last a {
  font-family:var(--texte2);
  font-size:calc(var(--sizeTxt2) * 1px);
  text-transform:uppercase;
}

Code:

<center><ul class="linklist top">
   <!-- BEGIN switch_user_logged_in -->
   <a href="{U_SEARCH_NEW}"><i class="ion-ios-flame"></i>{L_SEARCH_NEW}</a> |
   <a href="{U_SEARCH_SELF}"><i class="ion-ios-box-outline"></i>{L_SEARCH_SELF}</a> |
   <!-- END switch_user_logged_in -->
      <a href="{U_SEARCH_UNANSWERED}"><i class="ion-ios-chatbubble-outline"></i>{L_SEARCH_UNANSWERED}</a> |
   <!-- BEGIN switch_user_logged_in -->
        <a href="{U_MARK_READ}" accesskey="m"><i class="ion-android-checkmark-circle"></i>{L_MARK_FORUMS_READ}</a>
   <!-- END switch_user_logged_in -->
  </ul></center>

<!-- BEGIN catrow -->
   <!-- BEGIN tablehead -->
      <div class="forabg">
         <ul class="topiclist">
            <li class="header">
               <dl class="icon">
                                          <div class="cate_h">{catrow.tablehead.L_FORUM}</div>
               </dl>
            </li>
         </ul>
         <ul class="topiclist forums">
   <!-- END tablehead -->

   <!-- BEGIN forumrow -->
                          <div id="general_cat">
                            <bloc1><div class="degrade"><titre><a href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></titre></div>
                            <desc>{catrow.forumrow.FORUM_DESC}</desc>
                              <sfo>{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</sfo></bloc1>
                            <avatar><!-- BEGIN avatar -->
                            {catrow.forumrow.avatar.LAST_POST_AVATAR}
                            <!-- END avatar --></avatar>
                            <fin><stat>{catrow.forumrow.TOPICS} sujets // {catrow.forumrow.POSTS} messages</stat>
                              <last><!-- BEGIN switch_topic_title -->
                     <a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br />
                     <!-- END switch_topic_title -->
                     {catrow.forumrow.USER_LAST_POST}</last>
                            <img src="{catrow.forumrow.FORUM_FOLDER_IMG}"/></fin>
                          </div>
   <!-- END forumrow -->

   <!-- BEGIN tablefoot -->
            </ul>
      </div>
   <!-- END tablefoot -->
<!-- END catrow -->

<!-- BEGIN switch_on_index -->
<center><ul class="linklist top">
      <a href="{U_TODAY_ACTIVE}">{L_TODAY_ACTIVE}</a> |
      <a href="{U_TODAY_POSTERS}">{L_TODAY_POSTERS}</a> |
      <a href="{U_OVERALL_POSTERS}">{L_OVERALL_POSTERS}</a> |
   <!-- BEGIN switch_delete_cookies -->
         <a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}" rel="nofollow"><i class="ion-trash-a"></i>{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
   <!-- END switch_delete_cookies -->
  </ul></center>
<!-- END switch_on_index -->

<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
   var btn_collapse = $('<div></div>', {
      class: 'btn-collapse'
   });

   var btn_collapse_show = $('<i></i>', {
      class: 'ion-android-add-circle hidden',
      'data-tooltip': '{L_EXPEND_CAT}'
   }).appendTo(btn_collapse);

   var btn_collapse_hide = $('<i></i>', {
      class: 'ion-android-remove-circle',
      'data-tooltip': '{L_HIDE_CAT}'
   }).appendTo(btn_collapse);

   var collapsed = [];

   if (readCookie('collapsed') != null && readCookie('collapsed') != '') {
      collapsed = readCookie('collapsed').split(',');
   }

   $(document).on('click', '.btn-collapse', function() {
      $(this).children('.ion-android-add-circle').toggleClass('hidden');
      $(this).children('.ion-android-remove-circle').toggleClass('hidden');
      $(this).parents('.forabg').toggleClass('hidden');

      if (readCookie('collapsed') != null && readCookie('collapsed') != '') {
         collapsed = readCookie('collapsed').split(',');
      }

      if (!$(this).parents('.forabg').hasClass('hidden')) {
         removeFromArray('' + $(this).parents('.forabg').data('cindex'), collapsed);

         createCookie('collapsed', collapsed);
      } else {
         collapsed.push('' + $(this).parents('.forabg').data('cindex'));

         createCookie('collapsed', collapsed);
      }
   });

   $('.forabg').each(function(i) {
      $(this).data('cindex', '' + i);

      $(btn_collapse)
         .clone()
         .attr('id', 'forabg' + i)
         .appendTo($(this).find('.header'));

      if ($.inArray('' + i, collapsed) > -1) {
         $(this).toggleClass('hidden');
         $('#forabg' + i).children('.ion-android-add-circle').toggleClass('hidden');
         $('#forabg' + i).children('.ion-android-remove-circle').toggleClass('hidden');
      }
   });
});

function removeFromArray(item, array) {
   var i = array.indexOf(item);

   if (i > -1) {
      array = array.splice(i, 1);
   }
}

function createCookie(name, value, days) {
   var expires;

   if (days) {
      var date = new Date();
      date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
      expires = "; expires=" + date.toGMTString();
   } else {
      expires = "";
   }
   document.cookie = encodeURIComponent(name) + "=" + encodeURIComponent(value) + expires + "; path=/";
}

function readCookie(name) {
   var nameEQ = encodeURIComponent(name) + "=";
   var ca = document.cookie.split(';');
   for (var i = 0; i < ca.length; i++) {
      var c = ca[i];
      while (c.charAt(0) === ' ') c = c.substring(1, c.length);
      if (c.indexOf(nameEQ) === 0) return decodeURIComponent(c.substring(nameEQ.length, c.length));
   }
   return null;
}
//]]>
</script>


Code:

<!-- BEGIN disable_viewonline -->
<div id="QEEL">
  <un><mm><div class="qeel_msg">{TOTAL_POSTS} <script type="text/javascript">$('.qeel_msg').html($('.qeel_msg').html().replace(/Nos membres ont posté un total de /,"").replace(/messages/,"Messages"));</script></div></mm>
    <mem><div class="qeel_user">{TOTAL_USERS} <script type="text/javascript">$('.qeel_user').html($('.qeel_user').html().replace(/Nous avons /,"").replace(/membres enregistrés/,"Habitants"));</script></div></mem>
    <va><img src="https://zupimages.net/up/20/26/tuj3.gif" class="ava_user"/></va>
    <last><span id="nUSER">{NEWEST_USER}</span><script type="text/javascript">document.getElementById('nUSER').innerHTML=document.getElementById('nUSER').innerHTML.replace(/L'utilisateur enregistré le plus récent est /,"Bienvenue à<br/> ")</script></last></un>
  <deux><div class="grp">{GROUP_LEGEND} <script type="text/javascript">$('.grp').each(function(index,element){
    var txt = $(this).html().replace(/\[/g,"<div>").replace(/\]/g,"</div>");
          $(this).html(txt);});</script></div>
    <co><div class="coD">{LOGGED_IN_USER_LIST}</div></co>
    <der>{L_CONNECTED_MEMBERS}</der>
    <il><img src="https://68.media.tumblr.com/cc3eb594da03d2f5af81000fcea940e3/tumblr_okaftrbXDL1toe0eco1_500.gif"/></il>
  <trois>{TOTAL_USERS_ONLINE}</trois>
    <top><a href="http://en.root-top.com/toplist/titop/in.php?ID=3035" target="_blank"><img src="https://zupimages.net/up/20/26/ioqe.png"/></a><a href="http://www.root-top.com/topsite/pubrpgdesign/in.php?ID=2488" target="_blank"><img src="https://zupimages.net/up/20/26/m2r9.png"/></a><br/>
      <a href="http://www.root-top.com/topsite/obsession27/in.php?ID=26199" target="_blank"><img src="https://zupimages.net/up/20/26/49qk.png"/></a><a href="http://www.root-top.com/topsite/bazzart/in.php?ID=2482" target="_blank"><img src="https://zupimages.net/up/20/26/5xms.png"/></a></top>
    <cred><hh>Charney</hh> est un forum city gang / pouvoirs / mutants tirant ses inspirations d'oeuvres telles que GTA (jeux vidéos), X-Men, My Hero Academia, entre autres. Nous déconseillons le forum aux moins de 16 ans, à cause des éventuels sujets sensibles qui peuvent être abordés sur le forum (sexe, drogue, alcool, violence ...). Le forum a été créer par <hh>Ka' et Dune</hh>, a qui nous devons aussi la presque intégralité du codage et du design. Nous devons l'apparence et l'inspiration de nos sujets à <hh>Lena</hh> que nous avons découvert sur <a href="https://codepen.io/LenaDelys/pen/gOPOrLz" target="_blank">son CodePen</a>. La gif de la fiche de pub vient du DeviantArt de <a href="https://www.deviantart.com/king-lulu-deer/art/Night-Cruising-743567923">King-Lulu-Deer</a>. Nous devons les icônes des topsites à <a href="https://www.flaticon.com/authors/freepik">Freepik</a> de <a href="https://www.flaticon.com/">Flaticon</a>. L'intégralité du forum appartient à ses créatrices, les écrits qui s'y trouvent appartiennent à nos membres, merci de ne rien reprendre sans autorisation.</cred>
  <met><div id="cont_b00e12bb5e8e090cc5ff69babe033786"><script type="text/javascript" async src="https://www.tameteo.com/wid_loader/b00e12bb5e8e090cc5ff69babe033786"></script></div></met>
    </deux>
</div>
<!-- END disable_viewonline -->

Code:

/*********QEEL************/
#QEEL {
  display:inline-block;
  width:788px;
  background:var(--invertedFond);
}
@keyframes gradient {0% {background-position: 0% 50%;} 50% {background-position: 100% 50%;} 100% {background-position: 0% 50%;}}

#QEEL un {
  display:inline-block;
  vertical-align:top;
  width:200px;
  height:305px;
  padding:10px;
  background: var(--gradientRedToBlackToRedToBlack);
  background-size: 400% 400%;
  animation: gradient 15s ease infinite;
}

#QEEL un mm {
  width:180px;
  height:15px;
  display:block;
  overflow:hidden;
  text-align:center;
  font-family: var(--texte2);
  text-transform:uppercase;
  font-size:calc(var(--sizeTxt2) * 1px);
  background:var(--fond);
  margin:3px;
  color:var(--fontcolor);
}
#QEEL un mem {
  width:180px;
  height:15px;
  display:block;
  overflow:hidden;
  text-align:center;
  font-family: var(--texte2);
  text-transform:uppercase;
  font-size:calc(var(--sizeTxt2) * 1px);
  background:var(--fond);
  margin:3px;
  color:var(--fontcolor);
}
#QEEL un last {
  width:180px;
  height:40px;
  display:block;
  overflow:hidden;
  text-align:center;
  font-family: var(--texte2);
  text-transform:uppercase;
  font-size:calc(var(--sizeTxt3) * 1px);
  background:var(--fond);
  margin:3px;
  color:var(--fontcolor);
}
#QEEL un va {
  width:180px;
  height:200px;
  display:block;
  overflow:hidden;
  margin:3px;
}

#QEEL un va img{width:100%;height:auto;}

#QEEL deux {
  display:inline-block;
  vertical-align:top;
  height:300px;
  width:588px;
}
#QEEL deux groupes {
  display:inline-block;
  vertical-align:top;
  width:588px;
}
#QEEL .grp>div {
  display:inline-block;
  vertical-align:top;
  width:147px;
  height:40px;
  font-family: var(--texte2);
  text-transform:uppercase;
  font-size:calc(var(--titleFiche) * 1px);
  color:var(--fontcolor) !important;
  text-align:center;
  font-weight:normal;
  line-height:35px;
}
#QEEL deux co {
  display:inline-block;
  width:200px;
  height:140px;
  background:var(--fond);
  color:var(--fontcolor);
  text-align:justify;
  margin:3px;
  overflow:auto;
  line-height:12px;
  padding:5px;
  font-family: var(--texte2);
  text-transform:uppercase;
  font-size:calc(var(--sizeTxt2) * 1px);
}
#QEEL deux der {
  display:inline-block;
  width:200px;
  height:140px;
  background:var(--fond);
  color:var(--fontcolor);
  text-align:justify;
  padding:5px;
  margin:3px;
  overflow:auto;
  line-height:12px;
  font-family: var(--texte2);
  text-transform:uppercase;
  font-size:calc(var(--sizeTxt2) * 1px);
}
#QEEL deux il {
  display:inline-block;
  vertical-align:top;
  width:170px;
  overflow:hidden;
  margin:3px;
}
#QEEL deux il img {
  width:170px;
}
#QEEL trois {
  display:block;
  width:406px;
  height:28px;
  background: var(--gradientRedToBlackToRedToBlack);
  margin:3px;
  margin-top:-30px;
  color:var(--fontcolor) !important;font-size:9px;font-family: var(--texte2);
  text-transform:uppercase;
  line-height:28px;
  text-align:center;
}
#QEEL cred {
  display:inline-block;
  width:222px;
  height:80px;
  overflow:auto;
  margin:3px;
  text-align:justify;
  line-height:12px;
  font-size:calc(var(--sizeTxt1) * 1px);
}
#QEEL top {
  display:inline-block;
  width:80px;
  height:80px;
  margin:3px;
}
#QEEL top img {
  width:40px;
}
#QEEL met {
  display:inline-block;
  vertical-align:top;
  overflow:hidden;
}

Code:

$(function(){
  $("#QEEL .grp>div").each(function(i, elm){
    if(i==0){$(this).remove();}
    var color = $(this).find('a').css( "color" );
    $(this).css( "background-color", color );
    $(this).find('a').css( "color", "#ffffff" );
  });
 
});

test

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean scelerisque metus non magna placerat, et ornare diam accumsan. Vivamus tincidunt quis magna vel tempor. Fusce tempus libero consequat metus semper mollis. Aliquam vulputate nibh vitae maximus sodales. In arcu neque, euismod ac metus eu, venenatis interdum magna. Maecenas rhoncus libero et velit mollis, sed finibus ipsum pharetra. Nullam vel ante ut purus dignissim accumsan congue vitae sem. Praesent sagittis quam vitae mi condimentum, at malesuada enim mattis. Nulla facilisi. Vestibulum vestibulum nec orci ut dictum. Nam aliquam augue ac viverra venenatis. Pellentesque sit amet tellus mi. Fusce a elit vehicula nisl faucibus consequat vitae nec ex. Nam auctor ipsum eu turpis pulvinar, in mattis eros eleifend. Etiam scelerisque malesuada massa sit amet aliquam.

Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin convallis, massa a aliquet sollicitudin, turpis lorem posuere erat, sed faucibus mauris leo vel nisl. Sed mi tortor, interdum at ipsum venenatis, dignissim dapibus dolor. Integer id placerat ipsum. Integer a congue enim. Fusce scelerisque leo sed accumsan condimentum. Vestibulum gravida molestie quam, eu tincidunt risus cursus id. Duis ullamcorper a magna vel ultrices. Maecenas eu quam a arcu facilisis aliquet et eget nisl. Cras tincidunt lorem at lacus cursus dapibus vel non est. Ut velit est, scelerisque a consectetur vitae, congue porta mauris. Donec pharetra neque et massa tincidunt consequat. Morbi diam velit, faucibus ac viverra a, blandit nec eros. Sed laoreet ipsum velit, tempus fringilla tellus egestas et. Vivamus massa massa, congue sit amet maximus sed, auctor eget sem.

Sed ac nisi vitae ipsum pharetra tristique non nec sem. Vestibulum suscipit in massa nec pellentesque. Etiam eleifend laoreet dui sed tempor. Maecenas placerat hendrerit ligula, ut dapibus elit vestibulum ultricies. Integer lobortis tellus quis rhoncus venenatis. Nulla imperdiet aliquet massa vitae suscipit. Sed vulputate varius neque, non facilisis sapien eleifend id. Fusce vehicula lacinia mauris, at aliquet dui imperdiet a. Nullam urna urna, molestie id pellentesque ut, suscipit ac nisi.

dddd

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean scelerisque metus non magna placerat, et ornare diam accumsan. Vivamus tincidunt quis magna vel tempor. Fusce tempus libero consequat metus semper mollis. Aliquam vulputate nibh vitae maximus sodales. In arcu neque, euismod ac metus eu, venenatis interdum magna. Maecenas rhoncus libero et velit mollis, sed finibus ipsum pharetra. Nullam vel ante ut purus dignissim accumsan congue vitae sem. Praesent sagittis quam vitae mi condimentum, at malesuada enim mattis. Nulla facilisi. Vestibulum vestibulum nec orci ut dictum. Nam aliquam augue ac viverra venenatis. Pellentesque sit amet tellus mi. Fusce a elit vehicula nisl faucibus consequat vitae nec ex. Nam auctor ipsum eu turpis pulvinar, in mattis eros eleifend. Etiam scelerisque malesuada massa sit amet aliquam.

Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin convallis, massa a aliquet sollicitudin, turpis lorem posuere erat, sed faucibus mauris leo vel nisl. Sed mi tortor, interdum at ipsum venenatis, dignissim dapibus dolor. Integer id placerat ipsum. Integer a congue enim. Fusce scelerisque leo sed accumsan condimentum. Vestibulum gravida molestie quam, eu tincidunt risus cursus id. Duis ullamcorper a magna vel ultrices. Maecenas eu quam a arcu facilisis aliquet et eget nisl. Cras tincidunt lorem at lacus cursus dapibus vel non est. Ut velit est, scelerisque a consectetur vitae, congue porta mauris. Donec pharetra neque et massa tincidunt consequat. Morbi diam velit, faucibus ac viverra a, blandit nec eros. Sed laoreet ipsum velit, tempus fringilla tellus egestas et. Vivamus massa massa, congue sit amet maximus sed, auctor eget sem.

Sed ac nisi vitae ipsum pharetra tristique non nec sem. Vestibulum suscipit in massa nec pellentesque. Etiam eleifend laoreet dui sed tempor. Maecenas placerat hendrerit ligula, ut dapibus elit vestibulum ultricies. Integer lobortis tellus quis rhoncus venenatis. Nulla imperdiet aliquet massa vitae suscipit. Sed vulputate varius neque, non facilisis sapien eleifend id. Fusce vehicula lacinia mauris, at aliquet dui imperdiet a. Nullam urna urna, molestie id pellentesque ut, suscipit ac nisi.