epsilon
forum de libre service de codage,
aucune inscription
Une refonte complète d'Epsilon est prévue pour bientôt. Dans les mois qui suivent, le forum va totalement changer d'apparence et toutes les catégories vont être réorganisées. Pas de panique, aucun LS ne va disparaître !
Vous souhaitez réagir à ce message ? Créez un compte en quelques clics ou connectez-vous pour continuer.

Alexis Graves
Anonymous
Invité
Coucou, j'ai tenté de poser plusieurs codes différents de profils + messages sur mon forum test et ils me font tous le même truc : https://codagedetld.forumactif.com/t3-dooooooooooooooooo#17

J'ai essayé celui là : https://epsilon-ls.forumactif.com/t200-profilmessages-rouge et celui ci https://epsilon-ls.forumactif.com/t188-viewtopic-01-back-to-the-eighties

Voici le CSS, j'imagine qu'un truc interagit avec, mais quoi ? ...

Code:
/*EDITEUR REPONSE*/
div.sceditor-toolbar {
background:#0C90AD!important;
  background-color:#0C90AD!important;
  border-color:#0C90AD;
  border-bottom:0px;
}
#cp-main .panel.sig {
background-color:#0C90AD;
}
 
.sceditor-button div {
background-image:none
}
 
.sceditor-button {
text-indent:0;
position:relative
}
 
.sceditor-container iframe,.sceditor-container textarea {
color:#0C90AD!important
}
 
.sceditor-button.sceditor-button-bold div,.sceditor-button.sceditor-button-italic div,.sceditor-button.sceditor-button-underline div,.sceditor-button.sceditor-button-strike div,.sceditor-button.sceditor-button-left div,.sceditor-button.sceditor-button-right div,.sceditor-button.sceditor-button-center div,.sceditor-button.sceditor-button-justify div {
background-image:none
}
 
.sceditor-button.sceditor-button-bold div::before {
content:"B";
font-size:18px;
position:absolute;
text-indent:0;
left:6px;
width:16px;
height:16px;
z-index:5;
line-height:16px;
font-weight:900;
font-family:'Arial', sans-serif;
color:transparent;
background:linear-gradient(180deg, rgba(12,144,173) 0%, rgba(176,174,204) 100%);
background-clip:text;
-webkit-background-clip:text
}
 
.sceditor-button.sceditor-button-italic div::before {
content:"I";
font-size:18px;
position:absolute;
text-indent:0;
left:6px;
width:16px;
height:16px;
z-index:5;
line-height:16px;
font-weight:600;
font-family:'Arial', sans-serif;
font-style:italic;
color:transparent;
background:linear-gradient(180deg, rgba(12,144,173) 0%, rgba(176,174,204) 100%);
background-clip:text;
-webkit-background-clip:text
}
 
.sceditor-button.sceditor-button-underline div::before {
content:"U";
font-size:18px;
position:absolute;
text-indent:0;
left:6px;
width:16px;
height:16px;
z-index:5;
line-height:16px;
font-weight:600;
font-family:'Arial', sans-serif;
text-decoration:underline;
text-decoration-color:rgba(12,144,173);
color:transparent;
background:linear-gradient(180deg, rgba(12,144,173) 0%, rgba(176,174,204) 100%);
background-clip:text;
-webkit-background-clip:text
}
 
.sceditor-button.sceditor-button-strike div::before {
content:"S";
font-size:18px;
position:absolute;
text-indent:0;
left:6px;
width:16px;
height:16px;
z-index:5;
line-height:16px;
font-weight:600;
font-family:'Arial', sans-serif;
text-decoration:line-through;
text-decoration-color:rgba(12,144,173);
color:transparent;
background:linear-gradient(180deg, rgba(12,144,173) 0%, rgba(176,174,204) 100%);
background-clip:text;
-webkit-background-clip:text
}
 
.sceditor-button.sceditor-button-left div::before {
font-family:'Font Awesome 5 Free';
content:"\f036";
font-size:18px;
position:absolute;
text-indent:0;
left:6px;
width:16px;
height:16px;
z-index:5;
line-height:16px;
font-weight:900;
text-decoration-color:rgba(12,144,173);
color:transparent;
background:linear-gradient(180deg, rgba(12,144,173) 0%, rgba(176,174,204) 100%);
background-clip:text;
-webkit-background-clip:text
}
 
.sceditor-button.sceditor-button-center div::before {
font-family:'Font Awesome 5 Free';
content:"\f037";
font-size:18px;
position:absolute;
text-indent:0;
left:6px;
width:16px;
height:16px;
z-index:5;
line-height:16px;
font-weight:900;
text-decoration-color:rgba(12,144,173);
color:transparent;
background:linear-gradient(180deg, rgba(12,144,173) 0%, rgba(176,174,204) 100%);
background-clip:text;
-webkit-background-clip:text
}
 
.sceditor-button.sceditor-button-right div::before {
font-family:'Font Awesome 5 Free';
content:"\f038";
font-size:18px;
position:absolute;
text-indent:0;
left:6px;
width:16px;
height:16px;
z-index:5;
line-height:16px;
font-weight:900;
text-decoration-color:rgba(12,144,173);
color:transparent;
background:linear-gradient(180deg, rgba(12,144,173) 0%, rgba(176,174,204) 100%);
background-clip:text;
-webkit-background-clip:text
}
 
.sceditor-button.sceditor-button-justify div::before {
font-family:'Font Awesome 5 Free';
content:"\f039";
font-size:18px;
position:absolute;
text-indent:0;
left:6px;
width:16px;
height:16px;
z-index:5;
line-height:16px;
font-weight:900;
text-decoration-color:rgba(12,144,173);
color:transparent;
background:linear-gradient(180deg, rgba(12,144,173) 0%, rgba(176,174,204) 100%);
background-clip:text;
-webkit-background-clip:text
}
 
