Modèle de Fiche de présentation obligatoire

<center><link href='http://fonts.googleapis.com/css?family=Audiowide' rel='stylesheet' type='text/css'><link href='http://fonts.googleapis.com/css?family=Playball' rel='stylesheet' type='text/css'>
<style type="text/css"> .div_fond { background-color: #2a2a2a; border: 1px solid #000; border-bottom: 3px solid #000; border-radius: 0px 0px 5px 5px; } .div_irl { background-color: #2a2a2a; border: 1px solid #000; border-bottom: 3px solid #000; border-radius: 0px 0px 5px 5px; width: 400px; height: 100px; -webkit-transition: all 1s ease-in; -moz-transition: all 1s ease-in; -ms-transition: all 1s ease-in; -o-transition: all 1s ease-in; transition: all 1s ease-in; position: relative; margin-top: -220px; } .div_irl:hover { margin-top: -165px; -webkit-transition: margin 1s ease-in; -moz-transition: margin 1s ease-in; -ms-transition: margin 1s ease-in; -o-transition: margin 1s ease-in;  transition: margin 1s ease-in; position: relative; } .pseudo { margin-top: -16px; font-family: 'Playball', cursive; font-size: 35px; color: #434e4b; text-shadow: 1px 1px 1px #000; text-align: center; } .icon { width: 80px; height: 80px; box-shadow: 1px 1px 2px #000; margin-right: 5px; } .titre { font-family: 'Audiowide', cursive; font-size: 20px; letter-spacing: -1px; color: #587a7c; border-bottom: 1px solid #434e4b; text-shadow: 1px 1px 1px #000; text-align: left; margin-left: 5px; margin-top: -5px; } .credit { background-color: #505050; width: 200px; height: 15px; line-height: 15px; font-family: 'Audiowide', cursive; font-size: 12px; color: #2a2a2a; text-align: center; } .questions_id { font-family: 'Audiowide', cursive; color: #505050; font-size: 13px; } .select_option { font-family: 'Audiowide', cursive; font-size: 12px; color: #2a2a2a; background-color: #505050; border: none; padding: 3px; text-transform: small-caps; margin-top: 5px; margin-bottom: -5px; }</style>

<center><div style="background: none; width: 500px; height: 1250px;">
<div style="width: 500px; height: 1100px; z-index: 1; position: absolute;" class="div_fond"><img src="http://i.imgbox.com/GymexAU7.png" style="border-bottom: 6px double #434e4b;" /><div class="pseudo">Prénom <font style="color: #587a7c">Prénom</font> Nom</div><center>
<img src="http://i.imgbox.com/HddQyNED.gif" class="icon" /> <img src="http://i.imgbox.com/wR1jh3oq.gif" class="icon" /> <img src="http://i.imgbox.com/Q0lSMxxh.gif" class="icon" /></center><p class="titre">ID CARD</p><table height="340px" width="500px" cellpadding="4" style="margin-top: -35px;"><tr width="500px"><td width="200px" rowspan="2" height="340px"><img src="http://i.imgbox.com/gzPDGLsI.png" /><div class="credit">© eden memories</div></td><td width="300px" height="200px" style="font-family: trebuchet ms; color: #e0e0e0; font-size: 10px;"><font class="questions_id">Nom :</font> réponse ici
<font class="questions_id">Prénom's) :</font> réponse ici
<font class="questions_id">Âge :</font> réponse ici
<font class="questions_id">Date de naissance :</font> réponse ici
<font class="questions_id">Nationalité :</font> réponse ici
<font class="questions_id">Groupe :</font> réponse ici
<font class="questions_id">Situation :</font> réponse ici
<font class="questions_id">Métier :</font> réponse ici
<font class="questions_id">FT</font> réponse ici
<table align="center"><tr><td><select class="select_option"><option>Physique</option>
<option>option 1</option>
<option>option 2</option>
<option>option 3</option>
<option>option 4</option>
<option>option 5</option>
<option>option 6</option>
<option>option 7</option></select></td><td><select class="select_option"><option>Caractère</option>
<option>option 1</option>
<option>option 2</option>
<option>option 3</option>
<option>option 4</option>
<option>option 5</option>
<option>option 6</option>
<option>option 7</option></select></td></tr></table></td>
</tr><tr><td width="280px; height="140px"><div style="width: 280px; height: 140px; overflow: auto; font-family: trebuchet ms; color: #e0e0e0; font-size: 10px; text-align: justify; padding: 1x;">info sur ton personnage ♠ anecdote sur ton personnage ♠ info sur ton personnage ♠ anecdote sur ton personnage ♠ info sur ton personnage anecdote sur ton personnage ♠ info sur ton personnage ♠ anecdote sur ton personnage ♠ info sur ton personnage ♠  anecdote sur ton personnage ♠ info sur ton personnage ♠  anecdote sur ton personnage ♠ info sur ton personnage ♠  anecdote sur ton personnage ♠ info sur ton personnage ♠  anecdote sur ton personnage ♠ info sur ton personnage ♠  anecdote sur ton personnage ♠ info sur ton personnage ♠ anecdote sur ton personnage ♠ info sur ton personnage ♠ anecdote sur ton personnage ♠ info sur ton personnage</div></td></tr></table><p class="titre">HISTORY</p><table height="340px" width="500px" cellpadding="4" style="margin-top: -35px;"><tr width="500px"><td width="300px" height="50px" style="font-family: 'Playball', cursive; height: 50px; color: #434e4b; font-size: 15px; text-align: justify; overflow: auto; line-height: 12px;">citation citation citation citation citation citation citation citation citation citation citation citation citation citation citation citation citation citation (pas trop longue)</td><td width="200px" rowspan="2" height="340px"><img src="http://i.imgbox.com/3glPp9pX.png" /><div class="credit">© alaska</div></td></tr><tr><td width="280px; height="290px"><div style="width: 280px; height: 285px; overflow: auto; font-family: trebuchet ms; color: #e0e0e0; font-size: 10px; text-align: justify; padding: 1px;">histoire de ton personnage à placer ici. Racontes son enfance, ses souvenirs, ses joies, ses peines, ses rêves, sa situation actuelle, etc [b][color=#ff0000]Et n'oublie pas de dire ce qu'il pense de la Société et du système de couplage[/color][/b].

Et quoniam inedia gravi adflictabantur, locum petivere Paleas nomine, vergentem in mare, valido muro firmatum, ubi conduntur nunc usque commeatus distribui militibus omne latus Isauriae defendentibus adsueti. circumstetere igitur hoc munimentum per triduum et trinoctium et cum neque adclivitas ipsa sine discrimine adiri letali, nec cuniculis quicquam geri posset, nec procederet ullum obsidionale commentum, maesti excedunt postrema vi subigente maiora viribus adgressuri.

Exsistit autem hoc loco quaedam quaestio subdifficilis, num quando amici novi, digni amicitia, veteribus sint anteponendi, ut equis vetulis teneros anteponere solemus. Indigna homine dubitatio! Non enim debent esse amicitiarum sicut aliarum rerum satietates; veterrima quaeque, ut ea vina, quae vetustatem ferunt, esse debet suavissima; verumque illud est, quod dicitur, multos modios salis simul edendos esse, ut amicitiae munus expletum sit. histoire de ton personnage à  placer ici. Racontes son enfance, ses souvenirs, ses joies, ses peines, ses rêves, sa situation actuelle, etc. Et quoniam inedia gravi adflictabantur, locum petivere Paleas nomine, vergentem in mare, valido muro firmatum, ubi conduntur nunc usque commeatus distribui militibus omne latus Isauriae defendentibus adsueti. circumstetere igitur hoc munimentum per triduum et trinoctium et cum neque adclivitas ipsa sine discrimine adiri letali, nec cuniculis quicquam geri posset, nec procederet ullum obsidionale commentum, maesti excedunt postrema vi subigente maiora viribus adgressuri.

Exsistit autem hoc loco quaedam quaestio subdifficilis, num quando amici novi, digni amicitia, veteribus sint anteponendi, ut equis vetulis teneros anteponere solemus. Indigna homine dubitatio! Non enim debent esse amicitiarum sicut aliarum rerum satietates; veterrima quaeque, ut ea vina, quae vetustatem ferunt, esse debet suavissima; verumque illud est, quod dicitur, multos modios salis simul edendos esse, ut amicitiae munus expletum sit.</td>
</tr></table></div></div>

<div class="div_irl"><table width="400px" cellpadding="3"><tr width="100px"><td width="100px" rowspan="2" height="100px"><img src="http://i.imgbox.com/BTK1tDEV.jpg" style="margin-top: -10px; margin-left: -5px; border-radius: 0px 0px 0px 5px;" /></td><td width="300px" height="20px"><p class="titre">AND YOU ?!</p></tr><tr><td width="300px; height="80px"><div style="width: 280px; height: 70px; overflow: auto; font-family: trebuchet ms; color: #e0e0e0; font-size: 10px; text-align: justify; padding: 1x; margin-top: -25px;">Parles nous de toi en quelques mots dans cette partie. Parles nous de toi en quelques mots dans cette partie. Parles nous de toi en quelques mots dans cette partie. Parles nous de toi en quelques mots dans cette partie. Parles nous de toi en quelques mots dans cette partie. Parles nous de toi en quelques mots dans cette partie. Parles nous de toi en quelques mots dans cette partie. Parles nous de toi en quelques mots dans cette partie. Parles nous de toi en quelques mots dans cette partie. Parles nous de toi en quelques mots dans cette partie.</div></td></tr></table></div></div></center>