selene craft
Messages : 2 Date d'inscription : 18/05/2016
| Sujet: dernière page d'accueil Lun 23 Mai - 15:20 | |
| - Code:
-
<meta charset="UTF-8" /> <title>Pa-Lisou</title> <style> /* ajustements personnels */
/* stylisation paragraphe contexte + choses à savoir : */ #pa { font-family: "Lucida Handwriting", cursive; font-size: 12px; position: relative; }
/* stylisation titres */ #pa h2 { font-family: sans-serif; font-size: 14px;
text-transform: uppercase; text-align: center; font-style: italic;
margin-bottom: 10px !important; /* = espace sous les titres */ }
/* stylisation liens de toute la PA */
#pa a{ text-decoration: none; color: gray; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
#pa a:hover{ text-decoration: none; color: black; }
/* stylisation format date des news */
.date { font-weight: bold; color: gray; font-size: 11px; text-transform: uppercase; }
/* stylisation liens menu */ ul#menu a { text-decoration: none; color: #000; letter-spacing: 0px; font-size: 16px; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
ul#menu a:hover { letter-spacing: 2px; font-weight: bold; }
/* stylisation pseudo "staff" */
.pseudo { margin: 5px 0px; font-weight: bold; font-size: 110%; }
/* normalize */ #pa h1,#pa h2,#pa h3,#pa h4,#pa h5,#pa h6, ul, p { margin: 0; padding: 0; font-weight: normal;}
/* GÉNÉRAL */
#pa { width: 920px; margin: 0 auto; border: 5px solid black; }
#pa-1 h1 { width: 100%; height: 130px; line-height: 100px; text-align: center; }
#container { width: 780px; margin: 20px auto 10px; overflow: hidden; }
.left { width: 620px; float: left; margin-right: 10px; min-height: 150px; }
.right { width: 126px; height: 421px; border: 2px solid #000; float: left; padding: 10px; }
/* MENU */
ul#menu { width: 100%; padding: 5px 0px; border-top: 1px solid black; border-bottom: 1px solid black; list-style-type: none; text-align: center; text-transform: uppercase; }
ul#menu li{ display: inline-block; margin: 0; padding: 0 !important; }
ul#menu li:after { content: "—"; padding: 0 15px; }
ul#menu li:last-child:after { content: ""; padding: 0px; }
/* contexte */ #contexte { width: 596px; max-width: 596px; height: 136px; max-height:136px; padding: 10px; margin-bottom: 10px; border: 2px solid black; }
img.contexteimg { width: 160px; height: 140px; margin: 0 10px 0 0; float: left; }
.texte-contexte { width: 410px; height: 140px; padding-right: 15px; /* espace pour scrollbar */ float: left; text-align: justify; overflow-y: auto; /* scrolling */ }
.texte-contexte p{ margin-bottom: 20px;} .texte-contexte p:last-child{ margin-bottom: 0px;}
/* NEWS & CHOSES SE PASSANT */ .twocols { float: left; width: 281px; height: 81px; border: 2px solid #000; margin-right: 10px; padding: 10px; position: relative; overflow: hidden; }
.twocols:nth-child(even) { margin-right: 0px; }
.news img { width: 100%; height: auto;}
.choses img { position: absolute; top: 0; left: 0; width: 100%; height: 105px; -webkit-transition: all 1s linear; -moz-transition: all 1s linear; -ms-transition: all 1s linear; -o-transition: all 1s linear; transition: all 1s linear; z-index: 1; }
.choses:hover img { /* Pour faire disparaitre l'image au survol */ position: absolute; width: 100%; height: 0px; top: 52.5px; left: 0; }
.choses p { /* Positionnement du texte sous l'image + scroll */ position: absolute; top: 0; left: 0; padding: 10px; width: 285px; height: 85px; overflow-y: auto; z-index: 0; }
/* MEMBRES + NEWS + RECHERCHES */ .threecols { float: left; width: 156px; height: 136px; border: 2px solid #000; margin-right: 10px; padding: 10px; position: relative; }
.threecols:nth-child(2) { width: 216px; }
.threecols:last-child { margin-right: 0px; }
.memberofthemonth { width: 156px; height: 115px; } .mom { float: left; width: 75px; margin-right: 6px; text-align: center; }
.mom .pseudo { font-weight: bold;}
.mom:nth-child(2), .research a:nth-child(odd) { margin-right: 0px; }
.mom img { width: 100%; height: auto; }
.newscontent { height: 110px; overflow-y: auto; }
.nouvelle { margin: 5px 0px; border-bottom: 1px dotted #000; padding-bottom: 5px; } .research {text-align: center;}
.research a { display: inline-block; width: 50px; height: 50px; background: orange; margin-right: 5px; margin-bottom: 10px; text-align: center; }
.research a img{ width: 50px; height: 50px; }
/* STAFFS */
.contentstaff { width: 100%; text-align: center; margin-bottom: 10px; }
.contentstaff img { width: 75%; height: auto; }
/* PARTENAIRES */
#footer1 { clear: both; width: 100%; padding-top: 10px !important; }
#footer1 img { width: 88px; height: 31px; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; }
#footer1 img:hover { -webkit-animation-origin: center center; -moz-animation-origin: center center; -ms-animation-origin: center center; -o-animation-origin: center center; animation-origin: center center; -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); }
#credits { position: absolute; bottom: -20px; right: 0; }
</style> <div id="pa"> <div id="pa-1"> <div class="connected"> <h1> Bienvenue <span class="user-name">{USERNAME}</span> </h1> <p> <span style="font-size: 15px;"><strong>Forum ouvert depuis le 8 août 2007 ! Interdit aux moins de 18 ans </strong></span> </p><br /> </div> <div style="display: none;" class="not-connected"> <h1> Si tu venais t'inscrire ? </h1> </div> <ul id="menu"> <li> <a href="http://vampires-kingdom.forumactif.com/f5-
reglement">Règlement</a> </li> <li> <a href="http://vampires-kingdom.forumactif.com/t10-le-
contexte">Contexte</a> </li> <li> <a href="http://vampires-kingdom.forumactif.com/f1-les-
scenarios-pv-et-predefinis">Prédéfinis</a> </li> <li> <a href="http://vampires-kingdom.forumactif.com/f8-la-
faq">FAQ</a> </li> <li> <a href="http://vampires-kingdom.forumactif.com/t1374-le-parrainage">Parrainage</a> </li> <li> <a href="http://vampires-kingdom.forumactif.com/f69-les-pubs-et-les-partenaires">Partenariat</a> </li> </ul> <div id="container"> <div class="left"> <!--
ESPACE CONTEXTE
--> <div id="contexte"> <img class="contexteimg" alt="" src="http://i68.servimg.com/u/f68/18/89/02/60/image_10.png" /> <div class="texte-contexte"> <p> Nous sommes en 2026. Dans l'ombre, les vampires exercent leur pouvoir en ce monde, qu'ils ont découpé en trois grandes puissances, divisées sur le sort des humains. Beaucoup les considèrent comme un réservoir inépuisable d'esclaves, des jouets dont l'unique raison d'être est de répondre à tous leurs caprices. D'autres choisissent de tourner le dos à cette pratique ancestrale, de vivre en paix, et de se lier à l'espèce humaine en échange de leur délicieux sang. Les intrigues politiques se jouent entre les puissances vampiriques et pendant ce temps, les humains se font enlever et réduire en esclavage, tandis que d'autres tentent d'échapper à ce sort épouvantable en se mettant sous la protection de vampires qui refusent ce genre de pratique. Une partie de la population connait leur existence, les affranchis. </p> <p> Quel rôle jouerez vous dans Vampire's Kingdom ? </p> </div> </div> <!--
ESPACE NEWS ET CHOSES SE PASSANT
--> <div style="overflow: hidden; margin-bottom: 10px;"> <div class="twocols news"> INFOS <br /> <p> Nous demandons <strong>20 lignes (ou 350 mots)</strong> </p> <p> </p> <br /> <p> Nous comptons : <strong>25 vampires - 7 dévots -</strong> </p> <p> <strong>18 esclaves - 7 affranchis - 3 résidents</strong> </p> </div> <div class="twocols choses"> <p> </p> <p> <strong><span style="font-size: 16px;">Les Top-Sites pour voter :</span></strong><br /><a target="_blank" class="postlink" href="http://www.root-top.com/topsite/serpentgy/in.php?ID=10529"><span style="font-size: 40px;">♣</span></a> <a href="http://www.root-top.com/topsite/virtu4lgames/in.php?ID=5181" class="postlink" target="_blank"><span style="font-size: 40px;">♣</span></a> <a href="http://www.root-top.com/topsite/lilie/in.php?ID=424" class="postlink" target="_blank"><span style="font-size: 40px;">♣</span></a> <a href="http://www.root-top.com/topsite/velusia/in.php?ID=531" class="postlink" target="_blank"><span style="font-size: 40px;">♣</span></a> <a href="http://www.root-top.com/topsite/korben/in.php?ID=1979" class="postlink" target="_blank"><span style="font-size: 40px;">♣</span></a> <a href="http://www.root-top.com/topsite/virtu4lhunt3r/in.php?ID=2646" class="postlink" target="_blank"><span style="font-size: 40px;">♣</span></a><br /> </p> </div> </div> <!--
ESPACE MEMBRES + NEWS + RECHERCHONS
--> <div style="overflow: hidden;"> <div class="threecols"> <h2> nouveaux membres </h2> <div class="memberofthemonth"> <p class="mom"> <img alt="" src="http://www.imabox.fr/16/05/201148oixRxz29.jpg" /> <span class="pseudo">Ida Steiger</span><br /> rang </p> <p class="mom"> <img alt="" src="http://i86.servimg.com/u/f86/11/43/81/11/vignet11.jpg" /> <span class="pseudo">Jélani Ud-Din Ilbarîde</span><br /> rang </p> </div> </div> <div class="threecols"> <h2> Nouveautés </h2> <div class="newscontent"> <div class="nouvelle"> <div class="date"> 02-03-2016 : </div> Ouverture de la section "Dreamland" et fermeture temporaire de la zone 1. </div> <div class="nouvelle"> <div class="date"> 29-01-2016 : </div> Nouveau design et mise à jour 2016. </div> <div class="nouvelle"> <div class="date"> 21-01-2016 : </div> Arrivée d'Imala (PNJ), geôlière et tortionnaire associée au Bossu ! Messieurs les esclaves, vous disposez désormais d'une charmante demoiselle pour vous guider dans la caverne (zone 1). </div> </div> </div> <div class="threecols research"> <h2> Les prédéfinis </h2> <a href="http://vampires-kingdom.forumactif.com/t6523-les-devots"> <img alt="Tyron" src="http://www.imabox.fr/16/03/241258tJKqdf11.png" /></a> <a href="http://vampires-kingdom.forumactif.com/t6453-les-residents"> <img alt="Coleen" src="http://i86.servimg.com/u/f86/18/89/02/60/januar10.png" /></a> <a href="http://vampires-kingdom.forumactif.com/t6640-les-affranchis-3-4#410992"> <img alt="Iqbal" src="http://i84.servimg.com/u/f84/18/89/02/60/idris_11.png" /></a> <a href="http://vampires-kingdom.forumactif.com/t6454-les-vampires#405160"> <img alt="Ian" src="http://i86.servimg.com/u/f86/18/89/02/60/alex_o10.png" /></a> </div> </div> </div> <!--
END COLONNE "LEFT"
-->
| |
|
selene craft
Messages : 2 Date d'inscription : 18/05/2016
| Sujet: Re: dernière page d'accueil Lun 23 Mai - 15:20 | |
| - Code:
-
<div class="right"> <h2> Staff </h2> <div class="contentstaff"> <img alt="" src="http://i68.servimg.com/u/f68/18/89/02/60/image_12.png" /> <div class="pseudo"> L'ANGE NOIR </div> <a href="http://vampires-
kingdom.forumactif.com/privmsg?mode=post&u=1277">MP</a> - <a href="http://vampires-
kingdom.forumactif.com/u1277">PROFIL</a> </div> <div class="contentstaff"> <img alt="" src="http://i68.servimg.com/u/f68/18/89/02/60/image_13.png" /> <div class="pseudo"> LA MORSURE </div> <a href="http://vampires-
kingdom.forumactif.com/privmsg?mode=post&u=1278">MP</a> - <a href="http://vampires-
kingdom.forumactif.com/u1278">PROFIL</a> </div> <div class="contentstaff"> <img src="http://i86.servimg.com/u/f86/11/43/81/11/vignet12.jpg" alt="" /> <div class="pseudo"> SELENE CRAFT </div> <a href="http://vampires-kingdom.forumactif.com/privmsg?mode=post&u=1">MP</a> - <a href="http://vampires-kingdom.forumactif.com/u1">PROFIL</a> </div> </div> <!--
END COLONNE "RIGHT"
--> <div style="text-align: center;" id="footer1"> <!--
<marquee behavior="" direction="right"
onmouseover="this.stop();" onmouseout="this.start();" scrollamount="1">
--> <a href="http://atlantisinsurrection.forumactif.fr"><img src="http://image.noelshack.com/fichiers/2014/32/1407326857-
bouton8831pegase.png" /></a> <a href="http://clan-kravt.fr/index.php"><img src="http://www.pixenli.com/images/1437/1437740289001813800.png" /></a> <a href="http://black-out.forumactif.org"><img src="http://img4.hostingpics.net/pics/364734boutonBOlight100x35.gif" /></a> <a href="http://www.poudnoir.com"><img src="http://i80.servimg.com/u/f80/13/20/44/58/poudno12.gif" /></a> <a href="http://www.reversa-rpg.com"><img src="http://img15.hostingpics.net/pics/181411boutonpart1.png" /></a> <a href="http://strange-scotland.forums-
actifs.com"><img src="http://img15.hostingpics.net/pics/408308par2.gif" /></a> <a href="http://autresvies.forumgratuit.org"><img src="http://i40.servimg.com/u/f40/11/60/23/04/cadre_15.png" /></a> <a href="http://leseigneurdesanneaux.superforum.fr"><img src="http://i39.servimg.com/u/f39/13/81/52/72/bouton11.png" /></a> <a href="http://xmhorizon.forumactif.org/"><img src="http://img15.hostingpics.net/pics/360527BOUTON.jpg" /></a> <a href="http://marbrume.forumrpg.org"><img src="http://i21.servimg.com/u/f21/12/99/58/89/bouton11.jpg" /></a> <a href="http://asaria-evolution.forumactif.org"></a><img src="http://img4.hostingpics.net/pics/663170368006asatest.gif" /> <a href="http://darkdawnsymphony.forumgratuit.org"></a><a target="_blank" href="http://antredurpg.fr-bb.com"><img border="0" alt="Annuaire de forums RPG" title="L'Antre du RPG : Annuaire de Forums RPG" src="http://i38.servimg.com/u/f38/17/93/17/20/gif88x10.gif" /></a> <a href="http://www.age-des-tourments-forumrpg.fr"><img src="http://patoune.be/Pub/images/unnamed.gif" /></a> <a href="http://clark-and-hard.forumactif.com/"><img src="http://img15.hostingpics.net/pics/652045logo1.png" /></</a> </div> </div> </div> </div>
| |
|