.sceditor-button.sceditor-button-headers div::before {
font-family:'Font Awesome 5 Free';
content:"\f1dc";
font-size:17px;
position:absolute;
text-indent:0;
left:6px;
width:16px;
height:16px;
z-index:5;
line-height:16px;
font-weight:900;
text-decoration-color:rgba(12,144,173);
color:transparent;
background:linear-gradient(180deg, rgba(12,144,173) 0%, rgba(176,174,204) 100%);
background-clip:text;
-webkit-background-clip:text
}
/********************************************************* PAGE D'ACCUEIL *********************************************************/
       
    /********************* PA PAR MAGMA. ***************************/

    .pa_lastday {width: 850px; height: 600px; position : relative;
      background-image: url('https://zupimages.net/up/21/16/k35k.png');
      border-radius: 10px 10px 0 0;
      -webkit-border-radius: 10px 10px 0 0;
      -moz-border-radius: 10px 10px 0 0;}
    .titre_pa{ color: #B0AECC; font-size: 14px; font-family: Oswald; padding-bottom: 3px; text-transform: uppercase;}
    .titre2_pa{ position: absolute; bottom: 130px; left: 350px; text-align: center; color: #B0AECC; font-size: 14px; font-family: Oswald;
      padding-bottom: 3px; text-transform: uppercase;}

    .contexte_last { background-color: #; position: absolute; top: 60px; left: 40px; width: 255px; height: 175px;
    line-height: 11px; overflow:auto; color:#09687d; text-align: justify; padding: 7px;}
    .news_last {background:#; position: absolute; top: 250px; width: 240px; height: 140px; left: 345px; text-align: justify; font-size: 11px;
      line-height: 10px; font-family: Helvetica; color:#09687d; padding: 8px;}

    .partenaire_pa {position : absolute; top: 280px; left: 45px;}
    .partenaire_ligne {font-size:10px; background:#0C90AD; color:#f2efe4; border:1px solid #0C90AD; font-weight:300;
    font-family:Oswald; margin-bottom:5px; letter-spacing:1px; text-align:center; width:230px; }
    .partenaire_bouton {font-size:10px; background:#0C90AD; color:#f2efe4; border:1px solid #0C90AD; font-weight:300; font-family:Oswald; }

    .navigation_pa {  background-color: #; position : absolute; top: 60px; left: 345px; width: 235px; height: 155px; padding: 5px;}
    #navigation a:link, #navigation a:visited, #navigation a:active {
      -webkit-transition-property:color letter-spacing; -webkit-transition-duration:0.5s;
      -webkit-transition-timing-function:ease-in; height: 17px; font-family: Helvetica;  letter-spacing: 1px;
    font-size: 8px; width: 225px!important; text-align: center; padding: 2px; color: #f2efe4; background-color: #0C90AD;
    line-height: 13px; display:block; margin: 3px; text-transform: uppercase; -webkit-border-radius: 1px; border-radius: 1px;
    -moz-border-radius: 1px;}
    #navigation a:hover{
    color: #f2efe4; background-color: #B1AFCD; -moz-transition-property:color letter-spacing; -moz-transition-duration:0.5s;
      -moz-transition-timing-function:ease-in;
    /* … et lorsque ce sera standardisé */
      transition-property:color letter-spacing; transition-duration:0.5s; transition-timing-function:ease-in;
    font-size: 8px; text-shadow: 0px 0px 2px #f2efe4;}

    .scenarios_last {background-color: #; position: absolute; bottom: 30px; left: 50px; padding: 5px; width: 710px; height: 90px;
    padding-top: 6px;}
    .staff_last{background-color: #; position: absolute; top: 30px; right: 100px; padding-top: 7px; width: 100px; height: 420px; }

    #slidez {
        background: #f2efe4;
        color: #0C90AD;
        height: 128px; overflow: auto;
        margin-top: 0px;
        overflow: hidden;
        position: relative;
        width: 80px; font-size: 9px; font-family: Oswald; }
    #slidez img {
    transition: transform 0.9s ease-in-out;
      -moz-transition: -moz-transform 0.9s ease-in-out;
      -o-transition: -o-transform 0.9s ease-in-out;
      -webkit-transition: -webkit-transform 0.9s ease-in-out;
        left: 0;
        position: absolute;
        top: 0;
    }
    #slidez:hover img {
    transform: translateY(205px); /* Valeur négative égale à la hauteur de l'image */
      -moz-transform: translateY(205px);
      -o-transform: translateY(205px);
      -webkit-transform: translateY(205px);}
    .copyrightt {position : absolute; bottom: -20px; left: 70px; width: 650px; height: 40px; padding: 5px; text-transform :uppercase;
    color: grey; font-size: 8px;}

/**************END PA***************/

/* ----- PROFIL + MESSAGE POUR TWISTY RAIN ----- */

.titlepage {
    text-align: center;
    background: #080808;
    padding: 5px 0px;
}
.titlepage a {
    color: #c9c9c9;
    font: 18px pirata one;
    text-transform: lowercase;
}
.titlepage div a {
    font: 11px calibri;
}
.tdw_interne {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    margin: 0 auto 30px auto;
    width: 100%;
}
.tdw_first {
    width: 290px;
    background-image: url(https://imgur.com/qJFVdDE.png);
    background-position: 50% 50%;
    padding: 10px 20px;
}
.tdw_interne_name {
    text-align: center;
    background: #080808;
    padding: 10px 20px;
}
.tdw_interne_name a {
    font: 14px pirata one;
    letter-spacing: 1px;
    text-transform: lowercase;
}
.tdw_interne_avatar img {
    width: 250px;
    height: 450px;
}
.tdw_interne_imgrang {
}
.tdw_interne_imgrang img {
}
.tdw_interne_pro {
    font: 11px calibri;
    text-align: justify;
    color: #c9c9c9;
}
.tdw_champ {
    margin: 5px 0px;
    background: rgba(0, 0, 0, 0.5);
    padding: 4px 8px;
}
.tdw_champ span {
    color: #9f2b2c !important;
    font: 15px pirata one;
    text-transform: lowercase;
}
.tdw_champ img {
    width: 235px;
}
.tdw_interne_cont {
    text-align: center;
}
.tdw_second {
    width: 638px;
    padding: 5px 15px;
    background: #d0d0d0;
}
.hautposttdw {
    border-bottom: 1px solid #992929;
    margin-bottom: 5px;
    padding-bottom: 5px;
}
.tdw_post_info {
    background: #080808;
    padding: 5px;
    font: 9px Calibri;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.tdw_post_info a {
    font: 15px pirata one;
    text-transform: lowercase;
    padding-right: 10px;
    letter-spacing: 0px;
}
.tdw_interne_btns {
    text-align: right;
    padding-top: 5px;
}
.tdw_interne_btns a {
    color: #992929;
    margin: 0px 5px;
    font: 9px calibri;
    text-transform: uppercase;
    letter-spacing: 2px;
}
.postbody {
    width: 100%;
}
.postbody .content {
    font: 13px calibri !important;
    color: #cfcfcf !important;
}
.content img {
    max-width: 100%;
}
/*********************END PROFIL/MESSAGES****************/
/**************************DEBUT CATEGORIES**************************/
.titre_categories {
  width: 850px;
  height: 70px;
  margin: auto;
}

.titre_categories h2 {
  width: 100%;
  text-align: center;
  color: #0C90AD;
  text-transform: uppercase;
  font: 55px 'fjalla one', sans-serif;
  margin: 0;
}

.categories_content {
  width: 850px;
  height: 188px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background: #F8F1E9;
  margin: auto;
  position: relative;
  -webkit-box-shadow: 0px 0px 5px #d5d5d5;
  box-shadow: 0px 0px 5px #d5d5d5;
  margin-bottom: 20px;
}

.image_description_et_stats {
  width: 360px;
  height: 190px;
  position: relative;
  text-align: center;
}

.image_description_et_stats .image_description {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.image_description_et_stats div:nth-child(1) {
  position: relative;
  z-index: 2;
  display: inline-block;
  width: 100px;
  margin-left: -320px;
  margin-top: 5px;
  height: auto;
}

.stats_categories {
  width: 250px;
  height: 31px;
  display: inline-block;
  position: absolute;
  background: rgba(251, 251, 251, 0.7);
  z-index: 3;
  bottom: 15px;
  left: 15px;
  font: 17px 'fjalla one', sans-serif;
  text-transform: uppercase;
  color: #B0AECC;
  line-height: 32px;
}

.avatar_membre {
  width: 100px;
  height: 100px;
  overflow: hidden;
  border-radius: 50%;
  position: absolute;
  z-index: 4;
  right: 5px;
  top: 45px;
  border: 5px solid #09687d;
  -webkit-box-shadow: 0px 0px 9px #aaa9a9;
  box-shadow: 0px 0px 9px #aaa9a9;
}

.avatar_membre img {
  width: 100px;
  height: 100px;
  -o-object-fit: cover;
  object-fit: cover;
}

.description_et_dernier_message {
  width: 680px;
  height: 188px;
  background: #F8F1E9;
  position: absolute;
  right: 0;
}

.description_et_dernier_message > a {
  width: 460px;
  height: 40px;
  font: 30px 'fjalla one', sans-serif;
  text-transform: uppercase;
  color: #B0AECC  !important;
  display: block;
  position: absolute;
  right: 0;
  text-align: center;
  text-decoration: none;
  line-height: 70px;
}

.description_et_dernier_message p {
  width: 435px;
  height: 95px;
  margin: 60px 0px 0px 210px;
  text-align: justify;
  overflow: auto;
  font: 12px 'Cambria', sans-serif;
  color: #09687d;
  line-height: 11px;
}

.dernier_message {
  width: 545px;
  height: 23px;
  position: absolute;
  bottom: 0;
  right: 0;
  font: 12px 'cambria', sans-serif;
  color: #B0AECC;
  z-index: 99;
  text-align: center;
}

.dernier_message a {
  font: 12px 'cambria', sans-serif;
  text-decoration: none;
  color: #0C90AD;
  display: inline-block !important;
  margin-right: 2px;
}

.dernier_message strong {
  font: 12px 'cambria', sans-serif;
  font-weight: normal;
}

.dernier_message br {
  display: none;
}

.dernier_message link {
  display: inline-block;
}

.sous_forum_liens {
  width: 710px;
  min-height: 40px;
  margin: auto;
  margin-left: 160px;
  margin-top: -20px;
  text-align: center;
  font-size: 0;
  padding-top: 10px;
  padding-bottom: 10px;
}

.sous_forum_liens a {
  font: 16px 'fjalla one', sans-serif;
  text-transform: uppercase;
  text-decoration: none;
  color: #B0AECC;
}

.sous_forum_liens a:nth-of-type(2n+1) {
  color: #91af99;
}

.sous_forum_liens a::after {
  content: "  ";
}

.categories_content p img {
  position: absolute !important;
  top: 0 !important;
  left: -180px !important;
  z-index: 1;
  width: 380px;
  height: 188px;
  -o-object-fit: cover;
  object-fit: cover;
  -webkit-clip-path: polygon(0 0, 100% 0%, 69% 100%, 0% 100%);
  clip-path: polygon(0 0, 100% 0%, 69% 100%, 0% 100%);
  border: 4px solid #F8F1E9;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
}
/***************END CATEGORIES*************/

/* -------------------------------- QEEL -------------------------------- */

        /*** MISE EN FORME LIENS AU SURVOL ***/
        a:hover {
          text-decoration: none !important;
        }

        /*** MISE EN FORME FONT DU QEEL ***/
        .fond_qeel {
          width: 850px;
          border-radius: 0px 0px 25px 25px;
          background-color: #f2efe4;
          margin: auto;
          height: 620px;
          position: relative;
        }

        /*** MISE EN FORME TITRE PRINCIPAL ***/
        .titre_principal {
          color: #0C90AD;
          font-family: 'fjalla one',sans-serif;
          font-size: 28;
          letter-spacing: 5px;
          text-align: center;
        }

        /*** MISE EN FORME SOUS-TITRE "Et à qui se fier ?" ***/
        .titre_secondaire {
          color: #C7BBC1;
          font-family: 'fjalla one',sans-serif;
          font-size: 14px;
          text-align: center;
        }

        /*** MISE EN FORME BLOC STATISTIQUES ***/
        .bloc_stat {
          background-color: #F8F1E9;
          padding: 15px;
          width: 200px;
          height: 150px;
          overflow: auto;
          font-size: 11px;
          border: 2px solid #0C90AD;
          text-align: justify;
          color: #515151;
          position: absolute;
          left: 3em;
          z-index: 1;
        }

        /*** MISE EN FORME BLOC DES GROUPES ***/
        .bloc_groupes {
          background-color: #F8F1E9;
          padding: 15px;
          width: 480px;
          height: 50px;
          overflow: auto;
          font-size: 13px;
          border: 2px solid #0C90AD;
          text-align: center;
          font-family: 'fjalla one',sans-serif;
          position: absolute;
          left: 22.2em;
          z-index: 1;
        }

        /*** MISE EN FORME BLOC DES CONNECTES LES 24H ***/
        .bloc_connectes {
          background-color: #F8F1E9;
          padding: 15px;
          width: 480px;
          height: 50px;
          overflow: auto;
          font-size: 20px;
          border: 2px solid #0C90AD;
          text-align: center;
          font-family: 'fjalla one',sans-serif;
          position: absolute;
          left: 14.5em;
          z-index: 1;
        }

        /*** COULEUR ET TRANSPARENCE DU FOND DES 24H ***/
        #kaboum .row1 {
          background-color : transparent;
        }

        #kaboum span.gensmall {
          color: #515151;
        }

        /*** MISE EN FORME DES TITRES (simple + survol) ***/
        .titre_bloc {
          font-family: 'Dancing Script', cursive;
          font-size: 24px;
          font-weight: bold;
          color: #0C90AD;
          position: absolute;
          z-index: 2;
          margin-top: -18px;
        }

        .titre_bloc:hover {
          color: #B0AECC;
        }

        /*** GROUPES A ONGLETS ***/
        /* Mise en forme des noms de groupe */
        .groupe_onglet {
          display: inline-block;
          padding: 10px;
        }

        /* Mise en forme du bloc en transparence de description */
        .contenu_groupe_onglet {
          padding: 15px;
          display: none;
          width: 375px;
          height: 115px;
          overflow: auto;
          font-size: 11px;
          color: #414141;
          text-align: justify;
          background-color: #F8F1E9;
          position: absolute;
          top: 14em;
          left: 21em;
          filter: alpha(opacity = 50);
          opacity: 0.5;
        }

        /* Mise en forme des liens */
        .contenu_groupe_onglet a{
          text-decoration: none !important;
        }

        /*** MISE EN FORME DES CREDITS ***/
        .credits {
          text-align: right;
          margin-right: 10px;
          font-size: 9px;
          margin-top: 10px;
        }

        .credits a{
          color: #000;
        }

        /* -------------------------------- FIN QEEL -------------------------------- */
/*************************DEBUT MEMBERLIST*****************/
       
    /*LISTE DES MEMBRES*/
    :root {
            --bkg1: #EDF4F6; /*blanc*/ /*peut être modifié*/
            --bkg2: #1E1E1E; /*noir*/  /*peut être modifié*/
         
            --txt: 'Dosis', sans-serif; /*peut être modifié*/
            --ttr: 'Just Me Again Down Here', cursive; /*peut être modifié*/
            --clrtxt: #424347; /*gris foncé*/  /*peut être modifié*/
            --clrtxt2: #DEDEDE; /*gris clair*/  /*peut être modifié*/
        }
     
        /*CSS FACE*/
    .membre {display: inline-block;
    max-width: 150px;
    max-height: 183px;
    margin: 7px;}

    .face img {width: 135px;
    height: 135px;
    object-fit: cover;}

    .nom {font-family: var(--ttr);
    color: var(--clrtxt);
    text-align: center;
    text-transform: capitalize;
    font-size: 20px;}
    .nom strong {font-weight: 300;}
     
        /*CSS PILE*/
    .infos_content {background: var(--bkg2);
    height: 117px;
    padding-top: 18px;
    text-align: center;
    width: 135px;}

    .infos {color: var(--clrtxt2);
    font-family: var(--txt);
    font-size: 12px;
    line-height: 20px;}
    .infos div {border-bottom: 1px solid;
    width: 92px;
    margin-left: 22px;
    line-height: 15px;
    font-weight: bold;}

    .contact img {width: 20px;
    height: 20px;
    border-radius: 100%;
    margin-top: 7px;
    float: right;}
    .contact a {font-family: var(--txt);
    margin-top: 3px;}
    .contact a:hover {text-decoration: none;}
     
        /*ANIMATION (/!\ risque de casser le css si édition, ne pas toucher)*/
    .membre-flip {perspective: 1000px;}
    .membre-flip:hover .flip {transform: rotateY(180deg);}
    .flip {transition: 0.6s;
    transform-style: preserve-3d;
    position: relative;
    height: 183px;}
    .face, .pile {padding: 7px;
    width: calc(150px - 14px);
    background: var(--bkg1);
    color: var(--clrtxt);
    backface-visibility: hidden;
    position: relative;
    top: 0;
    left: 0;}
    .face {z-index: 2;
    transform: rotateY(0deg);}
    .pile {transform: rotateY(180deg);
    position: relative;
    top: -179px;
    height: 165px;}

/**************END MEMBERLIST*********************/

/**************** NOTIF TOOLBAR********************/

/* Cacher les bout de la toolbar que je ne veux pas */
.fa_tbMainElement#fa_left,
.fa_tbMainElement#fa_search,
.fa_tbMainElement#fa_share,
#fa_menu,
.rightHeaderLink#fa_hide,
.fa_tbMainElement#fa_right a.rightHeaderLink {
  display:none!important;
}
 
/* Supprimer la couleur de fond et positionnement du bloc */
#fa_toolbar {
  background-color:transparent!important;
  position:fixed;
  top:40px;
  padding:5px;
  width:100%;
  z-index:999;
  box-sizing:border-box;
}

/* Mise en page du bouton Notification */
.fa_tbMainElement#fa_right a.rightHeaderLink#fa_notifications {
  display:block!important;
  position:absolute;
  top:10px;
  right:10px;
  width:160px;
  padding:3px;
  background:#0C90AD;
  box-shadow:0 0 5px #0C90AD;
  color:#F8F1E9;
  font-family:Cambria;
  font-size:16px;
  letter-spacing:2px;
  text-align:center;
  text-decoration:none!important;
}
#fa_toolbar #fa_right #notif_list li:first-child{
  padding-top:10px;
}

