Safe Haven



 


 
fiche Sh
avatar

Messages : 62
Date d'inscription : 14/10/2007


Admin
happiness is forged in the fires of hell
Sam 17 Fév - 17:42
Voir le profil de l'utilisateur


Nom Prénom






Date de naissance25/12/00 (2018 ans)
RaceHumain
Lieu de naissancePapouasie Nouvelle-Guinée
QuartierCentre
MétierMangeur de pigeons
Niveau0
Couleur des yeuxOrange
Taille1m34






Chronologie






Tab 1


A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text.



Tab 2



Tab 3



Tab 4



Tab 5



Tab 6



Tab 7



Tab 8



Tab 9



Tab 10










Derrière l'écran


PseudoToto
ÂgeToto
Comment as-tu découvert le forumArdeo, mihi credite, Patres conscripti (id quod vosmet de me existimatis et facitis ipsi) incredibili quodam amore patriae, qui me amor et subvenire olim impendentibus periculis maximis cum dimicatione capitis, et rursum, cum omnia tela undique esse intenta in patriam viderem, subire coegit atque excipere unum pro universis. Hic me meus in rem publicam animus pristinus ac perennis cum C. Caesare reducit, reconciliat, restituit in gratiam.
Ta fréquence de rpToto
Un commentaire ?Toto





Code:
<div class="fiche_cadre">
<div class="fiche_img" style="background-image:url(https://media.giphy.com/media/lDlJF8l4YE2vS/giphy.gif);"></div> <div class="fiche_infos">Nom Prénom</div>
<div id="triangle-holder">
<div id="fiche_triangle1"></div>
<div id="fiche_triangle2"></div>
</div>

<div class="fiche_general"><div class="fiche_idleft"><span class="monstre_nomavinc">Date de naissance</span>25/12/00 (2018 ans)
<span class="monstre_nomavinc">Race</span>Humain
<span class="monstre_nomavinc">Lieu de naissance</span>Papouasie Nouvelle-Guinée
<span class="monstre_nomavinc">Quartier</span>Centre</div><div class="fiche_idright"><span class="monstre_nomavinc">Métier</span>Mangeur de pigeons
<span class="monstre_nomavinc">Niveau</span>0
<span class="monstre_nomavinc">Couleur des yeux</span>Orange
<span class="monstre_nomavinc">Taille</span>1m34</div></div>
<div id="fiche_triangle1b"></div>
<div id="fiche_triangle2b"></div>
<div class="fiche_questions">
<div class="carousel-container">
  <div class="carousel my-carousel carousel--translate">
    <input class="carousel__activator" type="radio" name="carousel" id="F" checked="checked"/>
    <input class="carousel__activator" type="radio" name="carousel" id="G"/>
    <input class="carousel__activator" type="radio" name="carousel" id="H"/>
    <input class="carousel__activator" type="radio" name="carousel" id="I"/>
    <input class="carousel__activator" type="radio" name="carousel" id="J"/>
    <div class="carousel__controls">
      <label class="carousel__control carousel__control--backward" for="J"></label>
      <label class="carousel__control carousel__control--forward" for="G"></label>
    </div>
    <div class="carousel__controls">
      <label class="carousel__control carousel__control--backward" for="F"></label>
      <label class="carousel__control carousel__control--forward" for="H"></label>
    </div>
    <div class="carousel__controls">
      <label class="carousel__control carousel__control--backward" for="G"></label>
      <label class="carousel__control carousel__control--forward" for="I"></label>
    </div>
    <div class="carousel__controls">
      <label class="carousel__control carousel__control--backward" for="H"></label>
      <label class="carousel__control carousel__control--forward" for="J"></label>
    </div>
    <div class="carousel__controls">
      <label class="carousel__control carousel__control--backward" for="I"></label>
      <label class="carousel__control carousel__control--forward" for="F"></label>
    </div>
    <div class="carousel__track">
      <div class="carousel__slide">
<div class="topic_titre3">Caractère</div>       
<div class="fiche_txt">Oportunum est, ut arbitror, explanare nunc causam, quae ad exitium praecipitem Aginatium inpulit iam inde a priscis maioribus nobilem, ut locuta est pertinacior fama. nec enim super hoc ulla documentorum rata est fides.

Ardeo, mihi credite, Patres conscripti (id quod vosmet de me existimatis et facitis ipsi) incredibili quodam amore patriae, qui me amor et subvenire olim impendentibus periculis maximis cum dimicatione capitis, et rursum, cum omnia tela undique esse intenta in patriam viderem, subire coegit atque excipere unum pro universis. Hic me meus in rem publicam animus pristinus ac perennis cum C. Caesare reducit, reconciliat, restituit in gratiam.</div>
    <div class="losange">
      <div class="los1"  style="background-image:url('https://i.imgur.com/Pb6PJii.gif');background-size:contain;background-position:center;">
      </div>
    </div>
      </div>
      <div class="carousel__slide">
      <div class="topic_titre3">Avis sur les monstres, le Conseil et le Monde Monstrueux</div>       
