Cher pirates, il est l'heure de voter pour la fiche qui remportera ce premier maître d'œuvre !
N'hésitez pas à commenter votre choix (:
Vous avez jusqu'au 16 septembre pour voter.


#1 par Nihil Scar Winspeare

Code:

<style type="text/css">@import url(http://fonts.googleapis.com/css?family=Old+Standard+TT:400,700,400italic);.fiche-888931254-marvel br{display:none}.fiche-888931254-marvel .cc-u br{display:block}.fiche-888931254-marvel{background:#444349 url(http://image.noelshack.com/fichiers/2014/36/1410123358-stardust.png);width:600px;overflow:hidden;position:relative;color:#fff;font-family:'Old Standard TT',serif;margin:auto;font-size:16px;line-height:1.5}.f-888931254-header{height:300px;background-color:#952716;background-image:url(http://image.noelshack.com/fichiers/2014/36/1410123702-avatar.jpg);background-position:center;-webkit-background-size:100%;-moz-background-size:100%;-o-background-size:100%;background-size:100%;overflow:hidden;position:relative;-webkit-transition:all 1s;-moz-transition:all 1s;-o-transition:all 1s;transition:all 1s}.f-888931254-header:after{content:"";position:absolute;top:100%;left:0;right:0;bottom:0;background:-webkit-gradient(linear,left top,left bottom,color-stop(rgba(0,0,0,0),0),color-stop(rgba(0,0,0,.65),1));background:-webkit-linear-gradient(top,rgba(0,0,0,0) 0,rgba(0,0,0,.65) 100%);background:-moz-linear-gradient(top,rgba(0,0,0,0) 0,rgba(0,0,0,.65) 100%);background:-o-linear-gradient(top,rgba(0,0,0,0) 0,rgba(0,0,0,.65) 100%);background:linear-gradient(top,rgba(0,0,0,0) 0,rgba(0,0,0,.65) 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(0,0,0,0)),color-stop(100%,rgba(0,0,0,.65)));background:-webkit-gradient(linear,left top,left bottom,color-stop(rgba(0,0,0,0),0),color-stop(rgba(97,89,144,.65),1));background:-webkit-linear-gradient(top,rgba(0,0,0,0) 0,rgba(97,89,144,.65) 100%);background:-moz-linear-gradient(top,rgba(0,0,0,0) 0,rgba(97,89,144,.65) 100%);background:-o-linear-gradient(top,rgba(0,0,0,0) 0,rgba(97,89,144,.65) 100%);background:linear-gradient(top,rgba(0,0,0,0) 0,rgba(97,89,144,.65) 100%);background:-webkit-linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,.65) 100%);background:-moz-linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,.65) 100%);background:-o-linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,.65) 100%);background:linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,.65) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#a6000000', GradientType=0);-webkit-transition:all 1s;-moz-transition:all 1s;-o-transition:all 1s;transition:all 1s;opacity:0}.f-888931254-header-title{position:absolute;bottom:0;right:0;background:#F0141E;padding:0 10px;z-index:2;line-height:35px;max-width:250px;font-weight:700}.f-888931254-header-subtitle{position:absolute;bottom:0;left:0;right:0;top:30px;color:#fff;z-index:1;height:55px;width:80%;margin:auto;padding:10px;opacity:0;-webkit-transition:all .5s;-moz-transition:all .5s;-o-transition:all .5s;transition:all .5s;text-align:center;font-style:italic;font-size:30px;text-shadow:0 0 5px #000;-webkit-transform:scale(1.05);-moz-transform:scale(1.05);-ms-transform:scale(1.05);-o-transform:scale(1.05);transform:scale(1.05)}.f-888931254-header-title:before{content:"";position:absolute;top:0;left:-17px;width:25px;height:35px;background:#F0141E;-webkit-transform:skew(-25deg,0deg);-moz-transform:skew(-25deg,0deg);-ms-transform:skew(-25deg,0deg);-o-transform:skew(-25deg,0deg);transform:skew(-25deg,0deg);z-index:1}.f-888931254-header:hover{background-position:center -205px}.f-888931254-header:hover:after{opacity:1;top:20%}.f-888931254-header:hover .f-888931254-header-subtitle{top:100px;opacity:1;color:#fff;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}.f-888931254-context{padding:20px;border-bottom:1px dashed #222;overflow:hidden;font-style:italic}.f-888931254-context .text{height:100px;overflow:auto}.f-888931254-musique{height:25px;overflow:hidden}.f-888931254-content{padding:20px;border-top:1px dashed #222;line-height:1.6}.f-888931254-highlight{background:rgba(0,0,0,.5);padding:15px;margin:10px -20px 0;border-left:5px solid #F0141E}.f-888931254-avatar{float:left;width:100px;height:100px;margin-right:30px;position:relative;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;overflow:hidden}.f-888931254-avatar:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;background:rgba(0,0,0,.5);-webkit-transition:all 1s;-moz-transition:all 1s;-o-transition:all 1s;transition:all 1s}.f-888931254-context:hover .f-888931254-avatar:after{opacity:0}.f-888931254-memories{margin:10px -20px;position:relative;height:400px;-webkit-box-shadow:0 20px 15px -15px #000;-moz-box-shadow:0 20px 15px -15px #000;box-shadow:0 20px 15px -15px #000}.f-888931254-illustration{position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;background:#000}.f-888931254-illustration img{-webkit-transition:all 1s .5s;-moz-transition:all 1s .5s;-o-transition:all 1s .5s;transition:all 1s .5s}.f-888931254-title-memory{text-align:center;position:absolute;bottom:0;top:0;left:0;right:0;width:80%;height:100px;margin:auto;font-size:50px;font-style:italic;text-shadow:0 0 15px #000;-webkit-transition:all 1s 1s;-moz-transition:all 1s 1s;-o-transition:all 1s 1s;transition:all 1s 1s}.f-888931254-shape-title{background:rgba(255,0,0,.49);width:800px;height:50px;top:43%;left:-50px;position:absolute;-webkit-transform:rotate(5deg);-moz-transform:rotate(5deg);-ms-transform:rotate(5deg);-o-transform:rotate(5deg);transform:rotate(5deg);-webkit-transition:all 1s 1s;-moz-transition:all 1s 1s;-o-transition:all 1s 1s;transition:all 1s 1s}.f-888931254-text-memory{padding:20px;position:absolute;top:0;bottom:0;overflow:auto;opacity:0;visibility:hidden;-webkit-transition:all 1s 0s;-moz-transition:all 1s 0s;-o-transition:all 1s 0s;transition:all 1s 0s}.f-888931254-memories:hover .f-888931254-shape-title{top:-50px;-webkit-transition:all 1s 0s;-moz-transition:all 1s 0s;-o-transition:all 1s 0s;transition:all 1s 0s}.f-888931254-memories:hover .f-888931254-title-memory{top:-150%;letter-spacing:10px;-webkit-transition:all 1s .05s;-moz-transition:all 1s .05s;-o-transition:all 1s .05s;transition:all 1s .05s}.f-888931254-memories:hover .f-888931254-illustration img{opacity:.2}.f-888931254-memories:hover .f-888931254-text-memory{opacity:1;visibility:visible;-webkit-transition:all .8s 1.25s;-moz-transition:all .8s 1.25s;-o-transition:all .8s 1.25s;transition:all .8s 1.25s}.f-888931254-footer{border-top:1px solid #464646;background:#363636;font-style:italic;font-size:14px;text-align:center;padding:5px}.f-888931254-middle-part{overflow:hidden;max-height:0;-webkit-transition:all 2s;-moz-transition:all 2s;-o-transition:all 2s;transition:all 2s}#open-fiche{display:none}.f-888931254-close-fiche,.f-888931254-open-fiche{color:#fff;background:#000;padding:5px;font-size:14px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;-webkit-transition:all .1s;-moz-transition:all .1s;-o-transition:all .1s;transition:all .1s;cursor:pointer}#open-fiche:checked+.fiche-888931254-marvel .f-888931254-middle-part{max-height:1500px}#open-fiche:checked+.fiche-888931254-marvel .f-888931254-open-fiche{opacity:0;visibility:hidden}#open-fiche:checked+.fiche-888931254-marvel .f-888931254-close-fiche{opacity:1;visibility:visible}#open-fiche+.fiche-888931254-marvel .f-888931254-close-fiche{opacity:0;visibility:hidden}</style><input type="checkbox" id="open-fiche" /><div class="fiche-888931254-marvel">
<div class="f-888931254-header">
<div class="f-888931254-header-title">Mort à la justice absolue.</div>
<div class="f-888931254-header-subtitle cc-u">“ She did make a choice, Scott.
It was you. ”</div>
</div>
<div class="f-888931254-context">
<div class="f-888931254-avatar" style="background-image: url(http://media.giphy.com/media/f7otQDvUZhWeI/giphy.gif)">
</div>
<div class="f-888931254-text"><div class="cc-u">Un petit texte d'introduction. Born with super-human senses and the power to heal from almost any wound, Wolverine was captured by a secret Canadian organization and given an unbreakable skeleton and claws.<label for="open-fiche" class="f-888931254-open-fiche">Lire</label></div>
</div>
</div>
<div class="f-888931254-middle-part">
<div class="f-888931254-musique"><iframe width="600" height="25" src="//www.youtube.com/embed/q4BxJzcIw7I?rel=0" frameborder="0"></iframe></div>
<div class="f-888931254-content cc-u">Hazmat. New threats. Veil. Finesse.

Will they be the next generation of Earths Mightiest Heroes or the greatest threat to the Marvel Universe. Avengers Assemble. Hes self-assured, and he would never, ever stop fighting for a worthwhile cause. While others have described Thor as an over-muscled, oafish imbecile, hes quite smart and compassionate.
<div class="f-888931254-highlight">- Allez, on fait une conversation rapide !
- Oui, tout le monde intervient.
- Moi aussi j'ai le droit de parler ?!
- Finesse. Everyones favorite super team presented in true blockbuster fashion.
- Mettle. Reptil.</div>Iron Man, Thor, Captain America and the rest of Earths Mightiest Heroes unite to stand against the threats none can face alone. Hazmat. See the Avengers go up against Ultron, Kang, the Masters of Evil and more over three decades of epic action. Will they be the next generation of Earths Mightiest Heroes or the greatest threat to the Marvel Universe.
<div class="f-888931254-memories">
<div class="f-888931254-illustration"><img src="http://image.noelshack.com/fichiers/2014/36/1410124724-memories.jpg" alt=""><div class="f-888931254-shape-title"></div><div class="f-888931254-title-memory">Flashback</div></div>
<div class="f-888931254-text-memory">Caught in a gamma bomb explosion while trying to save the life of a teenager, Dr. Bruce Banner was transformed into the incredibly powerful creature called the Hulk. The Avengers team like youve never seen them before. Iron Man, Thor, Captain America and the rest of Earths Mightiest Heroes unite to stand against the threats none can face alone. Everyones favorite super team presented in true blockbuster fashion.

This is where youll find all the big-time action, major storylines and iconic Spider-Man magic youd come to expect from the Wall-Crawler. The Avengers team like youve never seen them before. New roster. An all too often misunderstood hero, the angrier the Hulk gets, the stronger the Hulk gets.
This is where youll find all the big-time action, major storylines and iconic Spider-Man magic youd come to expect from the Wall-Crawler. The Avengers team like youve never seen them before. New roster. An all too often misunderstood hero, the angrier the Hulk gets, the stronger the Hulk gets.</div>
</div>Earths Mightiest Heroes reunite with their biggest guns at the forefront to take on familiar enemies and new threats alike. Everyones favorite super team presented in true blockbuster fashion.

Wounded, captured and forced to build a weapon by his enemies, billionaire industrialist Tony Stark instead created an advanced suit of armor to save his life and escape captivity. Striker. At the dawn of the Heroic Age, the Avengers will assemble once again. The Avengers return . . . <label for="open-fiche" class="f-888931254-close-fiche">[X]</label></label></div>
<div class="f-888931254-footer">Images : Marvel</div>
</div></div>

#2 par Scavenger

Code:

<style>#never-utopia-hulk br{display:none}#never-utopia-hulk p>br{display:initial}#never-utopia-hulk *{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}#never-utopia-hulk{position:relative;width:500px;padding:15px;min-height:800px}#never-utopia-hulk>img{position:absolute;z-index:42}#body-hulk{position:relative;overflow:hidden;left:0;top:0;margin:25px 35px;border:1px solid #000;min-height:600px;background:url(http://img15.hostingpics.net/pics/729865darkwallgreen.png) center center;border-top-right-radius:20px;padding:50px 40px}#body-hulk>img{float:left}#body-hulk>div{display:inline-block;width:100%}#caract-hulk{padding:10px;display:inline-block;width:110px;border:1px solid #fff;opacity:.6;border-radius:10px;float:right;background-color:#222B11}#caract-hulk h2{color:#ADC0B7;font-size:140%;text-align:center;border-bottom:1px #fff solid}#caract-hulk p{color:#ADC0B7;margin-top:5px}#body-hulk>h1{line-height:115%;font-size:250%;width:100%;text-align:center;margin-top:-15px;color:#2f3b18;text-shadow:0 0 1px #6d8839;font-weight:700;font-family:arial,Cursive;border-bottom:1px rgba(255,255,255,.5) solid}#body-hulk>h1:first-letter{color:transparent;text-transform:capitalize;text-shadow:0 0 2px #5e8e00}#power-hulk{margin-top:20px;height:115px;box-shadow:0 0 3px #5e8e00 inset;background-color:rgba(255,255,255,.2);position:relative;border-radius:5px}#power-hulk p{padding:15px 8px;overflow:hidden;height:84px;text-align:justify}#power-hulk p:hover{overflow-y:scroll;width:349px}#power-hulk h2{position:absolute;top:-15px;left:-15px;font-size:150%;background:url(http://img15.hostingpics.net/pics/729865darkwallgreen.png) center center;color:rgba(255,255,255,.5);padding-right:10px;padding-bottom:3px;text-shadow:-1px 0 1px rgba(255,255,255,.5);border-radius:15px}#rp-hulk{margin-top:20px;height:200px;box-shadow:0 0 3px #5e8e00 inset;background-color:rgba(255,255,255,.2);position:relative;border-radius:5px}#rp-hulk p{padding:15px 8px;overflow:hidden;height:169px;text-align:justify}#rp-hulk p:hover{overflow-y:scroll;width:349px}#rp-hulk h2{position:absolute;top:-15px;left:-15px;font-size:150%;background:url(http://img15.hostingpics.net/pics/729865darkwallgreen.png) center center;color:rgba(255,255,255,.5);padding-right:10px;padding-bottom:3px;text-shadow:-1px 0 1px rgba(255,255,255,.5);border-radius:15px}@-webkit-keyframes ban-hulk{from{background-position:0 0}to{background-position:200% 0}}@-moz-keyframes ban-hulk{from{background-position:0 0}to{background-position:200% 0}}@keyframes ban-hulk{from{background-position:0 0}to{background-position:200% 0}}#ban-hulk{position:absolute;right:0;left:0;bottom:0;height:100px;background-image:url(http://img15.hostingpics.net/pics/658570marvelbandeau.png);background-repeat:repeat-x;background-position:50px 0;-webkit-animation:ban-hulk 15s infinite linear;animation:ban-hulk 15s infinite linear}</style>
<div id="never-utopia-hulk">
  <img src="http://img4.hostingpics.net/pics/323678hulktorse.png" alt="image hulk haut-gauche"/>
  <div id="body-hulk">
      <div>
        <img src="http://img4.hostingpics.net/pics/252181emplacementimage.png" alt="image à remplacer"/>
        <span id="caract-hulk">
            <h2>Atouts</h2>
            <p>
              Force: 9000
              Agilité: -1
              Endurance: 42
              Intelligence: 450
              Magie: 0
            </p>
        </span>
      </div>
      <h1>pseudo</h1>
      <div id="power-hulk">
        <h2>Mes pouvoirs</h2>
        <p id="power-desc-hulk">
            Lorem ipsum dolor sit amet,
            consectetur adipiscing elit.
            Curabitur convallis tellus leo, et malesuada odio fermentum sit amet. Morbi eleifend, nibh non iaculis pharetra, ligula turpis porta felis, ut egestas nisi elit at risus. Morbi in mollis metus. Vivamus lobortis maximus nisl. Donec convallis orci ut orci tempor tincidunt.
        </p>
      </div>
      <div id="rp-hulk">
        <h2>Roleplay</h2>
        <p id="rp-desc-hulk">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur convallis tellus leo, et malesuada odio fermentum sit amet. Morbi eleifend, nibh non iaculis pharetra, ligula turpis porta felis, ut egestas nisi elit at risus. Morbi in mollis metus. Vivamus lobortis maximus nisl. Donec convallis orci ut orci tempor tincidunt.
        </p>
      </div>
      <div id="ban-hulk"></div>
  </div>
</div>

#3 par Ehawee

Code:

<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Shadows+Into+Light&subset=latin-ext,latin' rel='stylesheet' type='text/css'><style>#asaofond {width: 500px; background-color: #070920; margin: auto; overflow: hidden; border-top: 1px dotted black; border-bottom: 1px dotted black; box-shadow: 0px 0px 5px black; background-clip: border-box; background-size: 30% 30%; background-repeat: repeat; background-image: url(http://img15.hostingpics.net/pics/654688tileabledarkwoodtextures8.jpg)} #asaohead {width: 600px; opacity: 0.5; transform-origine: 50% 50%; transform: rotate(-5deg); margin-left: -50px; margin-top: -30px; transition: 1s} #asaohead:hover {opacity: 1; transition: 1s;} #asaotitre {width: 600px; height: 40px; background: #D3CDD1;  transform-origine: 50% 50%; transform: rotate(-5deg); margin-left: -50px; margin-top: -30px; text-align: center; } .asaorealtitre {color: #333448 ; font-family: 'Shadows Into Light', cursive; font-size: 50px; display: inline-block; border-bottom: 2px solid #333448; padding-bottom: 13px; transition: 1s; } .asaorealtitre:hover {color: black; border-bottom: 2px solid black; padding-bottom: 13px; transition 1s; } .asaoicone {width: 100px; height: 100px; border-radius: 50px; background-clip: border-box; background-size: cover; transition: 1s} .asaoicone:hover {transform: rotate(360deg); transition: 1s; } .asaoinfos {position: relative; height: 100px; width: 100px; overflow: visible;}.asaoinfos .asaoinfos .asaoicone:hover {background-color: red;}.asaoinfos .asaoinfobulle {position: absolute; top: 80px; left: -100px; width: 300px; height: 100px; background-color: #080605; font-family: 'Open Sans Condensed', sans-serif; color:#E3E0D7; padding: 5px; text-align: justify; font-size: 14px; border-top: 1px dotted black; border-bottom: 1px dotted black; box-shadow: 0px 0px 5px black; opacity: 0; visibility: hidden;} .asaoinfos:hover .asaoinfobulle {opacity: 1; visibility: visible; z-index: 999;} .asaoask {font-style: italic; text-shadow: 1px 1px 0px black; font-weight: bold} #asaoavatar {width: 200px; height: 320px; border-top: 1px dotted black; border-bottom: 1px dotted black; box-shadow: 0px 0px 5px black; overflow: hidden;} #asaocoulisse{width: 200px; height: 320px; background-size: cover; transform: translateY(0px) transition: 1s;}  #asaodescriptif {width: 190px; height: 310px; background-color: #080605; font-family: 'Open Sans Condensed', sans-serif; color:#E3E0D7; padding: 5px; text-align: justify; font-size: 14px;}</style>

<div id="asaofond"><img src="http://img11.hostingpics.net/pics/559716HforHerobyaTTe1.jpg" id="asaohead" /><div id="asaotitre"><span class="asaorealtitre">Prénom P² Nom</span></div>

<div style="margin: auto; width: 250px;"><div class="asaoinfos" style=" float: left"><div class="asaoicone" style="background-image: url(http://img15.hostingpics.net/pics/607309lisabyemilysotod7xcluc.jpg);"></div><div class="asaoinfobulle"><span class="asaoask">Patronyme? </span> réponse
<span class="asaoask">Prénoms? </span> réponse
<span class="asaoask">Âge? </span> réponse
<span class="asaoask">Date de naissance? </span> réponse
<span class="asaoask">Lieu de naissance? </span> réponse</div></div><div class="asaoinfos" style="float: right"><div class="asaoicone" style="background-image: url(http://img15.hostingpics.net/pics/607309lisabyemilysotod7xcluc.jpg);"></div><div class="asaoinfobulle"><span class="asaoask">Métier? </span> réponse
<span class="asaoask">Lieu de vie? </span> réponse
<span class="asaoask">Renommée? </span> réponse
<span class="asaoask">Pouvoir? </span> réponse
<span class="asaoask">Famille? </span> réponse</div></div><div style="clear: both"></div></div>

<div style="margin: auto; background-color: #080605; font-family: 'Open Sans Condensed', sans-serif; color:#E3E0D7; padding: 5px; text-align: justify; font-size: 14px; width: 90%; min-height: 50px; box-shadow: 0px 0px 5px black"><div style="font-family: 'Shadows Into Light', cursive; width: 100%; text-align: center; font-size: 35px; transform: rotate(-5deg); margin-top: -20px; margin-bottom: 15px; ">Je ressemble à...</div>Décrivez ici le physique de votre personnage en XX lignes.</div>

<div style="margin: auto; background-color: #080605; font-family: 'Open Sans Condensed', sans-serif; color:#E3E0D7; padding: 5px; text-align: justify; font-size: 14px; width: 90%; min-height: 50px; box-shadow: 0px 0px 5px black"><div style="font-family: 'Shadows Into Light', cursive; width: 100%; text-align: center; font-size: 35px; transform: rotate(-5deg); margin-top: -20px; margin-bottom: 15px; ">Je pense à ...</div>Décrivez ici le caractère de votre personnage en XX lignes.</div>

<div style="margin: auto; background-color: #080605; font-family: 'Open Sans Condensed', sans-serif; color:#E3E0D7; padding: 5px; text-align: justify; font-size: 14px; width: 90%; min-height: 50px; box-shadow: 0px 0px 5px black"><div style="font-family: 'Shadows Into Light', cursive; width: 100%; text-align: center; font-size: 35px; transform: rotate(-5deg); margin-top: -20px; margin-bottom: 15px; ">J'ai vécu...</div>Décrivez ici l'histoire de votre personnage en XX lignes.</div>

<div id="asaoavatar" style="float: left"><div id="asaocoulisse" style="background-image: url(http://img15.hostingpics.net/pics/607309lisabyemilysotod7xcluc.jpg)"></div></div> <div style="float: right; background-color: #080605; font-family: 'Open Sans Condensed', sans-serif; color:#E3E0D7; padding: 10px; text-align: justify; font-size: 14px; width: 280px; height: 300px; oveflow: auto; min-height: 50px; box-shadow: 0px 0px 5px black">blabla à propos du joueur</div>

<div style="text-align: center; font-family: 'Open Sans Condensed', sans-serif; color:#E3E0D7; clear: both">copyright images</div>
</div>

#4 par A-Lice

Code:

<link href='http://fonts.googleapis.com/css?family=Alex+Brush' rel='stylesheet' type='text/css'>
<div style="width:565px; margin:auto; border: 2px solid MediumOrchid; background:black; padding:10px; box-shadow:0px 0px 6px MediumOrchid;">
<div style="margin-top:-30px; margin-left:-30px;"><img src="http://img11.hostingpics.net/pics/331283griffes01.png" /></div> <div style="opacity:0.7;-webkit-filter: blur(10px); filter:blur(10px); color:purple; font-size:500px; margin-top:-170px; margin-left:150px; letter-spacing:-60px; position:relative; z-index:0;">••••</div>
<div style="font-size:50px; text-decoration:line-through; font-family: 'Alex Brush', cursive; margin-top:-20px; margin-left:200px; position:relative; z-index:10; color:white;">Nom Prénom</div>
<div style="font-size:30px; font-weight:bold; font-family: 'Alex Brush', cursive; margin-top:-10px; margin-left:270px; position:relative; z-index:10; color:white;">Catwoman</div>

<div style="display:inline-block; width:200px; height:320px; overflow:hidden; position:relative; top:100px;"><img src="http://img4.hostingpics.net/pics/749331Vavacatwoman.png" /></div> <div style="display:inline-block; width:250px; color:white; padding-left:10px; font-size:20px; font-family: 'Alex Brush', cursive; text-decoration:underline; font-weight:bold; text-align:right; position:relative; top:-200px; display:inline-block;">Some Information : </div><div style="display:inline-block; position: relative; top:-240px;"><img src="http://img11.hostingpics.net/pics/649001chat01.png" /></div>
<div style="margin-left:210px; margin-top:-235px; width:330px; height:265px; padding:10px; color:white; overflow:auto; background:#12001A; box-shadow:0px 0px 6px MediumOrchid;"><span style="font-weight:bold; font-size:18px; font-family: 'Alex Brush', cursive;">Surnom :</span> Catwoman

<span style="font-weight:bold; font-size:18px; font-family: 'Alex Brush', cursive;">Âge :</span> Non connu

<span style="font-weight:bold; font-size:18px; font-family: 'Alex Brush', cursive;">Métier :</span> Cambrioleuse/voleuse et supervilaine

<span style="font-weight:bold; font-size:18px; font-family: 'Alex Brush', cursive;">Arme(s) :</span> Costume de chat et fouet

<span style="font-weight:bold; font-size:18px; font-family: 'Alex Brush', cursive;">Capacité :</span> Athlète, acrobate et agile.

<span style="font-weight:bold; font-size:18px; font-family: 'Alex Brush', cursive;">Points faibles :</span> Sa passion pour tous les objets de valeur liés aux chats, du coup elle peut très facilement se mettre en danger par avarice.
</div>

<div style="display:inline-block;"><img src="http://img11.hostingpics.net/pics/341702chat02.png" /></div> <div style="display:inline-block; width:230px; color:white; padding:10px; font-size:20px; font-family: 'Alex Brush', cursive; text-decoration:underline; font-weight:bold; position:relative; top:30px;">Whim of her/his life :</div>
<div style="width:330px; height:300px; padding:10px; color:white; text-align:justify; overflow:auto; background:#12001A; box-shadow:0px 0px 6px MediumOrchid;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec hendrerit odio at bibendum tristique. Mauris elementum nunc a sapien feugiat, eget pharetra orci vulputate. Aliquam sed cursus odio. Suspendisse vitae lobortis tortor. Fusce euismod nibh quis efficitur tempus. Nam feugiat eros non lectus auctor, eget dapibus tortor ultricies. Nullam ac posuere augue. Aenean vulputate eleifend sem vel laoreet. Vestibulum nec eros aliquet, semper justo at, tincidunt tellus. Donec luctus tortor odio, quis consectetur est mattis eget. Nulla semper libero eget nunc bibendum, nec mattis velit scelerisque. Suspendisse vitae massa a leo aliquet semper in ut lacus. In odio elit, consequat vel varius ut, tincidunt non est. Sed nec ullamcorper velit, ut aliquet ante.

</div>
<div style="width:100px; height:100px; border-radius:100px; background:url(http://img11.hostingpics.net/pics/416788icon07.png); box-shadow:0px 0px 6px MediumOrchid; border: 2px solid MediumOrchid; margin-top:-360px; margin-left:450px;"></div> <div style="width:100px; height:100px; border-radius:100px; background:url(http://img11.hostingpics.net/pics/896111icon08.png); box-shadow:0px 0px 6px MediumOrchid; border: 2px solid MediumOrchid; margin-top:-20px; margin-left:400px;"></div> <div style="width:100px; height:100px; border-radius:100px; background:url(http://img11.hostingpics.net/pics/879265icon09.png); box-shadow:0px 0px 6px MediumOrchid; border: 2px solid MediumOrchid; margin-top:-40px; margin-left:460px;"></div> <div style="width:100px; height:100px; border-radius:100px; background:url(http://img11.hostingpics.net/pics/935608icon10.png); box-shadow:0px 0px 6px MediumOrchid; border: 2px solid MediumOrchid; margin-top:-60px; margin-left:370px;"></div><div style="width:100px; color:white; padding:10px; font-size:20px; font-family: 'Alex Brush', cursive; font-style:italic; font-weight:bold; margin-left:450px;">Miaou ♥</div>
<a href="http://www.never-utopia.com/" style="display:block; text-align:center; text-decoration:none; color:white; font-family: 'Alex Brush', cursive;">© Catwoman</a></div>

# 5 par Dakota

   

- Voici mes relations -

   

Nom
   Prénom
   Age
   Faction
   Motivation

   

La famille ... c'est sacré ?

Quiksilver - J'ai un frère, pas d'bol.

   

Magneto - lui c'est mon père. Méchant, mais je l'aime bien.

   

Les collègues - amis

Iron Man - Trop cool la boite de conserve

   

Thor - Il cause bizarre mais il est sympa

   

Eux, je ne les aime pas

Des robots cinglés,, larbins en plus

   

Ultron - Encore un robot cinglé, le chef de la bande

   

En gros, j'ai des relations compliquées !

   

Code:

<center><link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'><div style="width: 565px; height: 1060px; background-color: #151513;"><img src="http://nsa34.casimages.com/img/2014/09/06/140906090505531515.jpg" style="width: 565px;">
    <div style="display:block; width: 479px; border-bottom:solid 1px; color: #f66b20; position: relative; top: 1em;"></div><div style="font-family: 'Open Sans Condensed'; text-align: center; position: relative; top: 1em; color: #927663; font-size: 18px; letter-spacing: 3px;"> - Voici mes relations - </div><div style="display:block; width: 479px; border-bottom:solid 1px; color: #f66b20; position: relative; top: 2em;"></div>

    <div style="width: 479px; font-family: 'Open Sans Condensed'; text-align: left; font-size: 15px; color: #f66b20;"><img src="http://nsa34.casimages.com/img/2014/09/06/140906100138295583.jpg" style="width: 150px; height: 100px; float: left;" />Nom
    Prénom
    Age
    Faction
    Motivation</div>

    <div style="display:block; width: 479px;font-family: 'Open Sans Condensed'; text-align: left;  color: #f66b20; font-size: 17px; letter-spacing: 1px;"> La famille ... c'est sacré ? </div><div style="display:block; width: 479px; border-bottom:solid 1px; color: #f66b20; "></div><img src="http://nsa33.casimages.com/img/2014/09/06/140906103527740292.jpg"><div><a href="LIEN ICI" style="display:block; width: 479px; font-family: 'Open Sans Condensed'; text-align: left; color: #927663; font-size: 15px;">Quiksilver - J'ai un frère, pas d'bol.</a></div>
    <img src="http://nsa33.casimages.com/img/2014/09/06/140906105736499702.jpg"  style=" position: relative; top: 1em;"><div><a href="LIEN ICI" style="display:block; width: 479px; font-family: 'Open Sans Condensed'; text-align: left; color: #927663; font-size: 15px;">Magneto - lui c'est mon père. Méchant, mais je l'aime bien.</a></div>
    <div style="display:block; width: 479px;font-family: 'Open Sans Condensed'; text-align: left; color: #f66b20; font-size: 17px; letter-spacing: 1px;"> Les collègues - amis </div><div style="display:block; width: 479px; border-bottom:solid 1px; color: #f66b20;"></div><img src="http://nsa33.casimages.com/img/2014/09/06/140906110549405405.jpg"><div><a href="LIEN ICI" style="display:block; width: 479px; font-family: 'Open Sans Condensed'; text-align: left; color: #927663; font-size: 15px;">Iron Man - Trop cool la boite de conserve</a></div>
    <img src="http://nsa34.casimages.com/img/2014/09/06/140906110716146052.jpg"  style=" position: relative; top: 1em;"><div><a href="LIEN ICI" style="display:block; width: 479px; font-family: 'Open Sans Condensed'; text-align: left; color: #927663; font-size: 15px;">Thor - Il cause bizarre mais il est sympa</a></div>
    <div style="display:block; width: 479px;font-family: 'Open Sans Condensed'; text-align: left; color: #f66b20; font-size: 17px; letter-spacing: 1px;"> Eux, je ne les aime pas </div><div style="display:block; width: 479px; border-bottom:solid 1px; color: #f66b20;"></div><img src="http://nsa34.casimages.com/img/2014/09/06/140906111038710390.jpg"><div><a href="LIEN ICI" style="display:block; width: 479px; font-family: 'Open Sans Condensed'; text-align: left; color: #927663; font-size: 15px;">Des robots cinglés,, larbins en plus</a></div>
    <img src="http://nsa34.casimages.com/img/2014/09/06/140906111140126267.jpg" style=" position: relative; top: 1em;"><div><a href="LIEN ICI" style="display:block; width: 479px; font-family: 'Open Sans Condensed'; text-align: left; color: #927663; font-size: 15px;">Ultron - Encore un robot cinglé, le chef de la bande</a></div>
    <div style="display:block; width: 479px; border-bottom:solid 1px; color: #f66b20; position: relative; top: 1em;"></div><div style="font-family: 'Open Sans Condensed'; text-align: center; position: relative; top: 1em; color: #927663; font-size: 18px; letter-spacing: 3px;"> En gros, j'ai des relations compliquées ! </div><div style="display:block; width: 479px; border-bottom:solid 1px; color: #f66b20; position: relative; top: 2em;"></div>
    </div></center>

#6 par Onyx

Dr. Mildly Overcast

Nom : Krats. Prénom : Ynot. Surnom : Dr. Mildly Overcast. Âge : Cette donnée est inconnue. Métier : Docteur en Météorologie et Supervilain. Objectif : La domination du monde par le contrôle des micro-climats et par la maîtrise des catastrophes naturelles. Pouvoirs : Une intelligence supérieure, une armure en métal et une armée de robots météorologiques.

Observez mon apparence...

Non ergo erunt homines deliciis diffluentes audiendi, si quando de amicitia, quam nec usu nec ratione habent cognitam, disputabunt. Nam quis est, pro deorum fidem atque hominum! qui velit, ut neque diligat quemquam nec ipse ab ullo diligatur, circumfluere omnibus copiis atque in omnium rerum abundantia vivere? Haec enim est tyrannorum vita nimirum, in qua nulla fides, nulla caritas, nulla stabilis benevolentiae potest esse fiducia, omnia semper suspecta atque sollicita, nullus locus amicitiae. Et quia Montius inter dilancinantium manus spiritum efflaturus Epigonum et Eusebium nec professionem nec dignitatem ostendens aliquotiens increpabat, qui sint hi magna quaerebatur industria, et nequid intepesceret, Epigonus e Lycia philosophus ducitur et Eusebius ab Emissa Pittacas cognomento, concitatus orator, cum quaestor non hos sed tribunos fabricarum insimulasset promittentes armorum si novas res agitari conperissent. Ex turba vero imae sortis et paupertinae in tabernis aliqui pernoctant vinariis, non nulli velariis umbraculorum theatralium latent, quae Campanam imitatus lasciviam Catulus in aedilitate sua suspendit omnium primus; aut pugnaciter aleis certant turpi sono fragosis naribus introrsum reducto spiritu concrepantes; aut quod est studiorum omnium maximum ab ortu lucis ad vesperam sole fatiscunt vel pluviis, per minutias aurigarum equorumque praecipua vel delicta scrutantes.

... sans me démasquer.

Plongez dans ma psychée...

Non ergo erunt homines deliciis diffluentes audiendi, si quando de amicitia, quam nec usu nec ratione habent cognitam, disputabunt. Nam quis est, pro deorum fidem atque hominum! qui velit, ut neque diligat quemquam nec ipse ab ullo diligatur, circumfluere omnibus copiis atque in omnium rerum abundantia vivere? Haec enim est tyrannorum vita nimirum, in qua nulla fides, nulla caritas, nulla stabilis benevolentiae potest esse fiducia, omnia semper suspecta atque sollicita, nullus locus amicitiae. Et quia Montius inter dilancinantium manus spiritum efflaturus Epigonum et Eusebium nec professionem nec dignitatem ostendens aliquotiens increpabat, qui sint hi magna quaerebatur industria, et nequid intepesceret, Epigonus e Lycia philosophus ducitur et Eusebius ab Emissa Pittacas cognomento, concitatus orator, cum quaestor non hos sed tribunos fabricarum insimulasset promittentes armorum si novas res agitari conperissent. Ex turba vero imae sortis et paupertinae in tabernis aliqui pernoctant vinariis, non nulli velariis umbraculorum theatralium latent, quae Campanam imitatus lasciviam Catulus in aedilitate sua suspendit omnium primus; aut pugnaciter aleis certant turpi sono fragosis naribus introrsum reducto spiritu concrepantes; aut quod est studiorum omnium maximum ab ortu lucis ad vesperam sole fatiscunt vel pluviis, per minutias aurigarum equorumque praecipua vel delicta scrutantes.

... sans vous y perdre.

Laissez-moi vous raconter...

Non ergo erunt homines deliciis diffluentes audiendi, si quando de amicitia, quam nec usu nec ratione habent cognitam, disputabunt. Nam quis est, pro deorum fidem atque hominum! qui velit, ut neque diligat quemquam nec ipse ab ullo diligatur, circumfluere omnibus copiis atque in omnium rerum abundantia vivere? Haec enim est tyrannorum vita nimirum, in qua nulla fides, nulla caritas, nulla stabilis benevolentiae potest esse fiducia, omnia semper suspecta atque sollicita, nullus locus amicitiae. Et quia Montius inter dilancinantium manus spiritum efflaturus Epigonum et Eusebium nec professionem nec dignitatem ostendens aliquotiens increpabat, qui sint hi magna quaerebatur industria, et nequid intepesceret, Epigonus e Lycia philosophus ducitur et Eusebius ab Emissa Pittacas cognomento, concitatus orator, cum quaestor non hos sed tribunos fabricarum insimulasset promittentes armorum si novas res agitari conperissent. Ex turba vero imae sortis et paupertinae in tabernis aliqui pernoctant vinariis, non nulli velariis umbraculorum theatralium latent, quae Campanam imitatus lasciviam Catulus in aedilitate sua suspendit omnium primus; aut pugnaciter aleis certant turpi sono fragosis naribus introrsum reducto spiritu concrepantes; aut quod est studiorum omnium maximum ab ortu lucis ad vesperam sole fatiscunt vel pluviis, per minutias aurigarum equorumque praecipua vel delicta scrutantes.

... mon histoire.

Le joueur du grenier

Prénom : Chose. Âge : 99 ans. Sexe : Nope. Tu as un parrain? Nope. Quel est ton avatar ? Doctor Doom. As-tu lu le règlement? Yep! Comment as-tu connu le forum? Mystère. Le fofo, t'en penses quoi? ... Joker? *siffle*

Code:

<link href='http://fonts.googleapis.com/css?family=Lobster|Marvel' rel='stylesheet' type='text/css' /><center><div style="margin-left: 20px; text-align: center; margin-top: 55px; width: 480px; border-top: solid 20px #c4c4c4; border-bottom: solid 20px #c4c4c4; background: #202020; color: #c4c4c4; padding: 30px; text-shadow: 1px 1px 0px #000000; position: relative;"><div style="position: absolute; top: -80px; left: -65px; z-index: 3;"><img src="http://img15.hostingpics.net/pics/366827League2.png" alt="League" /></div><span style="padding-right: 30px; padding-left: 30px; font-variant: small-caps; font-size: 48px; border-bottom: 3px dotted #c4c4c4; font-weight: bold; text-shadow: 2px 2px 0px #000000; font-family: marvel;">Dr. Mildly Overcast</span>

<table style="width: 100%; margin-top: 25px; margin-bottom: 20px; padding: 10px; border-radius: 50px 20px 50px 20px; background: #101010; box-shadow: 0px 0px 5px 2px #000000;"><tr><td width="200"><div style="border-radius: 50px 20px 50px 20px; box-shadow: 0px 0px 5px 2px #000000; width: 200px; height: 350px; background: url('http://img4.hostingpics.net/pics/377775sasss.png');"></div></td><td align="left" style="padding-left: 15px; padding-right: 15px;"><div style="font-family: verdana; font-size: 12px; overflow: auto; max-height: 350px;"><span style="font-size: 16px; font-weight: bold; font-family: marvel;">Nom : </span>Krats.

<span style="font-size: 16px; font-weight: bold; font-family: marvel;">Prénom : </span>Ynot.

<span style="font-size: 16px; font-weight: bold; font-family: marvel;">Surnom : </span>Dr. Mildly Overcast.

<span style="font-size: 16px; font-weight: bold; font-family: marvel;">Âge : </span>Cette donnée est inconnue.

<span style="font-size: 16px; font-weight: bold; font-family: marvel;">Métier : </span>Docteur en Météorologie et Supervilain.

<span style="font-size: 16px; font-weight: bold; font-family: marvel;">Objectif : </span>La domination du monde par le contrôle des micro-climats et par la maîtrise des catastrophes naturelles.

<span style="font-size: 16px; font-weight: bold; font-family: marvel;">Pouvoirs : </span>Une intelligence supérieure, une armure en métal et une armée de robots météorologiques.</div></td></tr></table>

<table width="100%" cellspacing="0" cellpadidng="0"><tr><td align="left" style="padding-left: 25px;"><span style="display: inline-block; border-radius: 20px 20px 0 0; background: #151515; box-shadow: 0px 0px 5px 2px #000000; padding: 3px; padding-right: 15px; padding-left: 20px; font-family: lobster; font-size: 14px;">Observez mon apparence...</span></td></tr><tr><td align="center"><div style="border-radius: 20px; background: #101010; box-shadow: 0px 0px 5px 2px #000000; padding: 10px; text-align: justify; font-family: verdana; font-size: 12px; position: relative; z-index: 2;">Non ergo erunt homines deliciis diffluentes audiendi, si quando de amicitia, quam nec usu nec ratione habent cognitam, disputabunt. Nam quis est, pro deorum fidem atque hominum! qui velit, ut neque diligat quemquam nec ipse ab ullo diligatur, circumfluere omnibus copiis atque in omnium rerum abundantia vivere? Haec enim est tyrannorum vita nimirum, in qua nulla fides, nulla caritas, nulla stabilis benevolentiae potest esse fiducia, omnia semper suspecta atque sollicita, nullus locus amicitiae.

Et quia Montius inter dilancinantium manus spiritum efflaturus Epigonum et Eusebium nec professionem nec dignitatem ostendens aliquotiens increpabat, qui sint hi magna quaerebatur industria, et nequid intepesceret, Epigonus e Lycia philosophus ducitur et Eusebius ab Emissa Pittacas cognomento, concitatus orator, cum quaestor non hos sed tribunos fabricarum insimulasset promittentes armorum si novas res agitari conperissent.

Ex turba vero imae sortis et paupertinae in tabernis aliqui pernoctant vinariis, non nulli velariis umbraculorum theatralium latent, quae Campanam imitatus lasciviam Catulus in aedilitate sua suspendit omnium primus; aut pugnaciter aleis certant turpi sono fragosis naribus introrsum reducto spiritu concrepantes; aut quod est studiorum omnium maximum ab ortu lucis ad vesperam sole fatiscunt vel pluviis, per minutias aurigarum equorumque praecipua vel delicta scrutantes.</div></td></tr><tr><td align="right" style="padding-right: 25px;"><span style="display: inline-block; border-radius: 0 0 20px 20px; background: #151515; box-shadow: 0px 0px 5px 2px #000000; padding: 3px; padding-right: 15px; padding-left: 20px; font-family: lobster; font-size: 14px;">... sans me démasquer.</span></td></tr></table>

<table width="100%" cellspacing="0" cellpadidng="0"><tr><td align="left" style="padding-left: 25px;"><span style="display: inline-block; border-radius: 20px 20px 0 0; background: #151515; box-shadow: 0px 0px 5px 2px #000000; padding: 3px; padding-right: 15px; padding-left: 20px; font-family: lobster; font-size: 14px;">Plongez dans ma psychée...</span></td></tr><tr><td align="center"><div style="border-radius: 20px; background: #101010; box-shadow: 0px 0px 5px 2px #000000; padding: 10px; text-align: justify; font-family: verdana; font-size: 12px; position: relative; z-index: 2;">Non ergo erunt homines deliciis diffluentes audiendi, si quando de amicitia, quam nec usu nec ratione habent cognitam, disputabunt. Nam quis est, pro deorum fidem atque hominum! qui velit, ut neque diligat quemquam nec ipse ab ullo diligatur, circumfluere omnibus copiis atque in omnium rerum abundantia vivere? Haec enim est tyrannorum vita nimirum, in qua nulla fides, nulla caritas, nulla stabilis benevolentiae potest esse fiducia, omnia semper suspecta atque sollicita, nullus locus amicitiae.

Et quia Montius inter dilancinantium manus spiritum efflaturus Epigonum et Eusebium nec professionem nec dignitatem ostendens aliquotiens increpabat, qui sint hi magna quaerebatur industria, et nequid intepesceret, Epigonus e Lycia philosophus ducitur et Eusebius ab Emissa Pittacas cognomento, concitatus orator, cum quaestor non hos sed tribunos fabricarum insimulasset promittentes armorum si novas res agitari conperissent.

Ex turba vero imae sortis et paupertinae in tabernis aliqui pernoctant vinariis, non nulli velariis umbraculorum theatralium latent, quae Campanam imitatus lasciviam Catulus in aedilitate sua suspendit omnium primus; aut pugnaciter aleis certant turpi sono fragosis naribus introrsum reducto spiritu concrepantes; aut quod est studiorum omnium maximum ab ortu lucis ad vesperam sole fatiscunt vel pluviis, per minutias aurigarum equorumque praecipua vel delicta scrutantes.</div></td></tr><tr><td align="right" style="padding-right: 25px;"><span style="display: inline-block; border-radius: 0 0 20px 20px; background: #151515; box-shadow: 0px 0px 5px 2px #000000; padding: 3px; padding-right: 15px; padding-left: 20px; font-family: lobster; font-size: 14px;">... sans vous y perdre.</span></td></tr></table>

<table width="100%" cellspacing="0" cellpadidng="0"><tr><td align="left" style="padding-left: 25px;"><span style="display: inline-block; border-radius: 20px 20px 0 0; background: #151515; box-shadow: 0px 0px 5px 2px #000000; padding: 3px; padding-right: 15px; padding-left: 20px; font-family: lobster; font-size: 14px;">Laissez-moi vous raconter...</span></td></tr><tr><td align="center"><div style="border-radius: 20px; background: #101010; box-shadow: 0px 0px 5px 2px #000000; padding: 10px; text-align: justify; font-family: verdana; font-size: 12px; position: relative; z-index: 2;">Non ergo erunt homines deliciis diffluentes audiendi, si quando de amicitia, quam nec usu nec ratione habent cognitam, disputabunt. Nam quis est, pro deorum fidem atque hominum! qui velit, ut neque diligat quemquam nec ipse ab ullo diligatur, circumfluere omnibus copiis atque in omnium rerum abundantia vivere? Haec enim est tyrannorum vita nimirum, in qua nulla fides, nulla caritas, nulla stabilis benevolentiae potest esse fiducia, omnia semper suspecta atque sollicita, nullus locus amicitiae.

Et quia Montius inter dilancinantium manus spiritum efflaturus Epigonum et Eusebium nec professionem nec dignitatem ostendens aliquotiens increpabat, qui sint hi magna quaerebatur industria, et nequid intepesceret, Epigonus e Lycia philosophus ducitur et Eusebius ab Emissa Pittacas cognomento, concitatus orator, cum quaestor non hos sed tribunos fabricarum insimulasset promittentes armorum si novas res agitari conperissent.

Ex turba vero imae sortis et paupertinae in tabernis aliqui pernoctant vinariis, non nulli velariis umbraculorum theatralium latent, quae Campanam imitatus lasciviam Catulus in aedilitate sua suspendit omnium primus; aut pugnaciter aleis certant turpi sono fragosis naribus introrsum reducto spiritu concrepantes; aut quod est studiorum omnium maximum ab ortu lucis ad vesperam sole fatiscunt vel pluviis, per minutias aurigarum equorumque praecipua vel delicta scrutantes.</div></td></tr><tr><td align="right" style="padding-right: 25px;"><span style="display: inline-block; border-radius: 0 0 20px 20px; background: #151515; box-shadow: 0px 0px 5px 2px #000000; padding: 3px; padding-right: 15px; padding-left: 20px; font-family: lobster; font-size: 14px;">... mon histoire.</span></td></tr></table>

<table width="100%" cellspacing="0" cellpadidng="0"><tr><td align="left" style="padding-left: 25px;"><span style="display: inline-block; border-radius: 20px 20px 0 0; background: #151515; box-shadow: 0px 0px 5px 2px #000000; padding: 3px; padding-right: 15px; padding-left: 20px; font-family: lobster; font-size: 14px;">Le joueur du grenier</span></td></tr><tr><td align="center"><table style="width: 100%; position: relative; z-index: 2; padding: 10px; border-radius: 20px 50px 20px 50px; background: #101010; box-shadow: 0px 0px 5px 2px #000000;"><tr><td width="150"><div style="border-radius: 20px 50px 20px 50px; box-shadow: 0px 0px 5px 2px #000000; width: 150px; height: 150px; background: url('http://img4.hostingpics.net/pics/377775sasss.png');"></div></td><td align="left" style="font-family: verdana; font-size: 12px; padding-left: 15px; padding-right: 15px;"><div style="overflow: auto; height: 150px;"><span style="font-size: 16px; font-weight: bold; font-family: marvel;">Prénom : </span>Chose.
<span style="font-size: 16px; font-weight: bold; font-family: marvel;">Âge : </span>99 ans.
<span style="font-size: 16px; font-weight: bold; font-family: marvel;">Sexe : </span>Nope.
<span style="font-size: 16px; font-weight: bold; font-family: marvel;">Tu as un parrain? </span>Nope.
<span style="font-size: 16px; font-weight: bold; font-family: marvel;">Quel est ton avatar ? </span>Doctor Doom.
<span style="font-size: 16px; font-weight: bold; font-family: marvel;">As-tu lu le règlement? </span>Yep!
<span style="font-size: 16px; font-weight: bold; font-family: marvel;">Comment as-tu connu le forum? </span>Mystère.
<span style="font-size: 16px; font-weight: bold; font-family: marvel;">Le fofo, t'en penses quoi? </span>... Joker? *siffle*</div></td></tr></table></td></tr></table></div></center>

#7 par Alzufen

Code:

<div style="display: none;"><link href='http://fonts.googleapis.com/css?family=Handlee' rel='stylesheet' type='text/css' />

<style>#james_imagec{display: inline-block; height: 196px; width: 136px; position: relative; border: 2px solid #000; border-top: 0; margin-left: -4px; font: 13px 'Handlee'; text-align: center; overflow: hidden;} #james_imagec span{position: absolute; height: 100%; width: 100%; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; background: #fff; z-index: 999; transition: 1s all; } #james_imagec:hover span{opacity: 1;}#fiche_br br{display: none;}.fiche_br br{display: block;}</style>

</div><div style="width: 436px; height: 596px; margin: auto;" id="fiche_br">
<div class="fiche_br">
<div style="display: inline-block; background: url(http://image.noelshack.com/fichiers/2014/36/1410124848-1410122555-james-buchanan-bucky-barnes-full-1719689.jpg) top left; height: 196px; width: 107px; border: 2px solid #000;"></div>
<div style="display: inline-block; height: 196px; width: 214px; border: 2px solid #000; border-left: 0; margin-left: -4px; overflow: auto; font: 13px 'Handlee'; text-align: center;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque vitae justo nec massa pretium mattis. Phasellus consectetur euismod ipsum in pharetra. Vivamus quis efficitur sem. Nullam varius sapien orci, id vulputate quam hendrerit non. Maecenas sagittis massa enim, eu sagittis mauris commodo efficitur. Donec in malesuada mi. Mauris tempor fermentum lacinia. Integer aliquam vitae nulla eu ullamcorper. Praesent imperdiet porttitor suscipit. Nulla facilisi. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Duis imperdiet velit felis, quis dignissim lectus finibus eget. Quisque ultricies consectetur massa. Vestibulum eleifend lacinia congue. Praesent at dolor nunc.</div>
<div style="display: inline-block; background: url(http://image.noelshack.com/fichiers/2014/36/1410124432-james-buchanan-bucky-barnes-600-1700441.jpg) top center; height: 196px; width: 107px; border: 2px solid #000; border-left: 0; margin-left: -4px;"></div></div><div class="fiche_br">
<div style="display: inline-block; height: 196px; width: 146px; border: 2px solid #000; border-top: 0; overflow: auto; font: 13px 'Handlee'; direction: rtl;">Donec eleifend condimentum ligula id ornare. Nam eget tristique nunc, nec porttitor dui. Etiam auctor eros quis venenatis rutrum. Donec sagittis, risus ut elementum volutpat, dui risus ultrices orci, nec condimentum libero velit eu augue. Integer fringilla varius sapien, sed semper purus elementum quis. Nullam pulvinar cursus enim, sed placerat odio. Nunc eu condimentum lectus. Cras ut sem fermentum, varius sem volutpat, vulputate dui. Maecenas a hendrerit turpis, at ullamcorper nisl. Donec vel leo fringilla, scelerisque magna sit amet, suscipit ex. Ut venenatis, ligula condimentum tempus fermentum, turpis nisl congue ipsum, non consequat nulla lectus eget mauris. Nam id nisl felis. Phasellus quis malesuada dolor. Fusce mattis ultricies neque eu accumsan. Nam nec feugiat lectus.</div>
<div id="james_imagec">
<div style="background: url(http://image.noelshack.com/fichiers/2014/36/1410124776-james-buchanan-bucky-barnes-600-1728336.jpg) top center; height: 196px; width: 136px;"></div><span>Morbi luctus non nisl sit amet aliquam. Mauris vitae neque nulla. Nulla tempus mattis dictum. Curabitur ac massa in dolor fringilla pellentesque quis ac nibh. In facilisis lacinia justo, nec convallis sapien.</span></div>
<div style="display: inline-block; height: 196px; width: 146px; border: 2px solid #000; border-left: 0; border-top: 0; margin-left: -4px; overflow: auto; font: 13px 'Handlee';">Maecenas convallis tellus id fermentum imperdiet. Sed porttitor turpis at odio rutrum, consectetur commodo ex commodo. Curabitur id finibus dolor, sed tristique justo. Pellentesque mattis mollis ligula, gravida luctus tortor dapibus quis. Morbi cursus lorem arcu, eget venenatis tortor venenatis eget. Curabitur venenatis congue eros, at blandit nunc fermentum non. Donec ut faucibus quam. Praesent dictum felis ac nisi maximus, id lacinia mauris dignissim. Integer in feugiat justo, vitae ultricies enim. Ut eleifend porttitor metus.</div></div><div class="fiche_br">
<div style="display: inline-block; height: 196px; width: 213px; border: 2px solid #000; border-top: 0; overflow: auto; font: 13px 'Handlee';">Donec pretium convallis erat, ac ullamcorper turpis. Curabitur mauris odio, tristique nec dolor eu, lacinia rutrum dui. Duis varius in lectus eget tempus. Fusce et est at odio viverra rutrum in eu orci. In elit lectus, hendrerit sit amet faucibus mattis, euismod a arcu. Pellentesque sodales libero urna, at rutrum orci elementum a. Etiam ipsum eros, cursus at ex ac, mattis molestie mi. Sed mauris libero, blandit tincidunt quam eu, laoreet dignissim nulla. Donec tempus massa nisl, eget mattis felis sodales nec.</div>
<div style="display: inline-block; height: 196px; width: 213px; border: 2px solid #000; border-left: 0; border-top: 0; margin-left: -4px; overflow: auto; font: 13px 'Handlee'; direction: rtl; text-align: left;">Donec a orci id nisl sagittis ullamcorper. Aenean nunc ipsum, rutrum eget posuere sed, lacinia non magna. Mauris tortor urna, luctus ut efficitur at, egestas in urna. In hac habitasse platea dictumst. Integer ac mauris eu mauris lacinia fermentum. Praesent nec metus eu nibh porta tempor. Sed quis turpis turpis. Quisque congue urna elit, at hendrerit dui eleifend in. Donec at feugiat dui. Aliquam sit amet dui eu massa tincidunt rhoncus. Mauris orci nisl, imperdiet eu nisl id, sagittis blandit odio.</div></div>
</div>

Pow ! Sérieux ? Elles sont extra vos fiches ! J'espère que tout ça ira dans le LS une fois le défi terminé, sinon les membres vont baver devant sans pouvoir les utiliser
Bravo à tous sincèrement, j'ai eu beaucoup de mal à faire mon choix, y'a pleins de choses qui me plaisaient dans toutes sans exception. Finalement j'ai voté pour la première car c'est elle qui me fait le plus penser à Marvel et aux comics (l'animation au survol, la citation qui apparait...).
Un grand bravo pour votre travail !

Moi aussi j'ai eu du mal à choisir ! J'ai fini par voter pour la première, parce que c'est celle qui me donnerait le plus envie de connaître le personnage. J'ai hésité avec... presque toutes les autres, mais surtout la numéro 7 que j'ai trouvée sympa et représentative de la complexité d'un personnage, quoiqu'à mon goût il manque un padding pour que le texte ne colle pas les bordures.
En tout cas bravo à tous ! je trouve toutes ces fiches très belles (=

J'ai eu quelques soucis avec internet donc je donne enfin mon avis \o/ Comme je connais qui a fait quoi je ne voterai pas mais j'vais détailler mon avis

#1
Cette fiche est vraiment bien faites, elle est superbe et visuellement parlant, elle mérite d'être voter. MAIS le code c'est pas ça .-. Le nom des classes par exemple est ultra complexe et on ne s'y retrouve pas au premier coup d'œil. Je ne critique pas la façon de coder Juste que le nom des classes n'est pas clair et avec tous ces chiffres on s'y perd.

#2
C'est vert, donc forcément c'est beau *-* Le défilé en bas de la fiche m'a l'air plutôt bien géré, même si je dois avouer que je n'y comprends que dalle à cette bannière xD (Ne te vexe pas hein j'ai pas la science infuse moi .-.) La fiche n'est pas surchargée et c'est positif dans ce monde de folklore !

#3
Pour cette fiche elle jolie comme tout, le code plutôt facile à utiliser. Mais, je ne sais pas si ma culture Marvel est pourrie ou quoi mais.. Je ne ressens absolument pas l'univers Marvel dans cette fiche .-.

#4
La fiche est sympa, mais le code est fort brouillon Cependant, c'est très félin et faut pas être allergique aux poils de chats /pan.

#5
J'aime beaucoup cette fiche. C'est une façon bien différente de présenter les relations d'un personnage. Ce qui me chagrine mais ça c'est personnel, c'est l'absence d'espace entre l'image et le "nom, prénom etc." Un padding aurait créé cet espace (Comment ça c'est un conseil ? )

#6
Je crois que si je devais voter visuellement parlant ce serait pour cette fiche ! Elle est magnifique et c'est le coup de cœur *-* Mais le code en lui même ne me plait guère >< Je n'aime pas les tableaux, après c'est très personnel comme avis. (Ne te vexe pas là-dessus ta fiche est superbe ♥)

#7
Alors là je suis perplexe La fiche en elle-même est cowl, mais je ne vois pas du tout où, comment et pourquoi l'utiliser ._. Le code est facilement accessible donc c'est un bon point. Mais le border sur la deuxième rangée dépasse u_u (Les pixels et moi, une grande histoire d'amour x))

En bref, je n'ai pas de grande préférence visuelle et au niveau du code. Donc ne pas voter m'arranger xD

Je vous remercie tous pour avoir participer à ce premier Maître d'œuvre, je ne m'attendais vraiment pas à avoir autant de participation *-*

Oh y en a des jolies choses ici! Même si j'ai aimé toutes vos créations, je dois dire que, visuellement, les fiches #1 et #6 sont un vrai coup de cœur! J'aime également beaucoup la #5 : comme l'a dit Alice c'est une façon originale de présenter les liens mais, dans la pratique, beaucoup de membres ne sachant pas grapher, ça risque d'être coton pour eux de trouver des images à la bonne dimension ^^' La dernière me laisse un peu perplexe... C'est original, c'est joli mais comment on s'en sert? Au premier abord, j'ai cru que c'était une fiche de liens mais en fait, je n'en suis pas sûre du tout Du coup, il faudrait la voir en situation mais là, j'avoue que je me sens obligée de la placer hors-catégorie parce que je n'ai strictement aucune idée quant à sa nature. Idem, la 3 passe en hors-concours pour moi puisqu'elle ne me fait pas songer à l'univers demandé même si elle est jolie, claire et facile d'utilisation :) Les fiches 1, 2, 4, 5 et 6 sont celles qui rappellent le plus l'univers des comics (même si la 4 concerne DC Comics et pas Marvel ) mais pas facile de choisir entre la première et la dernière... Le rendu de la 1 me plaît plus mais le code de la 6 est plus clair et, pour les non-initiés comme pour les autres, c'est quand même plus agréable de savoir quoi changer sans y passer des plombes Après réflexion, les animations au survol l'emportent (donc le codage plus complexe) mais c'est vraiment de justesse x)

Félicitations à tous les participants, vos créations sont toutes très sympas et elles feront des heureux si elles terminent en LS

Pouet !

J'aime particulièrement trois créas dans ce défi à savoir la #1, 3 & 6. J'ai voté pour la première, pour son originalité et sa technique. J'ai hésité avec la sixième qui est bien fichue également mais il y manque un petit quelque chose au niveau du fond, ça fait vide je trouve et noir sur gris, ça fait tristounet. En revanche, la 3 me semble être hors-sujet, car même s'il est question du mot "hero" sur l'image du haut, rien ne fait vraiment allusion au thème qui était Marvel et c'est bien dommage parce que j'aime l'ambiance de cette fiche :S

M'enfin bwref, bon courage pour les votes ! :)

Coucou !

Tout d'abord, je tenais à féliciter tous les participants pour ces magnifiques fiches ! Y'a un sacré niveau !

Le choix n'a pas été simple mais j'ai décidé de voter pour la première fiche tout simplement car j'ai beaucoup aimé la présentation générale ainsi que les animations... Que j'aimerai savoir faire ça un jour... ^^
Félicitations donc au créateur de cette fiche  

Bon courage à toutes et à tous et encore bravo !

C'est vrai que vous avez envoyé du pâté punaise ! "o" J'ai cependant eu un coup de cœur pour la fiche numéro 4 ( la femme chat, elle heu......... et merde ! ( petite référence )

J'ai aussi beaucoup aimé la 2, j'aime quand c'est bien structuré et quand la fiche est pas trop large. Le défilement des comics est bien sympa aussi. ( Imagine les remplacer pas des pedobears trolleur )

Les autres fiches sont vraiment super aussi on voit que vous vous êtes défoncé le c.. pour les rendre originales et rien que pour ça vous méritez tous de gagner. Félicitation !

Hello (:

Des nouvelles (^-^) ? Les votes sont encore ouverts ?

Bonjour Nihil,

Les votes se sont clos automatiquement, il y avait une durée limitée au sondage ^^ Pour ce qui est des nouvelles, bah déjà qu'on en a pas d'Alice, alors du topic

Les votes se sont clos automatiquement, il y avait une durée limitée au sondage ^^

Ah mais oui, j'avais oublié cette fonctionnalité

Merci merci :)

Quelqu'un sait de qui sont les fiches? Pour au moins annoncer les créateurs? ^^

NyoTheNeko a écrit:Quelqu'un sait de qui sont les fiches? Pour au moins annoncer les créateurs? ^^

Je ne sais pas pour les autres, pour ma part j'avais fait la #1

Mmhh... Alzufen était le numéro 7 et moi le numéro 6 en tout cas.

Moi c'était la 3 =)
(et Nihil, ta création déchire °°)

J'ai fais la cinquième ^^

D'où tu dis laquelle c'est la mienne Onyx ? Je te boude ! T'as pas à le dire pour moi bouuuh Mais effectivement, c'était la 7 (toute façon maintenant que c'est dis) j'ai fait à l'arrache et je m'étais rendu compte du soucis de margin... Par contre pour ceux qui auraient pas compris, le but était de ressembler à une BD, et pour l'utilisation bah ça fais un peu fiche de présentation en fait mais bon, j'aurais voulu travailler plus que ça... mais ma folie de faire la truc au dernier moment et de relever un défi l'a emporté XD

Nous avons donc la gagnante: Nihil qui a fait la #1. Félicitation pour cette création très jolie!
Notre (ou plutôt nos!) deuxième place:Ehawee la #3 et Dakota la #5! Notre #4 est pour l'instant un mystère mais félicitation à lui! ^^
Onyx la #6 otient une belle troisième place (ou cinquième selon comment on compte)!
Scavenger la #2 et Alzufen la #7 obtiennent malheureusement la dernière place!

Félicitation à tous ceux qui ont participé, et merci à tous ceux qui ont voté!

Tu t'improvises annonce des vainqueurs à la place d'Alice, Nyo ? :3

Je rajouterais juste pour info car il l'a dit sur la CB et tout, mais la deuxième c'est Scavenger

Si la 4 n'est pas toi, c'est peut-être Hallo ou Alice mais je sais pas si l'une des deux à participer en fait donc bon ><'

Je n'ai pas participé personnellement, mais je crois qu'Alice avait demandé si elle le pouvait en tant qu'organisatrice, et que ça n'avait pas été refusé.

Je crois qu'Alice avait dis ne pas participer mmh... Qui est le mystérieux inconnu qui se cache là-dessous ? XD

Du coup j'ai édité mon "annonce"pour ajouter Scav'

Moi personnellement ma fiche préféré est la numéro 6 :)

Whaaaaaaaaaou j'arrive après les votes, mais quel travail. Vraiment un immense bravo ^^