/* Mise en page bouton "notification" - Au clic */
#fa_menu:hover:visited,
#fa_toolbar > #fa_right.notification > #fa_notifications {
  background:#B0AECC!important;
  color:#F8F1E9!important;
  text-shadow:none;
}

/* Référence pour la liste des notifications */
#fa_toolbar #fa_right.fa_tbMainElement {
  position:relative;
}

/* Mise en page de la liste des notifications */
#fa_toolbar #fa_right.notification #notif_list {
  top:50px!important;
  right:10px;
  left:auto!important;
  max-width:340px;
  min-width:167px;
  box-shadow:0 0 5px #474747;
  border:none!important;
}

/* Mise en page des notifications */
#fa_toolbar #fa_right #notif_list li .content,
#fa_toolbar #fa_right #notif_list li {
  width:auto!important;
  font-size:12px;
  background-color:#efd3a1;
}

/* Taille des blocs textes des points de la liste de notif' */
#fa_toolbar #fa_right #notif_list li .contentText {
  overflow:visible!important;
  width:300px !important;
  height:auto!important;
}

/* Bloc "notifs non lues" */
.fa_tbMainElement#fa_right a.rightHeaderLink.unread#fa_notifications {
  width:180px;
  /* On supprime 1px à la largeur car la bordure fera 1px d'épaisseur */
  border-left:1px solid black;
}

