<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<style type="text/css">
.tabc {
background-color: #FFFFFF; width: 210px; height:30px;font-family: 'francois one'; font-size: 20px; color: #79A7E2; text-align: center; line-height: 30px; overflow:hidden; -moz-transition:all 1s ease-in-out; -webkit-transition:all 1s ease-in-out; margin-left:0px; }
.tabc:hover { background-color: #FFFFFF; width: 210px; height:130px; font-family: 'francois one'; font-size: 20px; color: #79A7E2; text-align: center; line-height: 30px; -moz-transition:all 1s ease-in-out; -webkit-transition:all 1s ease-in-out; }
.color{
width: 200px;
height: 130px;
background-color:#FFFFFF;
color: #79A7E2;
padding: 5px;
font-family: 'francois one';
text-align: justify;
font-size: 20px;}
.image {
-webkit-transition: .4s ease-in-out opacity;
-moz-transition: .4s ease-in-out opacity;
-o-transition: .4s ease-in-out opacity;
transition: .4s ease-in-out opacity;
opacity: 0.7;}
.image:hover {
-webkit-transition: .4s ease-in-out opacity;
-moz-transition: .4s ease-in-out opacity;
-o-transition: .4s ease-in-out opacity;
transition: .4s ease-in-out opacity;
opacity: 1;}
.box {
width: 420px;
font-family:trebuchet ms;
font-size:11px;
line-height:9px;
text-align:justify;
padding: 10px;
background-image:url(http://farm4.static.flickr.com/3634/3346431062_0f7db7be6b_o.jpg);
color: white;
border-radius: 10px;}
</style>
</head>
<BODY>
<link href='http://fonts.googleapis.com/css?family=Francois+One|Marvel' rel='stylesheet' type='text/css'><center>
<div class="box">
<div style=" font-family:'francois one'; font-size:35px; text-transform:uppercase; color:#79A7E2; padding-bottom:7px; text-align: center; margin-top:10px;">prénom prénom nom</div>
<table><td><div style="width: 200px; height: 300px; "><div class="image" style="width:200px; height:300px; background-image:url(http://25.media.tumblr.com/tumblr_m8e9922LgC1rry1nko2_250.png); "></div>
<td valign="top"><div class="tabc">biographie<div style="padding: 10px 10px 10px 10px"><div style="width: 180px; height: 270px; font-family: times; font-size: 12px; line-height: 13px; text-align: justify; font-family:trebuchet ms; color: grey;">
insérer ici les points importants de son histoire
<br></div></div></div>
<div class="tabc">personnalité<div style="padding: 10px 10px 10px 10px"><div style="width: 180px; height: 270px; font-family: times; font-size: 12px; line-height: 13px; text-align: justify; font-family:trebuchet ms; color: grey;">
parler ici du caractère de votre personnage
<br></div></div></div><div class="color">passez votre souris sur les titres «personalité» et «biographie» pour en connaitre plus</br>
<center><span style="font-size: 9px;">(c) fiche par ocean lounge</span></center></div></td></table>
<div style=" font-family:'francois one'; font-size:35px; text-transform:uppercase; color:#79A7E2; padding-bottom:7px; text-align: center; margin-top: 10px">ce que je recherche</div></br></br>
<span style="color:#1C0751; font-family:'francois one';">(F)</span> ◭ </br></br>
<span style="color:7EABB8; font-family:'francois one';">(M)</span> ◭ </br></br>
</br></div></center></div>
Accueil
