MY LONDON

Code:: /***DÉBUT PA BY ELLA'***/
.ensemble {
  width: 700px;
  height: auto;
  background-color: #FFA34F;
  box-shadow: 0px 0px 15px 0px #000000;
}

.bienvenue {
  font-size: 45px;
  font-family: 'Playball';
  color: #cc0000;
}

.premier {
  width: 320px;
  height: 200px;
  background-color: #f0c298;
  border: 2px solid #000000;
  padding: 3px;
  overflow: auto;
}

.titrepa {
  font-size: 25px;
  font-family: 'Nothing You Could Do';
  color: #990000;
}

.predef {
  width: 280px;
  height: 130px;
  float: right;
  text-align: left;
  padding: 5px;
  padding-top: 25px;
}

.infobulle1 {line-height: 10px;
  width: 53px;
  height: 53px;
  padding: 1px;
  background: #f0c298;
  text-align: center;
  font-size: 10px;
  top:0; left:0; opacity:0; transition: opacity 1s ease; }

.infobulle1:hover { opacity:0.9; }

.infobulle {
  width: 55px;
  height: 55px;
  margin: 2px;
  display: inline-block;
  z-index: 1;
  background-color: #f0c298;
  color: #000000;
  text-decoration: none;
}

.partos {
  width: 280px;
  height: 44px;
  background-color: #f0c298;
  overflow: hidden;
  padding: 5px;
  border-radius: 5px;
  border: 1px solid #cecece;
   margin-bottom: 4px;
}

.liens {
  width: 100px;
  height: 245px;
  background-color: #f0c298;
  border: 1px solid #cecece;
  border-radius: 5px;
  text-align: center;
  font-size: 14px;
}

.staff {
  width: 258px;
  height: 245px;
  background-color: #f0c298;
  border: 1px solid #cecece;
  overflow: auto;
  border-radius: 5px;
}

.infobulle2 {line-height: 10px;
  width: 118px;
  height: 48px;
  padding: 1px;
  background: #f0c298;
  text-align: center;
  font-size: 10px;
  top:0; left:0; opacity:0; transition: opacity 1s ease; }

.infobulle2:hover { opacity:0.9; }

.infobullestaff {
  width: 120px;
  height: 50px;
  margin: 2px;
  display: inline-block;
  z-index: 1;
  background-color: #f0c298;
  color: #000000;
  text-decoration: none;
}

/***FIN PA***/

Code:: <link href="http://fonts.googleapis.com/css?family=Playball" rel="stylesheet" type="text/css" /><link href="http://fonts.googleapis.com/css?family=Nothing+You+Could+Do" rel="stylesheet" type="text/css" />
<div class="ensemble">

<div class="bienvenue">
   Bienvenue sur Misfits {USERNAME}
</div><br />
<table>

<tbody>

<tr>

<td>

<div class="premier">

<div class="titrepa">
   Contexte
</div><br />2009.<br />Un orage violent et inattendu s'abat sur Londres. Tandis que les grêlons se fracassent contre le sol, certaines personnes se retrouvent foudroyées. Projetées à terre avec brutalité, toutes ressentent une sensation inconnue pour le moins étrange et inhabituelle. <br />C'est ainsi que les ennuis ont commencé.<br />Des dons se sont manifestés chez les personnes ayant été touchées par ce curieux et étrange orage, causant par conséquent énormément de problèmes surnaturels et, de temps à autre, inexplicables. <br />Néanmoins, au fil du temps, les londoniens se sont acclimatés à leurs pouvoirs respectifs et les gens demeurant dépourvus de toute capacité surnaturelle quelle qu'elle soit n'ont pas été mis au courant de cette nouvelle particularité.<br /><a href="#">La suite ?</a>
</div>

</td>

<td>

<div class="premier">

<div class="titrepa">
   News
</div><br />ICI TU LOGES LES NEWS
</div>

</td>

</tr>

</tbody>

</table><br />
<table>

<tbody>

<tr>

<td>

<div class="titrepa">
   Prédéfinis
</div>

<div class="predef">

<table>

<tbody>

<tr>

<td>

<div style="background-image:url(http://www.auplod.com/u/pduloa78a80.jpeg);" class="infobulle">

<div class="infobulle1">
   Kayl <br />300 ans Codeuse
</div>

</div><br />
<div class="infobulle" style="background-image:url(http://www.auplod.com/u/pduloa78a80.jpeg);">

<div class="infobulle1">
   Nom Prénom Âge
</div>

</div><br />
</td>

<td>

