<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
   <tr>
      <td valign="bottom">
         <!-- BEGIN switch_user_logged_in -->
         <span class="gensmall">{LAST_VISIT_DATE}<br />
         {CURRENT_TIME}<br />
         </span>
         <!-- END switch_user_logged_in -->
         <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
      </td>
      <td class="gensmall" align="right" valign="bottom">
         <!-- BEGIN switch_user_logged_in -->
         <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
         <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
         <!-- END switch_user_logged_in -->
         <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
      </td>
   </tr>
</table>
<!-- BEGIN catrow --><!-- BEGIN tablehead --><div class="une_cate"><div class="secondarytitle"> {catrow.tablehead.L_FORUM} </div>
   <!-- END tablehead -->
   <!-- BEGIN cathead -->
<table>
   <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
      <!-- END inc -->
      <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
         <h{catrow.cathead.LEVEL} class="hierarchy">
            <span class="cattitle">
               <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
            </span>
         </h{catrow.cathead.LEVEL}>
      </td>
      <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right">&nbsp;</td>
   </tr>
</table>
   <!-- END cathead -->
   <!-- BEGIN forumrow -->
<link href='http://fonts.googleapis.com/css?family=Seaweed+Script' rel='stylesheet' type='text/css'>
  <link href='http://fonts.googleapis.com/css?family=Lateef' rel='stylesheet' type='text/css'>
            <div class="un_sous_forum">
              <div class="fond_principal_ss_forum" style="background-image: url('{catrow.forumrow.FORUM_FOLDER_IMG}');">
                <div class="titre_forum">
                  <h{catrow.forumrow.LEVEL} class="hierarchy">
                    <span class="forumlink">
                      <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br />
                    </span>
                  </h{catrow.forumrow.LEVEL}>
                </div>
                <div class="sujets_et_mess">{catrow.forumrow.POSTS} Messages | {catrow.forumrow.TOPICS} Sujets</div>
                <div class="image_descript">
                  <span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
                </div>
                <div class="dernier_mess">
                <span id="last" class="gensmall">{catrow.forumrow.LAST_POST}</span>
                <script type="text/javascript">jQuery('#last').html(jQuery('#last').html().replace(/<br>/g,'<span style="display: inline-block; padding: 0 2px;">-</span>')).removeAttr('id');</script>
              </div>
              </div>
              <div class="liens_ss_forums"><span class="hover_effacer">Hover me!</span>
                <div class="les_liens_des_forums">
                  <span class="gensmall">
                    {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
                  </span>
                </div>
              </div>
            </div>
   <!-- END forumrow -->
   <!-- BEGIN catfoot -->
   <!-- END catfoot -->
   <!-- BEGIN tablefoot -->
  </div>
<img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

.une_cate {
  text-align: center;
}

.un_sous_forum a, .un_sous_forum a:link, .un_sous_forum a:active, .un_sous_forum a:visited, .un_sous_forum a:hover { text-decoration: none !important; }

.un_sous_forum {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 245px;
  height: 245px;
  margin: 50px 30px 20px;
}

.fond_principal_ss_forum {
  position: relative;
  z-index: 2;
  width: 245px;
  height: 245px;
  background-size: 245px 245px;
  overflow: hidden;
}

.titre_forum {
  font-family: 'Seaweed Script';
}

.titre_forum a.forumlink {
  font-size: 25px;
  color: #6c1514;
  text-shadow: 1px 1px 0 #f9d2e7, -1px -1px 0 #f9d2e7;
  transition: all ease 0.5s;
}

.titre_forum a.forumlink:hover {
  font-size: 25px;
  color: #475e2c;
  text-shadow: 1px 1px 0 #95c566, -1px -1px 0 #95c566;
  transition: all ease 0.5s;
}

.liens_ss_forums {
  position: absolute;
  z-index: 1;
  top:-35px;
  left: -35px;
  width: 50px;
  height: 50px;
  padding: 10px;
  overflow: hidden;
  border-radius: 50%;
  background-color: #A61F3A;
  transition: all ease 0.5s;
}

.liens_ss_forums:hover {
  width: 100px;
  height: 100px;
  top: -75px;
  left:-75px;
  overflow: hidden;
  transition: all ease 0.5s;
}

.hover_effacer {
  color: white;
  font-family: 'Seaweed Script';
  font-size: 13px;
}

.liens_ss_forums .les_liens_des_forums, .liens_ss_forums:hover .hover_effacer {
  display: none;
  width: 90%;
  overflow: auto;
  height: 90px;
  margin: auto;
}

.liens_ss_forums:hover .les_liens_des_forums, .liens_ss_forums .hover_effacer  {
  display: block;
}

.les_liens_des_forums .gensmall {
  font-size: 0;
}

.les_liens_des_forums .gensmall a.gensmall {
  display: block;
  font-size: 16px;
  line-height: 15px;
  color: #f4bccf;
  font-family: 'Lateef';
  letter-spacing: 0px;
  transition: all ease 0.5s;
}

.les_liens_des_forums .gensmall a.gensmall:hover {
  letter-spacing: 2px;
  transition: all ease 0.5s;
}

.les_liens_des_forums img{
  float: left;
}

.sujets_et_mess {
  position: absolute;
  left: 0;   
  right: 0;
  top: 90px;
  width: auto;
  text-align: center;
  font-family: 'Lateef';
  color: #f9d2e7;
  text-shadow: 1px 1px 0 #437b0c;
}

.image_descript {
  position: absolute;
  bottom: 22px;
  left: 22px;
  height: 110px;
  width: 200px;
  text-align: justify;
}

.image_descript p {
  height: 90px;
  width: auto;
  padding: 10px;
  margin: 0px;
  overflow: auto;
  font-size: 16px;
  line-height: 12px;
  font-family: 'Lateef';
  color: white;
  text-shadow: 0px 0px 1px black;
}

.dernier_mess {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 23px;
  line-height: 20px;
  overflow: auto;
}

.dernier_mess .gensmall {
  font-size: 0px;
}

.dernier_mess .gensmall a {
  font-size: 16px;
  font-family: 'Lateef';
  color: #f4bccf;
  letter-spacing: 0px;
  transition: all ease 0.5s;
}

.dernier_mess .gensmall a:hover {
  letter-spacing: 2px;
  transition: all ease 0.5s;
}


.dernier_mess  .gensmall a strong {
  font-size: 16px;
  font-family: 'Seaweed Script';
}