#fa_toolbar #fa_right #notif_list li.unread {
  background:#f1d9ae!important;
}

/* Mise en page du bloc "voir toutes les notifications" */
#fa_toolbar #fa_right #notif_list li.see_all {
  text-align:center!important;
  background:#F8F1E9!important;
  padding:5px!important;
  font-size:12px!important;
}
#fa_toolbar #fa_right #notif_list li.see_all a{
  color:#B0AECC;
}
/****************END NOTIF TOOLBAR********************/
/* PRESENTATION LISTE SUJETS */
/* PRESENTATION LISTE SUJETS */
/* BLOC SUJET */
.LSBJ {
margin:10px auto 0; width:800px; text-align:center; font-family:Cambria;
}
/* OUTIL MODERATION SUJET */
.modSBJ {
position:absolute; z-index:3; margin-left:-10px; margin-top:30px;
}
/* AVATAR DERNIER POSTEUR */
.avSBJ {
display:inline-block; vertical-align:top; margin-right:5px;
width:75px; height:75px; overflow:hidden;
}
.avSBJ img{
width:85px;
}
/* BLOC TITRE & DESCRIPTION / ICÔNES / DERNIER MESSAGE SUJET */
.boxSBJ {
display:inline-block; vertical-align:top;
width:465px;
}
/* BLOC TITRE & DESCRIPTION SUJET */
.tleSBJ {
display:inline-block; vertical-align:top;
width:455px; height:55px; padding:0 5px; overflow:hidden;
background:#0C90AD; color:white; /* MODIFIABLE */
text-align:left; text-transform:uppercase;
}
/* TITRE SUJET */
.tleSBJ a {
color:white !important; /* MODIFIABLE */
}
/* DESCRIPTION SUJET */
.descSBJ {
display:inline-block; vertical-align:middle; margin-right:5px;
color:#CCC; /* MODIFIABLE */
font-size:10px; text-align:justify;
}
/* LISTE DES PAGES SUJET */
.gotoSBJ {
display:inline-block; vertical-align:middle; font-size:9px;
color:#CCC; /* MODIFIABLE */
}
.gotoSBJ a{
color:#CCC !important; /* MODIFIABLE */
}
.gotoSBJ br:nth-of-type(1) {
display:none;
}
.gotoSBJ img {
display:none;
}
/* ICÔNES SUJET */
.imgSBJ {
display:inline-block; vertical-align:top; margin-top:5px; margin-right:5px;
width:150px; height:15px;
}
/* DERNIER MESSAGE */
.lmsgSBJ {
display:inline-block; vertical-align:top; margin-top:5px;
width:310px; height:15px; overflow:hidden;
background:rgba(255,255,255,0.5); color:black; /* MODIFIABLE */
font-size:9px; text-align:center; line-height:15px;
}
/* AUTEUR SUJET */
.nameSBJ {
display:inline-block; vertical-align:top; margin:0 5px;
width:135px; height:75px; overflow:hidden;
background:rgba(250,250,250,0.8); /* MODIFIABLE */
font-size:11px; text-align:center; line-height:11px;
}
/* BLOC VUES & REPONSES SUJET */
.stsSBJ {
display:inline-block; vertical-align:top;
width:100px; padding:5px; line-height:15px;
background:#3e464c; /* MODIFIABLE */
}
/* VUES SUJET */
.vuesSBJ {
margin:5px auto;
width:85px; height:20px; padding-top:5px;
background:rgba(250,250,250,0.8); color:black; /* MODIFIABLE */
font-size:11px; text-align:center;
}
/* REPONSES SUJET */
.repSBJ {
margin:5px auto;
width:85px; height:20px; padding-top:5px;
background:rgba(250,250,250,0.8); color:black; /* MODIFIABLE */
font-size:11px; text-align:center;
}

