Code

Code:

<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: #2F3126; border: 1px solid #000; border-bottom: 3px solid #000; border-radius: 0px 0px 5px 5px; } .div_irl { background-color: #21221C; 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: #5A513F; 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: #21221C; border-bottom: 1px solid #21221C; text-shadow: 1px 1px 1px #000; text-align: left; margin-left: 5px; margin-top: -5px; } .credit { background-color: #5A513F; width: 200px; height: 15px; line-height: 15px; font-family: 'Audiowide', cursive; font-size: 12px; color: #21221C; text-align: center; } .questions_id { font-family: 'Audiowide', cursive; color: #5A513F; font-size: 13px; } .select_option { font-family: 'Audiowide', cursive; font-size: 12px; color: #5A513F; background-color: #21221C; 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://cdn.videogum.com/files/2011/10/walkingdeadbing8.gif" style="border-bottom: 6px double #21221C;" /><div class="pseudo">Prénom <font style="color: #1E1F17">Prénom</font> Nom</div><center>
<img src="http://wir.skyrock.net/wir/v1/resize/?c=isi&im=%2F7602%2F84227602%2Fpics%2F3099193019_1_3_BfuBqIvi.gif&w=100" class="icon" /> <img src="http://l-userpic.livejournal.com/113763209/31098288" class="icon" /> <img src="http://auto.img.v4.skyrock.net/5104/83615104/pics/3088119345_1_5_aF9CYH7T.gif" class="icon" /></center><p class="titre">GENERAL</p><table height="340px" width="500px" cellpadding="4" style="margin-top: -35px;"><tr width="500px"><td width="200px" rowspan="2" height="340px"><img src="https://31.media.tumblr.com/ef7707b887621400e2ade5d4fe5f6c8a/tumblr_n5qdpuNDna1qiiwoqo6_250.png" /><div class="credit">© eden memories</div></td><td width="300px" height="200px" style="font-family: trebuchet ms; color: #998B6F; 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 avant l'apocalypse:</font> réponse ici
<font class="questions_id">Ma famille:</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>Mental</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: #998B62; font-size: 10px; text-align: justify; padding: 1x;">Dans ton sac/ survie : Dit nous ce qu'il y a dans ton sac de survivant ainsi que comment tu survis actuellement en milieu hostile. Comment vis-tu cette apocalypse? Dit nous ce qu'il y a dans ton sac de survivant ainsi que comment tu survis actuellement en milieu hostile. Comment vis-tu cette apocalypse? Dit nous ce qu'il y a dans ton sac de survivant ainsi que comment tu survis actuellement en milieu hostile. Comment vis-tu cette apocalypse? Dit nous ce qu'il y a dans ton sac de survivant ainsi que comment tu survis actuellement en milieu hostile. Comment vis-tu cette apocalypse? Dit nous ce qu'il y a dans ton sac de survivant ainsi que comment tu survis actuellement en milieu hostile. Comment vis-tu cette apocalypse?</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: #010101; 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://i55.servimg.com/u/f55/18/66/94/20/15445710.jpg" /><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: #998B62; 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.

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: #998B62; font-size: 10px; text-align: justify; padding: 1x; margin-top: -25px;">Hello ! Derrière mon personnage qui ressemble à deux goûtes d'eau à [b][color=#000000]célébrité[/color][/b], je suis en réalité un(e) [b][color=#000000]fille/garçon[/color][/b], j'ai [b][color=#000000]âge[/color][/b]. Je m'appelle [b][color=#000000]prénom[/color][/b] mais on me nomme aussi [b][color=#000000]pseudo[/color][/b] sur la toile. Ma présence sur le forum sera de [b][color=#000000]j/7[/color][/b]. Je fais environs [b][color=#000000]nombre de lignes[/color][/b]. J'ai connue le forum grâce à [b][color=#000000]écrire ici[/color][/b]. Code du règlement:  [color=#000000]ici[/color]. Mon mot de la fin sera [b][color=#000000]écrire ici[/color][/b].</div></td></tr></table></div></div></center>