<div class="fiche_txt">Oportunum est, ut arbitror, explanare nunc causam, quae ad exitium praecipitem Aginatium inpulit iam inde a priscis maioribus nobilem, ut locuta est pertinacior fama. nec enim super hoc ulla documentorum rata est fides.

Ardeo, mihi credite, Patres conscripti (id quod vosmet de me existimatis et facitis ipsi) incredibili quodam amore patriae, qui me amor et subvenire olim impendentibus periculis maximis cum dimicatione capitis, et rursum, cum omnia tela undique esse intenta in patriam viderem, subire coegit atque excipere unum pro universis. Hic me meus in rem publicam animus pristinus ac perennis cum C. Caesare reducit, reconciliat, restituit in gratiam.</div>
    <div class="losange">
      <div class="los1"  style="background-image:url('https://i.imgur.com/Pb6PJii.gif');background-size:contain;background-position:center;">
      </div>
    </div>
      </div>
      <div class="carousel__slide">
      <div class="topic_titre3">Anecdotes et autres informations</div>       
<div class="fiche_txt">Oportunum est, ut arbitror, explanare nunc causam, quae ad exitium praecipitem Aginatium inpulit iam inde a priscis maioribus nobilem, ut locuta est pertinacior fama. nec enim super hoc ulla documentorum rata est fides.

Ardeo, mihi credite, Patres conscripti (id quod vosmet de me existimatis et facitis ipsi) incredibili quodam amore patriae, qui me amor et subvenire olim impendentibus periculis maximis cum dimicatione capitis, et rursum, cum omnia tela undique esse intenta in patriam viderem, subire coegit atque excipere unum pro universis. Hic me meus in rem publicam animus pristinus ac perennis cum C. Caesare reducit, reconciliat, restituit in gratiam.</div>
    <div class="losange">
      <div class="los1"  style="background-image:url('https://i.imgur.com/Pb6PJii.gif');background-size:contain;background-position:center;">
      </div>
    </div>
      </div>
      <div class="carousel__slide">
      <div class="topic_titre3">Avantages</div>       
<div class="fiche_txt">Oportunum est, ut arbitror, explanare nunc causam, quae ad exitium praecipitem Aginatium inpulit iam inde a priscis maioribus nobilem, ut locuta est pertinacior fama. nec enim super hoc ulla documentorum rata est fides.

Ardeo, mihi credite, Patres conscripti (id quod vosmet de me existimatis et facitis ipsi) incredibili quodam amore patriae, qui me amor et subvenire olim impendentibus periculis maximis cum dimicatione capitis, et rursum, cum omnia tela undique esse intenta in patriam viderem, subire coegit atque excipere unum pro universis. Hic me meus in rem publicam animus pristinus ac perennis cum C. Caesare reducit, reconciliat, restituit in gratiam.</div>
    <div class="losange">
      <div class="los1"  style="background-image:url('https://i.imgur.com/Pb6PJii.gif');background-size:contain;background-position:center;">
      </div>
    </div>
      </div>
      <div class="carousel__slide">
      <div class="topic_titre3">Inconvénients</div>       
<div class="fiche_txt">Oportunum est, ut arbitror, explanare nunc causam, quae ad exitium praecipitem Aginatium inpulit iam inde a priscis maioribus nobilem, ut locuta est pertinacior fama. nec enim super hoc ulla documentorum rata est fides.

Ardeo, mihi credite, Patres conscripti (id quod vosmet de me existimatis et facitis ipsi) incredibili quodam amore patriae, qui me amor et subvenire olim impendentibus periculis maximis cum dimicatione capitis, et rursum, cum omnia tela undique esse intenta in patriam viderem, subire coegit atque excipere unum pro universis. Hic me meus in rem publicam animus pristinus ac perennis cum C. Caesare reducit, reconciliat, restituit in gratiam.</div>
    <div class="losange">
      <div class="los1"  style="background-image:url('https://i.imgur.com/Pb6PJii.gif');background-size:contain;background-position:center;">
      </div>
    </div>
    </div>
    </div>
    <div class="carousel__indicators">
<label class="carousel__indicator" for="F"></label><label class="carousel__indicator" for="G"></label><label class="carousel__indicator" for="H"></label><label class="carousel__indicator" for="I"></label><label class="carousel__indicator" for="J"></label>
    </div>
  </div>
