PA Villains don't get happy endings

/* PAGE ACCUEIL FORME 1 */

#f1_accueil
{
  width: 800px;
  height: 500px;
  margin: auto;
  background: url(http://i.imgbox.com/xumS3UE2.png);
  text-shadow: none !important;
}
#f1_accueil a
{
  color: #40819e !important;
  text-shadow: none !important;
}
#f1_accueil a:hover
{
  color: #40819e !important;
  text-shadow: none !important;
}
.f1_col1
{
  width: 300px;
  vertical-align: top;
}
.f1_contexte
{
  width: 220px;
  height: 300px;
  overflow: auto;
  margin-top: 100px;
  margin-left: 65px;
  text-align: justify;
  color: #7e6144;
  text-shadow: 1px 1px 0px #ffffff;
}
.f1_bloconglets
{
  margin-top: 80px;
}
.f1_onglet1, .f1_onglet2, .f1_onglet3
{
  display: inline-block;
  width: 110px;
  height: 50px;
}
.f1_onglet1
{
  margin-left: 50px;
  margin-right: 25px;
}
.f1_onglet2
{
  margin-right: 30px;
}
.f1_contenu1, .f1_contenu2, .f1_contenu3
{
  position: absolute;
  width: 0px;
  height: 220px;
  margin-top: 40px;
  padding-top: 40px;
  overflow: hidden;
  font-size: 11px;
  color: #7e6144;
}
.f1_contenu1
{
  margin-left: -10px;
}
.f1_contenu2
{
  margin-left: -149px;
}
.f1_contenu3
{
  margin-left: -294px;
}
.f1_onglet1:hover .f1_contenu1, .f1_onglet2:hover .f1_contenu2, .f1_onglet3:hover .f1_contenu3
{
  width: 400px;
}
.f1_liens
{
  display: block;
  text-align: center;
}
.f1_liens a
{
  font-size: 16px;
  font-weight: bold;
}
.f1_news, .f1_friends
{
  width: 200px;
  height: 200px;
  overflow: hidden;
  text-align: justify;
}
.f1_credits, .f1_topsites
{
  height: 150px;
  border-left: 1px solid #40819e;
  margin-left: 5px;
  padding: 5px;
  text-align: center;
}
.f1_staff1
{
  display: block;
  width: 25px;
  height: 25px;
  background: url() #ff99ff;
  margin-bottom: 20px;
  margin-top: 20px;
  border: 1px solid #ff99ff;
}
.f1_staff2
{
  display: block;
  width: 25px;
  height: 25px;
  background: url() #00cc66;
  margin-bottom: 20px;
  margin-top: 20px;
  border: 1px solid #00cc66;
}
.f1_staff3
{
  display: block;
  width: 25px;
  height: 25px;
  background: url() #ff9900;
  margin-bottom: 20px;
  margin-top: 20px;
  border: 1px solid #ff9900;
}
.f1_staff4
{
  display: block;
  width: 25px;
  height: 25px;
  background: url() #9933cc;
  margin-bottom: 20px;
  margin-top: 20px;
  border: 1px solid #9933cc;
}



.f1_staffcontenu1, .f1_staffcontenu2, .f1_staffcontenu3, .f1_staffcontenu4
{
  position: absolute;
  width: 0px;
  height: 150px;
  background: #ffffff;
  margin-left: 80px;
  overflow: hidden;
}
.f1_staffcontenu2
{
  margin-top: -72px;
}
.f1_staffcontenu3
{
  margin-top: -144px;
}
.f1_staffcontenu4
{
  margin-top: -144px;
}
.f1_staff1:hover .f1_staffcontenu1, .f1_staff2:hover .f1_staffcontenu2, .f1_staff3:hover .f1_staffcontenu3, .f1_staff4:hover .f1_staffcontenu4
{
  width: 300px;
  border: 1px solid #40819e;
}

<div id="f1_accueil">
<table style="width: 100%;">
<tr><td class="f1_col1"><div class="f1_contexte">
Dans tous les royaumes, on avait rarement vu une assemblée pareille. Pourtant ils étaient tous là. Des pirates aux sorcières, en passant par les fées maléfiques et les monstres en tout genre. Pas un n’avait manqué à l’appel. Après tout, ils attendaient tous leur heure, leur moment de gloire, leur fin heureuse. Ils ne savaient même pas qui avait lancé l’idée qui les avaient tous réunis. Probablement Maléfique et sa passion pour les malédictions. Ou la sorcière de la maison en pain d’épice, qui n’était jamais en reste question idée maléfique. « Et qu’est ce qui nous assure que cela marchera ? Parce que moi et votre magie… » S’exclama Barbe Noir avant de cracher au sol. Tous les sorciers et sorcières de l’assistance levèrent les yeux au ciel. C’était bien un truc de pirates de vouloir refuser la magie. La Méchante Reine le fixa d’un air dédaigneux. « Mes sorts ne m’ont jamais fait défaut. » <a href="http://villainsdontgethappy.forumactif.org/t2-contexte">La suite ?</a></div></td>
<td style="vertical-align: top;"><div class="f1_bloconglets">
<span class="f1_onglet1"><div class="f1_contenu1">
<span class="f1_liens"><a href="http://villainsdontgethappy.forumactif.org/t25-reglement">Règlement</a> - <a href="http://villainsdontgethappy.forumactif.org/t7-bottin-des-avatars">Bottin</a> - <a href="http://villainsdontgethappy.forumactif.org/f6-pantoufle-a-son-pied">Scénarios</a> </span>
<table><tr>
<td><div class="f1_news"><marquee direction="up" scrollamount="2" onmouseover="this.stop();" onmouseout="this.start();"><span style="display: block; text-align: justify;"> /!\ Vous ne pouvez pas choisir votre personnage de conte. Vous le découvrirez petit à petit <br><br>

<b>20/10/2014</b> - Nouvelle version faite par moonrise.<br>
<b>24/08/2014</b> - Ouverture du forum avec sa première version faite par mishmish.</span></marquee></div></td>
<td><div class="f1_credits">(c) Crédits du forum<br />
Le forum appartient à ses administratrices. <br>Design par moonrise de Bazzart.<br />
PA par <a href="http://www.never-utopia.com">Never-Utopia</a>.</div></td>
</tr></table>
</div></span>

<span class="f1_onglet2"><div class="f1_contenu2">
<span class="f1_staff1"><div class="f1_staffcontenu1"><center><img src="http://media.tumblr.com/tumblr_m5af4xIjtq1rqkf12.gif"; style="width: 150px;"><br>Willeminah O’Malley<br>Administratrice<br>aka maman dragibus</center></div></span>
<span class="f1_staff2"><div class="f1_staffcontenu2"><center><img src="http://media.tumblr.com/tumblr_lvnoirU7ON1qmekj2o1_500.gif"; style="width: 150px;"><br>Poppy Teegarden<br>Administratrice<br>aka luxette</center></div></span>
<span class="f1_staff3"><div class="f1_staffcontenu3"><center><img src="http://i2.photobucket.com/albums/y26/hannah_wood/evi/ffef2e30.gif"; style="width: 150px;"><br>Mélusine Na Eireann<br>Administratrice<br>aka malice</center></div></span>
<span class="f1_staff4"><div class="f1_staffcontenu4"><center><img src="http://media.tumblr.com/346fa8fce9097315b758523fd732fbac/tumblr_inline_mo5jngVnnG1qz4rgp.gif"; style="width: 150px;"><br>Shena Eloa<br>Administratrice<br>aka freya</center></div></span>

</div></span>

<span class="f1_onglet3"><div class="f1_contenu3">
<table><tr>
<td><div class="f1_friends"><marquee direction="up" scrollamount="2" onmouseover="this.stop();" onmouseout="this.start();"><center>partenaires</center>
<br><a href="http://the-after-world.forumactif.org/">The After World</a><br><a href="http://liveyourlifev2.forumactif.org/forum">Live your life</a><br><a href="http://www.what-about-now.net/">What about now</a><br><a href="http://voyager-la-bas.forumactif.org/">Là-bas</a><br><a href="#">Toi?</a><br><a href="#">Toi?</a><br ><a href="#">Toi?</a><br ><a href="#">Toi?</a><br ><a href="#">Toi?</a><br ></marquee></div></td>
<td><div class="f1_topsites">
topsites
</div></td>
</tr></table>
</div></span>

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