/*********************END SUJET LISTE**************************/
/* NAVIGATION */
#navSIT {
position:fixed; z-index:5; left:0; top:0;
width:100%; height:50px;
background:#0C90AD; /* MODIFIABLE */
}
.navSIT {
position:absolute; top:15px; right:15px;
}
.mainmenu img {
display:none;
}
/* BORDURE AVATAR */
.avaSIT {
position:absolute; z-index:5; left:85px;
width:75px; height:75px; border-radius:75px; overflow:hidden; border:10px solid;
border-color:#0C90AD; /* MODIFIABLE */
}
/* IMAGE AVATAR */
.avaSIT img{
width:75px;
}
/* MESSAGE DE BIENVENUE */
.welcSIT {
position:absolute; left:200px; top:20px;
font-size:12px; font-family:cambria; /* MODIFIABLE */
color:white; /* MODIFIABLE */
}
/* BIENVENUE */
.welcSIT::before {
float:left; margin-right:5px;
content:'Bienvenue'; /* MODIFIABLE */
}
/* LIENS NAVIGATION */
#navSIT a{
display:inline-block; vertical-align:middle;
text-align:center;
text-transform:uppercase; font-size:12px; font-family:cambria; /* MODIFIABLE */
color:#F8F1E9; /* MODIFIABLE */
transition:all .65s linear; -webkit-transition:all .65s linear;
}
/* SURVOL LIEN NAVIGATION */
#navSIT a:hover {
color:#F8F1E9; /* MODIFIABLE */
}
/* DECONNEXION */
a#logout.mainmenu {
font-size:0px;
}
a#logout.mainmenu::after {
display:inline-block; vertical-align:middle;
font-size:12px !important; content:'Déconnexion'; /* MODIFIABLE */
}
/* MENU RECHERCHE */
#search_menu {
top:45px !important; left:5% !important;
}
/* COULEUR FOND MENU RECHERCHE */
#search_menu td.row2 {
background:lightgrey !important; font-family:cambria; /* MODIFIABLE */
}
/* COULEUR TEXTE MENU RECHERCHE */
#search_menu td.row2 span.genmed {
color:black !important; /* MODIFIABLE */
}
/* TITRE MENU RECHERCHE */
#search_menu th.thHead {
text-transform:uppercase; font-family:cambria; /* MODIFIABLE */
background:black; color:white; /* MODIFIABLE */
}
/* BARRE MENU RECHERCHE */
#search_menu input.post {
height:23px !important; border:none !important;
background:white; color:black; /* MODIFIABLE */
}
/* BOUTON MENU RECHERCHE */
#search_menu input.button {
height:25px; border:none !important; text-transform:uppercase;
background:black; color:white !important; /* MODIFIABLE */
}
/* RECHERCHE AVANCEE */
#search_menu a{
display:block; margin-bottom:5px; width:235px;
background:none !important; border:none !important;
text-transform:uppercase; font-weight:bold; color:black !important; /* MODIFIABLE */
}
/****END NAV*****/
/****Profil fiche***/
/* AFFICHAGE DU PROFIL */
.PFIL {
margin:auto; width:800px; font-family:cambria;
}
/* BLOC POSITIONNEMENT */
.boxPFIL {
display:inline-block; vertical-align:top; 
}
/* BLOC SUJETS UTILISATEUR PROFIL */
.sbjPFIL {
margin-bottom:10px;
width:100px; height:100px; padding:10px;
text-transform:uppercase; text-align:center; font-size:11px;
background:rgba(250,250,250,0.8); /* MODIFIABLE */
}
/* BORDURE SUJETS UTILISATEUR PROFIL */
.sbjPFIL a {
display:block; margin:auto;
width:98px; height:58px; padding-top:40px; border:1px solid;
border-color:rgba(0,0,0,0.4); color:grey; /* MODIFIABLE */
}
/* BLOC MESSAGES UTILISATEUR PROFIL */
.msgPFIL {
margin-bottom:10px;
width:100px; height:100px; padding:10px;
text-transform:uppercase; text-align:center; font-size:11px;
background:rgba(255,255,255,0.5); /* MODIFIABLE */
}
/* BORDURE MESSAGES UTILISATEUR PROFIL */
.msgPFIL a {
display:block; margin:auto;
width:98px; height:58px; padding-top:40px; border:1px solid;
border-color:rgba(0,0,0,0.3); color:rgba(0,0,0,0.3); /* MODIFIABLE */
}
/* BLOC DERNIERE VISITE PROFIL */
.lstPFIL {
width:100px; height:100px; padding:10px;
text-align:center; font-size:11px;
background:rgba(255,255,255,0.4); /* MODIFIABLE */
}
/* BORDURE DERNIERE VISITE PROFIL */
.lstPFIL div {
display:block; margin:auto;
width:88px; height:98px; padding:0 5px; border:1px solid;
border-color:rgba(0,0,0,0.2); color:grey; /* MODIFIABLE */
}
/* INTITULE DERNIERE VISITE PROFIL */
.lstPFIL span {
text-transform:uppercase;
}
/* BLOC ALIGNEMENT */
.lstPFIL i {
display:inline-block; vertical-align:middle; font-style:normal;
}
/* BLOC PSEUDONYME PROFIL */
.namePFIL {
margin-left:10px; margin-bottom:10px;
height:20px; padding:15px;
text-transform:uppercase; text-align:right; letter-spacing:3px;
background:rgba(255,255,255,0.7);  /* MODIFIABLE - COULEUR PAR DEFAUT */
}
/* PSEUDONYME PROFIL */
.namePFIL span strong {
color:white; /* MODIFIABLE */
}
/* BLOC AVATAR & IMAGES CONTACT PROFIL */
.avPFIL {
display:inline-block; vertical-align:top; margin-left:10px;
width:200px; height:320px; overflow:hidden;
}
/* BLOC IMAGES CONTACT & ADMINISTRATION PROFIL */
#ktactPFIL {
position:absolute;
width:200px; height:305px; padding-top:15px; text-align:center;
background:rgba(0,0,0,0.8); /* MODIFIABLE */
opacity:0; transition:opacity ease-in-out 0.75s; -webkit-transition:opacity ease-in-out 0.75s;
}
#ktactPFIL:hover {
opacity:1;
}
/* BLOC ADMINISTRATION PROFIL */
#adminPFIL {
margin-bottom:15px;
font-size:11px; color:white; /* MODIFIABLE */
}
/* LIENS ADMINISTRATION PROFIL */
#adminPFIL a {
color:white; /* MODIFIABLE */
}
/* IMAGES CONTACT PROFIL */
.ktactPFIL img {
margin:auto; margin-bottom:10px;
}
/* BLOC INFORMATIONS PROFIL */
.abtPFIL {
display:inline-block; margin-left:10px; 
width:440px; height:300px; padding:10px; overflow:auto; font-size:11px;
background:rgba(255,255,255,0.5); color:black; /* MODIFIABLE */
}
/* INTITULES INFORMATIONS PROFIL */
.abtPFIL div span {
text-transform:uppercase; font-weight:bold; color:black; /* MODIFIABLE */
}
/* INFORMATIONS PROFIL */
.abtPFIL div {
padding:2px 0;
}
.abtPFIL .field_uneditable {
display:inline-block;
}
/* FEUILLE DE PERSONNAGE PROFIL */
.boxRPG {
margin:auto; margin-top:10px;
width:780px; padding:10px;
background:rgba(255,255,255,0.4); /* MODIFIABLE */
}
/* INTITULES CONTENU FEUILLE DE PERSONNAGE PROFIL */
.boxRPG span {
text-transform:uppercase; color:#191919; /* MODIFIABLE */
}
.boxRPG div:nth-of-type(1) br {
display:none;
}
/* MODERATION PROFIL */
.ajax-profil_edit {
position:absolute; z-index:15; margin-top:4px; margin-left:7px;
}
.ajax-profil_edit img {
width:7px;
}
/****VRAC****/
a:link, a:visited, a:active {text-decoration: none !important;}
tr.post span.gensmall {display: none}
.postbody {display: block; text-align:justify;}
.postdetails.poster-profile textarea { width: 200px;}
.boutonhautbas {
    bottom: 40px;
    right: 10px; /* remplacez right par left pour afficher les boutons à gauche */
    position: fixed;
    z-index: 100;
}
 
/* Chrome, Safari */
::-webkit-scrollbar {
  width: 5px;
  height: 10px;
}
 
::-webkit-scrollbar-track-piece  {
  background-color: #1C1A1A;
}
 
::-webkit-scrollbar-thumb:vertical {
  height: 30px;
        -webkit-border-radius: 10px;
  background-color: #5E556D;
}
 
::-webkit-scrollbar-thumb:horizontal{
  height: 30px;
        -webkit-border-radius: 10px;
  background-color: #1C1A1A;
}
/**CODE SELECTIONNER**/
 .selectCode {float: left; /**ou right**/
cursor: pointer;
text-trasnform: uppercase;}
        div.cont_code { clear: right; }
::-webkit-scrollbar {
       width: 4px;
}
::-webkit-scrollbar-thumb {
       background: #c84a6f;
}
::-webkit-scrollbar-track {
       background: #cfcbcc;
}
/****END VRAC***/
/*************** PRESENTATION PAR MOSES. PAR BAZZART  ********************/
.mpto {
  width:500px;box-sizing:border-box;margin:15px auto;
  background-color:#F8F1E9;  /* couleur du fond de fiche */
}
.mpim {display:inline-block;width:250px;height:250px;box-sizing:border-box;background-size:cover;}

.mpin {width:250px;height:250px;box-sizing:border-box;display:inline-block;vertical-align:top;border-width:20px 30px 20px 30px;
  background-color: #0C90AD; /*- couleur du bloc information -*/
  color:white; /*- couleur du texte information -*/
  font-family: 'fjalla one',sans-serif;  /*- police information -*/
  border:20px solid #0C90AD; /*- couleur du bloc -*/
  font-size:11px;
}
.npi1, .npi2 {width:190px;height:105px;overflow:auto;text-align:justify;}

.mpin span, .mpjt span {opacity:0.8;text-transform:uppercase;font-size:10px;font-weight:bold;
  color:#F2EFE4; /*- couleur des libellé -*/
}
.mpca {margin:15px 0px 15px 15px;box-sizing:border-box;border-width:1px 0px 1px 1px;height:220px;text-align:right;
  border:solid #0C90AD; /*- couleur du cadre de l'image -*/
}

.mpnm {width:180px;height:75px;margin:140px 0px 0px 54px;}

.mpnm span {
  background-color: #0C90AD; /*- fond du prénom et ft de la fiche -*/
}
.mp01 {font-family: 'fjalla one',sans-serif; /*- étiquette Prénom Nom -*/
  font-size:16px;
  color:#F8F1E9;
}

.mp02 {font-family: 'fjalla one',sans-serif; /*- étiquette feat -*/
  font-size:14px;
  color:#F8F1E9;
}

.mpcar {margin:30px 60px;border-width:0px 5px 0px 5px;padding:0px 15px;height:170px;overflow:auto;text-align:justify;
  border:solid #0C90AD; /*- bordure caractère -*/
  font-family: 'fjalla one',sans-serif; /*- police caractère -*/
  font-size:11px;
  color: #4A4A4A; /*- couleur texte caractère -*/
}

.ticar {
  font-size:16px;  /*- Titre caractère -*/
  text-transform:uppercase;
  color:#0C90AD;
}

.mpjr {width:500px;height:200px;box-sizing:border-box;padding:10px;
  background-color: #0C90AD; /*- Bloc joueur -*/
}
.mpji {padding:5px;display:inline-block;margin:5px;vertical-align:top;
border:1px solid #F8F1E9; /*- bordure icon -*/
}

.mpji img {width:80px;height:80px;}

.mpjt {display:inline-block;box-sizing:border-box;width:260px;vertical-align:top;
  border: 15px solid #0C90AD; /*- Bloc information joueur -*/
  color:#F8F1E9;
  font-family: 'fjalla one',sans-serif;
  font-size:11px;text-align:justify;
}

.mpho {
  width:500px;box-sizing:border-box;margin:15px auto;text-align:center;padding:20px 20px;height:auto;
  border-bottom:20px solid #0C90AD; /* bas de la fiche histoire */
  background-color:#F8F1E9; /* couleur du fond de histoire */
}

