Salut!
Pour le Qeel, tu t'en vas dans le panneau d'administration, dans l'onglet "thème" et dans "modifier les templates". Le Qeel est dans le même template que les catégories, donc dans le template "INDEX_BODY".
Tu sélectionnes cette partie là :
- Code:
<table width="100%" cellpadding="3" cellspacing="1" border="0">
<tr>
<td class="catHead" colspan="2" height="28"><span class="cattitle"><a href="{U_VIEWONLINE}" class="cattitle">{L_WHO_IS_ONLINE}</a></span></td>
</tr>
<tr>
<td class="row1" align="center" valign="middle" rowspan="2"><img src="http://img.xooimage.com/files10/t/e/test-2f353" alt="{L_WHO_IS_ONLINE}" /></td>
<td class="row1" align="left"><span class="gensmall">{TOTAL_USERS_ONLINE}<br />{RECORD_USERS}<br /><br />{LOGGED_IN_USER_LIST}<br /><br />{L_ONLINE_EXPLAIN}</span></td>
</tr>
<td class="row1" align="left"><span class="gensmall">
<b>{L_LEGEND}</b>
<!-- BEGIN ranks_legend_row -->
<b>::</b> <span style="font-weight:bold;color:#{ranks_legend_row.COLOR}">{ranks_legend_row.TITLE}</span>
<!-- END ranks_legend_row -->
<!-- BEGIN switch_oldlegend -->
<b>::</b> {L_WHOSONLINE_ADMIN} <b>::</b> {L_WHOSONLINE_MOD}
<!-- END switch_oldlegend -->
</span>
</td>
</tr>
</table>
<br />
<!-- BEGIN switch_birthdays -->
<table width="100%" cellpadding="3" cellspacing="1" border="0"><tr><td class="catHead" height="28"><a name="login"></a><span class="cattitle">{L_BIRTHDAYS}</span></td></tr><tr><td class="row1" valign="middle" height="28"><span class="gensmall">{L_CONGRATULATIONS_TO}: {BIRTHDAY_USER_LIST}</span></td></tr></table>
<br />
<!-- END switch_birthdays -->
<table width="100%" cellpadding="3" cellspacing="1" border="0"><tr><td class="catHead" height="28"><a name="login"></a><span class="cattitle">{L_STATISTICS}</span></td></tr><tr><td class="row1" valign="middle" height="28"><span class="gensmall">{TOTAL_POSTS} | {TOTAL_USERS} | {NEWEST_USER}</span></td></tr></table><br />
Et tu remplaces entièrement par ceci :
- Code:
<link href='http://fonts.googleapis.com/css?family=Great+Vibes' rel='stylesheet' type='text/css' />
<div id="qeel">
<div id="qeel_info_members">
<span id="totaluser">{TOTAL_USERS}</span>
<span id="totalpost">{TOTAL_POSTS}</span>
<span id="newuser">{NEWEST_USER}</span>.
<span id="totalonline">{TOTAL_USERS_ONLINE}</span>.
<div id="userlists">
<div id="loggedlist">{LOGGED_IN_USER_LIST}</div>
<div id="totalconn">{L_ONLINE_EXPLAIN}</div>
</div>
<div style="display: none;">{L_CONGRATULATIONS_TO}: {BIRTHDAY_USER_LIST}</div>
<div id="qeel_title">
Qui vient par ici?
</div>
<script type="text/javascript">
document.getElementById('qeel_info_members').innerHTML=document.getElementById('qeel_info_members').innerHTML.replace(/utilisateurs enregistrés –/,"aventuriers -");
document.getElementById('qeel_info_members').innerHTML=document.getElementById('qeel_info_members').innerHTML.replace(/invisibles –/,"fantômes -");
document.getElementById('qeel_info_members').innerHTML=document.getElementById('qeel_info_members').innerHTML.replace(/se sont connectés/,"ont été présents");
</script>
<script type="text/javascript">
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Nous avons/,"Nos");
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/membre enregistré/,"guerrier");
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/membres enregistrés/,"guerriers");
document.getElementById('totalpost').innerHTML=document.getElementById('totalpost').innerHTML.replace(/Nos membres ont posté un total de/,"ont gagné");
document.getElementById('totalpost').innerHTML=document.getElementById('totalpost').innerHTML.replace(/message/,"batailles.");
document.getElementById('totalpost').innerHTML=document.getElementById('totalpost').innerHTML.replace(/message/,"bataille.");
document.getElementById('newuser').innerHTML=document.getElementById('newuser').innerHTML.replace(/L’utilisateur enregistré le plus récent est/,"et notre plus nouvelle recrue est");
document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Il y a en tout/,"Il y a");
document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/utilisateur en ligne :/,"aventurier qui parcourt nos terres, dont");
document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/utilisateurs en ligne :/,"aventuriers qui parcourent nos terres, dont");
document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Enregistré,/,"guerrier,");
document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Enregistrés,/,"guerriers,");
document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Invisible,/,"fantôme et");
document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Invisibles,/,"fantômes et");
document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Invités /,"inconnus");
document.getElementById('totalonline').innerHTML=document.getElementById('totalonline').innerHTML.replace(/Invité /,"inconnu");
document.getElementById('loggedlist').innerHTML=document.getElementById('loggedlist').innerHTML.replace(/Utilisateurs enregistrés/,"Guerriers présentement sur nos terres");
document.getElementById('qeel').innerHTML=document.getElementById('qeel').innerHTML.replace(/Ces données sont basées sur les utilisateurs actifs des 60 dernières minutes/,"");
</script>
</div>
<div id="qeel_bottom">
<script type="text/javascript">
//<!--
function change_qeelonglet(name)
{
document.getElementById('qeelonglet_'+anc_qeelonglet).className = 'qeelonglet_0 qeelonglet';
document.getElementById('qeelonglet_'+name).className = 'qeelonglet_1 qeelonglet';
document.getElementById('contenu_qeelonglet_'+anc_qeelonglet).style.display = 'none';
document.getElementById('contenu_qeelonglet_'+name).style.display = 'block';
anc_qeelonglet = name;
}
//-->
</script>
<span class="qeelonglet_1 qeelonglet" id="qeelonglet_Groupe1" onclick="javascript:change_qeelonglet('Groupe1');" style="color: #5e90c4;">
Groupe 1
</span>
<span class="qeelonglet_0 qeelonglet" id="qeelonglet_Groupe2" onclick="javascript:change_qeelonglet('Groupe2');" style="color: orange;">
Groupe 2
</span>
<span class="qeelonglet_0 qeelonglet" id="qeelonglet_Groupe3" onclick="javascript:change_qeelonglet('Groupe3');" style="color: #4dc740;">
Groupe 3
</span>
<span class="qeelonglet_0 qeelonglet" id="qeelonglet_Groupe4" onclick="javascript:change_qeelonglet('Groupe4');" style="color: #6e4819;">
Groupe 4
</span>
<span class="qeelonglet_0 qeelonglet" id="qeelonglet_Groupe5" onclick="javascript:change_qeelonglet('Groupe5');" style="color: #c50c0c;">
Groupe 5
</span>
<div class="contenu_qeelonglet" id="contenu_qeelonglet_Groupe1">
<img src="url_image_groupe_1" alt="Image du groupe 1" />
<div class="qeel_desc">
Description du groupe 1
</div>
</div>
<div class="contenu_qeelonglet" id="contenu_qeelonglet_Groupe2">
<img src="url_image_groupe_2" alt="Image du groupe 2" />
<div class="qeel_desc">
Description du groupe 2
</div>
</div>
<div class="contenu_qeelonglet" id="contenu_qeelonglet_Groupe3">
<img src="url_image_groupe_3" alt="Image du groupe 3" />
<div class="qeel_desc">
Description du groupe 3
</div>
</div>
<div class="contenu_qeelonglet" id="contenu_qeelonglet_Groupe4">
<img src="url_image_groupe_4" alt="Image du groupe 4" />
<div class="qeel_desc">
Description du groupe 4
</div>
</div>
<div class="contenu_qeelonglet" id="contenu_qeelonglet_Groupe5">
<img src="url_image_groupe_5" alt="Image du groupe 5" />
<div class="qeel_desc">
Description du groupe 5
</div>
</div>
<script type="text/javascript">
//<!--
var anc_qeelonglet = 'Groupe1';
change_qeelonglet(anc_qeelonglet);
//-->
</script>
</div>
</div>
Pour une raison que je n'ai pas trouvée, on dirait qu'on ne peut pas utiliser d'accents dans ce template, du moins pas quand on écrit directement dedans. Alors il va falloir écrire de "e" à a place de "é" et ainsi de suite ><
Sinon, pour le CSS, on va aller dans le template "OVERALL_HEADER", et on va retrouver cet endroit :
- Code:
/* General page style. The scroll bar colours only visible in IE5.5+ */
body {
background-color: {T_BODY_BGCOLOR};
scrollbar-face-color: {T_TR_COLOR2};
scrollbar-highlight-color: {T_TD_COLOR2};
scrollbar-shadow-color: {T_TR_COLOR2};
scrollbar-3dlight-color: {T_TR_COLOR3};
scrollbar-arrow-color: {T_BODY_LINK};
scrollbar-track-color: {T_TR_COLOR1};
scrollbar-darkshadow-color: {T_TH_COLOR1};
}
On met ce CSS juste avant :
- Code:
/************************************************************ DÉBUT QEEL ************************************************************/
/*Fond du qeel*/
#qeel {
position: relative;
width: 800px;
height: 680px;
margin: auto;
margin-top: 50px;
margin-bottom: 50px;
background: #141313 url('http://img15.hostingpics.net/pics/570241qeel2.png') no-repeat top center;
border-radius: 20px;
box-shadow: 0px 0px 10px #000000;
}
/*Titre du qeel*/
#qeel_title {
color: goldenrod;
font-size: 44px;
font-family: 'Great Vibes', cursive;
text-shadow: 1px 1px 2px #000000;
padding-left: 15px;
}
/*Carré des informations sur les membres*/
#qeel_info_members {
position: absolute;
top: 25px;
left: 25px;
width: 320px;
height: 290px;
background-color: rgba(20, 19, 19, 0.6);
border-radius: 10px;
box-shadow: 0px 0px 3px #141313;
padding: 10px;
color: #c9c7be;
font-size: 13px;
font-family: arial;
letter-spacing: 1px;
text-align: left;
}
/*Mise en forme des listes des membres connectés*/
#userlists {
margin-top: 5px;
height: 205px;
overflow: auto;
}
#totalconn {
margin-top: 5px;
}
#totalconn .row1{
background: transparent;
vertical-align: top;
}
#totalconn .gensmall {
color: #c9c7be;
font-size: 13px;
font-family: arial;
letter-spacing: 1px;
text-align: left;
}
/*Section des groupes*/
#qeel_bottom {
position: absolute;
top: 418px;
left: 0px;
width: 800px;
text-align: center;
}
/*Nom des groupes*/
.qeelonglet {
display: inline-block;
margin-left: 20px;
margin-right: 20px;
margin-top: 2px;
height: 40px;
font-size: 34px;
font-family: 'Great Vibes', cursive;
letter-spacing: 1px;
text-shadow: 0px 0px 3px #000000;
opacity: 0.6;
}
/*Groupe au survol*/
.qeelonglet_0:hover {
cursor: pointer;
opacity: 0.8;
}
/*Groupe actif*/
.qeelonglet_1 {
opacity: 1;
}
/*Description des groupes*/
.contenu_qeelonglet {
position: relative;
width: 800px;
height: 200px;
margin-top: 20px;
display: none;
}
/*Images des groupes*/
.contenu_qeelonglet img {
width: 800px;
height: 200px;
border-radius: 0px 0px 20px 20px;
}
/*Descriptions des groupes*/
.qeel_desc {
position: absolute;
top: 0px;
left: 0px;
width: 780px;
height: 180px;
background-color: rgba(20, 19, 19, 0.6);
border-radius: 0px 0px 20px 20px;
padding: 10px;
color: #c9c7be;
font-size: 13px;
font-family: arial;
letter-spacing: 1px;
text-align: justify;
overflow: auto;
transition: 0.5s;
opacity: 0;
}
/*Descriptions des groupes au survol*/
.contenu_qeelonglet:hover .qeel_desc {
opacity: 1;
}
/************************************************************ FIN QEEL ************************************************************/
À l'avenir, si tu veux modifier/ajouter du CSS, ce sera aussi dans ce template.
C'est tout pour le moment, je vais chercher pour le reste
Edit: Pour ce qui est des fiches de présentations...
Le HTML est uniquement autorisé aux administrateurs sur Xooit. Les membres normaux ne peuvent pas l'utiliser. Même si dans les options du message du membre normal, il est coché "le HTML est activé", le HTML ne fonctionne pas pour eux. Ce n'est pas un bug, c'est Xooit qui a décidé de fonctionner comme ça, apparemment, va savoir pourquoi...
Edit2 : Voilà pour la PA!
Tu te rend dans le panneau d'administration, tu descend le menu à gauche jusqu'à atteindre "Général", tu choisis "Message d'en-tête", puis tu tu y mets ce code :
- Code:
<link href="//fonts.googleapis.com/css?family=Cinzel:400,700,900" rel="stylesheet" type="text/css"><div id="fond_PA"><div id="titre_PA">Bienvenue sur mon forum</div><div id="soustitre_PA">Ce forum a été créé le ... Il est inspiré de...</div>
<div class="cadre_PA staff"> <span class="titre_cadre titre_staff">STAFF</span><div class="bouton_croix"> <img class="image_staff un" src="http://img1.wikia.nocookie.net/__cb20120225115529/walkingdead/images/0/0a/Daryl-dixon-picture.jpg"><a href="#"><img class="img_croix" src="http://img4.hostingpics.net/pics/793740Sanstitre8.jpg"></a></div><div class="bouton_croix"> <img class="image_staff deux" src="http://img1.wikia.nocookie.net/__cb20120225115529/walkingdead/images/0/0a/Daryl-dixon-picture.jpg"><a href="#"><img class="img_croix" src="http://img4.hostingpics.net/pics/793740Sanstitre8.jpg"></a></div><div class="bouton_croix"> <img class="image_staff trois" src="http://img1.wikia.nocookie.net/__cb20120225115529/walkingdead/images/0/0a/Daryl-dixon-picture.jpg"><a href="#"><img class="img_croix" src="http://img4.hostingpics.net/pics/793740Sanstitre8.jpg"></a></div><div class="bouton_croix"> <img class="image_staff quatre" src="http://img1.wikia.nocookie.net/__cb20120225115529/walkingdead/images/0/0a/Daryl-dixon-picture.jpg"><a href="#"><img class="img_croix" src="http://img4.hostingpics.net/pics/793740Sanstitre8.jpg"></a></div><div class="bouton_croix"> <img class="image_staff cinq" src="http://img1.wikia.nocookie.net/__cb20120225115529/walkingdead/images/0/0a/Daryl-dixon-picture.jpg"><a href="#"><img class="img_croix" src="http://img4.hostingpics.net/pics/793740Sanstitre8.jpg"></a></div></div><span class="titre_cadre titre_contexte">CONTEXTE</span><div class="cadre_PA contexte"><p>vitae velit lectus. Sed accumsan porta quam. Aliquam sit amet porta velit. Vivamus dapibus urna nec consectetur rhoncus. Maecenas vitae bibendum odio. In velit nunc, elementum et cursus vel, interdum eurisus.</p><p>vitae velit lectus. Sed accumsan porta quam. Aliquam sit amet porta velit. Vivamus dapibus urna nec consectetur rhoncus. Maecenas vitae bibendum odio. In velit nunc, elementum et cursus vel, interdum eurisus.</p></div><div class="cadre_PA postes_vacants"> <span class="titre_cadre titre_pv">POSTESVACANTS</span><div id="pv"> <a href="#"><img class="img_pv" src="http://i39.servimg.com/u/f39/17/14/00/25/pv11.png"></a><a href="#"><img class="img_pv" src="http://i39.servimg.com/u/f39/17/14/00/25/pv11.png"></a><a href="#"><img class="img_pv" src="http://i39.servimg.com/u/f39/17/14/00/25/pv11.png"></a><a href="#"><img class="img_pv" src="http://i39.servimg.com/u/f39/17/14/00/25/pv11.png"></a><a href="#"><img class="img_pv" src="http://i39.servimg.com/u/f39/17/14/00/25/pv11.png"></a><a href="#"><img class="img_pv" src="http://i39.servimg.com/u/f39/17/14/00/25/pv11.png"></a></div></div><div id="partenaires_PA"><span class="titre_cadre titre_partenaires">TOP PARTENAIRES</span><div class="img_partenaires"> <a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a><a href="#"><img src="http://i39.servimg.com/u/f39/17/14/00/25/parten12.png"></a></div><span id="nous_lier"> <a href="#">NOUS LIER</a> // <a href="#">PLUS </a>//<a href="#">VOUS</a> </span> <a href="#"><img src="http://img2.wikia.nocookie.net/__cb20120221101557/eden-eternal/fr/images/2/23/Logo_facebook_mini.gif" width="25px" height="25px"></a></div><div class="cadre_PA navigation_PA"> <span class="titre_cadre titre_navig">NAVIGATION</span><div class="bouton_croix_navig"> <img class="image_navig un" src="http://img1.wikia.nocookie.net/__cb20120225115529/walkingdead/images/0/0a/Daryl-dixon-picture.jpg"><a href="#"><img class="img_croix" src="http://img4.hostingpics.net/pics/793740Sanstitre8.jpg"></a></div><div class="bouton_croix_navig"> <img class="image_navig deux" src="http://img1.wikia.nocookie.net/__cb20120225115529/walkingdead/images/0/0a/Daryl-dixon-picture.jpg"><a href="#"><img class="img_croix" src="http://img4.hostingpics.net/pics/793740Sanstitre8.jpg"></a></div><div class="bouton_croix_navig"> <img class="image_navig trois" src="http://img1.wikia.nocookie.net/__cb20120225115529/walkingdead/images/0/0a/Daryl-dixon-picture.jpg"><a href="#"><img class="img_croix" src="http://img4.hostingpics.net/pics/793740Sanstitre8.jpg"></a></div><div class="bouton_croix_navig"> <img class="image_navig quatre" src="http://img1.wikia.nocookie.net/__cb20120225115529/walkingdead/images/0/0a/Daryl-dixon-picture.jpg"><a href="#"><img class="img_croix" src="http://img4.hostingpics.net/pics/793740Sanstitre8.jpg"></a></div><div class="bouton_croix_navig"> <img class="image_navig cinq" src="http://img1.wikia.nocookie.net/__cb20120225115529/walkingdead/images/0/0a/Daryl-dixon-picture.jpg"><a href="#"><img class="img_croix" src="http://img4.hostingpics.net/pics/793740Sanstitre8.jpg"></a></div><div class="bouton_croix_navig"> <img class="image_navig six" src="http://img1.wikia.nocookie.net/__cb20120225115529/walkingdead/images/0/0a/Daryl-dixon-picture.jpg"><a href="#"><img class="img_croix" src="http://img4.hostingpics.net/pics/793740Sanstitre8.jpg"></a></div></div><span style="color: #434142; display:block; text-align: center; margin-top: 15px;">(c) Lihuén sur <a href="http://www.never-utopia.com/">Never-Utopia</a></span> </div>
Ensuite, à la même place que le CSS du Qeel, on va aller mettre ce CSS :
- Code:
/* ------------ MISE EN FORME PA ------------ */
#fond_PA {
height: 515px;
width: 900px;
background-color: #100e0f;
margin: auto;
}
#titre_PA {
color: #5a0e0f;
font-family: Cinzel;
font-size: 48px;
text-shadow: 0px 0px 15px #4c3436;
margin-bottom: -5px;
text-align: center;
}
#soustitre_PA {
color: #434142;
font-family: Cinzel;
opacity: 0.5;
text-align: center;
}
.cadre_PA {
background: rgba(35, 30, 33, 0.5);
box-shadow: 2px 2px 2px black;
font-family: Arial;
font-size: 11px;
position: relative;
display: inline-block;
z-index: 0;
text-align: center;
}
.titre_cadre {
color: #5a0e0f;
font-family: Cinzel;
font-weight: bold;
font-size: 30px;
z-index: 2;
text-align: left;
display: inline-block;
position: absolute;
}
/* MISE EN FORME DU CADRE STAFF */
.staff {
width: 268px;
height: 143px;
float: left;
margin-left: 10px;
}
.titre_staff {
width: 15px;
word-wrap: break-word;
top: -10px;
left: -5px;
line-height: 32px;
}
.bouton_croix {
display: inline-block;
margin: auto;
margin: 150px auto 20px auto;
overflow: visible;
width: 31px;
height: 28px;
}
.bouton_croix .image_staff {
position: absolute;
width: 200px;
height: 120px;
z-index: 1;
visibility: hidden;
}
.bouton_croix .un {
margin: -140px 0px 0px -12px;
}
.bouton_croix .deux {
margin: -140px 0px 0px -43px;
}
.bouton_croix .trois {
margin: -140px 0px 0px -74px;
}
.bouton_croix .quatre {
margin: -140px 0px 0px -105px;
}
.bouton_croix .cinq {
margin: -140px 0px 0px -136px;
}
.bouton_croix:hover .image_staff {
visibility: visible;
}
/* MISE EN FORME DU CONTEXTE */
.contexte {
width: 416px;
height: 160px;
padding: 5px;
text-align: justify;
overflow: auto;
margin-top: 17px;
margin-left: 30px;
font-family: Cinzel;
color: #b6b4b4;
}
.contexte p {
font-family: Cinzel;
color: #b6b4b4;
}
.titre_contexte {
width: 416px;
margin-left: 15px;
}
/* MISE EN FORME POSTES VACANTS */
.postes_vacants {
width: 92px;
height: 381px;
float: right;
margin-right: 30px;
}
.titre_pv {
width: 15px;
word-wrap: break-word;
top: -20px;
right: -5px;
line-height: 32px;
}
#pv {
margin-top: 30px;
}
.img_pv {
margin: 2px 0px 2px 0px;
}
/*MISE EN FORME PARTENAIRES */
#partenaires_PA {
position: relative;
display: inline-block;
margin: 80px 0px 0px 20px;
width: 300px;
height: 150px;
float: left;
text-align: center;
}
.titre_partenaires {
width: 320px;
left: 5px;
top: -30px;
}
.img_partenaires {
margin-top: 10px;
}
.img_partenaires img {
margin: 1px 1px 0px 0px;
}
#nous_lier {
color: #5a0e0f;
text-align: center;
font-size: 13px;
display: block;
padding: 10px;
}
#nous_lier a {
text-decoration: none;
color: #5a0e0f;
font-family: Cinzel;
font-weight: bold;
}
/* MISE EN FORME NAVIGATION */
.navigation_PA {
width: 326px;
height: 191px;
margin-top: 22px;
margin-left: 60px;
}
.titre_navig {
right: -20px;
top: -15px;
}
.bouton_croix_navig {
margin: 3px 0px 3px -38px;
display: block;
width: 31px;
height: 28px;
}
.image_navig {
width: 326px;
height: 191px;
display: inline-block;
position: absolute;
visibility: hidden;
}
.bouton_croix_navig .un {
margin: -2px 0px 0px 38px;
}
.bouton_croix_navig .deux {
margin: -33px 0px 0px 38px;
}
.bouton_croix_navig .trois {
margin: -64px 0px 0px 38px;
}
.bouton_croix_navig .quatre {
margin: -95px 0px 0px 38px;
}
.bouton_croix_navig .cinq {
margin: -126px 0px 0px 38px;
}
.bouton_croix_navig .six {
margin: -157px 0px 0px 38px;
}
.bouton_croix_navig:hover .image_navig {
visibility: visible;
}
Note : Les retours à la lignes sont pris en comptes sur Xooit, donc il faut faire attention à ne pas cliquer sur "enter" entre des balises pour ne pas briser le code.