Fiche de Partenariat - Bataille médiévale, tons marrons

Images :

Code:

.a {
    color:#F4F3F3;
    text-decoration : none;
    }
   
    .fond_fiche{
    position : relative;
  height: 625px;
    width: 450px;
    background-color: #929180;
    }
   
    .banniere_nomdufo {
    position : absolute;
    top: -5px;
    height: auto;
    width: 450px;
    background-color:#A9A794 ;
    }
   
    .nomdufo{
    font-family: 'Cinzel', serif;
    color: #F4F3F3;
    font-size: 25px;
    padding-top:3px;
    font-weight : bold;
    text-align: center;
    letter-spacing : 1px;
    }
   
    .bloc_contexte{
    position : absolute;
    top : 45px;
    left: 10px;
    height:235px;
    width:260px;
    border-right: 1px solid #A9A794;
    }
   
    .contenu_contexte{
    position : absolute;
    top: 5px;
    left: 0px;
    height:  225px;
    width: 250px;
    overflow : auto;
    }
   
    .texte{
    font-family: 'Red Hat Display', sans-serif;
    font-size: 11px;
  color: #000000;
    text-align: justify;
    }
   
    .bloc_liens{
    position : absolute;
    right : 10px;
    width :150px;
    height: 25px;
    background-color:#A9A794;
    transition-duration : 1.5s;
    }
   
    .bloc_liens:hover{
    width : 135px;
    transition-duration : 1;5s;
    }
   
    .liensdufo{
    font-family: 'Cizel', serif;
    color: #F4F3F3;
    font-size: 20px;
    text-align :center;
    font-variant : small-caps;
    letter-spacing : 2px;
    transition-duration : 2s;
    }
   
    .liensdufo:hover{
    letter-spacing : 0px;
    transition-duration : 2s;
    }
   
    .banniere_messages_membres {
  position : absolute;
    top : 295px;
    height: auto;
    width: 450px;
    background-color:#A9A794 ;
    text-align: center;
    }
   
    .messages_membres{
    font-family: 'Red Hat Display', sans-serif;
    color: #F4F3F3;
    font-size: 20px;
    font-variant:small-caps;
   
    }
   
    .soustitre_staff {
    position : absolute;
    left : 90px;
    top : 332px;
    color: #F4F3F3;
    font-family :'Cinzel', serif;
    font-size : 23px;
    font-weight : bold;
    }
   
    .image_staff{
    position :absolute;
    left : 20px;
    border : 3px solid #F4F3F3;
    border-radius : 60px;
    }
   
    .pseudostaff{
    position: absolute;
    left : 75px;
    height: 25px;
    width: 140px;
    background-color:#A9A794;
    transition-duration : 1s ;
    }
   
    .pseudostaff:hover{
    width:130px;
  transition-duration : 1s ;
    }
   
    .texte_pseudostaff{
    color: #F4F3F3;
    font-size: 18px;
    font-family :'Cinzel', serif;
    text-align: right;
    padding-right:4px;
    font-variant : small-caps;
    font-weight : bold;
    letter-spacing : 0.5px;
    }
   
    .texte_rangstaff{
    position :absolute;
    right: 250px;
    width : 95px;
    height : 50px;
    font-style :italic;
    font-weight : bold;
    font-size : 12px;
    font-family : 'Red Hat Display', sans-serif;
    color : #F4F3F3;
    text-align : right;
    padding-right : 3px;
    overflow : auto ;
    }
   
    .soustitre_infos{
    position : absolute;
    right: 75px;
    top:332px;
    color: #F4F3F3;
    font-family :'Cinzel', serif;
    font-size : 23px;
    font-weight : bold;
    }
   
    .bloc_infos{
    position : absolute;
    right : 10px;
    top : 364px;
    width : 205px;
    height : 235px;
    border-left: 1px solid #A9A794;
    }
   
    .contenu_infos{
    position : absolute;
    top: 5px;
    left: 10px;
    height:  225px;
    width: 190px;
    overflow : auto;
    }
   
    .credits{
    position : absolute;
    bottom: 5px;
    left :210px ;
    font-family: 'Calibri', sans-serif;
    font-size : 8px;
  color : #000000;
    }

Code:

<img src="https://pre00.deviantart.net/5c26/th/pre/f/2017/112/9/8/the_last_one_by_88grzes-db6preo.jpg"
          style="height:auto;width:450px;" />
       
        <div class="fond_fiche">
         
        <div class="banniere_nomdufo">
          <div class="nomdufo">
            <a class="a" href="#" target="_blank">
              NOM DU FORUM </a>
          </div>
        </div>
          <div class="bloc_contexte">
            <div class="contenu_contexte">
          <div class="texte">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
        eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
        exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
        reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
        cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
        eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
        exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
        reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
           
          </div>
            </div>
          </div>
         
          <div class="bloc_liens" style="top:45px;"><div class="liensdufo">
            <a class="a" href="#" target="_blank">incipit</a> </div></div>
          <div class="bloc_liens" style="top:80px;"><div class="liensdufo">
            <a class="a" href="#" target="_blank">effectifs </a></div></div>
          <div class="bloc_liens" style="top:115px;"><div class="liensdufo">
            <a class="a" href="#" target="_blank">partenariats </a></div></div>
          <div class="bloc_liens" style="top:150px;"><div class="liensdufo">
            <a class="a" href="#" target="_blank">règlement </a></div></div>
          <div class="bloc_liens" style="top:185px;"><div class="liensdufo">
            <a class="a" href="#" target="_blank">autre </a></div></div>
            <div class="bloc_liens" style="top:220px;"><div class="liensdufo">
            <a class="a" href="#" target="_blank">autre </a></div></div>
            <div class="bloc_liens" style="top:255px;"><div class="liensdufo">
            <a class="a" href="#" target="_blank">autre </a></div></div>
         
            <div class="banniere_messages_membres">
          <span class="messages_membres">
            xx membres - xx messages
              </span></div>
       
          <div class="soustitre_staff"> Staff </div>
             
                      <div class="pseudostaff" style="top: 372px;" >
                        <div class="texte_pseudostaff">
                          <a class="a" href="#" target="_blank">Pseudo </a>
                        </div>
                </div>
         
          <div class="texte_rangstaff" style="top : 398px;"> fondateur
           
          </div>
         
  <div class="image_staff" style="background-image : url('https://i.servimg.com/u/f36/18/89/53/49/cheval10.jpg');
    height:70px; width:70px;top : 364px;"></div>
 
            <div class="pseudostaff" style="top: 452px;" >
                        <div class="texte_pseudostaff">
                          <a class="a" href="#" target="_blank">Pseudolong </a>
                    </div>
                </div>

          <div class="texte_rangstaff" style="top : 478px;"> administrateur & codeur
          </div>
         
  <div class="image_staff" style="background-image : url('https://i.servimg.com/u/f36/18/89/53/49/arbre_10.jpg');
    height:70px; width:70px;top : 444px;"></div>
         
            <div class="pseudostaff" style="top: 532px;" >
                        <div class="texte_pseudostaff">
                          <a class="a" href="#" target="_blank">Pseudo </a>
                    </div>
                </div>
         
          <div class="texte_rangstaff" style="top : 558px;"> moderateur
          </div>

<div class="image_staff" style="background-image : url('https://i.servimg.com/u/f36/18/89/53/49/lance_10.jpg');
    height:70px; width:70px;top : 524px;"></div>
         
         
          <div class="soustitre_infos" style=" margin : 0px; "> Infos </div>
         
          <div class="bloc_infos">
            <div class="contenu_infos">
            <div class="texte">
              :arrow_forward: une première information importante sur ton forum : sa date de création ? une particularité ?
              un évent en cours ? une description de l'ambiance ? quelque chose à venir ? une mise à jour
              récente ? <br /><br />
              :arrow_forward: une deuxième information importante sur ton forum : sa date de création ? une particularité ?
              un évent en cours ? une description de l'ambiance ? quelque chose à venir ? une mise à jour
              récente ? <br /><br />
      :arrow_forward: autre chose ?
             
              </div>
            </div>
            </div>
         
          <div class="credits">@Clém20</div>
         
          </div>

Code:

<link href="https://fonts.googleapis.com/css?family=Cinzel" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Red+Hat+Display&display=swap" rel="stylesheet">

Précisions:

Code:

<!DOCTYPE html>
  <html>
    <head> 
      <meta charset="utf-8" />
      <title>Fiche de pub pour refresh</title>
      <base target="_blank" />
      <style type="text/css">
.page{
  width: 550px;
  height: 900px;
  background: lightblue;
  background-image: url('LIEN');
  background-repeat: no-repeat;
}

a {
  text-decoration:none;
  color: white !important;
}

.titre {
  color : #fb6920;
  font-size: 24px;
  font-weight: ;
  letter-spacing: px;
  font-family: 'Indie Flower';
  float: right;
  position: relative;
  margin-right: 20px;
  margin-top: 257px;
  text-shadow: 2px 2px 0px white, -1px -1px 0px white;
}    

.contexte{
  width: 350px;
  height: 310px;
  background: white;
  position: absolute;
  top: 300px;
  overflow: auto;
  margin-left: 25px;
  font-size: 15px;
  padding: 7px;
  text-align:justify;
  color: chocolate;
}

.contexte:first-letter {
  font-size:290%;
  float:left;
  background: #fb6920;
  color: white;
  padding-left: 6px;
  padding-right: 5px;
  margin-right: 3px;
}  

.staff1{
  width: 100px;
  height: 100px;
  background: white;
  position: absolute;
  top: 300px;
  left: 420px;
  background: white;
  color: chocolate;
}  

.imagestaff1 {
  height: 100%;
  width: 100%;
  position:absolute;
  top:0;
  left:0;
  background-image: url('LIEN');
  background-size: contain;
  -webkit-transition: all 1s linear;
  transition: all 1s linear;
}  

.staff1:hover > .imagestaff1 {
  filter:alpha(opacity=0);
  opacity:0;
  visibility:hidden;
}

.staff2 {
  width: 100px;
  height: 100px;
  background: white;
  position: absolute;
  top: 410px;
  left: 420px;
  background: white;
  color: chocolate;
}    


.imagestaff2 {
  height: 100%;
  width: 100%;
  position:absolute;
  top:0;
  left:0;
  background-image: url('LIEN');
  background-size: contain;
  -webkit-transition: all 1s linear;
  transition: all 1s linear;
}  

.staff2:hover > .imagestaff2 {
  opacity:0;
  filter:alpha(opacity=0);
  visibility:hidden;
}

.staff3{
  width: 100px;
  height: 100px;
  background: white;
  position: absolute;
  top: 520px;
  left: 420px;
  background: white;
  color: chocolate;
}

.imagestaff3 {
  height: 100%;
  width: 100%;
  position:absolute;
  top:0;
  left:0;
  background-image: url('LIEN');
  background-size: contain;
  -webkit-transition: all 1s linear;
  transition: all 1s linear;
}  

.staff3:hover > .imagestaff3 {
  opacity:0;
  filter:alpha(opacity=0);
  visibility:hidden;
}

.blocliens{
  width: 550px;
  height: 36px;
  position: absolute;
  top: 650px;
  vertical-align: middle;
}  

.lien1{
  width: 109px;
  height: 35px;
  background: #fb6920;
  color: white !important;
  display: inline-block ;
  position: relative;
  top: 0px;
  float:left;
  text-align:center;
  line-height:30px;
}

.lien1:hover{
  width: 109px;
  height: 35px;
  background: #b92b2a;
  color: white;
  display: inline-block ;
  position: relative;
  top: 0px;
  float:left;
  text-align:center;
  line-height:30px;
}

.lien2{
  width: 111px;
  height: 35px;
  background: gold;
  color: white;
  display: inline-block ;
  position: relative;
  top: 0px;
  float: left;
  text-align:center;
  line-height:30px;
}

.lien2:hover{
  width: 111px;
  height: 35px;
  background: #b92b2a;
  color: white;
  display: inline-block ;
  position: relative;
  top: 0px;
  float: left;
  text-align:center;
  line-height:30px;
}

.blocinfo{
  width: 400px;
  background: white;
  position: absolute;
  top: 710px;
  overflow: auto;
  margin-left: 50px;
  font-size: 15px;
  padding: 15px;
  text-align:justify;
  color: chocolate;
  border-radius: 20px;
}

.boutonphrase {
  color : #fb6920;
  font-size: 20px;
  font-family: 'Indie Flower';
  text-shadow: 2px 2px 0px white, -1px -1px 0px white;
  width: 190px;
  margin: auto;
}    

.bouton {
  width: 100px;
  margin: auto;
  margin-top: -17px;
}    

.crédit {
  font-size: 10px;
  position: absolute;
  top: 875px;
  margin-left: 200Px;
  color: grey;
}
</style>
      <link type="text/css" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Indie+Flower" >
    </head>       
    <body>                 