<div style="background-image:url(http://www.auplod.com/u/pduloa78a80.jpeg);" class="infobulle">

<div class="infobulle1">
   Nom Prénom Âge
</div>

</div><br />
<div style="background-image:url(http://www.auplod.com/u/pduloa78a80.jpeg);" class="infobulle">

<div class="infobulle1">
   Nom Prénom Âge
</div>

</div><br />
</td>

<td>

<div style="background-image:url(http://www.auplod.com/u/pduloa78a80.jpeg);" class="infobulle">

<div class="infobulle1">
   Nom Prénom Âge
</div>

</div><br />
<div style="background-image:url(http://www.auplod.com/u/pduloa78a80.jpeg);" class="infobulle">

<div class="infobulle1">
   Nom Prénom Âge
</div>

</div><br />
</td>

<td>

<div style="background-image:url(http://www.auplod.com/u/pduloa78a80.jpeg);" class="infobulle">

<div class="infobulle1">
   Nom Prénom - Âge
</div>

</div><br />
<div style="background-image:url(http://www.auplod.com/u/pduloa78a80.jpeg);" class="infobulle">

<div class="infobulle1">
   Nom Prénom Âge
</div>

</div><br />
</td>

</tr>

</tbody>

</table>

</div><br />
<div class="partos">

<marquee>
   <br /><a href="#"><img src="http://data.bloggif.com/distant/user/store/c/6/8/a/289b2c926425833c548b09590d72a86c.png" /></a> - <a href="#"><img src="URL" /></a> - <a href="#"><img src="URL" /></a> - <a href="#"><img src="URL" /></a> - <a href="#"><img src="URL" /></a> - <a href="#"><img src="URL" /></a> - <a href="#"><img src="URL" /></a> - <a href="#"><img src="URL" /></a>
</marquee>

</div>

</td>

<td>

<div class="liens">
   <br /> <a href="#">Règlement</a><br /><br /><a href="#">Groupes</a><br /><br /><a href="#">Effectifs</a><br /><br /><a href="#">Suggestions</a><br /><br /><a href="#">Questions</a><br /><br /><a href="#">Pubs</a><br /><br /><a href="#">Partenaires</a><br />
</div>

</td>

<td>

<div class="staff">

<table>

<tbody>

<tr>

<td>

<div class="infobullestaff" style="background-image:url(http://www.auplod.com/u/apulod78e0d.png);">

<div class="infobulle2">
   <br />Passy - Fonda<br />Présente
</div>

</div><br />
</td>

<td>

<div class="infobullestaff" style="background-image:url(http://vignette4.wikia.nocookie.net/desencyclopedie/images/0/0a/Grosnoir.png/revision/latest?cb=20090319101943);">

<div class="infobulle2">
   <br />Machin - Rang<br />Présence
</div>

</div><br />
</td>

</tr>

</tbody>

</table>

<table>

<tbody>

<tr>

<td>

<div class="infobullestaff" style="background-image:url(http://vignette4.wikia.nocookie.net/desencyclopedie/images/0/0a/Grosnoir.png/revision/latest?cb=20090319101943);">

<div class="infobulle2">
   <br />Machin - Rang<br />Présence
</div>

</div><br />
</td>

<td>

<div class="infobullestaff" style="background-image:url(http://vignette4.wikia.nocookie.net/desencyclopedie/images/0/0a/Grosnoir.png/revision/latest?cb=20090319101943);">

<div class="infobulle2">
   <br />Machin - Rang<br />Présence
</div>

</div><br />
</td>

</tr>

</tbody>

</table>

<table>

<tbody>

<tr>

<td>

<div style="background-image:url(http://vignette4.wikia.nocookie.net/desencyclopedie/images/0/0a/Grosnoir.png/revision/latest?cb=20090319101943);" class="infobullestaff">

<div class="infobulle2">
   <br />Machin - Rang<br />Présence
</div>

</div><br />
</td>

<td>

<div style="background-image:url(http://vignette4.wikia.nocookie.net/desencyclopedie/images/0/0a/Grosnoir.png/revision/latest?cb=20090319101943);" class="infobullestaff">

<div class="infobulle2">
   <br />Machin - Rang<br />Présence
</div>

</div><br />
</td>

</tr>

</tbody>

</table>

</div>

</td>

</tr>

</tbody>

</table>

<div style="color: #FFFFFF; font-size: 7px; text-align: right;">
   © Codage by Ella'
</div>
</div>

» My London
» My London
» My London
» My London
» 2. My London (métiers)