/*SCÉNARIO*/
.imgscé1{width: 400px; padding: 3px; border- radius: 2px; border : 1px solid #f8cdaa; border-bottom: 8px solid #c6c981; padding-bottom: 0px;}
.scé2{background-color: #d3d99f; height: 4px; border-radius: 20px;}
.imgscé2{transform : rotate(10deg);-webkit-transform : rotate(10deg); border: 4px solid #f8d6af; width: 75px; height: 75px; float:left;}
.scé3{background-color: white;width: 310px;margin-left: 60px;margin-top: 15px;text-align: justify;padding: 11px;border-radius: 15px;font-size: 11px;line-height: 12px;border: 1px solid #f8d6af; padding-left: 25px;}


/*PRÉSENTATION*/
.pré1{font-family: 'Euphoria Script', cursive; font-size: 35px; color: #bbc275; text-align: center;  text-shadow: 0px 0px 4px;}
ff{color: #a6ab5b;}
.pré2{width: 430px; height: 6px;background-color: #f8d8b3; border-radius: 3px;}
.pré3{text-transform: lowercase; font-family: 'Playfair Display', serif; font-size: 10px; color: #d0b6a5;}
.imgpré1{width: 200px; margin-right: 5px; padding: 3px; border- radius: 2px; border : 1px solid #f8cdaa; border-bottom: 8px solid #c6c981; padding-bottom: 0px;}
.imgpré2{width: 200px; margin-left: 5px; padding: 3px; border- radius: 2px; border : 1px solid #f8cdaa; border-bottom: 8px solid #c6c981; padding-bottom: 0px;}
.pré4{background-color: #f8d8b3; font-size: 11px; font-family: 'Playfair Display', serif; color: #c79863; height: 12px; text-align: center; padding: 5px; margin-top: -75px; margin-right: -15px; border: 1px solid #eac9a2;}
.ong1{color: white; text-shadow: 0px 0px 2px;}
.ong2{background-color: #f8d8b3; font-size: 11px; font-family: 'Playfair Display', serif; color: #c79863; height: 12px; text-align: center; padding: 5px; margin-right: -15px; border: 1px solid #eac9a2;}
.pré5{width: 310px; height: 140px; border: 1px solid #f9d1ab; border-radius: 10px; background-color: white; padding: 7px; font-size: 11px; line-height: 12px; text-align: justify; overflow: auto; float:left;}
.pré6{font-family: 'Euphoria Script', cursive; font-size: 25px; color: #bbc275; text-align: center;  text-shadow: 0px 0px 4px; margin-bottom: -3px;}
.pré7{width: 430px; height: 6px;background-color: #f8d8b3; border-radius: 3px;}
.pré8{border: 1px solid #fbf0ea; width: 405px; padding: 10px; font-size: 11px; line-height: 12px; text-align: justify;}
.imgpré3{margin-left: 10px; height: 200px; float:right; border-bottom: 8px solid #c6c981; padding-bottom: 0px;}
.pré9{background-color: #d3d99f; height: 4px; border-radius: 20px; width: 270px;}
.pré10{transform : rotate(10deg);-webkit-transform : rotate(10deg); background-color: #f8d6af; width: 75px; height: 75px; padding: 5px; float:left;}
.pré11{transform : rotate(-25deg);-webkit-transform : rotate(-25deg); margin-top: 30px; color: white; text-shadow: 0px 0px 2px; font-size: 11px;}
.pré12{background-color: white;width: 310px;margin-left: 60px;margin-top: 15px;text-align: justify;padding: 11px;border-radius: 15px;font-size: 10px;line-height: 11px;border: 1px solid #f8d6af;color: #c1aba2;padding-left: 25px;}

<br><center><div class="pré1">Prénom <ff>Nom</ff></div><div class="pré2"></div><div class="pré3">une petite citation</div>
<img src="https://38.media.tumblr.com/3a03d28252f5e0a6ba3854401846bbfa/tumblr_myu40cB6CA1sim304o1_500.gif" class="imgscé1">

<div style="width: 430px;"><table><td style="width: 70px;"><div class="tabs-onglets">
<div class="pré4"> <a href="#premier_onglet"><span class="ong1">infos</span></a></div>
<div class="ong2"><a href="#deuxieme_onglet"><span class="ong1">caractère</span></a></div>
</div></td><td class="pré5"><div id="contenu"><div id="premier_onglet"><aa>› NOM :</aa> écrire ici <aa>› PRÉNOM(S) :</aa> écrire ici. <aa>› ÂGE :</aa> écrire ici. <aa>› DATE ET LIEU NAISSANCE :</aa> écrire ici. <aa>› ORIGINES :</aa> écrire ici. <aa>› ORIENTATION SEXUELLE :</aa> écrire ici. <aa>› CÔTÉ COEUR :</aa> écrire ici. <aa>› EMPLOIS/ÉTUDES :</aa> écrire ici. <aa>› AVATAR :</aa> écrire ici.</div>
<div id="deuxieme_onglet" ><aa>QUALITÉ</aa> <cc>»</cc> écrire ici au minimum 5 qualités. <cc>»</cc> écrire ici au minimum 5 qualités. <cc>»</cc> écrire ici au minimum 5 qualités. <cc>»</cc> écrire ici au minimum 5 qualités. <cc>»</cc> écrire ici au minimum 5 qualités.

<aa>DÉFAUTS</aa> <cc>»</cc> minimum 5 défauts. <cc>»</cc> minimum 5 défauts. <cc>»</cc> minimum 5 défauts. <cc>»</cc> minimum 5 défauts. <cc>»</cc> minimum 5 défauts.  

<div class="scé2"></div>

Ecrit le caractère de ton personnage en un maximum de ligne afin de donner touts les renseignement utiles pour que ton scénario soit pris le plus rapidement. </div>
</div></td></table></div>

<div class="pré6"> Plus d'infos</div><div class="pré7"></div>
<div class="pré8"><img src="http://auto.img.v4.skyrock.net/2965/84302965/pics/3189419199_1_6_SF0eixWH.png" class="imgpré3"><aa>SON HISTOIRE</aa>écrit ici l'histoire du personnage mais aussi les petits détails qu'un invité pourrait ignorer et qui sont pourtant hyper important dans ta conception du personnage. N'hésite pas à aller dans les détails. Ipsos secum saepius secum ne hoc haberi Marci arbitratu Marci tamquam videretur tum de quas arbitratu induxi haberi ut secum Scaevola loquentes ut ipsam ut 'inquam' filio ut tamquam induxi enim libro Scaevola sententias a et exposuit atque Laeli et ab ipsam 'inquam' illo secum C praesentibus Scaevola altero 'inquit' et C mandavi Laeli diebus diebus sermo atque cum atque hoc Scaevola mortem exposui memoriae Fannio paucis enim habitum libro Africani Africani enim secum loquentes videretur arbitratu quasi tum sermo Africani cum genero in Eius 'inquam' Eius Africani arbitratu 'inquit' genero ab interponeretur saepius ut Marci haberi Marci arbitratu Marci tamquam videretur tum de quas arbitratu induxi haberi ut secum Scaevola loquentes ut ipsam ut 'inquam' filio ut tamquam induxi enim libro Scaevola sententias a et exposuit atque</div><div style="width: 420px;">
<img src="https://31.media.tumblr.com/5124932c4fa67bffd960ae9d7b03f4fa/tumblr_inline_n7ixbuSNF81sffrfy.png" class="imgscé2"><div class="scé3"><cc>LE LIEN</cc> explique ici le lien qui unit les deux personnage. N'hésite pas à aller dans les détails pour éviter tout problème de compréhension. explique ici le lien qui unit les deux personnage. N'hésite pas à aller dans les détails pour éviter tout problème de compréhension. explique ici le lien qui unit les deux personnage. N'hésite pas à aller dans les détails pour éviter tout problème de compréhension. </div></div></center><br><br>