<div class="page">
                                                              
 <div class="titre">
                               Si tu devais partir en voyage, où irais-tu?                                
 </div>
                                                            
 <div class="contexte">
                               LE CONTEXTE BLABLABLA, ces balises -> <br /> <br /> Correspondent à un saut de ligne si vous souhaitez les utiliser. A la suite un petit lien vers le contexte en entier, vous pouvez le retirer: <a target="_blank" href="LIENde_la_suite_de_votre_contexte"><span style="color: rgb(185, 43, 42);">La suite...</span></a>                            
 </div>
                                                        
 <div class="staff1">
        
 <div style="height: 100px;  display:table-cell; vertical-align: middle; font-family: 'Indie Flower' ; text-align: center; width : 100px;">
          NOM STAFF      
 </div>
                  
 <div class="imagestaff1">
                    
 </div>
                                                        
 </div>
                                                        
 <div class="staff2">
        
 <div style="height: 100px;  display:table-cell; vertical-align: middle; font-family: 'Indie Flower' ; text-align: center; width : 100px;">
         NOM STAFF          
 </div>
                    
 <div class="imagestaff2">
                      
 </div>
                                                        
 </div>
                                                        
 <div class="staff3">
      
 <div style="height: 100px;  display:table-cell; vertical-align: middle; font-family: 'Indie Flower' ; text-align: center; width : 100px;">
        NOM STAFF    
 </div>
                    
 <div class="imagestaff3">
                    
 </div>
                                                        
 </div>
                                                        
 <div class="blocliens">
                                          
 <div class="lien1">
       <a href="LIEN" target="_blank">                  Règlement </a>                          
 </div>
                            
 <div class="lien2">
       <a href="LIEN" target="_blank">                      Base de données </a>                        
 </div>
                    
 <div class="lien1">
       <a href="LIEN" target="_blank">                     Fruits du démon </a>                          
 </div>
                              
 <div class="lien2">
       <a href="LIEN" target="_blank">                      Questions  </a>                          
 </div>
                          
 <div class="lien1">
       <a href="LIEN" target="_blank">                    Staff  </a>                    
 </div>
                                            
 </div>
                                              
 <div class="blocinfo">
                           Date d'ouverture: <br /> Membres enregistrés: <br />Nombre de messages postés : <br />  <br />                
 <div class="boutonphrase">
                 Venez nous rejoindre !                  
 </div><br />                  
 <div class="bouton">
                  <a title="OnePieceRefresh" href="LIEN_Forum"><img src="Image_bouton_partenariat" alt="logo partenaire" /></a>                  
 </div>
                                        
 </div>
                                    
 <div class="crédit">
                              @Youp sur <a target="_blank" href="http://www.never-utopia.com/"> <span style="color: rgb(185, 43, 42);">Never Utopia</span> </a>                              
 </div>
                                                                                
</div>
</body>
</html>


Code:

.page{
  width: 550px;
  height: 900px;
  background: lightblue;
 background-image: url('LIEN');
 background-repeat: no-repeat;
}

Code:

<link type="text/css" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Indie+Flower" />            

Code:

<iframe src="Le_lien_de_ta_page_html" frameborder="0" scrolling="no" style="margin:auto; width: 550px; height: 900px;"></iframe>

Code:

<link href='https://fonts.googleapis.com/css?family=Great+Vibes' rel='stylesheet' type='text/css' / /><div style="height: 650px; width: 500px; background: #C78A31; text-align: center;"><img src="http://i21.servimg.com/u/f21/15/03/21/91/banniy10.png" style="margin: 20px 0 0 20px;" /><div style="height: 25px; width: 250px; color: #371605; font-size: 50px; font-family: 'Great Vibes'; margin: 30px 0 0 115px; border-bottom: 1px solid #371605;">Contexte</div><div style="height: 187px; width: 430px; background: #FEFDA5; border: 2px dotted #371605; border-radius: 5px; overflow: auto; text-align: justify; padding: 3px 2px 0 3px; font-family: Time New roman; font-size: 15px; color: #371605; margin: 10px 0 0 35px;">Haec igitur Epicuri non probo, inquam. De cetero vellem equidem aut ipse doctrinis fuisset instructior est enim, quod tibi ita videri necesse est, non satis politus iis artibus, quas qui tenent, eruditi appellantur aut ne deterruisset alios a studiis. quamquam te quidem video minime esse deterritum. Oportunum est, ut arbitror, explanare nunc causam, quae ad exitium praecipitem Aginatium inpulit iam inde a priscis maioribus nobilem, ut locuta est pertinacior fama. nec enim super hoc ulla documentorum rata est fides. Haec et huius modi quaedam innumerabilia ultrix facinorum impiorum bonorumque praemiatrix aliquotiens operatur Adrastia atque utinam semper quam vocabulo duplici etiam Nemesim appellamus: ius quoddam sublime numinis efficacis, humanarum mentium opinione lunari circulo superpositum, vel ut definiunt alii, substantialis tutela generali potentia partilibus praesidens fatis, quam theologi veteres fingentes Iustitiae filiam ex abdita quadam aeternitate tradunt omnia despectare terrena.</div><div style="height: 25px; width: 200px; color: #371605; font-size: 50px; font-family: 'Great Vibes'; margin: 30px 0 0 145px; border-bottom: 1px solid #371605;">Statistiques</div><div style="height: 187px; width: 430px; background: #FEFDA5; border: 2px dotted #371605; border-radius: 5px; overflow: auto; text-align: justify; padding: 3px 2px 0 3px; font-family: Time New roman; font-size: 15px; color: #371605; margin: 15px 0 0 35px;">Haec igitur Epicuri non probo, inquam. De cetero vellem equidem aut ipse doctrinis fuisset instructior est enim, quod tibi ita videri necesse est, non satis politus iis artibus, quas qui tenent, eruditi appellantur aut ne deterruisset alios a studiis. quamquam te quidem video minime esse deterritum. Oportunum est, ut arbitror, explanare nunc causam, quae ad exitium praecipitem Aginatium inpulit iam inde a priscis maioribus nobilem, ut locuta est pertinacior fama. nec enim super hoc ulla documentorum rata est fides. Haec et huius modi quaedam innumerabilia ultrix facinorum impiorum bonorumque praemiatrix aliquotiens operatur Adrastia atque utinam semper quam vocabulo duplici etiam Nemesim appellamus: ius quoddam sublime numinis efficacis, humanarum mentium opinione lunari circulo superpositum, vel ut definiunt alii, substantialis tutela generali potentia partilibus praesidens fatis, quam theologi veteres fingentes Iustitiae filiam ex abdita quadam aeternitate tradunt omnia despectare terrena.</div><a href="http://www.never-utopia.com/">Fyraliel</a></div>

Fiche de Pub Taupe

Code:

<!DOCTYPE><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>div.staff {width: 100px; height: 75px; margin: auto; overflow: hidden; display: inline-block; margin-left: 5px;} .staff img {position: relative; bottom: 75px; transition: all 0.5s; width: 100px; height: 75px;} .staff:hover img {bottom: 200px; transition: all 0.5s;} .txt_staff {color: #9c887d; font-size: 14px; text-align: justify; overflow: auto; width: 80px; height: 55px; padding: 10px;}</style></head><body>
<div style="width: 530px; padding: 10px; margin: auto; background: #F5F5F2;">
  <img src="http://img15.hostingpics.net/pics/661225image791.jpg" style="width: 530px; height: 350px;" />
  <br /><br />
  <a href="Lien du forum" style="display: block; font-size: 35px; color: #9c887d; text-align: center;">Nom du forum</a>
  <br />
  <div style="width: 255px; display: inline-block; margin-right: 15px; background: #9c887d; height: 16px; color: #F5F5F2; font-size: 25px; text-align: center;">
    <span style="position: relative; top: -6px;">Contexte</span>
  </div>
  <div style="width: 255px; display: inline-block; background: #9c887d; color: #F5F5F2; height: 16px; font-size: 25px; text-align: center;">
    <span style="position: relative; top: -6px;">Informations</span>
  </div>
  <br />
  <div style="width: 215px; height: 140px; overflow: auto; display: inline-block; padding-left: 20px; padding-right: 20px; color: #9c887d; font-size: 11px; text-align: justify; margin-right: 15px;">
    Texte texte
  </div>
  <div style="width: 215px; height: 140px; overflow: auto; display: inline-block; padding-left: 20px; padding-right: 20px; color: #9c887d; font-size: 11px; text-align: justify;">
    Texte texte <br />x membres connectés
  </div>
  <br />
  <div style="width: 255px; display: inline-block; margin-right: 15px; background: #9c887d; color: #F5F5F2; height: 16px; font-size: 25px; text-align: center;">
    <span style="position: relative; top: -6px;">Nouveautés</span>
  </div>
  <div style="width: 255px; display: inline-block; background: #9c887d; color: #F5F5F2; font-size: 25px; height: 16px; text-align: center;">
    <span style="position: relative; top: -6px;">Staff</span>
  </div>
  <br />
  <div style="width: 215px; height: 80px; overflow: auto; display: inline-block; padding-left: 20px; padding-right: 20px; color: #9c887d; font-size: 11px; text-align: justify; margin-right: 15px;">
    Texte texte
  </div>
  <div style="width: 215px; height: 80px; overflow: auto; display: inline-block; padding-left: 20px; padding-right: 20px; color: #9c887d; font-size: 11px; text-align: justify;">
    <div class="staff"><div class="txt_staff">Texte ici
      </div><img src="http://img15.hostingpics.net/pics/219236image990.jpg" alt="staff" /></div>
    <div class="staff"><div class="txt_staff">Texte ici
      </div><img src="http://img15.hostingpics.net/pics/219236image990.jpg" alt="staff" /></div>
  </div>
  <br />
  <div style="background: #9c887d; color: #F5F5F2; font-size: 25px; height: 16px; text-align: center;">
    <span style="position: relative; top: -6px;">Nous lier</span>
  </div>
  <div style="color: #9c887d; font-size: 11px; text-align: justify; height: 80px; overflow: auto; padding: 15px;">
    Texte texte texte
  </div>
<a href="http://www.never-utopia.com" style="display: block; text-decoration: none; font-size: 11px; text-align: center; color: #9c887d;">A-Lice | Never-Utopia</a>
</div></body></html>

Code:

<center><iframe src="Lien de la page HTML" border="0" frameborder="0" scrolling="no" style="margin: 10px;" width="570px" height="900px"></iframe></center>


Code:

<style type="text/css">.fond {width: 650px; background-image: url('http://zupimages.net/up/14/23/x35y.jpg'); border: 3px solid #ffffff; color: #ffffff; font-size: 20px; margin: auto;} .nom_forum {font-family: 'Audiowide', cursive; font-size: 40px; color: #ffffff; text-align: center; display: block;  margin-right: auto; margin-left: auto; margin-top: -10px;} .conteneur {margin: auto; position: relative; height: 100px; width: 100px; overflow: visible; display: inline-block;} .contenu_bulle {width: 100px; height: 102px; background: #004d50; opacity: 0; overflow: auto; -webkit-transition: 0.5s all linear; transition: 0.5s all linear; font-family: Unica One; font-size: 12px; text-align: justify; position: absolute; top: 0em;} .contenu_bulle:hover {opacity: 0.7;} .contenu_bulle a {color: #000000;}</style>
<div class="fond"><img style="width: 650px;" alt="image" src="http://zupimages.net/up/14/50/0p5m.png" />
  <span class="nom_forum">Atlantis Insurrection</span>
<table style="position: relative; top: -4em;"><tr><td style="width: 30%; font-family: 'Iceland', cursive;"><img alt="" border="0" src="http://image.noelshack.com/fichiers/2014/48/1416995936-722407chevronbis.png" />AI, c'est :
  <div style="border: 2px solid #004d50;"><img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" />Bientôt 2 ans de RP ;<br /><img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" />103 Héros;<br /><img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" />Le forum où vous créez votre Héros;<br /><img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" />Un Univers sombre et dangereux;<br /><img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" />Des Missions (MJ) et Intrigues;<br /><img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" />Un Système de compétences;<br /><img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" />Une gestion du gène ATA.</div><br /></td>
<td colspan="2" style="width: 70%; font-family: 'Iceland', cursive;"><img src="http://image.noelshack.com/fichiers/2014/48/1416995936-722407chevronbis.png" />Contexte :   
  <div style="border: 2px solid #004d50; height: 168px; overflow: auto;"> « Chacun d'entre vous s'est proposé pour cette mission et vous représentez une douzaine de pays. Vous êtes les les meilleurs et les plus brillants du monde et à la vue de cette aventure dans laquelle nous allons nous embarquer, vous êtes aussi les plus courageux.<br />J'espère que nous reviendrons tous un jour en ayant découvert un tout nouveau domaine à explorer pour l'Humanité, mais comme vous le savez tous, nous pourrions ne jamais revenir chez nous.<br />Je vous offre à tous une chance de retirer votre participation...<br />...<br />Commencez la séquence d'ouverture ! »</div>
<img src="http://image.noelshack.com/fichiers/2014/48/1416995936-722407chevronbis.png" />Actuellement sur AI :   
  <div style="border: 2px solid #004d50;"><img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" /> nouveauté; <img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" /> nouveauté; <img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" /> nouveauté; <img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" /> nouveauté.</div></td></tr>

<tr><td style="font-family: 'Iceland', cursive;" colspan="3"><img src="http://image.noelshack.com/fichiers/2014/48/1416995936-722407chevronbis.png" />Nous recherchons :
     
<div class="conteneur"><img style="border: 2px solid #004d50;" src="http://www.myfconline.com/character_avatars/9050_22528.gif" /> <div class="contenu_bulle">Nom Prénom<br />Rôle<br /><a href="#">Voir</a></div></div><div class="conteneur"><img style="border: 2px solid #004d50;" src="http://staceyuk.chaotic-creative.com/coppermine/cpg1416/albums/wpw-20080214/thumb_mckay_plain.png" /> <div class="contenu_bulle">Nom Prénom<br />Rôle<br /><a href="#">Voir</a></div></div><div class="conteneur"><img style="border: 2px solid #004d50;" src="http://img.photobucket.com/albums/v17/LoveEmpress/MyIcons3/lizabethdaily_2weekch_10.png" /> <div class="contenu_bulle">Nom Prénom<br />Rôle<br /><a href="#">Voir</a></div></div><div class="conteneur"><img style="border: 2px solid #004d50;" src="http://kaisa12.bloxode.com/images/miniature/113588688139.jpg" /> <div class="contenu_bulle">Nom Prénom<br />Rôle<br /><a href="#">Voir</a></div></div><div class="conteneur"><img style="border: 2px solid #004d50;" src="http://www.dreamwidth.org/userpic/164424/168770" /> <div class="contenu_bulle">Nom Prénom<br />Rôle<br /><a href="#">Voir</a></div></div><div class="conteneur"><img style="border: 2px solid #004d50;" src="http://www.hollow-art.com/files/bases/2014/08/20140810/19720/Rhona%20Mitra%20in%20Strike%20back-2517880.png" /> <div class="contenu_bulle">Nom Prénom<br />Rôle<br /><a href="#">Voir</a></div></div></td></tr>



<tr><td colspan="3" style="font-family: 'Iceland', cursive;"><img src="http://image.noelshack.com/fichiers/2014/48/1416995936-722407chevronbis.png" />Quelques liens :

<img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" /><a rel="nofollow" target="_blank" class="postlink" href="#">Contrat de confidentialité</a> <img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" /><a rel="nofollow" target="_blank" class="postlink" href="#">Contexte</a> <img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" /><a rel="nofollow" target="_blank" class="postlink" href="#"></a><a rel="nofollow" target="_blank" class="postlink" href="#"><span style="color: red;"> Se porter candidat </span></a><img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" /><a rel="nofollow" target="_blank" class="postlink" href="#">Poser une question</a> <img src="http://image.noelshack.com/fichiers/2014/20/1400069736-minicat-new.png" /><a rel="nofollow" target="_blank" class="postlink" href="#">Persos vacants</a>

<div style="text-align: center;"><a href="http://www.never-utopia.com/">Never Utopia</a></td></tr></table></div>
<link type="text/css" rel="stylesheet" href="http://fonts.googleapis.com/css?family=Audiowide|Iceland" />

Code:

<link href='http://fonts.googleapis.com/css?family=Anton' rel='stylesheet' type='text/css' />
<div style="width:400px; margin:auto; background: #606060; border-bottom:3px solid darkred;"><img src="IMAGE DU HEADER" alt="entete" width="400" />
<div style="width:185px; height:210px; background:rgba(255,255,255,0.1); margin-left: 10px; margin-top: 10px;"><span style="font-family: 'Anton'; font-weight: lighter; text-transform: lowercase; color:rgba(0,0,0,0.4); font-size: 20px; text-align:center; margin-top: 20px; display: block;padding-top:10px; padding-bottom:10px;">News</span><span style="width:165px; height:150px; font-family:Trebuchet MS; font-size:11px; color: black; padding : 10px; overflow : auto; display: block; text-align:justify;">- news
- news
- news
- news</span></div><div style="width:185px; height:210px; background:rgba(255,255,255,0.1); margin-right: 10px; margin-top: -210px; float: right; "><span style="font-family: 'Anton'; font-weight: lighter; text-transform: lowercase; color:rgba(0,0,0,0.4); font-size: 20px; text-align:center; margin-top:10px; margin-bottom:10px; display: block;">Stats</span><span style="width:165px; height:100px; font-family:Trebuchet MS; font-size:11px; color: black; padding : 10px; overflow : auto; display: block; text-align:justify;"><b>Ouvert depuis le :</b> XX/XX/XXXX
<b>Messages :</b> XXXX
<b>Membres :</b> XX
<b style="color:pink;">~ Groupe :</b> XX
<b style="color:orange;">~ Groupe :</b> XX
<b style="color:red;">~ Groupe :</b> XX
<b style="color:purple;">~ Groupe :</b> XX
<b>Dernier enregistré :</b> Nom Prénom</span>
<div style="width:185px; height:50px; margin-top: -20px; font-family:Trebuchet MS; font-size:9px; color: black; text-align: center; text-transform:uppercase;">Attendus
<a href="http://" target="_blank"><img src="ICONE" width="30" /></a> <a href="http://" target="_blank"><img src="ICONE" width="30" /></a> <a href="http://" target="_blank"><img src="ICONE" width="30" /></a> <a href="http://" target="_blank"><img src="ICONE" width="30" /></a></div></div>
<center><img src="IMAGE DU LOGO" alt="bouton partenariat" /></center>
[code]<a href="http://" target="_blank"><img src="http://" alt="bouton partenariat" /></a>[/code]
<a href="http://www.never-utopia.com/" style="font-size:8px; text-align:center; display:block; font-family:Trebuchet MS; text-transform:uppercase;">Lady sur Never-Utopia</a></div></div>

Logo RPU - Webgraphx:

Alors commençons

Code:


.fondfiche{
width: 700px;
height: 846px;
border: 2px solid #5E5E5E;
background: #1E1E1E;
}

.bann{
width: 700px;
height: 210px;
background: url('http://img110.xooimage.com/files/d/7/0/11111-47709ca.png');
border-bottom: 10px solid #D66E00;
}

.sep{
margin-top: 4px;
height: 4px;
width: 700px;
background: #D66E00;
}

.sepm{
margin-top: 4px;
height: 2px;
width: 700px;
background: #D66E00;
}

.box2{
height: 200px;
width: 222px;
font-size: 14px;
color: #5E5E5E;
margin-top: 40px;
background: #141414;
border-radius: 10px;
border: 1px solid #232323;
}

.enteteb{
width: 100%;
height: 20px;
background: #D66E00;
border-radius: 10px 10px 0px 0px;
padding-top: 2px;
text-align: center;
font-size: 16px;
color: #FFFFFF;
font-weight: bold;
}

.box1{
height: 150px;
width: 222px;
font-size: 14px;
color: #5E5E5E;
margin-top: 30px;
background: #141414;
border-radius: 10px;
border: 1px solid #232323;
}
.conteneur{
padding: 2px;
width: 218px;
height: 117px;
overflow: auto;
}
.conteneur2{
padding: 4px;
width: 218px;
height: 155px;
overflow: auto;
}
.conteneurcont{
padding: 4px;
width: 440px;
height: 155px;
overflow: auto;
}
.navb{
height: 150px;
width: 222px;
margin-top: 30px;
background: #141414;
border-radius: 10px;
border: 1px solid #232323;
}

.cont{
height: 200px;
width: 448px;
font-size: 14px;
color: #5E5E5E;
margin-top: 40px;
background: #141414;
border-radius: 10px;
border: 1px solid #232323;
}

.partb{
margin-top: 8px;
}


.part{
height: 70px;
width: 672px;
margin-top: 40px;
font-size: 14px;
color: #5E5E5E;
background: #141414;
border-radius: 10px;
border: 1px solid #232323;
}

.credt{
background: #111111;
text-align: center;
font-size: 16px;
color: #5E5E5E;
font-weight: bold;
margin-top: 20px;
border-top: 2px solid #D66E00;
}

.bmenu
{
width: 100%;
/*background: #202126;*/
/*border-bottom: 1px solid #005B89;*/
border-top: 1px solid #303034;
color: #EBEBEB;
text-align: center;
margin: auto;
-moz-transition : all 1s;
    -webkit-transition : all 1s;
}

.bmenu:hover
{
width: 100%;
/*border-bottom: 1px solid #005B89;*/
border-top: 1px solid #303034;
background: #D66E00;
color: #EBEBEB;
text-align: center;
margin: auto;
-moz-transition : all 1s;
    -webkit-transition : all 1s;
}

a:link{
text-align: center;
text-decoration: none;
color: #FFFFFF;
}

a:link:hover{
text-align: center;
color: #FFFFFF;
}

li {list-style-type: none;}


Code:

<div class="fondfiche">
  <div class="bann"></div>
  <div class="sepm"></div>
  <div class="sep"></div>
<table style="padding: 10px;">
  <tr>
  <td><div class="navb"><div class="enteteb">Navigation</div>
      <li class="bmenu"><a href="http://" target="_blank">Lien</a></li>
        <li class="bmenu"><a href="http://" target="_blank">Lien</a></li>
        <li class="bmenu"><a href="http://" target="_blank">Lien</a></li>
        <li class="bmenu"><a href="http://" target="_blank">Lien</a></li>
        <li class="bmenu"><a href="http://" target="_blank">Lien</a></li>
        <li class="bmenu"><a href="http://" target="_blank">Lien</a></li>
    </div></td><td><div class="box1"><div class="enteteb">Actualité</div><div class="conteneur">
blablablblab<br/>
lablblabblablablb<br/>
lablablblablablblablblalablblablbla<br/>
blablablblab<br/>
lablblabblablablb<br/>
lablablblablablblablblalablblablbla<br/>
blablablblab<br/>
lablblabblablablb<br/>
lablablblablablblablblalablblablbla<br/>
</div></div></td><td><div class="box1"><div class="enteteb">Le Staff</div></div></td>
</tr>
<tr>
  <td colspan ="2"><div class="cont"><div class="enteteb">Contexte</div>
 <div class="conteneurcont">


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vel finibus lectus, non congue lorem. Nunc tincidunt dui sed justo viverra lacinia. Mauris finibus metus non erat suscipit, et blandit elit placerat. Vestibulum tempus dignissim posuere. Maecenas quam nulla, egestas sit amet libero eget, sodales mollis eros. Aliquam dictum eleifend lobortis. Fusce rhoncus quam et fermentum facilisis. Praesent iaculis molestie pharetra.

Integer eleifend, nibh vel faucibus dictum, lacus arcu semper ex, sed varius nulla sapien cursus lectus. Integer ut massa sed nibh venenatis porta. Morbi sit amet nunc at dolor vulputate sollicitudin. Fusce laoreet eu nunc vel ullamcorper. Proin vel varius mi, ornare convallis nunc. Vestibulum finibus leo et lacinia tempor. Ut aliquet, sem condimentum tempor semper, elit metus vestibulum quam, faucibus vehicula mi nibh pellentesque mi. Nam imperdiet porttitor quam, nec faucibus est pulvinar sed.

Suspendisse in diam pellentesque, fermentum arcu id, sagittis mi. Suspendisse vehicula condimentum felis, in egestas leo. Donec sed porta est. Fusce imperdiet vel ligula quis convallis. Integer ac elit non odio dictum imperdiet. Nulla libero justo, semper egestas enim vitae, varius commodo turpis. Vestibulum auctor placerat neque. Nunc quam mauris, lobortis nec scelerisque a, tincidunt eu leo. Duis consequat, nisl at pretium volutpat, nulla nisl volutpat lectus, vel varius quam ante non magna.

Quisque varius, sem vehicula iaculis blandit, nibh enim viverra tortor, vel ultricies mi orci a lectus. Nam ultrices dui tellus, a molestie felis interdum quis. Aenean est massa, vehicula sit amet feugiat quis, dapibus accumsan nunc. Quisque molestie vehicula ultricies. Aliquam sem orci, laoreet non tellus eget, aliquet porttitor sem. Curabitur vestibulum nisl nulla, at auctor turpis porttitor ac. Cras tincidunt lacinia neque. Sed malesuada dolor arcu, sit amet vehicula ante ornare eget. Integer quis magna sit amet lorem facilisis feugiat. Quisque elementum leo neque, non sagittis odio varius dignissim. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras facilisis, enim ac vehicula commodo, ex velit porta arcu, sed ultrices dui velit non arcu.

Ut cursus metus felis, at scelerisque tortor vestibulum rutrum. Morbi suscipit volutpat ligula, eu bibendum elit viverra ut. Curabitur mollis cursus felis nec lacinia. Ut mollis varius arcu eu placerat. Cras tellus nisl, lobortis id arcu quis, efficitur porta velit. Integer convallis augue eget lectus vulputate pulvinar et eget lectus. Nunc quis leo erat. </div>   
  </div></td><td><div class="box2"><div class="enteteb">Statistique</div>
  <div class="conteneur2">
Nombre de membre:<br/>
Nombre de Post: <br/>
Age du forum<br/>
Recrutement:<br/></div>
  </div></td>
</tr>
<tr>
  <td colspan ="3"><div class="part"><div class="enteteb">Partenaires</div>
 <div class="partb">  <marquee>
<img src="http://i39.servimg.com/u/f39/18/09/95/45/atr112.gif" alt="RôlePlay universe | Multi-Rôle Play" style="border:none;" />
<img src="http://i39.servimg.com/u/f39/18/09/95/45/atr112.gif" alt="RôlePlay universe | Multi-Rôle Play" style="border:none;" />
<img src="http://i39.servimg.com/u/f39/18/09/95/45/atr112.gif" alt="RôlePlay universe | Multi-Rôle Play" style="border:none;" />
<img src="http://i39.servimg.com/u/f39/18/09/95/45/atr112.gif" alt="RôlePlay universe | Multi-Rôle Play" style="border:none;" />
<img src="http://i39.servimg.com/u/f39/18/09/95/45/atr112.gif" alt="RôlePlay universe | Multi-Rôle Play" style="border:none;" />
<img src="http://i39.servimg.com/u/f39/18/09/95/45/atr112.gif" alt="RôlePlay universe | Multi-Rôle Play" style="border:none;" />
<img src="http://i39.servimg.com/u/f39/18/09/95/45/atr112.gif" alt="RôlePlay universe | Multi-Rôle Play" style="border:none;" />
<img src="http://i39.servimg.com/u/f39/18/09/95/45/atr112.gif" alt="RôlePlay universe | Multi-Rôle Play" style="border:none;" />
<img src="http://i39.servimg.com/u/f39/18/09/95/45/atr112.gif" alt="RôlePlay universe | Multi-Rôle Play" style="border:none;" />
<img src="http://i39.servimg.com/u/f39/18/09/95/45/atr112.gif" alt="RôlePlay universe | Multi-Rôle Play" style="border:none;" />
<img src="http://i39.servimg.com/u/f39/18/09/95/45/atr112.gif" alt="RôlePlay universe | Multi-Rôle Play" style="border:none;" />
<img src="http://i39.servimg.com/u/f39/18/09/95/45/atr112.gif" alt="RôlePlay universe | Multi-Rôle Play" style="border:none;" />
  </marquee> </div></td>
</tr>
  </table><div class="credt"><center>Crée par Databar - RPU 2014 - Libre service <a href="http://www.never-utopia.com" target="blank">Never utopia</a></center></div>
</div>

Affaire classée

Code:

<!DOCTYPE><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><link href='http://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css' /></head><body>
<div style="width:650px; background-color: firebrick; border:1px solid black; margin:auto;"><div style="border-top-left-radius: 20px; border-top-right-radius: 20px; width:80px; background-color: firebrick; padding:5px; font-size:12px; color:black; border-top:solid 1px black; border-left:solid 1px black; border-right:1px solid black; text-align:center; transform:rotate(-90deg); position:relative; left:-59px; top:40px;">Pub</div><br/><br/>
<div style="width:93%; background-image:url(http://img15.hostingpics.net/pics/876228papertexturestockbyomg009d4q4wu0.jpg); transform:rotate(-1deg); border: solid 1px black; margin-left:auto; margin-right:auto; margin-top:-50px;"><div style="width:100%; background-image:url(http://img15.hostingpics.net/pics/876228papertexturestockbyomg009d4q4wu0.jpg); transform:rotate(-1deg); border: solid 1px black; margin:auto;"><div style="width:97%; background-image:url(http://img15.hostingpics.net/pics/876228papertexturestockbyomg009d4q4wu0.jpg); margin:auto; padding:10px; transform:rotate(2deg); border: solid 1px black; text-align:center;">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/4/4a/Torchwood_old_logo.svg/275px-Torchwood_old_logo.svg.png" alt="logo" style="width:150px; height:150px;" /><br /><br /><div style="width:90%; text-align:justify; font-size:13px; color:black; padding:10px; margin:auto;"><span style="display:block; text-align:center; font-size:25px; color:black;">Fiche de Pub</span>
  <br/>
  <br/>
  <div style="width:580px; height:200px; margin-left:-25px; overflow:hidden;"><img src="http://img11.hostingpics.net/pics/993999600200.png" /></div>
  <br/>
<div style="margin:auto; width:90%; padding:10px; text-align:justify; background-color:firebrick; color:white; border:black 1px solid;"><span style="display:block; text-align:center; font-size:25px; color:BurlyWood; font-family: 'Pacifico', cursive; padding:10px;">Nom du forum et/ou lien</span>
    <div style="width:95%; border:2px black dashed;padding:5px; margin:auto;"><span style="display:block; margin:auto; width:50%; border-bottom:2px solid white; text-shadow:0px 0px 2px white; font-size:18px; text-align:center; padding:5px;">Contexte</span><br />
  Blabla du contexte.
    </div> <br />
  <div style="width:95%; border:2px black dashed; text-align:center; padding:5px; margin:auto;"><span style="display:block; margin:auto; width:50%; border-bottom:2px solid white; text-shadow:0px 0px 2px white; font-size:18px; text-align:center; padding:5px;">Staff</span><br />
      <div style="display:inline-block; padding:5px;"><img src="http://img15.hostingpics.net/pics/847387renzoicon03.png" alt="" style="width:100px; height:100px;" /></div> <div style="padding:5px; display:inline-block;"><img src="http://img15.hostingpics.net/pics/847387renzoicon03.png" alt="" style="width:100px; height:100px;" /></div> <div style="display:inline-block; padding:5px;"><img src="http://img15.hostingpics.net/pics/847387renzoicon03.png" alt="" style="width:100px; height:100px;" /></div> <div style="padding:5px; display:inline-block;"><img src="http://img15.hostingpics.net/pics/847387renzoicon03.png" alt="" style="width:100px; height:100px;" /></div>
    </div><br />
    <div style="display:inline-block; margin-left:1%; width:31%; border:2px black dashed;padding:5px;"><span style="display:block; margin:auto; width:50%; border-bottom:2px solid white; text-shadow:0px 0px 2px white; font-size:18px; text-align:center; padding:5px;">Stat's</span><br />
    Blabla.
      </div> <div style="display: inline-block; width:61%; border:2px black dashed;padding:5px;"><span style="display:block; margin:auto; width:50%; border-bottom:2px solid white; text-shadow:0px 0px 2px white; font-size:18px; text-align:center; padding:5px;">Ce que tu veux</span><br />
  Blabla.
    </div> <br /><br />
    <div style="width:95%; border:2px black dashed;padding:5px; margin:auto;"><span style="display:block; margin:auto; width:50%; border-bottom:2px solid white; text-shadow:0px 0px 2px white; font-size:18px; text-align:center; padding:5px;">En savoir plus...</span><br />
      <a href="">Blabla d'un lien</a><br />
      <a href=""><img src="" alt="" /></a>
     
    </div> <br />
  </div>
</div>
</div></div></div><a href="http://www.never-utopia.com/" style="text-decoration:none; font-size:12px; color:black; text-align:center; padding:5px; display:block;">© A-Lice | Never-Utopia</a></div></body></html>

Code:

<center><iframe src="LIEN DE LA PAGE HTML" border="0" frameborder="0" scrolling="no" style="margin:10px;" width="710px" height="1450px"></iframe></center>

La suite de l'ensemble se trouve ici :

Affaire classée

Code:

<div class="fiche_part"><div class="etiquette_part">Demande de partenariat</div><br/>
<div class="fond1_part"><div class="fond2_part"><div class="fond3_part">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/4/4a/Torchwood_old_logo.svg/275px-Torchwood_old_logo.svg.png" alt="logo" style="width:150px; height:150px;" /><br /><br /><div class="txt_part"><span class="titre_part">Demande de partenariat</span>

<div class="img_part"><img src="http://img11.hostingpics.net/pics/993999600200.png" /></div>
<div class="bloc_part"><span class="titre2_part">Nom du forum</span>
Texte ici
</div>
</div>
</div></div></div><a href="http://www.never-utopia.com/" class="credit_part">© A-Lice | Never-Utopia</a></div>

Code:

.fiche_part {
width:650px;
background-color: firebrick;
border:1px solid black;
margin:auto;
}
.etiquette_part {
border-top-left-radius: 20px;
border-top-right-radius: 20px;
width:160px;
background-color: firebrick;
padding:5px; font-size:12px;
color:black;
border-top:solid 1px black;
border-left:solid 1px black;
border-right:1px solid black;
text-align:center;
transform:rotate(-90deg);
position:relative;
left:-100px;
top:80px;
}
.fond1_part {
width:93%;
background-image:url(http://img15.hostingpics.net/pics/876228papertexturestockbyomg009d4q4wu0.jpg);
transform:rotate(-1deg);
border: solid 1px black;
margin-left:auto;
margin-right:auto;
margin-top:-50px;
}
.fond2_part {
width:100%;
background-image:url(http://img15.hostingpics.net/pics/876228papertexturestockbyomg009d4q4wu0.jpg);
transform:rotate(-1deg);
border: solid 1px black;
margin:auto;
}
.fond3_part {
width:97%;
background-image:url(http://img15.hostingpics.net/pics/876228papertexturestockbyomg009d4q4wu0.jpg);
margin:auto;
padding:10px;
transform:rotate(2deg);
border: solid 1px black;
text-align:center;
}
.txt_part {
width:90%;
text-align:justify;
font-size:13px;
color:black;
padding:10px;
margin:auto;
}
.titre_part {
display:block;
text-align:center;
font-size:25px;
color:black;
}
.img_part {
width:580px;
height:200px;
margin-left:-25px;
overflow:hidden;
}
.bloc_part {
margin:auto;
width:90%;
padding:10px;
text-align:justify;
background-color:firebrick;
color:white;
border:black 1px solid;
}
.titre2_part {
display:block;
text-align:center;
font-size:25px;
color:BurlyWood;
padding:10px;
}
a.credit_part {
text-decoration:none;
color:black;
text-align:center;
padding:5px;
display:block;
}


Code:

.g_fiche {
width:600px;
background-color: firebrick;
border:1px solid black;
margin:auto;
}
.g_etiquette {
border-top-left-radius: 20px;
border-top-right-radius: 20px;
width:80px;
background-color: firebrick;
padding:5px;
font-size:12px;
color:black;
border-top:solid 1px black;
border-left:solid 1px black;
border-right:1px solid black;
text-align:center;
transform:rotate(-90deg);
position:relative;
left:-60px;
top:40px;
}
.g_fond1 {
width:90%;
background-image:url(http://img15.hostingpics.net/pics/876228papertexturestockbyomg009d4q4wu0.jpg);
transform:rotate(-1deg);
border: solid 1px black;
margin-left:auto;
margin-right:auto;
margin-top:-50px;
}
.g_fond2 {
width:100%;
background-image:url(http://img15.hostingpics.net/pics/876228papertexturestockbyomg009d4q4wu0.jpg);
transform:rotate(-1deg);
border: solid 1px black;
margin:auto;
}
.g_fond3 {
width:97%;
background-image:url(http://img15.hostingpics.net/pics/876228papertexturestockbyomg009d4q4wu0.jpg);
margin:auto;
padding:10px;
transform:rotate(2deg);
border: solid 1px black;
text-align:center;
}
.g_texte {
width:90%;
text-align:justify;
font-size:13px;
color:black;
padding:10px;
margin:auto;
}
.g_titre {
display:block;
text-align:center;
font-size:25px;
color:black;
}
.g_soustitre {
display:inline-block;
text-indent:30px;
font-size:16px;
}
a.g_credit {
text-decoration:none;
color:black;
display:block;
text-align:center;
padding:5px;
}
.g_img_cont {
width:100px;
height:100px;
padding:3px;
}
.g_img_cont2 {
margin-left:-30px;
width:565px;
}
.g_titre_lien {
display:inline-block;
text-align:right;
font-size:18px;
width:465px;
}
.g_bloc_lien {
margin:auto;
width:465px;
background-color:firebrick;
}
.g_txt_lien {
height:110px;
display:inline-block;
text-align:justify;
color:black;
overflow:auto;
width:350px;
padding-right:5px;
padding-top:5px;
}
.g_img_lien {
display:inline-block;
float:left;
padding:5px;
}
.g_titre_bord {
display:inline-block;
margin:auto;
width:210px;
text-align:center;
font-size: 18px;
padding:5px;
color:black;
}
.g_txt_bord {
display:inline-block;
margin-left:10px;
width:210px;
height:300px;
background-color:firebrick;
border:solid 1px black;
padding:5px;
overflow:auto;
color:white;
}
.g_txt_rp {
margin:auto;
width:90%;
padding:10px;
text-align:justify;
background-color:firebrick;
color:white;
border:black 1px solid;
}
.g_titre_rp {
display:block;
text-align:center;
font-size:25px;
color:BurlyWood;
font-family: 'Pacifico', cursive;
padding:10px;
}
.g_soustitre_rp {
display:block;
text-align:right;
color:burlywood;
font-size:12px;
border-bottom:dashed 2px burlywood;
font-family: courrier new;
padding:10px;
text-shadow:1px 1px 3px white;
}
.g_parole_rp {
display:inline-block;
color:BurlyWood;
text-indent:25px;
font-style:italic;
font-size:14px;
}
.g_img_part {
width:580px;
height:200px;
margin-left:-25px;
overflow:hidden;
}


Code:

<div class="g_fiche" style="width:650px;"><div class="g_etiquette" style="width:160px; position:relative; left:-100px; top:80px;">Demande de partenariat</div><br/>
<div style="width:93%;" class="g_fond1"><div class="g_fond2"><div class="g_fond3">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/4/4a/Torchwood_old_logo.svg/275px-Torchwood_old_logo.svg.png" alt="logo" style="width:150px; height:150px;" /><br /><br /><div class="g_texte"><span class="g_titre">Demande de partenariat</span>

<div class="g_img_part"><img src="http://img11.hostingpics.net/pics/993999600200.png" /></div>
<div class="g_txt_rp"><span class="g_titre_rp">Nom du forum</span>
Texte ici
</div>
</div>
</div></div></div><a href="http://www.never-utopia.com/" class="g_credit">© A-Lice | Never-Utopia</a></div>

La suite de l'ensemble se trouve ici :

En rouge et noir

Code:

<!Doctype><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href='http://fonts.googleapis.com/css?family=Francois+One' rel='stylesheet' type='text/css' /></head><body>
  <div style="width:565px; height:1009px; background:url(http://i39.servimg.com/u/f39/18/91/99/24/fond_f11.jpg); margin:auto; color:silver;"><img src="http://i39.servimg.com/u/f39/18/91/99/24/fiche_12.jpg" alt="" style="width:565px; height:169px;" /><br/>
    <span style="display:block; font-size:22px; text-transform:uppercase; font-family: 'Francois One', sans-serif; padding:3px; letter-spacing:-1px; margin-top:5px; text-align:center;">- <span style="color:firebrick;">Nom du forum</span> - Genre - <span style="color:firebrick;">Nom du forum</span> - Genre -</span><br/>
    <span style="display:block; text-indent:40px; position:relative; top:30px; font-size:20px; font-family: 'Francois One', sans-serif; letter-spacing:-1px;">Le forum en quelques mots</span><br/>
    <div style="margin-left:15px; width:350px; height:150px; background:#232625; overflow:auto; border-radius:15px; border-right:1px solid silver; border-bottom:1px solid silver; padding:10px; float:left;">Blabla est un forum de blabla</div> <br/>
    <span style="font-size:25px; text-align:center; line-height:25px; display:block; height:140px; overflow:auto; font-family: 'Francois One', sans-serif;">
      <a href="LIEN ICI" style="color:firebrick; text-decoration:none;">Lien 1</a><br/>
      <a href="LIEN ICI" style="color:firebrick; text-decoration:none;">Lien 1</a><br/>
      <a href="LIEN ICI" style="color:firebrick; text-decoration:none;">Lien 1</a><br/>
      <a href="LIEN ICI" style="color:firebrick; text-decoration:none;">Lien 1</a></span><br/>
    <span style="display:block; text-indent:85px; position:relative; top:30px; font-size:20px; font-family: 'Francois One', sans-serif; letter-spacing:-1px;">Le contexte</span><br/>
    <div style="margin-right:15px; width:470px; height:130px; background:#232625; overflow:auto; border-radius:15px; border-right:1px solid silver; border-bottom:1px solid silver; padding:10px; float:right;">C'est l'histoire de blabla</div><br/>
    <div style="margin-left:15px; float:left; margin-top:75px; width:150px;">
      <span style="font-size:25px; color:firebrick; text-align:center; display:block; font-family: 'Francois One', sans-serif;">Stats</span><br/>
      • XX membres<br/>
      • XX messages<br/>
      • Ouvert le XX<br/></div><br/>
    <span style="display:block; text-indent:45px; position:relative; top:45px; font-size:20px; font-family: 'Francois One', sans-serif; letter-spacing:-1px;">La vie du forum</span><br/>
    <div style="margin-right:15px; margin-top:15px; width:350px; height:150px; background:#232625; overflow:auto; border-radius:15px; border-right:1px solid silver; border-bottom:1px solid silver; padding:10px; float:right;">Actuellement sur  blabla il se passe</div><br/><br/>
    <div style="height:70px; overflow:hidden; clear:both; position:relative; top:65px;">
      <a href="LIEN DU FORUM" style="font-size:25px; text-decoration:none; color:firebrick; font-family: 'Francois One', sans-serif; position:relative; right:20px; left:200px;">Rejoignez-nous !</a>
      <img src="http://img4.hostingpics.net/pics/960813bouton.png" style="border-radius:15px; margin-right:15px; float:right;" /><br/>
    <a href="http://www.never-utopia.com/" style="text-decoration:none; color:white; margin-left:15px; position:relative; top:8px; font-size:13px;">© Fiche par Dakota et A-Lice sur Never-Utopia</a></div>
</div></body></html>

Code:

<center><iframe src="ICI LE LIEN DE LA PAGE HTML" border="0" frameborder="0" scrolling="no" style="margin:10px;" width="565px" height="1039px"></iframe></center>

Fiche de Pub

Code:

<br /><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><link href='http://fonts.googleapis.com/css?family=Handlee|Berkshire+Swash' rel='stylesheet' type='text/css'><div style="margin:auto; width:96%; border-radius: 200px; background-color:#141517; border:4px solid #767676; padding:10px; box-shadow:0px 0px 8px #767676; text-align:center;"><br/>
<span style="display:block; width:60%; margin:auto; color:white; font-size:25px; text-align:center; border:2px dotted #767676; border-radius: 100px; padding:10px; background-color:#2F3C3E; font-family: 'Berkshire Swash', cursive; text-shadow:2px 2px 2px #141517;">Fiche de Pub</span><br /><br /><div style="margin:auto; width:95%; height:200px; border-radius: 100px; border:2px dotted #767676; text-align:justify; color:white; overflow:hidden;"><img src="http://img4.hostingpics.net/pics/909792Bannierefofo.png" style="margin-left:-130px;" alt="" /></div><br/><br/>
  <div style="margin:auto; width:75%; background-color:#2F3C3E; border:2px dotted #767676; padding:10px; text-align:justify; color:white;"><span style="display:block; font-size:18px; color:#141517; text-align:center; text-shadow:2px 2px 2px white; font-family: 'Handlee', cursive;">Contexte</span><br /><div style="height:250px; overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.
Duis congue nunc a dictum porta. Nunc et sapien rhoncus, rhoncus eros nec, elementum velit. Nunc vel euismod nunc. Nam varius urna vitae mi elementum imperdiet. Pellentesque pulvinar sapien id leo pharetra dapibus. Aliquam posuere venenatis elit sit amet venenatis. Maecenas vitae ante tempus, ultrices nisi id, porttitor magna. Ut sodales ante sed ullamcorper mattis. Vestibulum non arcu non nisl rutrum commodo. Ut purus leo, commodo quis dapibus elementum, ornare vitae tortor.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.   
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.
    </div></div><br />
  <div style="display:inline-block; margin:auto; width:35%; background-color:#2F3C3E; border:2px dotted #767676; padding:10px; text-align:justify; color:white;"><span style="display:block; font-size:18px; color:#141517; text-align:center; text-shadow:2px 2px 2px white; font-family: 'Handlee', cursive;">Stat's</span><br /><div style="height:150px; overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.
    <p>Duis congue nunc a dictum porta. Nunc et sapien rhoncus, rhoncus eros nec, elementum velit. Nunc vel euismod nunc. Nam varius urna vitae mi elementum imperdiet. Pellentesque pulvinar sapien id leo pharetra dapibus. Aliquam posuere venenatis elit sit amet venenatis. Maecenas vitae ante tempus, ultrices nisi id, porttitor magna. Ut sodales ante sed ullamcorper mattis. Vestibulum non arcu non nisl rutrum commodo. Ut purus leo, commodo quis dapibus elementum, ornare vitae tortor.
    </p>
    </div></div> <div style="display:inline-block; margin:auto; width:35%; background-color:#2F3C3E; border:2px dotted #767676; padding:10px; text-align:justify; color:white;"><span style="display:block; font-size:18px; color:#141517; text-align:center; text-shadow:2px 2px 2px white; font-family: 'Handlee', cursive;">Liens</span><br /><div style="height:150px; overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.
    <p>Duis congue nunc a dictum porta. Nunc et sapien rhoncus, rhoncus eros nec, elementum velit. Nunc vel euismod nunc. Nam varius urna vitae mi elementum imperdiet. Pellentesque pulvinar sapien id leo pharetra dapibus. Aliquam posuere venenatis elit sit amet venenatis. Maecenas vitae ante tempus, ultrices nisi id, porttitor magna. Ut sodales ante sed ullamcorper mattis. Vestibulum non arcu non nisl rutrum commodo. Ut purus leo, commodo quis dapibus elementum, ornare vitae tortor.
    </p>
  </div></div><br /><br />
  <div style="margin:auto; width:75%; background-color:#2F3C3E; border:2px dotted #767676; padding:10px; text-align:justify; color:white;"><span style="display:block; font-size:18px; color:#141517; text-align:center; text-shadow:2px 2px 2px white; font-family: 'Handlee', cursive;">Nouveautés</span><br /><div style="height:150px; overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.
    <p>Duis congue nunc a dictum porta. Nunc et sapien rhoncus, rhoncus eros nec, elementum velit. Nunc vel euismod nunc. Nam varius urna vitae mi elementum imperdiet. Pellentesque pulvinar sapien id leo pharetra dapibus. Aliquam posuere venenatis elit sit amet venenatis. Maecenas vitae ante tempus, ultrices nisi id, porttitor magna. Ut sodales ante sed ullamcorper mattis. Vestibulum non arcu non nisl rutrum commodo. Ut purus leo, commodo quis dapibus elementum, ornare vitae tortor.
    </p>
    </div></div><br />
  <div style="margin:auto; width:75%; background-color:#2F3C3E; border:2px dotted #767676; padding:10px; text-align:justify; color:white;"><span style="display:block; font-size:18px; color:#141517; text-align:center; text-shadow:2px 2px 2px white; font-family: 'Handlee', cursive;">Logo's</span><br /><div style="height:100px; overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.
    </div></div><br />
  <br/><a href="http://www.never-utopia.com/" style="font-size:11px; color:#767676; text-decoration:none;">© By A-Lice sur Never-Utopia</a>
</div>

Code:

<center><iframe src="LIEN DE LA PAGE HTML" border="0" frameborder="0" scrolling="no" style="margin:10px;" width="650px" height="1450px"></iframe></center>

La suite des fiches se trouve ici :

Fiche de Partenariat

Code:

<br /><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><link href='http://fonts.googleapis.com/css?family=Handlee|Berkshire+Swash' rel='stylesheet' type='text/css' /><div style="margin:auto; width:96%; border-radius: 200px; background-color:#141517; border:4px solid #767676; padding:10px; box-shadow:0px 0px 8px #767676; text-align:center;"><br/>
<span style="display:block; width:60%; margin:auto; color:white; font-size:25px; text-align:center; border:2px dotted #767676; radius: 100px; padding:10px; background-color:#2F3C3E; font-family: 'Berkshire Swash', cursive; text-shadow:2px 2px 2px #141517;">Fiche de Partenariat</span><br /><br /><div style="margin:auto; width:95%; height:200px; border-radius: 100px; border:2px dotted #767676; text-align:justify; color:white; overflow:hidden;"><img src="http://img4.hostingpics.net/pics/909792Bannierefofo.png" style="margin-left:-130px;" alt="" /></div><br/><br/>
  <div style="margin:auto; width:75%; background-color:#2F3C3E; border:2px dotted #767676; padding:10px; text-align:justify; color:white;"><span style="display:block; font-size:18px; color:#141517; text-align:center; text-shadow:2px 2px 2px white; font-family: 'Handlee', cursive;">Contexte</span><br /><div style="height:250px; overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.
Duis congue nunc a dictum porta. Nunc et sapien rhoncus, rhoncus eros nec, elementum velit. Nunc vel euismod nunc. Nam varius urna vitae mi elementum imperdiet. Pellentesque pulvinar sapien id leo pharetra dapibus. Aliquam posuere venenatis elit sit amet venenatis. Maecenas vitae ante tempus, ultrices nisi id, porttitor magna. Ut sodales ante sed ullamcorper mattis. Vestibulum non arcu non nisl rutrum commodo. Ut purus leo, commodo quis dapibus elementum, ornare vitae tortor.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.   
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.
    </div></div><br />
  <div style="display:inline-block; margin:auto; width:35%; background-color:#2F3C3E; border:2px dotted #767676; padding:10px; text-align:justify; color:white;"><span style="display:block; font-size:18px; color:#141517; text-align:center; text-shadow:2px 2px 2px white; font-family: 'Handlee', cursive;">Stat's</span><br /><div style="height:150px; overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.
    <p>Duis congue nunc a dictum porta. Nunc et sapien rhoncus, rhoncus eros nec, elementum velit. Nunc vel euismod nunc. Nam varius urna vitae mi elementum imperdiet. Pellentesque pulvinar sapien id leo pharetra dapibus. Aliquam posuere venenatis elit sit amet venenatis. Maecenas vitae ante tempus, ultrices nisi id, porttitor magna. Ut sodales ante sed ullamcorper mattis. Vestibulum non arcu non nisl rutrum commodo. Ut purus leo, commodo quis dapibus elementum, ornare vitae tortor.
    </p>
    </div></div> <div style="display:inline-block; margin:auto; width:35%; background-color:#2F3C3E; border:2px dotted #767676; padding:10px; text-align:justify; color:white;"><span style="display:block; font-size:18px; color:#141517; text-align:center; text-shadow:2px 2px 2px white; font-family: 'Handlee', cursive;">Liens</span><br /><div style="height:150px; overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.
    <p>Duis congue nunc a dictum porta. Nunc et sapien rhoncus, rhoncus eros nec, elementum velit. Nunc vel euismod nunc. Nam varius urna vitae mi elementum imperdiet. Pellentesque pulvinar sapien id leo pharetra dapibus. Aliquam posuere venenatis elit sit amet venenatis. Maecenas vitae ante tempus, ultrices nisi id, porttitor magna. Ut sodales ante sed ullamcorper mattis. Vestibulum non arcu non nisl rutrum commodo. Ut purus leo, commodo quis dapibus elementum, ornare vitae tortor.
    </p>
  </div></div><br /><br />
  <div style="margin:auto; width:75%; background-color:#2F3C3E; border:2px dotted #767676; padding:10px; text-align:justify; color:white;"><span style="display:block; font-size:18px; color:#141517; text-align:center; text-shadow:2px 2px 2px white; font-family: 'Handlee', cursive;">Staff</span><br /><div style="height:150px; overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.
    <p>Duis congue nunc a dictum porta. Nunc et sapien rhoncus, rhoncus eros nec, elementum velit. Nunc vel euismod nunc. Nam varius urna vitae mi elementum imperdiet. Pellentesque pulvinar sapien id leo pharetra dapibus. Aliquam posuere venenatis elit sit amet venenatis. Maecenas vitae ante tempus, ultrices nisi id, porttitor magna. Ut sodales ante sed ullamcorper mattis. Vestibulum non arcu non nisl rutrum commodo. Ut purus leo, commodo quis dapibus elementum, ornare vitae tortor.
    </p>
    </div></div><br />
  <div style="margin:auto; width:75%; background-color:#2F3C3E; border:2px dotted #767676; padding:10px; text-align:justify; color:white;"><span style="display:block; font-size:18px; color:#141517; text-align:center; text-shadow:2px 2px 2px white; font-family: 'Handlee', cursive;">Logo's</span><br /><div style="height:100px; overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.
    </div></div><br />
  <br/><a href="http://www.never-utopia.com/" style="font-size:11px; color:#767676; text-decoration:none;">© By A-Lice sur Never-Utopia</a>
</div>

Code:

<center><iframe src="LIEN DE LA PAGE HTML" border="0" frameborder="0" scrolling="no" style="margin:10px;" width="650px" height="1450px"></iframe></center>

La suite des fiches se trouve ici :

Fiche de Demande de Partenariat

Code:

<link href='http://fonts.googleapis.com/css?family=Handlee|Berkshire+Swash' rel='stylesheet' type='text/css' />
<div style="margin:auto; width:80%; border-radius: 200px; background-color:#141517; border:4px solid #767676; padding:10px; box-shadow:0px 0px 8px #767676; text-align:center;">
<span style="display:block; width:60%; margin:auto; color:white; font-size:25px; text-align:center; border:2px dotted #767676; border-radius: 100px; 100px; padding:10px; background-color:#2F3C3E; font-family: 'Berkshire Swash', cursive; text-shadow:2px 2px 2px #141517;">Devenons coupains \o/</span><br /><br />
<div style="margin:auto; width:75%; border-radius: 100px; background-color:#2F3C3E; border:2px dotted #767676; padding:40px; text-align:justify; color:white;"><span style="display:block; font-size:18px; color:#141517; text-align:center; text-shadow:2px 2px 2px white; font-family: 'Handlee', cursive; font-weight:bold;">Le nom du forum</span>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mi ipsum, elementum non tempor quis, pellentesque eget libero. Vestibulum venenatis tellus sit amet felis volutpat porttitor. Nunc ullamcorper tortor in tellus ultrices, in vestibulum nulla dictum. Fusce at aliquet dolor. Proin vitae porta quam, eu feugiat risus. Pellentesque a nisl elit. Integer aliquam auctor lacus, nec pellentesque turpis cursus sit amet.

Duis congue nunc a dictum porta. Nunc et sapien rhoncus, rhoncus eros nec, elementum velit. Nunc vel euismod nunc. Nam varius urna vitae mi elementum imperdiet. Pellentesque pulvinar sapien id leo pharetra dapibus. Aliquam posuere venenatis elit sit amet venenatis. Maecenas vitae ante tempus, ultrices nisi id, porttitor magna. Ut sodales ante sed ullamcorper mattis. Vestibulum non arcu non nisl rutrum commodo. Ut purus leo, commodo quis dapibus elementum, ornare vitae tortor.

</div>
<a href="http://www.never-utopia.com/" style="font-size:11px; color:#767676; text-decoration:none;">© By A-Lice sur Never-Utopia</a>
</div>

La suite des fiches se trouve ici :

NOM du FORUM
RéglementContexte Avatars Prédéfinis

Ecrire ici le contexte ou un résumer alléchant.

「P'tite description.」

Un petit texte descriptif sur l'ambiance, ce que l'on peut y trouver, sa force, ses qualités, etc...

「Nos Statistiques.」

¤ C'est un monde qui a vu le jour un date.
¤ Il compte un total de nombre d'inscrits petits monstres qui on fait nombres de messages bêtises entre temps.
¤ C'est également une alliance entre (nombre d'admin) puissants admins terriblement vilains èwé :


Nom&Prénom ~ Nom&Prénom ~ Nom&Prénom

「Nous Lier ?」

fiche by koalz

Code:

<center><div style="background-color: #110917; width: 550px; height: auto; border-top: 10px solid #1b1422; border-bottom: 10px solid #1b1422;-moz-box-shadow: #000000 1px 0px 5px;"><a href="URLduFORUM"><img src="URL Image Entête" /></a><span style="text-shadow: 1px 1px 10px"><span style="font-family: Mistral; font-size: 46px; color: #d9d9d9; position: relative; top: -5px;">

<i>NOM du FORUM</i></span></span>
<span style="background-color : #1b1422; padding: 5px; -moz-border-radius-topright: 12px; -moz-border-radius-bottomleft: 12px; color: white; text-shadow: 0px 0px 3px white; margin-left: 4px; letter-spacing: 2px; font-size: 18px; font-family: Georgia;"><a href="URL du réglement" style="color: #d9d9d9;"><i>Réglement</i></font></a></span><span style="background-color : #1b1422; padding: 5px; -moz-border-radius-topright: 12px; -moz-border-radius-bottomleft: 12px; color: white; text-shadow: 0px 0px 3px white; margin-left: 4px; letter-spacing: 2px; font-size: 18px; font-family: Georgia;"><a href="URL du contexte" style="color: #d9d9d9;"><i>Contexte</i></a></span> <span style="background-color : #1b1422; padding: 5px; -moz-border-radius-topright: 12px; -moz-border-radius-bottomleft: 12px; color: white; text-shadow: 0px 0px 3px white; margin-left: 4px; letter-spacing: 2px; font-size: 18px; font-family: Georgia;"><a href="URL liste avatar" style="color: #d9d9d9;"><i>Avatars</i></a></span> <span style="background-color : #1b1422; padding: 5px; -moz-border-radius-topright: 12px; -moz-border-radius-bottomleft: 12px; color: white; text-shadow: 0px 0px 3px white; margin-left: 4px; letter-spacing: 2px; font-size: 18px; font-family: Georgia;"><a href="URL prédéfinis" style="color: #d9d9d9;"><i>Prédéfinis</i></a></span>

<div style="background-color: #1b1422; width: auto; height: auto; position: relative; top: 10px;padding: 10px;"><div style="text-align: justify;"><div style="width: 530px; text-align: justify; padding-right: 3px; font-size: 11px; color: #000"><span style="line-height: 12px; font-size: 9px; color: #7E8296; text-align: center;">
Ecrire ici le contexte ou un résumer alléchant.</span>
</div></div></div>
<div style="background-color: #1b1422; width: auto; height: auto; position: relative; top: 10px;padding: 10px;"><div style="font-family: Trajan Pro; font-size: 15px; color: #d9d9d9; position: relative; left: 10px;"><div style="text-align: left;"><div style="font-family: Garamond; font-size: 20px; color: #d9d9d9; position: relative; left: 10px;"><div style="text-align: left;"><b>「P'tite description.」</b></div></div></div></div><div style="text-align: justify;"><span style="line-height: 12px; font-size:11px; color: #7E8296; ">
Un petit texte descriptif sur l'ambiance, ce que l'on peut y trouver, sa force, ses qualités, etc...</span></div></div><br /><div style="background-color: #1b1422; width: auto; height: auto; position: relative; top: 10px;padding: 10px;"><div style="font-family: Trajan Pro; font-size: 15px; color: #d9d9d9; position: relative; left: 10px;"><div style="text-align: left;"><div style="font-family: Garamond; font-size: 20px; color: #d9d9d9; position: relative; left: 10px;"><div style="text-align: left;"><b>「Nos Statistiques.」</b></div></div></div></div><div style="text-align: justify;"><div style="line-height: 12px; font-size:11px; color: #7E8296; ">
¤ C'est un monde qui a vu le jour un <b>date</b>.
¤ Il compte un total de <b>nombre d'inscrits</b> petits monstres qui on fait <b>nombres de messages</b> bêtises entre temps.
¤ C'est également une alliance entre (nombre d'admin) puissants admins terriblement vilains èwé :

<center><img width="50px;" src="url image de l'admin" /> <img width="50px;" src="url image de l'admin" /> <img width="50px;" src="url image de l'admin" />
<b>Nom&Prénom</b> ~ <b>Nom&Prénom</b> ~ <b>Nom&Prénom</b></center></div></div></div><br /><div style="background-color: #1b1422; width: auto; height: auto; position: relative; top: 10px;padding: 10px;"><div style="font-family: Trajan Pro; font-size: 15px; color: #d9d9d9; position: relative; left: 10px;"><div style="text-align: left;"><div style="font-family: Garamond; font-size: 20px; color: #d9d9d9; position: relative; left: 10px;"><div style="text-align: left;"><b>「Nous Lier ?」</b></div></div></div></div><div style="text-align: justify;"><div style="line-height: 12px; font-size:11px; color: #7E8296; "><center>
<a href="Url du forum"><img src="URL image pub"></a> <a href="Url du forum"><img src="URL image pub"></a> <a href="Url du forum"><img src="URL image pub"></a>

<a href="Url du forum"><img src="URL image pub"></a> <a href="Url du forum"><img src="URL image pub"></a>
</center></div></div></div><br /><span style="font-size: 10px; color: #7E8296;">fiche by <a href="http://www.never-utopia.com/u13592">koalz</a></span><br /></div></center>

Nom du Forum / Blog

Contexte

Victus universis caro ferina est lactisque abundans copia qua sustentantur, et herbae multiplices et siquae alites capi per aucupium possint, et plerosque mos vidimus frumenti usum et vini penitus ignorantes.

Ex turba vero imae sortis et paupertinae in tabernis aliqui pernoctant vinariis, non nulli velariis umbraculorum theatralium latent, quae Campanam imitatus lasciviam Catulus in aedilitate sua suspendit omnium primus; aut pugnaciter aleis certant turpi sono fragosis naribus introrsum reducto spiritu concrepantes; aut quod est studiorum omnium maximum ab ortu lucis ad vesperam sole fatiscunt vel pluviis, per minutias aurigarum equorumque praecipua vel delicta scrutantes.

Particularité du Forum

Victus universis caro ferina est lactisque abundans copia qua sustentantur, et herbae multiplices et siquae alites capi per aucupium possint, et plerosque mos vidimus frumenti usum et vini penitus ignorantes.

Ex turba vero imae sortis et paupertinae in tabernis aliqui pernoctant vinariis, non nulli velariis umbraculorum theatralium latent, quae Campanam imitatus lasciviam Catulus in aedilitate sua suspendit omnium primus; aut pugnaciter aleis certant turpi sono fragosis naribus introrsum reducto spiritu concrepantes; aut quod est studiorum omnium maximum ab ortu lucis ad vesperam sole fatiscunt vel pluviis, per minutias aurigarum equorumque praecipua vel delicta scrutantes.

Essentiel hors RPG

♠ Administrateur :
♠ Modérateurs :
♠ Graphiste / Codeur :
♠ Statistiques :
♠ Date de création :
♠ Lien du forum

© FICHE DE PUB PAR AMYLITH -NESIS

Code:

<div style="background-color: #fff; width: 500px; border-radius: 20px 0px; border: 3px solid #8bb784; padding: 10px; margin: auto; text-align: center;">
<link href='http://fonts.googleapis.com/css?family=Milonga' rel='stylesheet' type='text/css' /><div style="margin: auto; font-family: Milonga; font-size: 30px; letter-spacing: 5px; text-align: center;color: #8bb784;text-shadow : 2px 2px 2px #82ac88; text-align: center;"> Nom du Forum / Blog 
</div>
<img src="http://img4.hostingpics.net/pics/536516330100.png" />

<div style=" font-family: Milonga; font-size: 25px; letter-spacing: 2px; text-align: center; color: #8bb784; text-shadow: 2px 2px 2px #82ac88;"> Contexte 
</div>
<div style="margin: auto; width: 450px; padding-left: 12px; padding-right: 12px; backgrond-color: #fff; text-align: justify; color: #8bb784; border-radius: 20px 0px; border: 3px solid #8bb784;box-shadow: 2px 2px 2px #8bb784;overflow: auto;">Victus universis caro ferina est lactisque abundans copia qua sustentantur, et herbae multiplices et siquae alites capi per aucupium possint, et plerosque mos vidimus frumenti usum et vini penitus ignorantes.

Ex turba vero imae sortis et paupertinae in tabernis aliqui pernoctant vinariis, non nulli velariis umbraculorum theatralium latent, quae Campanam imitatus lasciviam Catulus in aedilitate sua suspendit omnium primus; aut pugnaciter aleis certant turpi sono fragosis naribus introrsum reducto spiritu concrepantes; aut quod est studiorum omnium maximum ab ortu lucis ad vesperam sole fatiscunt vel pluviis, per minutias aurigarum equorumque praecipua vel delicta scrutantes.
</div>
<div style="margin: auto; font-family: Milonga; font-size: 25px; letter-spacing: 2px; text-align: center; color: #8bb784;text-shadow : 2px 2px 2px #82ac88;"> Particularité du Forum
</div>
<div style="margin: auto width: 450px; padding-left: 12px; padding-right: 12px; backgrond-color: #fff; text-align: justify; color: #8bb784; border-radius: 20px 0px; border: 3px solid #8bb784;box-shadow: 2px 2px 2px #8bb784;overflow: auto;">Victus universis caro ferina est lactisque abundans copia qua sustentantur, et herbae multiplices et siquae alites capi per aucupium possint, et plerosque mos vidimus frumenti usum et vini penitus ignorantes.

Ex turba vero imae sortis et paupertinae in tabernis aliqui pernoctant vinariis, non nulli velariis umbraculorum theatralium latent, quae Campanam imitatus lasciviam Catulus in aedilitate sua suspendit omnium primus; aut pugnaciter aleis certant turpi sono fragosis naribus introrsum reducto spiritu concrepantes; aut quod est studiorum omnium maximum ab ortu lucis ad vesperam sole fatiscunt vel pluviis, per minutias aurigarum equorumque praecipua vel delicta scrutantes.
</div>
<div style="margin: auto font-family: Milonga; font-size: 25px; letter-spacing: 2px; text-align: center; color: #8bb784;text-shadow : 2px 2px 2px #82ac88;"> Essentiel hors RPG
</div>
<div style="margin: auto width: 450px; padding-left: 12px; padding-right: 12px; backgrond-color: #fff; text-align: justify; color: #8bb784; border-radius: 20px 0px; border: 3px solid #8bb784;box-shadow: 2px 2px 2px #8bb784;overflow: auto;">
♠ Administrateur :
♠ Modérateurs :
♠ Graphiste / Codeur :
♠ Statistiques :
♠ Date de création :
♠  <a href="http://"> Lien du forum</a>
</div>
<div style="text-align: center;">© FICHE DE PUB PAR AMYLITH -NESIS </div>
</div>

VOTRE FORUM
ADRESSE DE VOTRE FORUM

Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue. Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue. Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue. Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue. Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.

• • •

Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.

• • •

Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.

code by Illusion (c)

Code:

<div style="border-radius:25px; border-top: 1px dashed black; border-bottom: 1px dashed black; border-left:2px solid black;border-right:2px solid black; background-color: #e7eaf0; width: 470px; height:690px; text-align: left;"><br/><br/><div style="border-radius:25px; border: 1px dashed black; background-color: #eb4481; width: 300px; height:40px; margin: auto;text-align: center;"><span style="border-bottom:1px dashed black;font-size:15px; color: black;">VOTRE FORUM</span><br /><a href="URL DU FORUM"><i><span style="font-size:11px; color: black;">ADRESSE DE VOTRE FORUM</span></i></a></div>
<img src="http://i80.servimg.com/u/f80/16/46/34/02/mousta10.png" /><br /><br /><br /><div style="width:390px; height:100px; border-left:2px solid black; border-right: 2px solid black; border-radius: 25px; background-color: #f0e735; overflow:auto;margin: auto;"><img src="http://i80.servimg.com/u/f80/16/46/34/02/yellow10.png" title="Il était une fois" /><div style="margin-left:10px; color: black; text-align: left;">Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue. Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue. Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue. Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue. Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue. </div></div><br /><div style="font-size:25px; color: black; text-align: center;">•    •    •</div><br /><div style="width:390px; height:100px; border-left:2px solid black; border-right: 2px solid black; border-radius: 25px; background-color: #99f035; overflow:auto;margin: auto;"><img src="http://i80.servimg.com/u/f80/16/46/34/02/green10.png" title="Les statistiques, et autres infos" /><div style="margin-left:10px;color: black; text-align: left;">Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.</div></div><br /><div style="font-size:25px; color: black; text-align: center;">•    •    •</div><br /><div style="width:390px; height:100px; border-left:2px solid black; border-right: 2px solid black; border-radius: 25px; background-color: #96b6f5; overflow:auto;margin: auto;"><img src="http://i80.servimg.com/u/f80/16/46/34/02/blue10.png" title="Le mot de la fin" /><div style="margin-left:10px;color:black; text-align: left;">Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.Il était une fois, au pays des Bisounours, une coquille d’œuf et une fleur bleue.</div></div><br /><br /><div style="margin-right:10px; font-size:11px; text-align: right; color: black;">code by <a href="http://www.never-utopia.com/"><i>Illusion</i></a> (c)</div></div>

Code:

<style>#img_halo, #img_halo2, #img_halo3{text-align:center;font-size:7px;width:45px;height:58px;margin:10px auto;position:absolute;z-index:1;overflow:hidden;}#img_halo{background-image:url('http://img96.xooimage.com/files/9/a/5/parchopetit2-3dd1fdf.png')}#img_halo2{background-image:url('http://img97.xooimage.com/files/9/6/d/parchopetit3-3dd20d0.png')}#img_halo3{background-image:url('http://img97.xooimage.com/files/b/3/2/parchopetit4-3dd2256.png')}#img_halo:hover, #img_halo1:hover, #img_halo2:hover, #img_halo3:hover{font-size:14px;z-index:2;height:350px;width:250px;margin-left:-60px;margin-top:-100px;margin-left:0;margin-right:0;background-image:url('http://img96.xooimage.com/files/e/8/8/parcho-1.5-3dd1e54.png')}#img_halo1, #img_halo4{text-align:center;font-size:7px;width:60px;height:30px;margin:10px auto;position:absolute;z-index:1;overflow:hidden;}#img_halo1{background-image:url('http://img96.xooimage.com/files/2/a/f/parcholongpetit1-3dd2481.png')}#img_halo4{background-image:url('http://img96.xooimage.com/files/2/a/f/parcholongpetit1-3dd2481.png')}#img_halo1:hover, #img_halo4:hover{background-image:url('http://img98.xooimage.com/files/0/f/6/parcholong-3dd23be.png');z-index:2;height:150px;width:250px;margin-bottom:0;margin-top:-100px;margin-left:0;margin-right:0;font-size:14px}.fond{background-position:0% 50%;background-image:url('http://img92.xooimage.com/files/9/1/d/pa-3-3d383ff.png');background-repeat:no-repeat;height:197px;}.tabcenter{margin-left:auto;margin-right:auto;}.texte{opacity:0;overflow:hidden;font-size:12px}.texte:hover{opacity:1;padding:15px;width:200px;height:280px;overflow:auto}.texte2{opacity:0;overflow:hidden;font-size:12px}.texte2:hover{opacity:1;padding:15px;width:200px;height:80px;overflow:auto}</style>

<div class="fond" style="color:#000000"><table style="height:150px;width:200px;padding-top:10px;padding-left:55px;"><td><div style="margin-bottom:35px"><span id="img_halo1">Statistiques
<div class="texte2">TEXTE</div></span></div></td><td><div style="margin-top:15px;margin-left:15px"><span id="img_halo">Contexte
<div class="texte">TEXTE</div></span></div></td><td><div style="margin-bottom:10px;margin-left:55px"><span  id="img_halo2">Prédéfinis
<div class="texte">TEXTE</div></span></div></td><td><div style="margin-left:55px;margin-bottom:45px"><span id="img_halo3">Infos
<div class="texte">TEXTE</div></span></div></td><td><div style="margin-top:70px;margin-right:10px"><span id="img_halo4">Boutons<div class="texte2">TEXTE</div></span></div></td></table></div>

Spoiler:

Code:

<div style="border: 4px solid #000000; -moz-border-radius: 10px; -webkit-border-radius: 10px; background-attachment: fixed; background-color: #C4D3D9; width: 650px;">


<center><a href="LIEN DE TON FORUM"><img src="LIEN DE LA BANNIERE OU MINI BANNIERE" alt="NOM DE TON FORUM"/></a></center>
<span style="font-family: Lucida Handwriting; font-style: italic; font size: 70px">
<center>NOM DU FORUM</center>
</span>


<center><div style="border: 2px dashed #000000;font-size: large; -moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: white";>Déscription</div></center>
Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici

<center><div style="border: 2px dashed #000000;font-size: large; -moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: white";>Nouvelles</div></center>
Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici

<center><div style="border: 2px dashed #000000;font-size: large; -moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: white";>Statistiques</div></center>
Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici

<center><div style="border: 2px dashed #000000;font-size: large; -moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: white";>Crédits Du forum</div></center>
Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici  Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici Ton Texte Ici

<span style="border: 2px dotted #000000; font-size: 10px; background-color: #ffffff;">© Fiche Crée Par Natsu Dragneel de <a href="http://www.never-utopia/">Never utopia</a> </span></div>

Spoiler:

Code:

<iframe src="votre lien de page html" width="610px" height="1175"; frameborder="no"; ></iframe>

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Fiche pub</title>
<style type="text/css">

.titre-forum
{
font-family: "palatino linotype",palatino,serif;
color: #545D5E;
margin-top: -60px;
margin-bottom: 15px;
font-size: 30px;
font-weight: bold;
text-transform: uppercase;
text-align: center;
text-shadow: 3px 3px 1px #cccccc;
filter: dropshadow(color=#cccccc, offx=3, offy=3);
}

.header {
border-bottom:ridge 1px #161616;
margin: auto;
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgb(255,255,255) 0%, rgb(229,229,229) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(255,255,255)), color-stop(100%,rgb(229,229,229))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* IE10+ */
background: linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */

width: 560px;
height: 80px;
-moz-border-radius: 20px 20px 0px 10px / 10px 10px 10px 0px;
-webkit-border-radius: 20px 20px 0px 10px / 10px 10px 10px 0px;
-khtml-border-radius: 20px 20px 0px 10px / 10px 10px 10px 0px;
border-radius: 20px 20px 0px 10px / 10px 10px 10px 0px;
-moz-box-shadow: 2px 4px 4px #8a8a8a;
-webkit-box-shadow: 2px 4px 4px #8a8a8a;
box-shadow: 2px 4px 4px #8a8a8a;

 
   
}



.back {
background: rgb(238,238,238); /* Old browsers */
background: -moz-linear-gradient(top,  rgb(238,238,238) 0%, rgb(204,204,204) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(238,238,238)), color-stop(100%,rgb(204,204,204))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgb(238,238,238) 0%,rgb(204,204,204) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgb(238,238,238) 0%,rgb(204,204,204) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgb(238,238,238) 0%,rgb(204,204,204) 100%); /* IE10+ */
background: linear-gradient(top,  rgb(238,238,238) 0%,rgb(204,204,204) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */

-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
border-top: 3px solid #cccccc;
border-bottom: 2px solid #cccccc;
}

.titre {
color: #eae9e9;
font-family: helvetica,serif;
margin-bottom: 10px;
padding: 1px;
font-size: 16px;

}

.lier {
color: #eae9e9;
font-family: helvetica,serif;
margin-bottom: 10px;
padding: 1px;
font-size: 16px;
text-align: center;
background-color: #eae9e9;
background-repeat: no-repeat;
background-position: center center;
font-size: 18px;
letter-spacing: 4px;
display: block;
width: 100%;
color: #717171;
}

.stat {
color: #eae9e9;
font-family: helvetica,serif;
margin-bottom: 10px;
padding: 1px;
font-size: 16px;
text-align: center;
background-color: #eae9e9;
background-repeat: no-repeat;
background-position: center center;
font-size: 18px;
letter-spacing: 4px;
display: block;
width: 100%;
color: #717171;
}

.lien a {
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgb(255,255,255) 0%, rgb(229,229,229) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(255,255,255)), color-stop(100%,rgb(229,229,229))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* IE10+ */
background: linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
background-repeat: no-repeat;
background-position: center center;
font-size: 13px;
display: block;
width: 100%;
height: 34px;
color: #717171;
text-shadow: 1px 1px 0px #FFFFFF;
line-height: 34px;
}

.lien a:hover {
background: rgb(226,226,226); /* Old browsers */
background: -moz-linear-gradient(top, rgb(226,226,226) 0%, rgb(219,219,219) 50%, rgb(209,209,209) 51%, rgb(254,254,254) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(226,226,226)), color-stop(50%,rgb(219,219,219)), color-stop(51%,rgb(209,209,209)), color-stop(100%,rgb(254,254,254))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgb(226,226,226) 0%,rgb(219,219,219) 50%,rgb(209,209,209) 51%,rgb(254,254,254) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgb(226,226,226) 0%,rgb(219,219,219) 50%,rgb(209,209,209) 51%,rgb(254,254,254) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgb(226,226,226) 0%,rgb(219,219,219) 50%,rgb(209,209,209) 51%,rgb(254,254,254) 100%); /* IE10+ */
background: linear-gradient(top, rgb(226,226,226) 0%,rgb(219,219,219) 50%,rgb(209,209,209) 51%,rgb(254,254,254) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=0 ); /* IE6-9 */
background-repeat: no-repeat;
background-position: center center;
font-size: 13px;
display: block;
width: 100%;
height: 34px;
color: #717171;
text-shadow: 1px 1px 0px #FFFFFF;
line-height: 34px;
}


.bod {
background-color: #aaaaaa;
min-height: 58px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

.para {
display: block;
float: left;
margin-left: 10px;
margin-top: 3px;
position: absolute;
width: 260px;
height: 150px;
overflow: auto;
border: double 2px #000000;
padding: 1px;   
}

.para1 {
display: block;
position: absolute;
float: left;
margin-top: 3px;
margin-left: 280px;
width: 260px;
height: 150px;
overflow: auto;
border: double 2px #000000;
padding: 1px;   
}

.para2 {
display: block;
position: absolute;
float: left;
margin-left: 10px;
margin-top: 165px;
width: 260px;
height: 150px;
overflow: auto;
border: double 2px #000000;
padding: 1px;   
}

.para3 {
display: block;
position: absolute;
float: left;
margin-left: 280px;
margin-top: 165px;
width: 260px;
height: 150px;
overflow: auto;
border: double 2px #000000;
padding: 1px;
margin-bottom: 50px;   
}

.second {
background-color: #aaaaaa;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
width: 555px;
height: 330px;
margin: auto;
border: 1px dotted #000;
text-align: justify;
color: #eae9e9;
font-size: 13px;
}

.troisième {
background-color: #aaaaaa;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
width: 555px;
margin: auto;
border: 1px dotted #000;
text-align: center;
color: #eae9e9;
font-size: 13px;
}

.quatrième {
background-color: #aaaaaa;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
width: 555px;
margin: auto;
border: 1px dotted #000;
text-align: center;
color: #eae9e9;
font-size: 13px;
}

.border {
border: 1px dotted #000;
width: 555px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
margin-left: auto;
margin-right: auto;
}

.qeel_infos {
color: #000;   
background: rgb(245,246,246); /* Old browsers */
background: -moz-linear-gradient(top, rgb(245,246,246) 0%, rgb(219,220,226) 21%, rgb(184,186,198) 49%, rgb(221,223,227) 80%, rgb(245,246,246) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(245,246,246)), color-stop(21%,rgb(219,220,226)), color-stop(49%,rgb(184,186,198)), color-stop(80%,rgb(221,223,227)), color-stop(100%,rgb(245,246,246))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgb(245,246,246) 0%,rgb(219,220,226) 21%,rgb(184,186,198) 49%,rgb(221,223,227) 80%,rgb(245,246,246) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgb(245,246,246) 0%,rgb(219,220,226) 21%,rgb(184,186,198) 49%,rgb(221,223,227) 80%,rgb(245,246,246) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgb(245,246,246) 0%,rgb(219,220,226) 21%,rgb(184,186,198) 49%,rgb(221,223,227) 80%,rgb(245,246,246) 100%); /* IE10+ */
background: linear-gradient(top, rgb(245,246,246) 0%,rgb(219,220,226) 21%,rgb(184,186,198) 49%,rgb(221,223,227) 80%,rgb(245,246,246) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f6', endColorstr='#f5f6f6',GradientType=0 ); /* IE6-9 */
width: 500px;
padding: 10px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
margin-left: auto;
margin-right: auto;
}
   
</style>
</head>


<body>
<table width="600" border="0" cellspacing="0" cellpadding="10" class="back">
  <tr>
    <td><div class="header"></div><div class= titre-forum> Ton Forum </div></td>
  </tr>
  <tr>
    <td><div class="border">
    <div class="bod">
  <table width="100%" border="0" cellspacing="5" cellpadding="0" style="height: 58px;">
  <tr>
    <td width="83" align="center" valign="middle" class="lien"><a href="http://" target="_blank">Lien</a><td width="83" align="center" valign="middle" class="lien"><a href="http://" target="_blank">Lien</a><td width="83" align="center" valign="middle" class="lien"><a href="http://" target="_blank">Lien</a><td width="83" align="center" valign="middle" class="lien"><a href="http://" target="_blank">Lien</a><td width="83" align="center" valign="middle" class="lien"><a href="http://" target="_blank">Lien</a></td>

  </tr></table></div></div>


<div class="second">
<table width="100%" border="0" cellspacing="10">
  <tr>
    <div class="para"width="90%"valign="top"><p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p></div>
<div class="para1"width="90%"valign="top"><p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p></div>
    <div class="para2"width="90%"valign="top"><p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p></div>
    <div class="para3"width="90%"valign="top"><p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p></div>
    </tr></table></div>
     
<div class="troisième">
<table width="100%" border="0" cellspacing="10">
  <tr>
    <td class="pub" width="90%" valign="top">
  <span class="lier"> Nous lier ?</span><br><br>
    <a href="http://www.never-utopia.com/" target="_blank"><img src="http://i70.servimg.com/u/f70/09/00/56/80/miniba15.png"/></a><br><br>
    <textarea><a href="http://www.never-utopia.com/" target="_blank"><img src="http://i70.servimg.com/u/f70/09/00/56/80/miniba15.png"/></a></textarea><br><br>
   
    <a href="http://www.never-utopia.com/" target="_blank"><img src="http://img4.hostingpics.net/pics/666823logo6.jpg"/></a><br><br>
    <textarea><a href="http://www.never-utopia.com/" target="_blank"><img src="http://img4.hostingpics.net/pics/666823logo6.jpg"/></a></textarea><br><br>
   
    <a href="http://www.never-utopia.com/" target="_blank"><img src="http://img4.hostingpics.net/pics/876649logo1.jpg"/></a><br><br>
    <textarea><a href="http://www.never-utopia.com/" target="_blank"><img src="http://img4.hostingpics.net/pics/876649logo1.jpg"/></a></textarea>
    </td></tr></table></div>
   
    <div class="quatrième">
<table width="100%" border="0" cellspacing="10">
  <tr>
    <td class="stats" width="90%" valign="top">
  <span class="stat">Quelques Stats</span><br><br>
<div class="qeel_infos">Nous avons <strong><span class="FORUMCOUNTUSER">0</span></strong> utilisateurs enregistrés.<br>
Nos membres ont postés un total de <strong><span class="FORUMCOUNTPOST">0</span></strong> messages.<br>
Dernier membre à nous avoir rejoints. <strong><span class="FORUMLASTUSER">Klash</span></strong>.<br>
</div><br />Mise en page et codage par © <a href="http://www.never-utopia.com/">Never-Utopia</a></td></tr></table></div>
</body>
</html>

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Fiche pub</title>
<style type="text/css">
body {
  margin: 0px;
  }
.titre-forum
{
font-family: "palatino linotype",palatino,serif;
color: #545D5E;
margin-top: -60px;
margin-bottom: 15px;
font-size: 30px;
font-weight: bold;
text-transform: uppercase;
text-align: center;
text-shadow: 3px 3px 1px #cccccc;
filter: dropshadow(color=#cccccc, offx=3, offy=3);
}

.header {
border-bottom:ridge 1px #161616;
margin: auto;
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgb(255,255,255) 0%, rgb(229,229,229) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(255,255,255)), color-stop(100%,rgb(229,229,229))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* IE10+ */
background: linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */

width: 560px;
height: 80px;
-moz-border-radius: 20px 20px 0px 10px / 10px 10px 10px 0px;
-webkit-border-radius: 20px 20px 0px 10px / 10px 10px 10px 0px;
-khtml-border-radius: 20px 20px 0px 10px / 10px 10px 10px 0px;
border-radius: 20px 20px 0px 10px / 10px 10px 10px 0px;
-moz-box-shadow: 2px 4px 4px #8a8a8a;
-webkit-box-shadow: 2px 4px 4px #8a8a8a;
box-shadow: 2px 4px 4px #8a8a8a; 
}


.back {
background: rgb(238,238,238); /* Old browsers */
background: -moz-linear-gradient(top,  rgb(238,238,238) 0%, rgb(204,204,204) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(238,238,238)), color-stop(100%,rgb(204,204,204))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgb(238,238,238) 0%,rgb(204,204,204) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgb(238,238,238) 0%,rgb(204,204,204) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgb(238,238,238) 0%,rgb(204,204,204) 100%); /* IE10+ */
background: linear-gradient(top,  rgb(238,238,238) 0%,rgb(204,204,204) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */

-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
border-top: 3px solid #cccccc;
border-bottom: 2px solid #cccccc;
}

.titre {
color: #eae9e9;
font-family: helvetica,serif;
margin-bottom: 10px;
padding: 1px;
font-size: 16px;

}

.lier {
color: #eae9e9;
font-family: helvetica,serif;
margin-bottom: 10px;
padding: 1px;
font-size: 16px;
text-align: center;
background-color: #eae9e9;
background-repeat: no-repeat;
background-position: center center;
font-size: 18px;
letter-spacing: 4px;
display: block;
width: 100%;
color: #717171;
}

.stat {
color: #eae9e9;
font-family: helvetica,serif;
margin-bottom: 10px;
padding: 1px;
font-size: 16px;
text-align: center;
background-color: #eae9e9;
background-repeat: no-repeat;
background-position: center center;
font-size: 18px;
letter-spacing: 4px;
display: block;
width: 100%;
color: #717171;
}

.lien a {
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgb(255,255,255) 0%, rgb(229,229,229) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(255,255,255)), color-stop(100%,rgb(229,229,229))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* IE10+ */
background: linear-gradient(top, rgb(255,255,255) 0%,rgb(229,229,229) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
background-repeat: no-repeat;
background-position: center center;
font-size: 13px;
display: block;
width: 100%;
height: 34px;
color: #717171;
text-shadow: 1px 1px 0px #FFFFFF;
line-height: 34px;
}

.lien a:hover {
background: rgb(226,226,226); /* Old browsers */
background: -moz-linear-gradient(top, rgb(226,226,226) 0%, rgb(219,219,219) 50%, rgb(209,209,209) 51%, rgb(254,254,254) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(226,226,226)), color-stop(50%,rgb(219,219,219)), color-stop(51%,rgb(209,209,209)), color-stop(100%,rgb(254,254,254))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgb(226,226,226) 0%,rgb(219,219,219) 50%,rgb(209,209,209) 51%,rgb(254,254,254) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgb(226,226,226) 0%,rgb(219,219,219) 50%,rgb(209,209,209) 51%,rgb(254,254,254) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgb(226,226,226) 0%,rgb(219,219,219) 50%,rgb(209,209,209) 51%,rgb(254,254,254) 100%); /* IE10+ */
background: linear-gradient(top, rgb(226,226,226) 0%,rgb(219,219,219) 50%,rgb(209,209,209) 51%,rgb(254,254,254) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=0 ); /* IE6-9 */
background-repeat: no-repeat;
background-position: center center;
font-size: 13px;
display: block;
width: 100%;
height: 34px;
color: #717171;
text-shadow: 1px 1px 0px #FFFFFF;
line-height: 34px;
}


.bod {
background-color: #aaaaaa;
min-height: 58px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

.para {
display: block;
float: left;
margin-left: 10px;
margin-top: 3px;
position: absolute;
width: 260px;
height: 150px;
overflow: auto;
border: double 2px #000000;
padding: 1px;
}

.para1 {
display: block;
position: absolute;
float: left;
margin-top: 3px;
margin-left: 280px;
width: 260px;
height: 150px;
overflow: auto;
border: double 2px #000000;
padding: 1px;
}

.para2 {
display: block;
position: absolute;
float: left;
margin-left: 10px;
margin-top: 165px;
width: 260px;
height: 150px;
overflow: auto;
border: double 2px #000000;
padding: 1px;
}

.para3 {
display: block;
position: absolute;
float: left;
margin-left: 280px;
margin-top: 165px;
width: 260px;
height: 150px;
overflow: auto;
border: double 2px #000000;
padding: 1px;
margin-bottom: 50px;
}

.second {
background-color: #aaaaaa;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
width: 555px;
height: 330px;
margin: auto;
border: 1px dotted #000;
text-align: justify;
color: #eae9e9;
font-size: 13px;
}

.troisième {
background-color: #aaaaaa;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
width: 555px;
margin: auto;
border: 1px dotted #000;
text-align: center;
color: #eae9e9;
font-size: 13px;
}

.quatrième {
background-color: #aaaaaa;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
width: 555px;
margin: auto;
border: 1px dotted #000;
text-align: center;
color: #eae9e9;
font-size: 13px;
}

.border {
border: 1px dotted #000;
width: 555px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
margin-left: auto;
margin-right: auto;
}

.qeel_infos {
color: #000;
background: rgb(245,246,246); /* Old browsers */
background: -moz-linear-gradient(top, rgb(245,246,246) 0%, rgb(219,220,226) 21%, rgb(184,186,198) 49%, rgb(221,223,227) 80%, rgb(245,246,246) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(245,246,246)), color-stop(21%,rgb(219,220,226)), color-stop(49%,rgb(184,186,198)), color-stop(80%,rgb(221,223,227)), color-stop(100%,rgb(245,246,246))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgb(245,246,246) 0%,rgb(219,220,226) 21%,rgb(184,186,198) 49%,rgb(221,223,227) 80%,rgb(245,246,246) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgb(245,246,246) 0%,rgb(219,220,226) 21%,rgb(184,186,198) 49%,rgb(221,223,227) 80%,rgb(245,246,246) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgb(245,246,246) 0%,rgb(219,220,226) 21%,rgb(184,186,198) 49%,rgb(221,223,227) 80%,rgb(245,246,246) 100%); /* IE10+ */
background: linear-gradient(top, rgb(245,246,246) 0%,rgb(219,220,226) 21%,rgb(184,186,198) 49%,rgb(221,223,227) 80%,rgb(245,246,246) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f6', endColorstr='#f5f6f6',GradientType=0 ); /* IE6-9 */
width: 500px;
padding: 10px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
margin-left: auto;
margin-right: auto;
}
 
</style>
</head>


<body>
<table width="600" border="0" cellspacing="0" cellpadding="10" class="back">
  <tr>
    <td>
      <div class="header"></div>
      <div class= titre-forum> Ton Forum </div>
    </td>
  </tr>
  <tr>
    <td>
      <div class="border">
        <div class="bod">
          <table width="100%" border="0" cellspacing="5" cellpadding="0" style="height: 58px;">
            <tr>
              <td width="83" align="center" valign="middle" class="lien">
                <a href="http://" target="_blank">Lien</a>
              </td>
              <td width="83" align="center" valign="middle" class="lien">
                <a href="http://" target="_blank">Lien</a>
              </td>
              <td width="83" align="center" valign="middle" class="lien">
                <a href="http://" target="_blank">Lien</a>
              </td>
              <td width="83" align="center" valign="middle" class="lien">
                <a href="http://" target="_blank">Lien</a>
              </td>
              <td width="83" align="center" valign="middle" class="lien">
                <a href="http://" target="_blank">Lien</a>
              </td>
            </tr>
          </table>
        </div>
      </div>
      <div class="second">
        <table width="100%" border="0" cellspacing="10">
          <tr>
            <div class="para"width="90%"valign="top"><p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p></div>
            <div class="para1"width="90%"valign="top"><p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p></div>
            <div class="para2"width="90%"valign="top"><p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p></div>
            <div class="para3"width="90%"valign="top"><p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p></div>
          </tr>
        </table>
      </div>
      <div class="troisième">
        <table width="100%" border="0" cellspacing="10">
          <tr>
            <td class="pub" width="90%" valign="top">
              <span class="lier"> Nous lier ?</span><br /><br />
              <a href="http://www.never-utopia.com/" target="_blank"><img src="http://i70.servimg.com/u/f70/09/00/56/80/miniba15.png"/></a><br /><br />
              <textarea><a href="http://www.never-utopia.com/" target="_blank"><img src="http://i70.servimg.com/u/f70/09/00/56/80/miniba15.png"/></a></textarea><br /><br />
   
              <a href="http://www.never-utopia.com/" target="_blank"><img src="http://img4.hostingpics.net/pics/666823logo6.jpg"/></a><br /><br />
              <textarea><a href="http://www.never-utopia.com/" target="_blank"><img src="http://img4.hostingpics.net/pics/666823logo6.jpg"/></a></textarea><br /><br />
   
              <a href="http://www.never-utopia.com/" target="_blank"><img src="http://img4.hostingpics.net/pics/876649logo1.jpg"/></a><br /><br />
    <textarea><a href="http://www.never-utopia.com/" target="_blank"><img src="http://img4.hostingpics.net/pics/876649logo1.jpg"/></a></textarea>
    </td></tr></table></div>
   
    <div class="quatrième">
<table width="100%" border="0" cellspacing="10">
  <tr>
    <td class="stats" width="90%" valign="top">
      <span class="stat">Quelques Stats</span><br /><br />
      <div class="qeel_infos">Nous avons <strong><span class="FORUMCOUNTUSER">0</span></strong> utilisateurs enregistrés.<br />
        Nos membres ont postés un total de <strong><span class="FORUMCOUNTPOST">0</span></strong> messages.<br />
        Dernier membre à nous avoir rejoints. <strong><span class="FORUMLASTUSER">Klash</span></strong>.<br />
      </div><br />Mise en page et codage par © <a href="http://www.never-utopia.com/">Never-Utopia</a></td></tr></table></div></td></tr></table>
</body>
</html>

Code:

<iframe src="votre lien de page html" style="width: 610px; height: 1175px; margin: auto; border: none;"></iframe>