Liens#4 - Version 2

<center><div class="SimsFAfond"><table align=center><tr><td width="200px"><div class="SimsFA"><div class="SimsFA_img"><img src="https://nsa40.casimages.com/img/2019/08/06/190806094148628251.png" width="200px;" height="320px;" /></div><div class="SimsFA_description"><div class="SimsFAbande">Qualités</div>
Ecrire ici les qualités de ton personnage.
Tu peux simplement les lister ou alors les décrire. Dans ce cas, si tu veux un code joli pour faire ressortir le caractère dans le texte, tu peux utiliser <span class="SimsFAgras">cet aspect</span> grâce au petit code ^^

<div class="SimsFAbande">Défauts</div>
Ecrire ici les défauts de ton personnage.
Et du coup, comme tu peux le remarquer, ce cadre est équipé d'un <span class="SimsFAgras">overflow</span> ce qui te permet de mettre autant de texte que tu le désires derrière cet avatar !</div></td><td width="300px"><div class="SimsFAinfos"><div class="SimsFAbande">Pseudo</div><span class="SimsFAgras">Âge</span> - <span class="SimsFAgras">Métier</span> - <span class="SimsFAgras">Situation</span><br/>
<div class="SimsFAanecdotes">Ici, vous allez pouvoir écrire ce que vous voulez : des trucs particuliers sur votre personnage, des choses importantes.

Vous pouvez le présenter sous forme d'anecdotes :
<span class="SimsFAgras">Anecdote 1</span> ici
Ou alors sous forme de dates :
<span class="SimsFAgras">Date</span> événement
Ou bien sous tout autre forme donc vous avez envie XD

A noter : ce cadre est équipe d'un <span class="SimsFAgras">overflow</span> lui aussi, ce qui vous permet de mettre autant de contenu que vous le désirez.
Ecrivez, laissez vos doigts parler pour vous ;)</div>
<div class="SimsFAbande"><a href="" target="_blank" style="color:#fefefe;">Fiche de présentation</a></div></div></td></tr></table><br/><br/>
<div class="SimsFAbande2">Liens que je recherche</div>(♀♂) <span class="SimsFAgras">Intitulé du lien</span> - Description du lien
(♀♂) <span class="SimsFAgras">Intitulé du lien</span> - Description du lien
(♀♂) <span class="SimsFAgras">Intitulé du lien</span> - Description du lien
<br/></div>
<div style="font-size:8px;">Loukoum sur <a href="https://tourmaline.forumactif.com/" target="_blank">Tourmaline</a></div></center>

<center><div class="SimsFAfond"><div class="SimsFAbande22">Les filles / Les garçons / Autre titre</div>
<table align=center><tr><td><div style="background-image: url(https://nsa40.casimages.com/img/2019/08/18/190818064623266454.png);background-size: cover;width:200px;height:320px;position:relative;border:6px solid #858cac;"><div class="SimsFAlien"><span class="SimsFAgras">Intitulé du lien</span> Et ici vous décrivez votre lien : comment il a évolué, ... .

A noter : ce cadre est équipé d'un <span class="SimsFAgras">overflow</span>, donc comme précédemment, vous pouvez écrire autant que vous voulez !</div><div class="SimsFAbande321">Pseudo</div></td><td><div style="background-image: url(https://nsa40.casimages.com/img/2019/08/22/190822075131301347.png);background-size: cover;width:200px;height:320px;position:relative;border:6px solid #FFFFFF;"><div class="SimsFAlien"><span class="SimsFAgras">Intitulé du lien</span> Et ici vous décrivez votre lien.</div><div class="SimsFAbande322">Pseudo</div></td></tr><tr><td><div style="background-image: url(https://66.media.tumblr.com/c740cb8f86e8e369dc612a21a54b4002/tumblr_po93g9BEOd1s2nxzho7_250.png);background-size: cover;width:200px;height:320px;position:relative;border:6px solid #FFFFFF;"><div class="SimsFAlien"><span class="SimsFAgras">Intitulé du lien</span> Et ici vous décrivez votre lien.</div><div class="SimsFAbande322">Pseudo</div></td><td><div style="background-image: url(https://66.media.tumblr.com/5e064943194ec51d5cd5e9680d912599/tumblr_po5wtm8ixp1s2nxzho6_250.png);background-size: cover;width:200px;height:320px;position:relative;border:6px solid #858cac;"><div class="SimsFAlien"><span class="SimsFAgras">Intitulé du lien</span> Et ici vous décrivez votre lien.</div><div class="SimsFAbande321">Pseudo</div></td></tr></table></div>
<div style="font-size:8px;">Loukoum sur <a href="https://tourmaline.forumactif.com/" target="_blank">Tourmaline</a></div></center>