.mphi {padding:5px;display:inline-block;margin:5px;vertical-align:top;
border:1px solid #0C90AD; /*- bordure icon histoire -*/

.mphi img {width:80px;height:80px;}
.mpth {font-size:19px;text-transform:uppercase;
  color:#0C90AD; /* titre histoire */
font-family: 'Lora', serif;}

.mphc {text-align:justify;box-sizing:border-box;margin: 10px 30px;padding:0px 15px;height:600px;overflow:auto;
  font-size:11px; /* Corps texte histoire */
font-family: 'fjalla one',sans-serif;
  color:#4A4A4A;
  border:solid #0C90AD;border-width:0px 5px 0px 5px;}
/***********END FICHE PREZ************/
/*************** FICHE SCENARIO PAR MOSES. SUR BAZZART ********************/
.spto {width:500px;box-sizing:border-box;margin:15px auto;
background-color:#F8F1E9; /*- couleur de fond -*/
}
.spim {width:250px;height:250px;box-sizing:border-box;background-size:cover;display:inline-block;}

.spin {width:250px;height:250px;box-sizing:border-box;display:inline-block;vertical-align:top;
background-color: #0C90AD;color:#F8F1E9;font-family: 'fjalla one',sans-serif;border:20px solid #0C90AD;border-width:20px 30px 20px 30px;font-size:11px; /*- Caractéristique du bloc information -*/
}
.spi1, .spi2 {width:190px;height:105px;overflow:auto;text-align:justify;}

.spin span, .mpjt span {opacity:0.8;text-transform:uppercase;font-size:10px;font-weight:bold;color:#F2EFE4;;} /*- libellé informations -*/

.spca {margin:15px 0px 15px 15px;box-sizing:border-box;
border:solid #0C90AD; /*- couleur du cadre sur l'image -*/
border-width:1px 0px 1px 1px;height:220px;text-align:right;}

.spnm {width:180px;height:75px;margin:140px 0px 0px 54px;}

.spnm span {
background-color: #0C90AD; /*- couleur des étiquettes nom et feat -*/
}

.sp01 {font-family: 'Cambria', serif;font-size:16px;color:#F8F1E9;
/*- étiquette nom -*/}

.sp02 {font-family: 'fjalla one',sans-serif;font-size:14px;color:#F8F1E9;
/*-étiquette feat -*/}

.spcar {margin:10px 20px;padding:0px 10px;height:170px;overflow:auto;text-align:justify;width:210px;box-sizing:border-box;display:inline-block;border-width:0px 2px 0px 2px;
border:solid #4f4f4f; /*- bloc histoire -*/
font-family: 'fjalla one',sans-serif;
font-size:11px;
color: #4f4f4f;
}
.spat {background-color:#0C90AD;
font-family: 'fjalla one',sans-serif;
font-size:11px;color:#F8F1E9;  /*- Bloc attentes -*/
padding: 10px;height:190px;overflow:auto;text-align:justify;width:250px;box-sizing:border-box;display:inline-block;}

.sicar {font-size:16px;text-transform:uppercase;color:#4f4f4f;
/*- Titre Histoire et attente -*/}

.spjr {width:500px;height:120px;
background-color: #aeaeae; /*- couleur lien 1 -*/
box-sizing:border-box;padding:10px;}

.spji {border:1px solid white;padding:5px;display:inline-block;margin:5px;vertical-align:top;}

.spjt {display:inline-block;box-sizing:border-box;width:260px;border: 15px solid #aeaeae;vertical-align:top;color:#F8F1E9;font-family: 'fjalla one',sans-serif;font-size:11px;text-align:justify;height:100px;overflow:auto;}

.spji img {width:80px;height:80px;}

.spjd {width:500px;height:120px;background-color: #F8F1E9; /*- couleur lien 2 -*/
box-sizing:border-box;padding:10px}

.spdi {border:1px solid #0C90AD;padding:5px;display:inline-block;margin:5px;vertical-align:top;}
.spdt {display:inline-block;box-sizing:border-box;width:260px;border: 15px solid #F8F1E9;vertical-align:top;color:#4f4f4f;font-family: 'fjalla one',sans-serif;font-size:11px;text-align:justify;height:100px;overflow:auto;}
.spdi img {width:80px;height:80px;}
.spdt span, .spjt span {text-transform:uppercase; font-size:10px;font-weight:bold;color:#0C90AD;}
/***************END FICHE SCENA***************/
/******************************************************** FICHES ********************************************************/

/* REGLEMENT */
.reglement {
        width: 500px;
        margin: auto;
        background: #F7F0E8;
        text-align: justify;
        position: relative;
     padding: 0 0 2%;
        font-family: Cambria, sans-serif;
        font-weight: bold;
        color: #0C90AD;
}

.reglement header {
        background: url(https://zupimages.net/up/21/21/y8oo.png);
        box-sizing: border-box;
        padding: 8% 0 3% 5%;
}

.reglement header h2 {
        font-size: 30px;
        text-transform: uppercase;
        margin: 0 0 2% 0;
}

.reglement h3 {
        text-transform: uppercase;
        letter-spacing: 1px;
}

.reglement .separation span {
       margin: 0 4%;
     color: #B0AECC;
}

.reglement header .separation span:last-child {
       margin: 0 4%;
}

img.img_reglement {
        position: absolute;
        right: 8%;
        top: 5%;
}

.reglement .content {
        width: 90%;
        margin: 18% auto 2%;
}

.reglement .t1 {
        display: block;
        border-top: 1px solid #0C90AD;
        width: 80px;
}

.reglement .t2 {
        border-top: 1px solid #0C90AD;
        display: block;
        width: 100px;
        margin: .2% 0 0 0;
}

.reglement .img_footer_gauche {
        position: absolute;
        left: 0;
        bottom: 0;
}

.reglement .img_footer_droite {
        position: absolute;
        right: 0;
        bottom: 0;
}

a.wicked_credits {
        text-align: right;
        display: block;
        font-style: italic;
        text-transform: lowercase;
        letter-spacing: -1px;
        font-size: 10px;
        margin: 4% 2% 0 0;
        color: #b3afaf;
}
/* GROUPES */
.groupes_fiche {
        width: 500px;
        margin: auto;
        background: #F7F0E8;
        text-align: justify;
        position: relative;
     padding: 0 0 2%;
     font-family: Cambria, sans-serif;
    font-size: 12px;
        font-weight: bold;
        color: #0C90AD;
}

.groupes_fiche header {
        background: url(https://zupimages.net/up/21/21/y8oo.png);
        box-sizing: border-box;
        padding: 8% 0 3% 5%;
}

.groupes_fiche header h2 {
        font-size: 30px;
        text-transform: uppercase;
        margin: 0 0 2% 0;
}

.groupes_fiche h3 {
        text-transform: uppercase;
        letter-spacing: 1px;
}

.groupes_fiche .separation span {
       margin: 0 4%;
       color: #B0AECC;
}

.groupes_fiche header .separation span:last-child {
       margin: 0 4%;
}

.groupes_fiche .content {
        width: 90%;
        margin: 1% auto 2%;
}

.bloc_groupe .img_groupe {
        float: left;
        margin: 4% 4% 0 0;
}

.bloc_groupe:nth-child(2n+2) .img_groupe {
        float: right;
        margin: 4% 0 0 4%;
}

.bloc_groupe::after {
        display: block;
        content: "";
        clear: both;
}

.groupes_fiche .img_footer_gauche {
        position: absolute;
        left: 0;
        bottom: 0;
}

.groupes_fiche .img_footer_droite {
        position: absolute;
        right: 0;
        bottom: 0;
}

a.wicked_credits {
        text-align: right;
        display: block;
        font-style: italic;
        text-transform: lowercase;
        letter-spacing: -1px;
        font-size: 10px;
        margin: 4% 2% 0 0;
        color: #b3afaf;
}
/******************************************************** FICHES ********************************************************/
/* CONTEXTE */
.contexte {
        width: 500px;
        margin: auto;
        background: #F7F0E8;
        text-align: justify;
        position: relative;
     padding: 0 0 2%;
     font-family: Cambria, sans-serif;
        font-weight: bold;
        color: #0C90AD;
}

.contexte header {
        background: url(https://zupimages.net/up/21/21/y8oo.png);
        box-sizing: border-box;
        padding: 8% 0 3% 5%;
}

.contexte header h2 {
        font-size: 30px;
        text-transform: uppercase;
        margin: 0 0 2% 0;
}

.contexte .separation span {
       margin: 0 4%;
       color: #B0AECC;
}

.contexte header .separation span:last-child {
       margin: 0 4%;
}

.contexte .content {
        width: 90%;
        margin: 180px auto 10%;
}

.contexte .img_footer_gauche {
        position: absolute;
        left: 0;
        bottom: 0;
}

.contexte .img_footer_droite {
        position: absolute;
        right: 0;
        bottom: 0;
}

img.img_contexte1 {
        position: absolute;
        top: 105px;
        left: 43%;
}

img.img_contexte2 {
        left: 35%;
        position: absolute;
        top: 173px;
}

img.img_contexte3 {
        position: absolute;
        right: 33%;
        top: 172px;
}

a.wicked_credits {
        text-align: right;
        display: block;
        font-style: italic;
        text-transform: lowercase;
        letter-spacing: -1px;
        font-size: 10px;
        margin: 0 2% 0 0;
        color: #b3afaf;
}
/*****************END FICHES*****************/
/*************************BOTTIN*************************/
libre{ color:#50bf6c; font-size:12px;}
reserve{ color:#b9bf50; font-size:12px;}
pris{ color:#CF2757; font-size:12px;}


.fondFiche{
    background: #F7F0E8;
    border: 5px solid #0C90AD;
    box-shadow: 0 0 25px #B0AECC inset;
    margin: auto;
    text-align: center;
    width: 500px;
}

.iconeFicheAdmin{
  width:85px;
  height:85px;
  margin:auto;
  border:5px solid #0C90AD;
}

.imgPresMembre{
  width:65px;
  height:65px;
  float:left;
  padding:2px;
  padding-right: 5px;
}
.titreSstitre{
  height:40px;
  width:450px;
  margin:auto;
  padding:5px;
}

.soustitre{
  text-transform:uppercase;
  font-family:'cambria', sans-serif;
  font-size:9px;
  width:450px;
}

 .titre1{
    color: #B0AECC;
    font-family: 'fjalla one',sans-serif;
    font-size: 18px;
    height: 5px;
    letter-spacing: 8px;
    margin-top: -12px;
    text-align: center;
    text-shadow: #ecececcf -1px 1px 0px;
    text-transform: uppercase;
    width: 500px;
}

.titreBottin{
    font-family: 'fjalla one',sans-serif;
    color: #0C90AD;
    text-shadow: #ecececcf -1px 1px 0px;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 2px;
}
.messageBottin{
  width:440px;
  margin:auto;
  background: #cfcbcc;
  border: #B0AECC 3px solid;
  padding:10px;
  font-family:open sans;
  font-size:11px;
  text-align:justify;
  max-height:150px;
  overflow:auto;
}

.messageCaractere{
    text-transform: uppercase;
    width: 400px;
    margin: auto;
    padding: 10px;
    font-family: Cambria;
    font-size: 11px;
    text-align: center;
    height: 50px;
    overflow: auto;
    font-style: oblique;
}

.copyright::before/*copyright, ne pas retirer*/{
  font-family:'fjalla one',sans-serif;
  font-size:10px;
  text-align:center;
  content:"ROGERS.";
  text-transform:uppercase;
  letter-spacing:2px;
  color:#595959;
}
/*****************END BOTTIN***********************/
/*********FICHE DE VALIDATION************/
.validation {
        width: 500px;
        margin: auto;
        background: #0C90AD;
        position: relative;
        padding: 0 0 1%;
        font-family: Calibri, sans-serif;
        font-weight: bold;
        color: #F7F0E8;
}

.validation header {
        background: url(https://zupimages.net/up/21/21/y8oo.png);
        padding: 5% 0 10%;
        text-align: center;
        text-transform: uppercase;
        letter-spacing: 2px;
        font-size: 20px;
}

img.validation_img {
        margin: -8% auto 2%;
        display: block;
}

.validation p {
        width: 70%;
        margin: 2% auto;
        text-align: justify;
}

.validation .separation {
       text-align: center;
}

.validation .separation span {
       margin: 0 4%;
       color: #B0AECC;
}

.validation .separation span:last-child {
       margin: 0 4%;
}

a.wicked_credits {
        text-align: right;
        display: block;
        font-style: italic;
        text-transform: lowercase;
        letter-spacing: -1px;
        font-size: 10px;
        margin: 4% 2% 0 0;
        color: #b3afaf;
}
/********************END FICHE VALIDATION***********/
/* LIENS SOUS CATEGORIES */
.liens_footer_cate {
        width: 850px;
        margin: auto;
     font-family: 'Oswald', sans-serif;
        color: #1c1a1a;
        line-height: 1.5;
        font-size: 14px;
}

.lfc_bloc {
        float: left;
        width: 33.2%;
}

.lfc_bloc a {
        font-size: 11px;
        display: block;
        text-align: center;
        text-transform: uppercase;
}

.lfc_bloc a:hover {
       color: #7D2443  !important;
}
/******Fin liens*****/
/******DIVERS******/
#sceditor_smilies {
    background: linear-gradient(#F8F1E9, #F2EFE4) repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
    border: 1px dotted #F8F1E9;
}
/*********SWITCHEROO************/
:root {
  --color-text: rgba(255, 255, 255, 0.87);
  --color-bg: #0C90AD;
  --color-delete: #e74c3c;
  --color-tooltip: #010203;
  --color-squircle: #201f2e;
  --color-accent: #b14255;
  --color-button: #aaa2f2;
  --color-pill: #ffffff;
  --gap-size: 16px;
  --ease: cubic-bezier(0.4, 0.0, 0.2, 1);
  --ease-bounce: cubic-bezier(0.43, 0.09, 0.38, 2.56);
}

.switcheroo {
  color: var(--color-text);
  background-color: var(--color-bg);
  font-size: 16px;
}
.switcheroo[position="static"] {
  position: relative;
}
.switcheroo[position="top"] {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
}
.switcheroo[position="bottom"] {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 100;
}
.switcheroo[direction="horizontal"] {
  width: 100%;
}
.switcheroo[direction="vertical"] {
  height: 100%;
}

.switcheroo__squircles {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
  padding: var(--gap-size);
  gap: var(--gap-size);
}
.switcheroo[direction="horizontal"] .switcheroo__squircles {
  flex-direction: row;
}
.switcheroo[direction="vertical"] .switcheroo__squircles {
  flex-direction: column;
}

/* squircle */
.switcheroo[theme="discord"] .switcheroo__squircle {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-squircle);
}
.switcheroo[theme="discord"] .switcheroo__squircle {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  cursor: pointer;
  transition: border-radius 128ms var(--ease);
}
.switcheroo[theme="discord"] .switcheroo__squircle:hover {
  border-radius: 36%;
}
.switcheroo[theme="discord"][direction="vertical"] .switcheroo__squircle:before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  background-color: var(--color-pill);
  position: absolute;
  border-radius: 4px;
  top: 50%;
  transform: translate(-100%, -50%) scale(0);
  transition: transform 128ms, opacity 64ms;
  pointer-events: none;
  opacity: 0;
}
.switcheroo[theme="discord"][direction="horizontal"] .switcheroo__squircle:before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  background-color: var(--color-pill);
  position: absolute;
  border-radius: 4px;
  left: 50%;
  transform: translate(-50%, -100%) scale(0);
  transition: transform 128ms, opacity 64ms;
  pointer-events: none;
  opacity: 0;
}
.switcheroo[theme="discord"] .switcheroo__squircle.active {
  border-radius: 36%;
  cursor: default;
}
.switcheroo[theme="discord"][direction="vertical"] .switcheroo__squircle:hover:before {
  opacity: 1;
  transform: translate(-100%, -50%) scale(0.5);
}
.switcheroo[theme="discord"][direction="horizontal"] .switcheroo__squircle:hover:before {
  opacity: 1;
  transform: translate(-50%, -100%) scale(0.5);
}

.switcheroo[theme="discord"][direction="vertical"] .switcheroo__squircle.active:before {
  opacity: 1;
  transform: translate(-85%, -50%) scale(0.2);
  border-radius: 50%;
}
.switcheroo[theme="discord"][direction="horizontal"] .switcheroo__squircle.active:before {
  opacity: 1;
  transform: translate(-50%, -85%) scale(0.2);
  border-radius: 50%;
}


/* tooltip */
.switcheroo__popper {
  background-color: var(--color-tooltip);
  padding: 0.68rem 1rem;
  position: absolute;
  width: -webkit-max-content;
  width: max-content;
  border-radius: 4px;
  z-index: 0;
  opacity: 0;
  transition: opacity 64ms var(--ease), transform 128ms var(--ease-bounce);
  pointer-events: none;
  color: #fff;
}
.switcheroo[direction="vertical"] .switcheroo__popper {
  left: 155%;
  top: 50%;
  transform-origin: left;
  transform: translateY(-50%) scale(0.98);
}
.switcheroo[direction="horizontal"] .switcheroo__popper {
  top: 155%;
  left: 50%;
  transform-origin: top;
  transform: translateX(-50%) scale(0.98);
}
.switcheroo__popper:before {
  content: "";
  position: absolute;
  width: 24px;
  height: 24px;
  background-color: var(--color-tooltip);
  z-index: -1;
}
.switcheroo[direction="vertical"] .switcheroo__popper:before {
  left: -2px;
  top: 50%;
  transform: translateY(-50%) rotate(-45deg);
}
.switcheroo[direction="horizontal"] .switcheroo__popper:before {
  left: 50%;
  top: -2px;
  transform: translateX(-50%) rotate(-45deg);
}

.switcheroo[direction="vertical"] .switcheroo__squircle:hover .switcheroo__popper {
  opacity: 1;
  transform: translateY(-50%) scale(1);
}
.switcheroo[direction="horizontal"] .switcheroo__squircle:hover .switcheroo__popper {
  opacity: 1;
  transform: translateX(-50%) scale(1);
}
.switcheroo__squircle:hover:before {
  opacity: 1;
  transform: translate(-100%, -50%) scale(0.5);
}

/* avatar */
.switcheroo[theme="discord"] .switcheroo__avatar {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  overflow: hidden;
}
.switcheroo[theme="discord"] .switcheroo__avatar img {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
/* divider */
.switcheroo[theme="discord"][direction="vertical"] .switcheroo__divider {
  width: 100%;
  height: 2px;
  background-color: var(--color-pill);
  border-radius: 1px;
  opacity: 0.06;
  transform: scale(0.8);
}
.switcheroo[theme="discord"][direction="horizontal"] .switcheroo__divider {
  width: 2px;
  background-color: var(--color-pill);
  border-radius: 1px;
  opacity: 0.06;
  transform: scale(0.8);
}
/* delete button */
.switcheroo[theme="discord"] .switcheroo__delete {
  display: flex;
  justify-content: center;
  position: absolute;
  width: 16px;
  line-height: 14px;
  height: 16px;
  top: -2px;
  right: -2px;
  border-radius: 50%;
  background-color: var(--color-delete);
  transform: scale(0);
  opacity: 1;
  transition: transform 128ms var(--ease), opacity 64ms var(--ease);
  cursor: pointer;
  font-size: 13px;
}
.switcheroo[theme="discord"] .switcheroo__squircle:hover .switcheroo__delete {
  opacity: 1;
  transform: scale(1);
}
/* logo */
.switcheroo[theme="discord"] .switcheroo__logo {
}
.switcheroo[theme="discord"] .switcheroo__logo img {
  width: 32px;
}
.switcheroo[theme="discord"] .switcheroo__logo:hover {
  background-color: var(--color-accent);
}
/* buttons */
.switcheroo[theme="discord"] .switcheroo__squircle--button {
  transition: border-radius 128ms var(--ease);
  color: var(--color-button);
}
.switcheroo[theme="discord"] .switcheroo__squircle--button:hover {
  color: #fff;
  background-color: var(--color-button);
}
/* modal */
.switcheroo__form {
  padding: 48px;
}
.switcheroo__form-row {
  display: flex;
  flex-flow: column;
  align-items: flex-start;
  margin-bottom: 16px;
}
.switcheroo__form-label {
  margin-bottom: 8px;
  font-size: 14px;
  text-transform: uppercase;
  color: var(--color-text) !important;
}
.switcheroo__form-input {
  padding: 6px !important;
  font-size: 16px !important;
  border-radius: 4px !important;
  width: 100% !important;
  border-bottom: 2px solid var(--color-accent) !important;
  background-color: var(--color-bg) !important;
  color: var(--color-text) !important;
  cursor: text !important;
}
.switcheroo__form-button {
  border-radius: 8px;
  padding: 8px;
  border: none;
  outline: none;
  box-shadow: none;
  text-transform: uppercase;
  font-size: 14px;
  align-self: flex-end;
  color: #fff;
  background-color: var(--color-accent);
}

.monomer-overlay {
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: 0.2s opacity ease;
  background: rgba(0, 0, 0, 0.6);
}

.monomer-modal {
  position: fixed;
  z-index: 999;
  top: 50%;
  left: 50%;
  opacity: 0;
  width: 94%;
  padding: 24px 20px;
  transition: 0.2s opacity ease;
  transform: translate(-50%, -50%);
  border-radius: 2px;
  background: var(--color-squircle);
  color: var(--color-text);
}

.monomer-modal.monomer-open.monomer-anchored {
  top: 20px;
  transform: translate(-50%, 0);
}

.monomer-modal.monomer-open {
  opacity: 1;
}

.monomer-overlay.monomer-open {
  opacity: 1;
}

.monomer-close {
  font-family: Helvetica, Arial, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  width: 24px;
  height: 24px;
  position: absolute;
  top: -5px;
  right: -5px;
  padding: 5px;
  cursor: pointer;
  color: #0C90AD;
  border: 0;
  outline: none;
  background: var(--color-delete);
  border-radius: 50%;
  padding: 0;
}
.monomer-close:hover {
  opacity: 0.8;
}
#fa_toolbar, #fa_toolbar_hidden {
    display: none!important;
}
(function() {
    new Switcheroo('#switcheroo', {
        logo: '', /* accepte html, permet d'afficher un logo qui retourne à l'accueil du forum */
        enableReorder: true, /* activer le drag&drop pour l'ordre des comptes (true/false) */
        updateAvatar: true, /* activer le clique droit pour charger un nouvel avatar (true/false) */
        customButtons: [], /* boutons personnalisés, explication plus bas */
        confirm: false, /* demande une confirmation avant le changement de compte */
        confirmMsg: 'Confirmer le Switcheroo de personnage ?', /* le message affiché lors de la confirmation */
        deleteIcon: '×', /* accepte html, icone pour supprimer un compte lié */
        addIcon: '+', /* accepte html, icone qui ouvre le formulaire de connexion et d'association */
        errorMsg: 'Une erreur est surviendue lors du Switcheroo.',
    });
})();

Merci beaucoup par avance pour votre aide !
Sherlock
Sherlock
Mediocrity knows nothing higher than itself; but talent instantly recognizes genius.
Mediocrity knows nothing higher than itself; but talent instantly recognizes genius.
Salut Alexis :happyblob: !

Alors la solution va paraître toute bête mais il s'agit simplement d'un problème de largeur de forum. En effet, en analysant le schmilblick avec l'inspecteur d'élément et en réduisant la taille du bloc de l'avatar, le tout prend la place nécessaire.

Problème avec un code de profil + message F2vk

(bon c'est fait à l'arrache pour te montrer)

En fait si tu veux, le code est fait de sorte qu'il prenne toute la place disponible. Si jamais le contenant n'a pas assez de place pour la taille maximum du contenu, alors le contenu est cassé.
Pour illustrer ça simplement : si ton bloc contenant fait 1000px et que le contenu fait 1200px, le contenu va se placer l'un sous l'autre. Mais si tu mets le contenant à 1200px, alors le contenu va pouvoir s'afficher correctement. c:

Voilà voilà !
Alexis Graves
Anonymous
Invité
Coucou, j'avais bien tenté ça justement, de tout mettre en 1200 ou de tout réduire pour que ça rentre dans 850 et rien à faire, ça ne fonctionne pas :/
Sherlock
Sherlock
Mediocrity knows nothing higher than itself; but talent instantly recognizes genius.
Mediocrity knows nothing higher than itself; but talent instantly recognizes genius.
:uuh: :uuh:

Est-ce que tu peux me donner les clés de ton fort (autrement appelé identifiants) pour que je puisse regarder ça de plus près ? Parce que ça m'intrigue, ce qui se passe. xD Surtout si ça te fait la même chose avec les deux codes (mais le mien est sûrement mal codé, il faut que je le refasse très certainement) !

Jawn
Jawn
The relations between us in those latter days were peculiar.
The relations between us in those latter days were peculiar.
Pas de réponse depuis plus d'un mois, j'archive ~
Contenu sponsorisé
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum