Galerie Frary

Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.
Galerie Frary

forum pour les créations de Frary

Le Deal du moment : -29%
PC portable – MEDION 15,6″ FHD Intel i7 ...
Voir le deal
499.99 €

    Codage DFL

    Admin
    Admin
    Admin


    Messages : 310
    Date d'inscription : 18/02/2021

    Codage DFL Empty Codage DFL

    Message par Admin Dim 2 Jan - 13:18

    INDEX BOX : CATEGORIE

    Code:
    <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 --><table class="forumline" width="850px" border="0" cellspacing="1" cellpadding="0">
     <tr><div class="titre-categorie"> {catrow.tablehead.L_FORUM} </div></tr>
     
     <!-- END tablehead -->
     <!-- BEGIN cathead -->
     <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"> </td>
     </tr>
     <!-- END cathead -->
     <!-- BEGIN forumrow -->
          
     
     <tr><td colspan="{catrow.forumrow.INC_SPAN}" valign="top" height="10px">
     
     
              </td>
                      </tr>
    <tr>
      <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="500px" height="50">
                      <table width="450px">
                        <tr>
                          <td valign="top">
                      <img class="catimage" title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
                          </td>
                          <td valign="top">
                            <div class="triangle"></div>
                          </td>
                          <td valign="top" width="388px"><span class="genmed"><div class="catdesc">
     <center>
     
              <div class="catdesc0">{catrow.forumrow.FORUM_DESC}</div></center></div></span>
                          </td>
                          <td align="center" valign="top" height="97">
                      <div style="width:55px"><!-- BEGIN avatar -->
                <span class="lastpost-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</span>
                        <!-- END avatar --></div>
      </td>
      <td align="center" valign="top" height="50">
        <table><tr><center><div class="titrforum">
     <a href="{catrow.forumrow.U_VIEWFORUM}" style="color:#ffffff">{catrow.forumrow.FORUM_NAME}</a><br />
                                      
                                      </div></center></tr>
          <tr><td valign="top">
                      <div class="lienscat"><span class="gensmall">
     <!-- BEGIN switch_moderators_links -->
     {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
     <!-- END switch_moderators_links -->
                        <div class="supvirg">
                          {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}<script type="text/javascript">$('.supvirg').each(function(){$(this).html($(this).html().replace(/,/g,""));});</script>
                        </div>
                        </span></div>
                      
     </td>
     
     <td class="row3 over" align="center" valign="top" height="50">
                <!-- BEGIN ads -->
                <span class="AD_LastPA">
                    <span class="lastpost-avatar"><img src="{catrow.forumrow.ads.IMG}" alt="{catrow.forumrow.ads.TITLE}" /></span>
                    <span class="AD_LastInfos">
                        <b><a href="{catrow.forumrow.ads.LINK}">{catrow.forumrow.ads.TITLE}</a></b><br />
                        {catrow.forumrow.ads.DATE}<br />
                        {catrow.forumrow.ads.LOCATION}
                    </span>
                </span>
                <!-- END ads -->
                

                      <div class="lastp"><span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
     </td>
          </tr></table>
                          </td>
                        </tr>
                       </table>
                      <div class="catsujme"><span class="gensmall">{catrow.forumrow.TOPICS} sujets et {catrow.forumrow.POSTS} posts.</span></div>
      </td>
      
      
     </tr>
     <!-- END forumrow -->
     <!-- BEGIN catfoot -->
     <tr>
     <!-- BEGIN inc -->
     <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
     <!-- END inc -->
     <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
     </tr>
     <!-- END catfoot -->
     <!-- BEGIN tablefoot -->
    </table><img src="https://images2.imgbox.com/73/41/nUOuBvda_o.png" style="width:850px; height: 90px; border-radius: 0px 0px 25px 25px;"><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

    INDEX BODY : PA et QEEL :
    Code:

    {JAVASCRIPT}
    <!-- BEGIN message_admin_index -->
    <table class="forumline" width="850px" 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 -->
      <tr><div class="titre-categorie"><img src="https://images2.imgbox.com/ad/60/xoDqifS6_o.png" /><span class="tcat">bienvenue</span></div></tr>
       <!-- 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><img src="https://images2.imgbox.com/73/41/nUOuBvda_o.png" style="width:850px">
    <!-- END message_admin_index -->

    <!-- BEGIN switch_user_login_form_header -->
    <form action="{S_LOGIN_ACTION}" method="post" name="form_login">
        <table width="850px" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
            <tr>
                <td width="50%" valign="top" align="{switch_user_login_form_header.V_ALIGN}" class="row1">

                    <table>
                        <tr>
                            <td><span class="genmed">{L_USERNAME}:</span> </td>
                            <td><input class="post" type="text" size="10" name="username"/> </td>
                            <td>
                                <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                                <span class="gensmall">{L_AUTO_LOGIN}</span> 
                            </td>
                        </tr>

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

                <!-- BEGIN switch_social_login -->
                <td width="10%" align="center" valign="middle" class="row1">
                    <span class="genmed fb_or">{switch_user_login_form_header.switch_social_login.L_OR}</span>
                </td>
                <td width="40%" class="align_gauche row1">
                    <div class="social_btn">
                        <!-- BEGIN fb_connect -->
                        <div class="fb-login-button"></div>
                        <!-- END fb_connect -->
                        <!-- BEGIN topicit_connect -->
                        <div class="ti-connect"></div>
                        <!-- END topicit_connect -->
                    </div>
                </td>
                <!-- END switch_social_login -->

            </tr>
        </table>
    </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" rel="nofollow">{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" rel="nofollow">{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">
        <table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
            <tr>
                <td width="50%" valign="top" align="right" class="row1">

                    <table>
                        <tr>
                            <td><span class="genmed">{L_USERNAME}:</span> </td>
                            <td><input class="post" type="text" size="10" name="username"/> </td>
                            <td>
                                <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
                                <span class="gensmall">{L_AUTO_LOGIN}</span> 
                            </td>
                        </tr>

                        <tr>
                            <td><span class="genmed">{L_PASSWORD}:</span> </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>

                <!-- BEGIN switch_social_login -->
                <td width="10%" align="center" valign="middle" class="row1">
                    <span class="genmed fb_or">{switch_user_login_form_footer.switch_social_login.L_OR}</span>
                </td>
                <td width="40%" class="align_gauche row1">
                    <div class="social_btn">
                        <!-- BEGIN fb_connect -->
                        <div class="fb-login-button"></div>
                        <!-- END fb_connect -->
                        <!-- BEGIN topicit_connect -->
                        <div class="ti-connect"></div>
                        <!-- END topicit_connect -->
                    </div>
                </td>
                <!-- END switch_social_login -->

            </tr>
        </table>
    </form>
    <!-- END switch_user_login_form_footer -->

    <!-- BEGIN disable_viewonline -->
    <img src="https://images2.imgbox.com/ad/60/xoDqifS6_o.png" style="width:850px; height: 90px; border-radius: 25px 25px 0px 0px;">
    <table class="forumline" width="850px" border="0" cellspacing="1" cellpadding="0">
     
      <tr>
       <td align="center" valign="top">
              <iframe style="border:0px;width:848px;height:140px;" src="https://deadforlove.forumactif.com/h6-groupe-qeel"></iframe>
                <table width="100%">
                  <tr>
                    <td width="30%"><table><tr><td><div class="statss" style="margin-left:4px;"><span id="nb_messages">{TOTAL_POSTS}<script type="text/javascript">document.getElementById('nb_messages').innerHTML=document.getElementById('nb_messages').innerHTML.replace(/Nos membres ont posté un total de/,""); document.getElementById('nb_messages').innerHTML=document.getElementById('nb_messages').innerHTML.replace(/messages/,"<br/>posts");</script></span></div></td>
                      <td><div class="statss"><span id="nb_membres">{TOTAL_USERS}<script type="text/javascript">document.getElementById('nb_membres').innerHTML=document.getElementById('nb_membres').innerHTML.replace(/Nous avons/,""); document.getElementById('nb_membres').innerHTML=document.getElementById('nb_membres').innerHTML.replace(/membre enregistré/,"<br/>membre"); document.getElementById('nb_membres').innerHTML=document.getElementById('nb_membres').innerHTML.replace(/membres enregistrés/,"<br/>membres");</script></span></div></td></tr></table>
             
                      <div class="enlignetitre" style="margin-left:8px;">Ils sont en ligne</div>
                      <div class="enligne"><span id="logged">{LOGGED_IN_USER_LIST}<script type="text/javascript">document.getElementById('logged').innerHTML=document.getElementById('logged').innerHTML.replace(/Utilisateurs enregistrés :/,"");</script></span></div>
                      <div class="stats0"><span id="tot_user">{TOTAL_USERS_ONLINE}<script type="text/javascript">document.getElementById('tot_user').innerHTML=document.getElementById('tot_user').innerHTML.replace(/Il y a en tout/,"Actuellement, ").replace(/utilisateur en ligne/,"personne est en ligne -").replace(/utilisateurs en ligne/,"personnes sont en ligne -").replace(/::/,"").replace(/Enregistré/,"membre").replace(/Enregistrés/,"membres").replace(/Invisible/,"inconnu").replace(/Invisibles/,"inconnus").replace(/Invité/,"invité.").replace(/Invités/,"invités.");</script></span>
                          <span id="connectes">{RECORD_USERS}</span>
                        <script type="text/javascript">document.getElementById('connectes').innerHTML=document.getElementById('connectes').innerHTML.replace(/Le record du nombre d'utilisateurs en ligne est de/,"Notre record de membres connectés est de");</script></div>
          
                   
                    </td>
             
          <td width="17%">
                      <div class="dernierav">
                        <span id="avatar_dernier_membre"></span>
                      </div>
                     
                    </td>
               <td width="23%"><div class="créditsqeel">DFL est une idée de Frary. Le design actuel est une création de mrs jay et les codages du forum sont de MAY. L'optimisation est sur chrome</div>
                      <div class="bienvenue"><table><tr><td><div class="triangleqeel"></div></td><td width="100%" valign="middle"><center>
                        <span id="new_user">
                          <span id="dernier_membre" class="bienv"><center>{NEWEST_USER}</center></span>   
                          <script type="text/javascript">document.getElementById('new_user').innerHTML=document.getElementById('new_user').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"Bienvenue à <br/>");</script>
                        </span>
                        </center></td></tr></table></div></td>
          <td width="30%"><div class="enlignetitre" style="margin-right:8px;">Dernières 24h</div>
                      <div class="lastco"><table id="kaboum">{L_CONNECTED_MEMBERS}</table><script type="text/javascript">
                jQuery('#kaboum span.gensmall').html(jQuery('#kaboum span.gensmall').html().replace('Membres connectés au cours des 48 dernières heures : ',''));
                  </script>
    </div></td>
                  </tr>
                  <tr height="8px"></tr>
                </table>
          </td>
        </tr>

       
    </table>
      <img src="https://images2.imgbox.com/73/41/nUOuBvda_o.png" style="width:850px; height: 90px; border-radius: 0px 0px 25px 25px;">
    <!-- END disable_viewonline -->
    {CHATBOX_BOTTOM}
    <br clear="all" />
    <!-- BEGIN switch_legend -->

    <!-- END switch_legend -->

    {AUTO_DST}


    Dernière édition par Admin le Dim 2 Jan - 13:37, édité 1 fois
    Admin
    Admin
    Admin


    Messages : 310
    Date d'inscription : 18/02/2021

    Codage DFL Empty Re: Codage DFL

    Message par Admin Dim 2 Jan - 13:21

    css entier

    Code:
    @import url('https://fonts.googleapis.com/css2?family=BenchNine:wght@300;400;700&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=Jost|Abril+Fatface');
    @import url('https://fonts.googleapis.com/css2?family=Yesteryear');
    @import url('https://fonts.googleapis.com/css2?family=Qwigley&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=Mrs+Saint+Delafield&display=swap');

    /*--------------------HEADER--------------------*/
    body {
    background-position: top center;
    background-attachment: scroll;
    background-repeat:no-repeat;
    background-size:100%;}
    .derniers_posts img{height:10px;}


    /* Fixation bannière défilante || Tuto donné par Kanala */
    .ban1 { background-image: url('https://images2.imgbox.com/e1/ea/N9lEWm0i_o.png'); }

    .switcheroo {
        background-color: #F1F1F100 !important;
    }

    /**** FICHE DE PRÉSENTATION *****/
    .general{margin: auto; width:488px; color: black; font-size: 11px; text-align: justify;}
    .general2{margin: auto; width:450px; color: black; font-size: 11px; text-align: justify;}
    .gtitle{font-family: Big Shoulders Display; text-align: center; font-size: 30px;}
    .gsub{font: 10px/11px calibri; text-transform: uppercase; padding-top: 5px;}
    .imgprez{float:left; border-radius: 10px; width: 150px;margin-right: 10px;}
    .prezbloc1{
      float:left;
      width: 290px;
      height: 240px;
      overflow: auto;
      font-size: 11px;
      margin-bottom: 10px;
      background-color: #fafafa;
      padding: 10px;
    }
    .im2{height:85px; border-radius: 5px; margin-left: 10px; float: right; }
    .ca{
      border-radius: 5px;
      float: left;
      width: 155px;
      text-align: center;
      text-transform: uppercase;
      font-size: 10px;
      color: white;
      padding: 0px 2px;
      background-color: #e0beac;
      margin-right: 5px;
      margin-bottom: 5px;
    }
     .bs_an{
      float: right;
      writing-mode: vertical-rl;
      text-orientation: upright; text-align: center;
      height: 117px; float: left;
      text-transform: uppercase; font-size: 10px;
      padding: 3px; background-color: #242323; border-radius: 10px; color: #eaeaea;
      margin: 5px; letter-spacing:-3px; margin-top: 0px;
    }
    ca{text-transform: lowercase; font-size: 12px; color: #c07c59; font-weight: bold;}
    ca3{text-transform: lowercase; font-size: 22px; color: #c07c59; font-family: Big Shoulders Display; font-weight: bold;}
    .ca4{background-color: #242323; font-size: 10px; padding: 10px; text-transform: uppercase; color: #eaeaea;}
    .ca2{
      font-family: Big Shoulders Display; font-size: 28px;
      text-align: center; text-transform: uppercase;
      margin-bottom: 5px; line-height:25px; margin-top: 5px;
    }
    .cc{
      margin: 10px 0px;
      float: left;
      background-color: #242323; color: #eaeaea;
      height: 150px; overflow: auto; padding: 15px; width: 250px;
    }
    .cc > ca{text-transform: uppercase}
    .dfl{
      border-radius: 5px;
      float: left;
      width: 160px;
      text-align: center;
      text-transform: uppercase;
      font-size: 10px;
      color: white;
      padding: 0px 2px;
      background-color: #e0beac;
      margin-bottom: 5px;
      margin-right: 5px;
    }
    .imong{float: left; height:60px; border-radius: 5px; margin-right: 10px;}

    /****************************************************************FICHE ET POSTS**************************************/
    .pnom {z-index:3;height:40px;position:relative;
     margin-bottom:5px;padding-bottom:-15px;font-family: 'abril fatface';font-size:35px;font-weight:100;text-decoration:none;text-align:center;color:#fff1e5;text-shadow:1px 1px #E7661b;}
    .pnom2 {z-index:3;height:40px;position:relative;
     font-family: 'abril fatface';font-size:35px;font-weight:100;text-decoration:none;text-align:center;color:#fff1e5;text-shadow:1px 1px #E7661b;
      margin-top:-15px;margin-right:-100px;margin-bottom:-25px;}
    .pava {width:150px;border-radius:0px;border-top:#9fd7d7 3px dashed;padding-top:5px;margin-bottom:5px;}
    .ptexte1 {width:200px;height:228px;background-color:#ffffff;z-index:1;position:relative;margin-bottom:5px;
      overflow:hidden;padding:5px;text-align:justify;font-family:jost;font-size:11px;z-index:1;position:relative;line-height: 120%;border:#ffffff 5px solid}
    .ptexte1:hover {overflow:auto}
    .ptexte2 {width:190px;height:250px;background-color:#ffffff;z-index:1;position:relative;margin-right: 10px;margin-left: -5px;
      padding:5px;text-align:justify;font-family:jost;font-size:11px;z-index:1;position:relative;line-height: 120%;border:#9fd7d7 1px solid}
    .ptexte22 {overflow:hidden;height:214px;padding:5px;margin-top:2px;}
    .ptexte22:hover {overflow:auto}
    .ptriangle {width: 0;height: 0;border-right: 40px solid #ffffff;border-bottom: 40px solid transparent;border-top: 40px solid transparent;margin-left:-30px;margin-right:-5px;margin-top:10px;z-index:1;position:relative;}
    .pstitre {margin-top:-25px;text-align:center;font-family:jost;font-size:12px;text-transform:lowercase;letter-spacing:1px;color:#9fd7d7;text-shadow:1px 1px #ffffff;}
    .pavatar2 {width:150px;height:240px;background-color:#ffffff;
      overflow:hidden;padding:5px;outline:#ffffff 5px solid;border-left:#fff1e5 3px dashed;
    text-align:justify;font-family:jost;font-size:11px;line-height: 120%;}
    .pavatar2:hover img {opacity:0%;margin-left:-400px;position:absolute;transition:1s;}
    .pavatar2 img {opacity:100%;margin-left:0px;position:absolute;transition:1s;outline:#ffffff 5px solid}
    .pava2 {width:150px;}
    .ptexte3 {height:235px;overflow:hidden;padding-right:2px;text-align:justify;font-family:jost;font-size:11px;line-height: 120%;}
    .pavatar2:hover {overflow:auto;}
    .pquote {margin-top:5px;width:354px;background-color:#9fd7d7;color:#ffffff;font-family:jost;font-size:11px;text-transform:lowercase;padding:15px;letter-spacing:1px;text-align:justify;}
    .phist {width:384px;font-family:jost;font-size:12px;line-height:130%;padding-top:10px;text-align:justify;border-bottom:#9fd7d7 3px dashed;padding-bottom:10px;}
    .ptexte1 span, .pavatar2 span, .pris, .pris a {color: #E7661b;font-weight: 600;font-size: 10px;text-transform: uppercase;letter-spacing: 1px;text-decoration-color: #fff1e5;
        text-decoration-line: underline;text-decoration-style: dashed; }
    .ptexte22 span, .reserve {color: #9fd7d7 font-weight: 600;font-size: 10px;text-transform: uppercase;letter-spacing: 1px;text-decoration-color: #fff1e5;
        text-decoration-line: underline;text-decoration-style: dashed; text-shadow: 1px 1px #ffffff;}
    .libre {color: GREEN;font-weight: 600;font-size: 10px;text-transform: uppercase;letter-spacing: 1px;text-decoration-color: #ffffff;
        text-decoration-line: underline;text-decoration-style: dashed;}
    .pst2 {background-color:#E7661b;color:#ffffff;font-weight: 300;font-size: 12px;text-transform: uppercase;letter-spacing: 1px;
    text-align:center; height:15px; padding-top:5px;}

    /**********************************************TOPIC LIST BOX****************************************/
    .sujimage {width:35px;height:49px;margin-left:10px;margin-right:-24px;z-index:0;position:relative;}
    .sujtitre {width:520px;height:43px;background-color:#ffffff;z-index:1;position:relative;overflow:hidden;
      padding:3px;text-align:left;font-family:jost;font-size:11px;z-index:1;text-transform:lowercase;line-height: 120%;margin-top:-3px;}
    .sujauteur a {font-family:abril fatface;text-transform: none;font-size:15px;font-weight:200;}
    .sujauteur strong {font-family:abril fatface;text-transform: none;font-size:15px;font-weight:300;}
    .sujauteur {margin-top:8px;padding-left:10px;font-size:10px;}
    .sujtriangle {width: 0;height: 0;border-right: 12px solid #ffffff;border-bottom: 25px solid transparent;
      border-top: 25px solid transparent;margin-right:-5px;margin-left:-7px;margin-top:-3px;z-index:1;position:relative;}
    .sujlastp {width:204px;height:50px;border-top:#9fd7d7 3px dashed;margin-top:5px;background-color:transparent;font-family:jost;font-size:10px;text-transform:lowercase;}
    .sujlastp a {color:#ffffff;text-shadow:1px 1px #fff1e5;}
    .sujlastp strong {text-shadow:1px 1px #ffffff;}
    .sujsmess {width:200px;background-color:#ffffff;border:#9fd7d7 1px solid;text-align:center;font-family: 'Jost', sans-serif;text-transform:uppercase;font-size:9px;margin-top:0px;padding:2px}
    .sujlastpost-avatar img {width:35px;height:55px;border-radius:0px;border-top:#9fd7d7 3px dashed;padding-top:5px;}
    .sujpage {background-color:#fff1e5;;width:526px;height:12px;margin-left:7px;font-size:8px;color:#ffffff}
    .sujpage a {color:#ffffff;}
    .sujpage span.gensmall {color:#ffffff;}

    /*************************************************************CHATBOX****************************************************/
    /*COULEUR FOND CHATBOX*/
    body.chatbox {
    background-color: #DFE3E3;
    }

    /*COULEUR TEXTE TITRE CHATBOX*/
    #chatbox_header .catBottom .cattitle {
    color: #BFBFA0;
    }

    .chatfootertable label.fontbutton {color:#000000;}
    .chatfootertable div.fontbutton {color:#000000;}
    .chatfootertable div#help-button {color:#000000;}

    .chatbox-options a {color:#BFBFA0;}

    /********************************************************MEMBER LIST*****************************************/
    .avatarmini img {width:25px;height:40px;}
    .mlistcontact img {width:20px;margin:3px;}
    .thTop {color:#ffffff;background-color:#9fd7d7;font-family:jost;font-size:11px;text-transform:lowercase;}
    .thCornerL {color:#ffffff;background-color:#9fd7d7 font-family:jost;font-size:11px;text-transform:lowercase;}
    .thCornerR {color:#ffffff;background-color:#9fd7d7;font-family:jost;font-size:11px;text-transform:lowercase;}
    .listpseudo a {font-family:abril fatface;font-size:15px;}
    .listinfos {font-size:10px;font-family:jost;text-transform:lowercase;}

    /*************************************************MAINMENU****************************************************/

    .mainmenumay img {display:none;}
    .mainmenumay a {padding-right:10px;padding-left:10px;color:#fff1e5;font-family:jost;text-transform:uppercase;font-size:11px;transition:1s;}
    .mainmenumay a:hover {color:#fff1e5;background-color:#9fd7d7;transition:1s;}

    /***********************************************VIEWTOPIC BODY MAY*****************************/
    td.cat, td.catBottom, td.catHead, td.catLeft, td.catRight, td.catSides {
        background-color:#fff1e5;color:#ffffff;font-family:jost;text-transform:lowercase;letter-spacing:1px;font-size:12px;
        background-image: url(https://lh3.googleusercontent.com/proxy/MtKHwVXJSAF2584ddGsfYGPaaNSqpO2yLIr0Kqo1uktg0UgxxfsKkfEoHXao02LtTByApV_5XgE2s8hC6mSK4ik2eD7R4TXACpiH4YjpoFGVOlfxqBdv);
    }

    .cattitle {
        color:#ffffff;font-family:jost;text-transform:lowercase;letter-spacing:1px;font-size:12px;
      }

    td.catBottom span.nav {background-color:#fff1e5;color:#ffffff;font-family:jost;text-transform:lowercase;letter-spacing:1px;font-size:12px;}
    td.catBottom span.nav a {background-color:#fff1e5;color:#ffffff;font-family:jost;text-transform:lowercase;letter-spacing:1px;font-size:12px;}
    .avatarpost img {width:200px;height:320px;border:#ffffff 5px solid;}
    .pseudopost {width:200px;height:25px;margin-bottom:-13px;padding:5px 5px 0px 5px;text-align:center;border-bottom:#9fd7d7 3px dashed;}
    .pseudopost strong {text-shadow:1px 1px #ffffff;font-family: 'abril fatface';font-size:15px;font-weight:100;text-decoration:none;}
    .rangpost {margin-top:3px;margin-bottom:3px;width:200px;background-color:#9fd7d7;color:#ffffff;font-family:jost;font-size:10px;text-transform:lowercase;text-align:center;padding:5px;letter-spacing:1px;}
    .trianglepost {width: 0;height: 0;border-left: 30px solid transparent;border-right: 30px solid transparent;border-bottom: 30px solid #9fd7d7;margin-top:-20px;margin-bottom:-10px;z-index:1;position:relative;}
    .trianglepost2 {width: 0;height: 0;border-left: 30px solid transparent;border-right: 30px solid transparent;border-top: 30px solid #9fd7d7;margin-top:-6px;margin-bottom:-24px;z-index:1;position:relative;}
    .profilpost {position:relative;z-index:2;border:#9fd7d7 1px solid;width:198px;padding:5px;background-color:#ffffff;font-family:jost;font-size:10px;text-transform:lowercase;height:120px;overflow:hidden;transition:1s;text-align:justify;}
    .profilpost:hover {height:200px;overflow:auto;transition:1s}
    .profilpost img {max-width:190px}
    .contactspost {width:200px;text-align:center;}
    .navipost span.nav {font-family:jost;font-size:10px;text-transform:lowercase;color:#ffffff}
    .navipost span.nav a {font-family:jost;font-size:10px;text-transform:lowercase;color:#ffffff}
    .signature {margin-top:30px;border-top:#9fd7d7 3px dashed;width:250px;}
    .pdetails {font-family:jost;font-size:11px;text-transform:lowercase;color:#ffffff;background-color:#9fd7d7;padding:2px;}
    .pdetails2 {font-family:jost;font-size:8px;text-transform:uppercase;color:#ffffff;background-color:#9fd7d7;padding:2px;}
    .postbody {padding:15px; text-align: justify;}
    .boutonst1 {width: 0;height: 0;border-left: 25px solid transparent;border-top: 19px solid #ffffff;margin-right:-4px;z-index:1;position:relative;}
    .boutonst2 {width: 0;height: 0;border-right: 25px solid transparent;border-top: 19px solid #ffffff;margin-left:-4px;z-index:1;position:relative;}
    .boutonsmiddle {background-color:#ffffff;}

    /***************************************************PROFIL MAYLANDIE*********************************************************/
    .avatarpro {}
    .avatarpro img {width:200px;height:320px;border:#ffffff 10px solid;margin-bottom:5px;}
    .rangpro {width:208px;background-color:#ffffff;border:#9fd7d7 1px solid;text-align:center;font-family: 'jost', sans-serif;font-size:10px;padding:5px;text-transform:lowercase;letter-spacing:1px;}
    .sujetsmpro {width:97px;background-color:#ffffff;border:#9fd7d7 1px solid;text-align:center;font-family: 'Jost', sans-serif;text-transform:uppercase;font-size:11px;margin-top:-17px;padding:5px}
    .pseudopro {background-color:#ffffff;width:100%;}
    .pseudopro1 {font-family: 'abril fatface';font-size:15px;font-weight:100;text-decoration:none;}
    .onlinepro {font-family: 'abril fatface';font-size:15px;font-weight:100;text-decoration:none;color:#fff1e5;}
    .contactspro img {width:20px;}
    .liensujpro {font-family:Jost;font-size:10px;}
    .textepro {background-color:#ffffff;width:100%;text-align:left;}
    /**+trouver class forumline et background d8e5e8**/

    .forumline {border:0px;}

    /*************************************************CAT MAY**********************************************************************/

    .catsujme {margin-bottom:10px;width:363px;margin-left:13px;margin-top:-24px;background-color:transparent;text-shadow:1px 1px #E7661b;text-transform:uppercase;letter-spacing:1px;font-family:jost;font-size:5px;text-align:center;border-top:#9fd7d7 3px dashed;}
    .catimage {width:50px;height:70px;margin-left:10px;margin-right:-24px;z-index:0;position:relative;}
    .catdesc {width:314px;height:70px;background-color:#ffffff;z-index:1;position:relative;}
    .catdesc0 {height:50px;overflow:hidden;padding:10px;text-align:justify;font-family:jost;font-size:11px;z-index:1;position:relative;line-height: 120%;}
    .catdesc0:hover {overflow:auto}
    .catdesc0 strong {color:#fff1e5;text-shadow:1px 1px #9fd7d7;}
    .triangle {width: 0;height: 0;border-right: 20px solid #ffffff;border-bottom: 25px solid transparent;border-top: 25px solid transparent;margin-right:-5px;margin-top:10px;z-index:1;position:relative;}
    .lastp {width:180px;height:50px;border-top:#9fd7d7 3px dashed;margin-top:-12px;background-color:transparent;font-family:jost;font-size:10px;text-transform:lowercase;}
    .lastp a {color:#ffffff;text-shadow:1px 1px #E7661b;}
    .lastp strong {text-shadow:1px 1px #FFFFFF;}
    .titrforum {z-index:3;width:350px;background-color:transparent;height:40px;overflow:hidden;position:relative}
    .titrforum a {margin-bottom:5px;padding-bottom:-15px;font-family: 'Abril Fatface';font-size:25px;font-weight:100;text-decoration:none;text-align:center;color:#E7661b;text-shadow:1px 1px #E7661b;}
    .lienscat {margin-top:-12px;padding:5px;width:200px;background-color:#fff1e5;color:#ffffff;height:47px;overflow:hidden;text-align:left;margin-left:-5px;position:relative;z-index:3;border-radius:0px;}
    .lienscat:hover {overflow:auto}
    .lienscat a {background-color:#ffffff;color:#E7661b;font-family:jost;font-size:10px;display:block;width:100%;line-height:20px;text-align:center;vertical-align:middle;margin-bottom:2px;text-transform:lowercase;transition:1.5s;}
    .lienscat a:hover {background-color:#9fd7d7;color:#ffffff;transition:1.5s;}
    .lastpost-avatar img {width:50px;height:80px;border-radius:0px;border-top:#9fd7d7 3px dashed;padding-top:5px;}

    /*haut de catégorie*/
    .titre-categorie {
        margin-left: 0px;
    text-transform:uppercase;}

    .titre-categorie img {
        border-bottom: #f8d145 0px solid;
      margin-bottom:0px;
      width:850px;
      height: 100px;
      border-radius: 25px 25px 0px 0px;
    }
     
    .titre-categorie .tcat {display:block;margin-top: -110px;padding-top: 50px;color:#ffffff;text-shadow:1px 1px #E7661b;letter-spacing:1px;font-size:30px;text-align:center;font-family:abril fatface;
    }

    /*Titre de catégorie*/
    .titre-categorie .tcat {
      } /*sur l'index*/

    .nav img {
      display: none;} /*texte dans la navigation*/

    .nav {font-family:jost;font-size:10px;text-transform:lowercase;color:#ffffff}
    .nav a {font-family:jost;font-size:10px;text-transform:lowercase;color:#ffffff}
     

    /********************************************QEEL MAY**********************************************************/
    .qeelimg3{
      background-image: url('https://images2.imgbox.com/42/7e/bCnu7BxI_o.png');
      width: 850px;
      height: 100px;
      margin-top: 30px;
      border-radius: 25px 25px 0px 0px;
      font-family: 'Abril Fatface';font-size:25px;font-weight:100;text-decoration:none;text-align:center;color:#ffffff;text-shadow:1px 1px #9fd7d7;
    }
    .qeelimg2{
      background-image: url('https://images2.imgbox.com/ad/60/xoDqifS6_o.png');
      width: 850px;
      height: 50px;
      border-radius: 0px 0px 25px 25px;
      font-family: 'Abril Fatface';font-size:25px;font-weight:100;text-decoration:none;text-align:center;color:#ffffff;text-shadow:1px 1px #9fd7d7;
    }
    .dernierav img {width: 150px;height:240px;}
    .dernierav {width:150px;height:240px;overflow:hidden;border-top:#9fd7d7 3px dashed;padding-top:5px;}
    img.qeelimg {
        margin-left: 0px;
      width:850px;
    }
    .lastco {margin-right:8px;height:194px;overflow:hidden;border-bottom:#9fd7d7 3px dashed;padding:5px;text-transform:lowercase; text-align: justify;}
    .lastco strong {overflow:auto; text-align: justify;}
    .lastco strong {font-family:jost;font-size:12px; text-align: justify;}
    .lastco a {font-family:jost;font-size:12px; text-align: justify;}
    .bienvenue {text-align:center;background-color:#ffffff;height:98px;padding-top:15px;font-family:jost;font-size:11px;text-transform:lowercase;letter-spacing:1px;color:#E7661b}
    .bienvenue a {font-family:abril fatface;text-transform:none;font-size:18px;letter-spacing:0px;text-shadow:0px}
    .bienvenue strong {font-family:abril fatface;text-transform:none;font-size:18px;letter-spacing:0px;text-shadow:0px}
    .bienv {font-family:Jost;font-size:12px;text-transform:lowercase;letter-spacing:1px;color:#E7661b}
    .triangleqeel {width: 0;height: 0;border-top: 35px solid transparent;border-bottom: 35px solid transparent;border-right: 40px solid white;margin-left:-40px;margin-top:0px;z-index:1;position:relative;}
    .enlignetitre {z-index:3;position:relative;padding-top:-20px;margin-bottom:5px;padding-bottom:-15px;font-family: 'abril fatface';font-size:25px;font-weight:100;text-decoration:none;text-align:center;color:#ffffff;text-shadow:1px 1px #E7661b;}
    .enligne {text-transform:lowercase;margin-left:8px;background-color:#ffffff;font-family:jost;font-size:12px;margin-bottom:5px;padding:5px;text-align:justify;height:92px;overflow:hidden}
    .enligne:hover {overflow:auto}
    .statss {margin-top:-4px;width:108px;background-color:#ffffff;border:#9fd7d7 1px solid;text-align:center;font-family: 'Jost', sans-serif;text-transform:uppercase;font-size:11px;padding:5px}
    .stats0 {overflow:hidden;height:44px;margin-left:8px;background-color:#9fd7d7;color:#ffffff;font-family:jost;font-size:10px;text-transform:lowercase;padding:5px;letter-spacing:1px;text-align:justify;}
    .stats0:hover {overflow:auto}
    .créditsqeel {background-color:#9fd7d7;color:#ffffff;font-family:jost;font-size:10px;text-transform:lowercase;height:120px;margin-bottom:5px;padding:5px;letter-spacing:1px;text-align:justify;}
    /*------------------------------------------------APPARENCE FORUM------------------------------------------------*/
    .bodyline{border-radius:5px;}
    .bodylinewidth{margin-bottom:20px;margin-top:30px;}

    /*balise lettres*/
    b{}
    i{text-shadow:1px 1px #ffffff;}


    /*SOULIGNEMENT LIENS DU FORUM*/
    A:link {text-decoration: none !important;}
    A:visited {text-decoration: none !important;}
    A:active {text-decoration: none !important;}
    A:hover {text-decoration: none !important;}

    /*DERNIERE EDITION PAR*/
    tr.post span.gensmall { display: none; }
    table#msg_et, table#msg_et td{ background-color:none !important;}
    table#msg_et, table#msg_et td{background-color:none !important;}

       
    /*------------------------------------------------SUPPRESSION TRAITS INDESIRABLES------------------------------------------------*/
    td.catBottom, th.thBottom {border : 0px solid white;}
    td.catHead, th.thHead {border-width: 0 0 0 0 ;font-size: 12px;font-color : white ;}
    td.catRight, td.row3Right, th.thRight {border-width: 0 0 0 0;}
    td.catLeft, td.row3Left, th.thLeft {border-width: 0 0 0 0;}
    th.thCornerL, th.thTop, th.thCornerR, th.thSides {border:0px;}
    /*------------------------------------------------FIN SUPPR. DES TRAITS INDESIRABLES------------------------------------------------*/

    /*------------------------------------------------SCROLLBAR------------------------------------------------*/
              ::-webkit-scrollbar {
              width: 5px; /*largeur de la scrollbar verticale*/
              height: 5px; /*hauteur de la scrollbar horizontale*/
              background-color: #edecec;}
           
              ::-webkit-scrollbar-track {
              background-color: #edecec; /*couleur du fond de la scrollbar*/}
           
              ::-webkit-scrollbar-thumb { /*la petite bande qui monte/descend*/
              background-color: #fff1e5 /*couleur de l'ascenseur*/;}
    /*------------------------------------------------FIN SCROLLBAR------------------------------------------------*/

    .boite {width:150px;border:#fff1e5 10px solid;background-color:#fff1e5;position:absolute;left:40px;top:200px;text-align:center;}
    .imageboite {background-image:url('https://zupimages.net/up/21/27/rgfq.gif');
      width:150px;height:60px;background-size:100%;}
    .imageboite2 {background-image:url('https://zupimages.net/up/21/27/xqjp.gif');
      width:150px;height:60px;background-size:100%;}
    .boite h1 {background-color:#9fd7d7;color:#ffffff;font-family: jost;
        font-size: 10px;letter-spacing: 1px;margin-bottom: 5px;text-align: center;text-transform: lowercase;font-weight:600;padding: 2px;}
    .boite h2, .boite h2 a {margin:0px;font-family:jost;color: #E7661b;text-transform:uppercase;font-size:10px;}
    .bordboite {border-bottom: #9fd7d7 3px dashed;}

    /*SUPPRIMER FOND PA*/
    /*on desactive la couleur de fond et les bordures du tableau*/
    .M14_forumline {background:none !important;border:none;}
    /*on desactive la couleur de fond et les bordures du bloc du titre de la P.A*/
    .M14_catHead {background:none !important;border:none;}
    /*on desactive la couleur de fond et les bordures du contenu du tableau*/
    .M14_row1 {background:none !important;border:none;}

    .selectCode { float:right; text-transform: uppercase; cursor:pointer; font-family:source sans pro;color:#A5A092!important;}
    div.cont_code { clear: right; }
    .code, .quote, .spoiler_closed, .spoiler_content {
        background-color: rgba(255,255,255,0.5);border: 1px solid #d4c6cc;color: #9fd7d7!important;font-family: karla!important;
        font-size: 10px;letter-spacing: 1px;line-height: 125%;overflow-x: hidden!important;padding: 10px;max-width:500px;}
    Admin
    Admin
    Admin


    Messages : 310
    Date d'inscription : 18/02/2021

    Codage DFL Empty Re: Codage DFL

    Message par Admin Dim 2 Jan - 13:31

    page d'accueil :

    Code:
    <iframe src="https://loveandthunder.forumactif.com/h7-pa2" style="margin-top:15px;border:0px;width:840px;height:350px"></iframe>     

    htlm :

    Code:
    <meta charset="UTF-8" />        <title>Titre</title>                <style>
              @import url('https://fonts.googleapis.com/css?family=qwigley');
    @import url('https://fonts.googleapis.com/css?family=Jost');

              /***SLIDES***/
              #slides {
        position: relative;
        height: 100px;
        padding: 0px;
        margin: 0px;
        list-style-type: none;
    }

    .slide {
              position: absolute;
        left: -0px;
        top: 0px;
        width: 300px;
        height: 100%;
        opacity: 0;
        z-index: 1;
      font-size: 40px;
        padding: 5px;
        box-sizing: border-box;
        background: #333;
        color: #fff;

        -webkit-transition: opacity 1s;
        -moz-transition: opacity 1s;
        -o-transition: opacity 1s;
        transition: opacity 1s;
    }

    .showing {
        opacity: 1;
        z-index: 2;
    }

    .slide:nth-of-type(1) {
        background: #9fd7d7;
    }
    .slide:nth-of-type(2) {
        background: #9fd7d7;
    }
    .slide:nth-of-type(3) {
        background: #9fd7d7;
    }


              /***FIN SLIDES***/
             
             
              .texte1 {
              width:200px;
              height:95px;
              overflow:hidden;
              text-align:justify;
              padding:7px;
              margin-left:4px;
              margin-right:4px;
              margin-top:4px;
              margin-bottom:9px;
              color:#57534e;
              line-height:100%;
              font-size:11px;
              font-family:jost;
              -webkit-transition: 1s;
              transition: 1s;
              position:relative;
              z-index:2;
              }
             
              .texte1:hover {overflow:auto;}
             
              .texte2 {
              width:150px;
              height:138px;
              overflow:hidden;
              text-align:justify;
              padding:6px;
              color:#57534e;
              line-height:100%;
              font-size:11px;
              font-family:jost;
              -webkit-transition: 1s;
              transition: 1s;
              background-color:#9fd7d7;
              border:#9fd7d7 1px solid;
              }
             
              .texte2b {overflow:hidden;padding:2px;width:auto;height:115px;}
              .texte2b:hover {overflow:auto}
             
              .texte3 {padding-bottom:5px;
              -webkit-transition: 1s;
              transition: 1s;
              border-bottom:#E7661b 3px dashed;
              }
             
              .texte3b {
              width:210px;
              height:58px;
              overflow:hidden;
              text-align:justify;
              padding-bottom:10px;
              color:#57534e;
              line-height:100%;
              font-size:11px;
              font-family:jost;
              -webkit-transition: 1s;
              transition: 1s;
              }
             
              .texte3b:hover {overflow:auto;}
             
          .titre3 {margin-bottom:-30px;text-align:center;font-family:jost;font-size:20px;text-transform:lowercase;letter-spacing:1px;color:#9fd7d7;text-shadow:1px 1px #ffffff;}
              .titre4 {margin-bottom:5px;text-align:center;font-family:jost;font-size:15px;text-transform:lowercase;letter-spacing:1px;color:#E7661b text-shadow:1px 1px #a0646a;}
             
              .titre {text-align:center;font-family:yesteryear;font-size:25px;color:#ffffff;text-shadow:1px 1px #E7661b;margin-bottom:-10px;}
             
              .groupe1 span.gtexte {background-color:#9fd7d7;
    color:#dae5e8;
    -webkit-transition: 1s;
    transition: 1s;
    margin-left:0px;
    margin-top:-106px;
    position:absolute;
    height: 102px;
    width:146px;
    overflow-y: auto;
    opacity: 0 ;
              padding:2px;
    }
              .petitt {
      text-decoration-color : #9fd7d7;
      text-decoration-line  : underline ;
      text-decoration-style : dashed;
              color:#ffffff;
    }
            .liens {display:block;background-color:#fff1e5;color:#BFBFA0;font-family:jost;text-decoration:none;text-align:center;font-size:12px;letter-spacing:1px;margin:5px;text-transform:lowercase}
              .titre2 {background-color:#9fd7d7 color:#BFBFA0;margin-bottom:2px;font-family:jost;text-decoration:none;text-align:center;font-size:10px;letter-spacing:-1px;padding:5px;text-transform:uppercase}
             
              .titre5 {width:290px;background-color:#fff1e5;color:#E7661b;margin-bottom:2px;font-family:jost;text-decoration:none;text-align:center;font-size:10px;letter-spacing:0px;padding:5px;text-transform:uppercase}
              .partenaires {height:70px;border-bottom:# 3px dashed;color:#ffffff;margin-bottom:2px;font-family:jost;text-decoration:none;text-align:center;font-size:10px;letter-spacing:-1px;padding:5px;text-transform:uppercase}
              .partliens {height:43px;}
              .liensp {text-decoration:none;text-align:center;background-color:#fff1e5;width:148px;color:#E7661b;letter-spacing:1px;font-family:jost;font-size:10px;display:block;}
           
              .groupe1:hover span.gtexte {
    opacity: 1;
    margin-left:0px;
              transition:1s;
              -webkit-transition: 1s;
    }
             
              .triangle {width: 0;height: 0;border-left: 80px solid transparent;border-right: 80px solid transparent;border-bottom: 50px solid #BFBFA0 ;margin-top:-50px;margin-bottom:-5px;z-index:0;position:relative;}

              .button img {width:25px;height:25px;margin:2px;}
              .button2 img {width:20px;height:20px;margin:2px;border:#DFE3E3 2px solid;}
              .staffimg {width:60px;height:60px;border:#BFBFA0 5px solid;margin-bottom:-10px;}
            .staffname {width:220px;text-align:center;font-family:qwigley;font-size:25px;color:#ffffff;margin-bottom:-10px;}
              .staffname2 {width:220px;text-align:center;color:#ffffff;font-family:jost;text-transform:lowercase;letter-spacing:1px;font-size:12px;}
        .lienstaff {text-decoration:none;text-align:center;background-color:#fff1e5;width:80px;color:#E7661b;font-family:jost;font-size:10px;display:block;}
              .bordure {border-bottom:#BFBFA0 3px dashed;width:auto;height:1px;}
              .dcstaff {font-size:11px;font-family:jost;color:#ffffff;text-transform:lowercase;padding-left:28px;}
           
              /*modifier l'apparence de la scrollbar*/
              ::-webkit-scrollbar {
              width: 5px; /*largeur de la scrollbar verticale*/
              height: 5px; /*hauteur de la scrollbar horizontale*/
              background-color: #edecec;}
           
              ::-webkit-scrollbar-track {
              background-color: #edecec; /*couleur du fond de la scrollbar*/}
           
              ::-webkit-scrollbar-thumb { /*la petite bande qui monte/descend*/
              background-color: #bec099 /*couleur de l'ascenseur*/;}

    /***html des logos de races***/
                .groupe1 {
              width:33px;
              height:33px;
              overflow:hidden;
              text-align:justify;
              padding:6px;
              color:#dae5e8;
              line-height:100%;
              font-size:11px;
              font-family:jost;
              -webkit-transition: 1s;
              transition: 1s;
              margin:10px;
              background-size:100%;
              }
             
              .groupe1 span.gtexte {background-color:#9fd7d7;
    color:#BFBFA0;
    -webkit-transition: 1s;
    transition: 1s;
    margin-left:0px;
    margin-top:0px;
    position:absolute;
    height: 32px;
    width:32px;
              overflow:hidden;
    opacity: 0 ;
              padding:2px;
              padding-top:13px;
              text-align:center;
    }
             
           
             
              .groupe1:hover span.gtexte {
    opacity: 1;
    margin-left:0px;
              transition:1s;
              -webkit-transition: 1s;
    }
           
                  </style>                                       
    <center>
                                            
       <div style="background-color:#DFE3E3;">
                                               
          <table style="margin-left:0px;">
                                       <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
             <tr style="">
                                                               
                <td>
                                                        
                   <div class="titre5">
                                          Nos meilleurs amis                   
                   </div>
                                                                    
                   <div class="partenaires">
                                                      <a target="_blank" href="https://extraordinaryleague.forumactif.com/" class="button2"><img src="https://zupimages.net/up/21/27/srtm.png" /></a>            <a target="_blank" href="http://nyttselskap.forumactif.com/" class="button2"><img src="https://zupimages.net/up/21/27/srtm.png" /></a>            <a target="_blank" href="http://x-once-upon-a-time-x.forumactif.com/" class="button2"><img src="https://zupimages.net/up/21/27/srtm.png" /></a>            <a target="_blank" href="url" class="button2"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a>            <a target="_blank" href="url" class="button2"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a>            <a target="_blank" href="url" class="button2"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a>            <a target="_blank" href="url" class="button2"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a><br />            <a target="_blank" href="url" class="button2"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a>            <a target="_blank" href="url" class="button2"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a>            <a target="_blank" href="url" class="button2"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a>            <a target="_blank" href="url" class="button2"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a>            <a target="_blank" href="url" class="button2"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a>            <a target="_blank" href="url" class="button2"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a>            <a target="_blank" href="url" class="button2"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a><br />                               
                   </div>
                                                                    
                   <div class="partliens">
                                                           
                      <center>
                                                              
                         <table>
                                                <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
                            <tr style="">
                                                                    
                               <td>
                                                      <a style="margin-left:-3px;" class="liensp" target="_blank" href="https://loveandthunder.forumactif.com/t299-nos-demandes-d-amis">en faire partie</a>                   
                               </td>
                                                                    
                               <td>
                                                      <a style="margin-right:-3px;" class="liensp" target="_blank" href="https://loveandthunder.forumactif.com/f10-nos-amis">nos partenaires</a>                   
                               </td>
                                                                    
                            </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>                   
                         </table>
                                                                            
                         <div style="position:relative;z-index:100;margin-bottom:0px;margin-top:-2px;" class="titre3">
                                                l'équipe.                   
                         </div>
                                                              
                      </center>
                                                           
                   </div>
                                                                
                   <ul id="slides">
                                                                   
                      <li class="slide">
                                                                          
                         <table>
                                                <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
                            <tr style="">
                                                                    
                               <td valign="top">
                                                      <img class="staffimg" src="https://media2.giphy.com/media/II9UtrhZihIeQ/source.gif" />                   
                               </td>
                                                                    
                               <td>
                                                                       
                                  <div class="staffname">
                                                         Aëlynn Stuart                   
                                  </div>
                                                                       
                                  <div class="staffname2">
                                                                                                                       fonda / Frary                   
                                  </div>
                                                                       
                                  <center>
                                                                          
                                     <table>
                                                            <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
                                        <tr style="">
                                                                                
                                           <td>
                                                                  <a class="lienstaff" target="_blank" href="https://loveandthunder.forumactif.com/privmsg?mode=post&u=3">mp</a>                   
                                           </td>
                                                                                
                                           <td>
                                                                  <a class="lienstaff" target="_blank" href="https://loveandthunder.forumactif.com/u3">profil</a>                   
                                           </td>
                                                                                
                                        </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>                   
                                     </table>
                                                                          
                                  </center>
                                                                       
                               </td>
                                                                    
                            </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody>            </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
                            <tr style="">
                                                                    
                               <td>
                                                                       
                                  <div class="bordure">
                                                                          
                                  </div>
                                                                       
                               </td>
                                                                    
                               <td>
                                                                       
                                  <div class="dcstaff">
                                                         DC : Eva Lawson 
                                  </div>
                                                                       
                               </td>
                                                                    
                            </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>                   
                         </table>
                                                                
                      </li>
                                                                   
                      <li class="slide">
                                                                          
                         <table>
                                                <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
                            <tr style="">
                                                                    
                               <td valign="top">
                                                      <img class="staffimg" src="https://img.wattpad.com/75f0c3e17ae23fb3dbf65afbed0c3359dd4220f8/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f4f4249724a7474677875526f56513d3d2d3434383836353136392e313464373963323933383639343536383730353534343538393330322e676966" />                   
                               </td>
                                                                    
                               <td>
                                                                       
                                  <div class="staffname">
                                                         Aylin Stuart                 
                                  </div>
                                                                       
                                  <div class="staffname2">
                                                                                                                       admin / Sweety didie                   
                                  </div>
                                                                       
                                  <center>
                                                                          
                                     <table>
                                                            <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
                                        <tr style="">
                                                                                
                                           <td>
                                                                  <a class="lienstaff" target="_blank" href="https://loveandthunder.forumactif.com/privmsg?mode=post&u=5">mp</a>                   
                                           </td>
                                                                                
                                           <td>
                                                                  <a class="lienstaff" target="_blank" href="https://loveandthunder.forumactif.com/u5">profil</a>                   
                                           </td>
                                                                                
                                        </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>                   
                                     </table>
                                                                          
                                  </center>
                                                                       
                               </td>
                                                                    
                            </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody>                  </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
                            <tr style="">
                                                                    
                               <td>
                                                                       
                                  <div class="bordure">
                                                                          
                                  </div>
                                                                       
                               </td>
                                                                    
                               <td>
                                                                       
                                  <div class="dcstaff">
                                                         DC : Kathleen Davis, Victoria Lawson & Tala Uley               
                                  </div>
                                                                       
                               </td>
                                                                    
                            </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>                   
                         </table>
                                                                
                      </li>
                                                                     
                      <li class="slide showing">
                                                                          
                         <table>
                                                <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
                            <tr style="">
                                                                    
                               <td valign="top">
                                                      <img class="staffimg" src="https://zupimages.net/up/21/27/srtm.png" />                   
                               </td>
                                                                    
                               <td>
                                                                       
                                  <div class="staffname">
                                                         Nom prénom             
                                  </div>
                                                                       
                                  <div class="staffname2">
                                                         Pseudo             
                                  </div>
                                                                       
                                  <center>
                                                                          
                                     <table>
                                                            <tbody> </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
                                        <tr style="">
                                                                                
                                           <td>
                                                                  <a class="lienstaff" target="_blank" href="#">mp</a>                   
                                           </td>
                                                                                
                                           <td>
                                                                  <a class="lienstaff" target="_blank" href="#">profil</a>                   
                                           </td>
                                                                                
                                        </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>                   
                                     </table>
                                                                          
                                  </center>
                                                                       
                               </td>
                                                                    
                            </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody>                  </tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
                            <tr style="">
                                                                    
                               <td>
                                                                       
                                  <div class="bordure">
                                                                          
                                  </div>
                                                                       
                               </td>
                                                                    
                               <td>
                                                                       
                                  <div class="dcstaff">
                                                         DC : aucun       
                                  </div>
                                                                       
                               </td>
                                                                    
                            </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>                   
                         </table>
                                                                
                      </li>
                                           
                   </ul>
                                                                  
                </td>
                                                               
                <td>
                                                        
                   <div class="titre">
                                          Contexte                   
                   </div>
                                                                  
                   <div class="texte1">
                                                                <em> « Tu ne peux plus fuir, cette fois tu vas devoir rester et écouter ce que j’ai à te dire : Je t’aime. Je t’aime à un tel point que ça me dévore... Je t’aime tellement, et je sais que tu m’aimes aussi. Je t’en prie, dis-moi que tu m’aimes... Dis-moi que tout ce qu’on s’est infligé, tous ces mensonges, toutes ces trahisons, toutes ces disputes avaient une raison d’être. Dis-moi que c’était pas pour rien... » </em>          <br /><br />Et j’étais là, le cœur battant… Le cœur cognant tellement fort dans ma cage thoracique, le sang se propulsant tellement vite dans mes veines… En pleine crise de tachycardie, peut-être ? Les joues rougies par l’émotion, les yeux brillants de larmes, presque suppliants… J’étais au supplice. Plus rien n’importait autour de moi. Tu étais là, j’étais là et seule la palpitation saccadée de mon cœur dans ma poitrine brisait le silence qui pesait entre nous. J’attendais que tu réagisses. J’attendais que tu répondes quelque chose. J’attendais que tu m’aimes enfin. Chaque minute, chaque seconde sans réaction meurtrissait mon cœur et me nouait l’estomac de manière intense. Et enfin, tu ouvris la bouche pour prendre une inspiration qui m’aspira et fit tout disparaître autour de moi. Et je me réveillai, assise et pantelante dans ton lit, entre tes draps de satin. Je palpai le matelas de part et d’autres de ma tête, essayant de contrôler mon souffle irrégulier. Je regardai autour de moi. La place près de moi était vide et froide. Une fois calmée, je pris la décision de me lever et d’enfiler cette robe de chambre en soie blanche qui traînait sur une chaise. JMe dirigeant dans la pièce voisine, je t’aperçus. Tu étais de dos, devant la fenêtre, les mains derrière toi, observant l’immensité de l’eau et de son coucher de soleil. Cette sensation de déjà-vu, comme si j’avais déjà vécu cet événement par le passé… Je m’approchai de toi doucement, et une fois à ta hauteur, je plaçai ma main fébrilement sur ton bras pour que tu te retournes vers moi. J’avais ce besoin viscéral de savoir si tu m’aimais autant que je t’aimais. J’ouvris la bouche, mais aucun son ne franchit mes lèvres.            <br /><br /><em>« Après tout... Je suis juste une fille, debout devant un garçon, lui demandant de l'aimer. »</em>                               
                   </div>
                                                        
                   <center>
                                                           
                      <div class="triangle">
                                                              
                      </div>
                                                           
                   </center>
                                                 <a target="_blank" href="https://discord.gg/WRHrcn" class="liens">Discord</a>          <a target="_blank" href="https://loveandthunder.forumactif.com/f23-scenarios-attendus" class="liens">Scénarios</a>          <a target="_blank" href="https://loveandthunder.forumactif.com/t458-le-bottin-des-avatars" class="liens">Bottin</a>          <a target="_blank" href="https://loveandthunder.forumactif.com/f11-nos-invites" class="liens">Invités</a>          <a target="_blank" href="https://loveandthunder.forumactif.com/f8-les-annexes" class="liens">Annexes</a>                           
                </td>
                                                                 
                <td>
                                                                    
                   <table>
                                                      <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
                      <tr style="">
                                                                          
                         <td style="text-align:center">
                                                                 
                            <div class="titre2">
                                                   Voter                   
                            </div>
                                                            <a target="_blank" href="http://en.root-top.com/toplist/titop/in.php?ID=2023" class="button"><img src="https://zupimages.net/up/21/27/srtm.png" /></a><br />          <a target="_blank" href="http://www.root-top.com/topsite/loveharvard/in.php?ID=132" class="button"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a><br />          <a target="_blank" href="http://www.root-top.com/topsite/bazzart/in.php?ID=2362" class="button"><img src="https://zupimages.net/up/21/27/srtm.png" /></a><br />          <a target="_blank" href="http://www.root-top.com/topsite/pubrpgdesign/in.php?ID=2375" class="button"><img src="https://zupimages.net/up/21/27/yv3u.png" /></a><br />          <a target="_blank" href="http://www.root-top.com/topsite/obsession27/in.php?ID=20965" class="button"><img src="https://zupimages.net/up/21/27/srtm.png" /></a><br />                             
                         </td>
                                                                          
                         <td valign="top">
                                                                           
                            <div class="texte2">
                                                                      
                               <div class="titre4">
                                                      le récap.                   
                               </div>
                                                                    
                               <div class="texte2b">
                                                                La vie continuait son cours, les habitants, les monstres avec leurs lots de malheurs et de bonheurs, cette tension qui perdurent depuis maintenant des années entre le bien et le mal, les termes du traité des familles fondatrices oubliées peu à peu avec le temps faisant alors de Tulsa une ville meurtrière et terrifiante, dangereuse et violente. Tout était en suspens depuis maintenant bien des années, sur le bout du fil jusqu'à cette soirée en fin mars, la soirée annuelle d'une des familles fondatrices. La soirée comme chaque année se déroulait bien et sans incidents, les races se toléraient et savaient prendre sur eux pour la convivialité d'une soirée, d'une nuit. Du moins, pour un temps. En effet, alors que la famille Kingston faisait son discours habituel, un homme tomba dans la piscine qui, elle, devint rouge. La victime, morte, les traces d'un vampire... Une créature de la nuit avait fauté. Mais ce n'était pas cela le pire, c'est que la Victime n'est rien d'autre que le fils cadet des Coleman, famille fondatrice, humaine, normalement intouchable. L'irréparable, c'était produit.          <br /><br />La ville est désormais sans dessus dessous, une enquête de police est menée officiellement, officieusement, une enquête par les chasseurs tandis que la création du conseil ne se faisait pas attendre pour reprendre les principes et la base de cette ville avant que le chaos y règne en maître absolu. Cette situation n'a que trop duré. Alors vas-t-on trouver le ou la criminel(le)? Qui sera les représentants des races de la ville ?                             
                               </div>
                                                                    
                            </div>
                                                                               
                            <div class="titre3">
                                                   informations.                   
                            </div>
                                                                             
                         </td>
                                                                          
                      </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody>                   
                   </table>
                                                                                            
                   <div class="texte3">
                                                             
                      <div class="texte3b">
                                                                 Le forum et son contexte sont la propriété du staff et de sa fondatrice. Toutes reproductions partielles ou totales sont interdites. Nous demandons <span class="petitt">un rp par mois</span>, et nous n'avons pas de limite de ligne à partir de <span class="petitt">10 lignes</span>. Les <span class="petitt">initiales sont également interdites</span>. Le forum a ouvert ses portes le <span class="petitt">25. 03. 20</span>.                             
                      </div>
                                                           
                   </div>
                                                                                            
                </td>
                                                                       
             </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody>      </tbody>                   
          </table>
                               
          <table>
                             <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody> <tbody></tbody>
             <tr style="">
                                           
                <td>
                                              
                   <div class="groupe1" style="background-image:url('https://www.zupimages.net/up/20/44/kyyb.png')">
                                              <span class="gtexte">0 points</span>           
                   </div>
                                                            
                </td>
                                           
                <td>
                                              
                   <div style="background-image:url('https://www.zupimages.net/up/20/44/acw2.png')" class="groupe1">
                                                <span class="gtexte">0 points</span>           
                   </div>
                                              
                </td>
                                           
                <td>
                                              
                   <div style="background-image:url('https://www.zupimages.net/up/20/44/sa6q.png')" class="groupe1">
                                                <span class="gtexte">0 points</span>           
                   </div>
                                              
                </td>
                                           
                <td>
                                              
                   <div class="groupe1" style="background-image:url('https://www.zupimages.net/up/20/44/abck.png')">
                                                <span class="gtexte">0 points</span>             
                   </div>
                                              
                </td>
                                           
                <td>
                                              
                   <div style="background-image:url('https://www.zupimages.net/up/20/44/ezmx.png')" class="groupe1">
                                                <span class="gtexte">0 points</span>           
                   </div>
                                              
                </td>
                                         
             </tr><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody></tbody><tbody>      </tbody>         
          </table>
                                             
       </div>
                                                      
    </center>
                                                                                                              <script type="text/javascript">
    var slides = document.querySelectorAll('#slides .slide');
    var currentSlide = 0;
    var slideInterval = setInterval(nextSlide,3000);

    function nextSlide(){
        slides[currentSlide].className = 'slide';
        currentSlide = (currentSlide+1)%slides.length;
        slides[currentSlide].className = 'slide showing';
    }</script>
    Admin
    Admin
    Admin


    Messages : 310
    Date d'inscription : 18/02/2021

    Codage DFL Empty Re: Codage DFL

    Message par Admin Dim 2 Jan - 13:34

    queel :

    général

    htlm

    Code:
    <meta charset="UTF-8" />        <title>Titre</title>                <style>
              @import url('https://fonts.googleapis.com/css?family=Yesteryear');
    @import url('https://fonts.googleapis.com/css?family=Jost');
           
        /*Pour donner un style à vos mots soulignés*/
              u{border-bottom: 2px dotted;border-color:#1d0e14;text-decoration: none
        }

        /*Pour donner un style à vos mots en italique*/
        I{border-bottom:none; color:#ad8c62;text-decoration: none; text-shadow: 1px 1px 1px #000000;
        }
         

        .groupe1 {
              width:140px;
              height:106px;
              overflow:hidden;
              text-align:justify;
              padding:6px;
              color:#000000;
              line-height:100%;
              font-size:11px;
              font-family:jost;
              -webkit-transition: 1s;
              transition: 1s;
              }
             
           
             
              .namegr {text-transform:uppercase;text-align:center;font-family:jost;font-size:13px;color:#ffffff}
             
              .groupe1 span.gtexte {background-color:#ffffff;
    color:#000000;
    -webkit-transition: 1s;
    transition: 1s;
    margin-left:0px;
    margin-top:-106px;
    position:absolute;
    height: 102px;
    width:136px;
    overflow-y: auto;
    opacity: 0 ;
              padding:2px;
    }
             
           
             
              .groupe1:hover span.gtexte {
    opacity: 1;
    margin-left:0px;
              transition:1s;
              -webkit-transition: 1s;
    }

           
       
           
              /*modifier l'apparence de la scrollbar*/
              ::-webkit-scrollbar {
              width: 5px; /*largeur de la scrollbar verticale*/
              height: 5px; /*hauteur de la scrollbar horizontale*/
              background-color: #edecec;}
           
              ::-webkit-scrollbar-track {
              background-color: #edecec; /*couleur du fond de la scrollbar*/}
           
              ::-webkit-scrollbar-thumb { /*la petite bande qui monte/descend*/
              background-color: #bec099 /*couleur de l'ascenseur*/;}
           
                  </style>                                       
    <center>
       
       <table>
                  <tbody></tbody> <tbody></tbody>
          <tr style="">
                      
             <td>
                         
                <div class="groupe1" style="background-color:#87b9a7;">
                              
                   <center>
                      
                      <table>
                          <tbody> </tbody> <tbody></tbody>
                         <tr style="">
                            
                            <td valign="middle" style="height: 100px;">
                                <span class="namegr">The Power of love</span>
                            </td>
                            
                         </tr><tbody></tbody><tbody></tbody>
                      </table>
                      
                   </center>
                             <span class="gtexte"><em>« The power of love...A force from above cleaning my soul. »</em>Chaque instants, chaque secondes, chaque minutes... Tu n'es plus maître de toi même, comme envoûté, ton âme lui appartient, d'un amour dévoué. Tu as trouvé ton âme sœur, celle pour qui tu es prêt à vivre les plus belles et les plus tragiques aventures. Elle est ta moitié et tu ne peux plus vivre sans cette part de toi qui est la sienne. Envers et contre tout, votre amour combat toutes les forces obscure et victorieuse, vous pouvez tout vivre à ses côtés, mais vous n'êtes rien sans lui. Tu n'es pas un, tu es.. Vous êtes deux. Une équipe, le ying et le yang et toutes les combinaisons mathématiques, vous êtes l'équation parfaite... même si vous n'êtes pas forcément encore ensemble. </span>         
                </div>
                         
             </td>
                      
             <td>
                         
                <div class="groupe1" style="background-color:#6c8484;">
                              
                   <center>
                      
                      <table>
                          <tbody> </tbody> <tbody></tbody>
                         <tr style="">
                            
                            <td valign="middle" style="height: 100px;">
                                <span class="namegr">Saturn</span>
                            </td>
                            
                         </tr><tbody></tbody><tbody></tbody>
                      </table>
                      
                   </center>
                             <span class="gtexte">Tu es amoureux du monde. tu aimes la vie et les gens. Mais cependant, l'amour n'est pas encore venu frapper à ta porte. Mais cela t'es égale. Pour toi rien ne compte plus que l'amour de ta famille, l'amour de tes amis ou même encore l'amour de la nature et de ta propre solitude. Tu te laisses porter par le courant de la vie sans te soucier de l'amour. Tu sais qu'un jour tu rencontreras quelqu'un qui fera battre ton coeur. Mais là n'est pas ta priorité. L'important c'est ton bonheur intérieur et rendre les gens que tu aimes heureux et en sécurité. Rien ne compte plus que ça et c'est ça pour toi la vision de l'amour. </span>         
                </div>
                         
             </td>
                      
             <td>
                         
                <div class="groupe1" style="background-color:#725147;">
                              
                   <center>
                      
                      <table>
                          <tbody> </tbody> <tbody></tbody>
                         <tr style="">
                            
                            <td valign="middle" style="height: 100px;">
                                <span class="namegr">Dynasty</span>
                            </td>
                            
                         </tr><tbody></tbody><tbody></tbody>
                      </table>
                      
                   </center>
                             <span class="gtexte"><em>«  And now you're just a page torn from the story I'm living »</em>Tu n'es plus une personne à part entière, bien sûr que non. Ton âme est complètement brisée, la tête hors de l'eau, de justesse. Tu ne sais pas si tu as la force de te battre et de nager jusqu'à la rive d'en face, tu ne sais pas si tu as envie de cela, ou si tu as envie que les ténèbres t'engouffre entièrement, est-ce que la vie vaut-elle la peine d'être vécus ? Tant de souffrance et de douleur, es-tu capable de survivre pour ce déchirement sans fin ? Tu ne crois plus en l'amour. tu ne crois plus en grand chose... tu te bas chaque instant pour reprendre le chemin de la vie et respirer de nouveau. Mais cette flamme intérieure qui t'embrase n'a rien de bon. Tu n'es qu'un bloc de glace au milieu des flammes.  </span>         
                </div>
                         
             </td>
                      
             <td>
                         
                <div class="groupe1" style="background-color:#b08f74;">
                              
                   <center>
                      
                      <table>
                          <tbody> </tbody> <tbody></tbody>
                         <tr style="">
                            
                            <td valign="middle" style="height: 100px;">
                                <span class="namegr">Always hate me</span>
                            </td>
                            
                         </tr><tbody></tbody><tbody></tbody>
                      </table>
                      
                   </center>
                             <span class="gtexte"><em>«  I never meant to hurt you, it's just something I do, I guess it's not a good excuse. »</em>Tu n'es pas dans une situation des plus simples, avouons-le. Tu es en couple ou tu es célibataire, ton destin est liée à une autre personne que tu ne le veuilles ou non. Tu ne sais pas comment te libérer de cette emprise, souvent bien néfaste pour toi. Piégée dans une relation sans amour, ou alors subir cet amour à sens unique, pourquoi pas aussi vivre cette amour mutuelle, mais avec tellement de blessures mutuelles, où tout le monde, tout l'univers est contre vous, ayant raison de votre amour ? Amour inavoué, incertain, incapable d'accepter de se mettre en danger ? Tu es dans un rapport, une relation... toxique. Ou alors, tu ne sais pas sur quel pieds danser entre deux coeurs. Ta situation te fait perdre la raison et ton âme ne sait plus quoi penser du bien et du mal. Tout est si compliqué  </span>         
                </div>
                         
             </td>
                      
             <td>
                         
                <div class="groupe1" style="background-color:#918b95;">
                              
                   <center>
                      
                      <table>
                          <tbody> </tbody> <tbody></tbody>
                         <tr style="">
                            
                            <td valign="middle" style="height: 100px;">
                                <span class="namegr">Young and beautiful</span>
                            </td>
                            
                         </tr><tbody></tbody><tbody></tbody>
                      </table>
                      
                   </center>
                             <span class="gtexte"><em>«Hot summer nights mid July when you and I were forever wild »</em>Tu es une personne qui est encore jeune dans l'âme. Tu as vécus des choses douloureuses ou bien peut-être ton entourage ? En tout cas, tu as décidé de ne pas prendre le risque de mettre ton cœur en danger, tu es prêt à tout pour le protéger et c'est bien pour cela que tu préfère vivre comme un épicurien, vivre chaque instant comme le dernier, profiter et ne pas t'attacher, surtout ne pas t'attacher, car aimer une personne c'est prendre un risque, et tu n'es pas prêt encore pour cela, et tu en a pas forcément envie aussi. Pour toi l'amour... non merci. Tu préfères profites profiter de la vie. soit tu vies ta vie en solitaire, soit tu passes chaque nuit avec une conquête différente. L'amour... ce n'est qu'un jeu. Et soit tu n'y crois plus. Soit tu n'y as jamais vraiment cru. Peut-être n'est-ce alors que la peur qui te fais songer de la sorte ?  </span>         
                </div>
                         
             </td>
                    
          </tr><tbody></tbody><tbody>      </tbody>
       </table>
                
    </center>

    javascript

    onglet :
    Code:
    /**
     * Système d'onglets automatisé
     * Version : 1.0
     * Par Emmanuel "Manumanu" B.
     **/


    $(document).ready(function() {

    // le premier onglet est l'onglet par défault
      var ongletActuel = null;
      ongletActuel = $('.tabs-onglets a:first').attr('href');

      // Ajout de classe au premier onglet
      $('.tabs-onglets').find('a[href="'+ ongletActuel +'"]').addClass('selected');

      // Afficher l'élément par défaut correspondant à celui de l'onglet par défaut
      $(ongletActuel).show().siblings().hide();

      // Gestion de l'événement clic
      $('.tabs-onglets a').click(function(e) {
          idOnglet = $(this).attr('href');

          // Si l'élément est déjà sélectionné, ne rien faire
          if (idOnglet == ongletActuel)
            e.preventDefault();
          else {
            // Afficher le contenu demandé et masquer le contenu restant
            $(idOnglet).fadeIn().siblings().hide();

            // Retirer la classe des autres onglets et l'ajouter sur l'élément sélectionné
            $(this).addClass('selected').siblings().removeClass('selected');
            ongletActuel = idOnglet;
          }

          // Empêche le déclenchement du lien
          e.preventDefault();
      });
    });

    avatar qeel :
    $(function(){
    $.get($("#dernier_membre a[href^='/u']")[0].href,function(d){
    (a=$("#avatar_membre img",$(d))).length&&$("#avatar_dernier_membre").html(a);})
    });

    Contenu sponsorisé


    Codage DFL Empty Re: Codage DFL

    Message par Contenu sponsorisé


      La date/heure actuelle est Dim 28 Avr - 6:37