<tr><td><div style="background-image: url(https://66.media.tumblr.com/c740cb8f86e8e369dc612a21a54b4002/tumblr_po93g9BEOd1s2nxzho7_250.png);background-size: cover;width:200px;height:320px;position:relative;border:6px solid #858cac;"><div class="SimsFAlien"><span class="SimsFAgras">Intitulé du lien</span> Et ici vous décrivez votre lien.</div><div class="SimsFAbande321">Pseudo</div></td><td><div style="background-image: url(https://66.media.tumblr.com/5e064943194ec51d5cd5e9680d912599/tumblr_po5wtm8ixp1s2nxzho6_250.png);background-size: cover;width:200px;height:320px;position:relative;border:6px solid #FFFFFF;"><div class="SimsFAlien"><span class="SimsFAgras">Intitulé du lien</span> Et ici vous décrivez votre lien.</div><div class="SimsFAbande322">Pseudo</div></td></tr><tr><td><div style="background-image: url(https://66.media.tumblr.com/c740cb8f86e8e369dc612a21a54b4002/tumblr_po93g9BEOd1s2nxzho7_250.png);background-size: cover;width:200px;height:320px;position:relative;border:6px solid #FFFFFF;"><div class="SimsFAlien"><span class="SimsFAgras">Intitulé du lien</span> Et ici vous décrivez votre lien.</div><div class="SimsFAbande322">Pseudo</div></td><td><div style="background-image: url(https://66.media.tumblr.com/5e064943194ec51d5cd5e9680d912599/tumblr_po5wtm8ixp1s2nxzho6_250.png);background-size: cover;width:200px;height:320px;position:relative;border:6px solid #858cac;"><div class="SimsFAlien"><span class="SimsFAgras">Intitulé du lien</span> Et ici vous décrivez votre lien.</div><div class="SimsFAbande321">Pseudo</div></td></tr>

/*---------------------------------------------------------------------*/
/*---------------------------Fiche de liens---------------------------*/
/*---------------------Loukoum sur Tourmaline---------------------*/
/*---------------------------------------------------------------------*/
.SimsFAfond{
  width:500px;
  background-color: #532724;
  background-image: url("https://www.transparenttextures.com/patterns/xv.png");
  border:5px solid #f87001;
  padding:10px;
  text-align:justify;
  font-family:'Muli';
  font-size:12px;
}

.SimsFA{
  width:200px;
  height:320px;
  overflow:hidden;
}

.SimsFA_img{
  position:relative;
  z-index:2;
  width:200px;
  height:320px;
  transform:all;
  -moz-transform:all;
  -o-transform:all;
  -htm-transform:all;
  -webkit-transform:all;
  transition:1s;
  -moz-transition:1s;
  -o-transition:1s;
  -htm-transition:1s;
  -webkit-transition:1s;
}

.SimsFA:hover .SimsFA_img{
  margin-left:-200px;
  transform:all;
  -moz-transform:all;
  -o-transform:all;
  -htm-transform:all;
  -webkit-transform:all;
  transition:1s;
  -moz-transition:1s;
  -o-transition:1s;
  -htm-transition:1s;
  -webkit-transition:1s;
}

.SimsFA_description{
  position:relative;
  z-index:1;width:200px;
  height:320px;
  margin-top:-320px;
  overflow-y:auto;
  overflow-x:hidden;
}

.SimsFAbande{
  color:#532724;
  background-color:#f87001;
  width:90%;
  padding:5px;
  text-align:center;
  font-family:'Arizonia';
  font-size:14px;
}

.SimsFAbande:hover{
  background-color:#fbefcd;
}

.SimsFAbande2{
  color:#532724;
  background-color:#f87001;
  width:490px;
  padding:5px;
  text-align:center;
  font-family:'Arizonia';
  font-size:14px;
}

.SimsFAbande2:hover{
  background-color:#fbefcd;
}

.SimsFAbande22{
  color:#532724;
  background-color:#f87001;
  width:490px;
  padding:5px;
  text-align:center;
  font-family:'Arizonia';
  font-size:20px;
}

.SimsFAbande22:hover{
  background-color:#fbefcd;
}

.SimsFAgras{
  font-weight:bold;
  color:#f87001;
  text-transform:uppercase;
  font-size:10px;
}

.SimsFAgras:hover{
  color:#532724;
}

.SimsFAinfos{
  padding-left:10px;
  text-align:center;
}

.SimsFAanecdotes{
  padding:0px 10px 0px 10px;
  width:90%;
  height:200px;
  overflow:auto;
  font-size:12px;
  text-align:justify;
}

.SimsFApresentation{
  padding:0px 10px 0px 10px;
  width:90%;
  height:270px;
  overflow:auto;
  font-size:12px;
  text-align:justify;
}

.SimsFApresIRL{
  padding:0px 10px 0px 10px;
  width:90%;
  height:120px;
  overflow:auto;
  font-size:12px;
  text-align:justify;
}

.SimsFAtitre{
  font-size:20px;
  font-family:'Arizonia';
  color:#f87001;
  width:450px;
  font-weight:bold;
}

.SimsFAentete{
  width:350px;
}

.SimsFAlien{
  font-family:'Muli';
  font-size:12px;
  opacity:0.0;
  color: #532724;
  text-align: justify;
  width: 190px;
  height: 310px;
  background-color: #fbefcd;
  -webkit-transition: opacity .6s linear;
  -moz-transition: opacity .6s linear;
  -o-transition: opacity .6s linear;
  padding:5px;
  overflow:auto;
}

.SimsFAlien:hover{
  opacity: 0.9;
}

.SimsFAbande3{
  color:#532724;
  background-color:#f87001;
  width:190px;
  padding:5px;
  text-align:center;
  margin-top:-180px;
  font-family:'Arizonia';
  font-size:14px;
}

.SimsFAbande321{
  color:#532724;
  background-color:#f87001;
  width:190px;
  padding:5px;
  text-align:center;
  margin-top:-27px;
  font-family:'Arizonia';
  font-size:14px;
}

.SimsFAbande322{
  color:#f87001;
  background-color:#532724;
  width:190px;
  padding:5px;
  text-align:center;
  margin-top:-27px;
  font-family:'Arizonia';
  font-size:14px;
}