</div>
</div>
<div id="fiche_triangle4"></div><div class="fiche_titre3">Chronologie</div>
<div class="wrapper">
<div class="labels"><span tabindex="0"><label class="tab-label" for="tab-tab1">Tab Caption 1</label></span><span tabindex="0"><label class="tab-label" for="tab-tab2-0">Tab Caption 2</label></span><span tabindex="0"><label class="tab-label" for="tab-tab2-1">Tab Caption 3</label></span><span tabindex="0"><label class="tab-label" for="tab-tab2-2">Tab Caption 4</label></span><span tabindex="0"><label class="tab-label" for="tab-tab2-3">Tab Caption 5</label></span><span tabindex="0"><label class="tab-label" for="tab-tab2-4">Tab Caption 6</label></span><span tabindex="0"><label class="tab-label" for="tab-tab2-5">Tab Caption 7</label></span><span tabindex="0"><label class="tab-label" for="tab-tab2-6">Tab Caption 8</label></span><span tabindex="0"><label class="tab-label" for="tab-tab2-7">Tab Caption 9</label></span><span tabindex="0"><label class="tab-label" for="tab-tab2-8">Tab Caption 10</label></span>
</div>
<div class="tabs">
<div class="tab"><input class="tab-radio" type="radio" id="tab-tab1" name="tabs-main" checked><div class="tab-panel"><div class="tab-content">
<h2>Tab 1</h2>
<p>A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text. A long piece of text.</p>
</div></div></div><div class="tab"><input class="tab-radio" type="radio" id="tab-tab2-0" name="tabs-main"><div class="tab-panel"><div class="tab-content">
<h2>Tab 2</h2>
</div></div></div><div class="tab"><input class="tab-radio" type="radio" id="tab-tab2-1" name="tabs-main"><div class="tab-panel"><div class="tab-content">
<h2>Tab 3</h2>
</div></div></div><div class="tab"><input class="tab-radio" type="radio" id="tab-tab2-2" name="tabs-main"><div class="tab-panel"><div class="tab-content">
<h2>Tab 4</h2>
</div></div></div><div class="tab"><input class="tab-radio" type="radio" id="tab-tab2-3" name="tabs-main"><div class="tab-panel"><div class="tab-content">
<h2>Tab 5</h2>
</div></div></div><div class="tab"><input class="tab-radio" type="radio" id="tab-tab2-4" name="tabs-main"><div class="tab-panel"><div class="tab-content">
<h2>Tab 6</h2>
</div></div></div><div class="tab"><input class="tab-radio" type="radio" id="tab-tab2-5" name="tabs-main"><div class="tab-panel"><div class="tab-content">
<h2>Tab 7</h2>
</div></div></div><div class="tab"><input class="tab-radio" type="radio" id="tab-tab2-6" name="tabs-main"><div class="tab-panel"><div class="tab-content">
<h2>Tab 8</h2>
</div></div></div><div class="tab"><input class="tab-radio" type="radio" id="tab-tab2-7" name="tabs-main"><div class="tab-panel"><div class="tab-content">
<h2>Tab 9</h2>
</div></div></div><div class="tab"><input class="tab-radio" type="radio" id="tab-tab2-8" name="tabs-main"><div class="tab-panel"><div class="tab-content">
<h2>Tab 10</h2>
</div></div></div>
</div>
</div>

<div id="fiche_triangle5"></div>

<div class="fiche_ooc">

<div class="fiche_titre3b">Derrière l'écran</div>

<div class="topic_txt"><span class="monstre_nomavinc">Pseudo</span>Toto
<span class="monstre_nomavinc">Âge</span>Toto
<span class="monstre_nomavinc">Comment as-tu découvert le forum</span>Ardeo, mihi credite, Patres conscripti (id quod vosmet de me existimatis et facitis ipsi) incredibili quodam amore patriae, qui me amor et subvenire olim impendentibus periculis maximis cum dimicatione capitis, et rursum, cum omnia tela undique esse intenta in patriam viderem, subire coegit atque excipere unum pro universis. Hic me meus in rem publicam animus pristinus ac perennis cum C. Caesare reducit, reconciliat, restituit in gratiam.
<span class="monstre_nomavinc">Ta fréquence de rp</span>Toto
<span class="monstre_nomavinc">Un commentaire ?</span>Toto</div>
</div>
</div>
avatar

Messages : 62
Date d'inscription : 14/10/2007


Admin
happiness is forged in the fires of hell
Lun 19 Fév - 11:54
Voir le profil de l'utilisateur







https://codepen.io/CreativeJuiz/pen/Hizkh
 
fiche Sh
Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» CHATTAHOOCHEE • fiche de publicité
» Notre fiche
» Fiche technique du nouveau décodeur Technicolor
» Fiche réponse RP
» Code de présentation de fiche liens

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
test graph :: Tests :: Test-
Sauter vers: