AccueilAccueil  CalendrierCalendrier  FAQFAQ  RechercherRechercher  MembresMembres  GroupesGroupes  S'enregistrerS'enregistrer  Connexion  

pas perdre

l'administration sans limites
avatar
l'administration sans limites
messages : 47
pseudo : step aside (caca)
avatar : camilla.
crédits : (morrigan)

age : 26
Voir le profil de l'utilisateur
http://botrchangement.forumactif.org
Sam 4 Fév - 21:47
caté
Code:
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
 <tr>
 <td valign="bottom"> </td>
 </tr>
</table>






<!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>
          <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"><toptop>{catrow.tablehead.L_FORUM}</toptop></th>
       </tr>
   <!-- END tablehead -->
 <!-- BEGIN cathead -->
 <tr>
 <!-- BEGIN inc -->
 <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
 <!-- END inc -->
 <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
 <h{catrow.cathead.LEVEL} class="hierarchy">
 <span class="cattitle">
 <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
 </span>
 </h{catrow.cathead.LEVEL}>
 </td>
 <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right">&nbsp;</td>
 </tr>
 <!-- END cathead -->
 <!-- BEGIN forumrow -->
 <tr>
 <!-- BEGIN inc -->
 <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
 <!-- END inc --> <td class="row1 over" valign="top" height="50">
      
          <table><tr> <td> <div class="imagenouv"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /></div></td>
                   <td>   <table><tr><td> <div class="cate1">
<h{catrow.forumrow.LEVEL} class="hierarchy">
 <span class="forumlink">
 </span>
 </h{catrow.forumrow.LEVEL}> <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
          <div class="cate"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div>
 <span class="gensmall">
                     </span>
                      
         <center>  <div class="sousforum"><span class="ListeSousForums" id="subforums">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</span></div>
                     </center> <script type="text/javascript">
jQuery('#subforums').html(jQuery('#subforums').html().replace(/, /g,' - ')).removeAttr('id');
</script></div> </td>
                    
                     <td><div class="cate11">
                       <table><tr>
                         <td> <!-- BEGIN avatar -->
            <div class="avapa"></div> <span class="lastpost-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</span>
          <!-- END avatar --> </td>
      <td> <center>
  <div class="gensmall derniersmessages">
    <div class="sousms">{catrow.forumrow.LAST_POST}</div></div></center></td> </tr></table>
       <div class="zz">( {catrow.forumrow.TOPICS} sujets | {catrow.forumrow.POSTS} réponses )</div> </div></td></tr></table>
  
   </td></tr></table>
        
         </td>
 </tr>
 <!-- END forumrow -->
 <!-- BEGIN catfoot -->
 <tr>
 <!-- BEGIN inc -->
 <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
 <!-- END inc -->
 <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
 </tr>
 <!-- END catfoot -->
 <!-- BEGIN tablefoot -->
</table><img src="{SPACER}" alt="" height="0" width="1" /><!-- END tablefoot --><!-- END catrow -->
Revenir en haut Aller en bas
l'administration sans limites
avatar
l'administration sans limites
messages : 47
pseudo : step aside (caca)
avatar : camilla.
crédits : (morrigan)

age : 26
Voir le profil de l'utilisateur
http://botrchangement.forumactif.org
Sam 4 Fév - 21:48
css
Code:
/* général */
a { text-decoration: none; }
a {text-decoration: none;}
a:link {text-decoration: none;}
a:hover {text-decoration: none!important;}
tr.post span.gensmall { display: none; }
body.chatbox {background-color:#ebeae8;}

.bodylinewidth .bodyline > table:first-child tr:first-child > td span.gen,
.bodylinewidth .bodyline > table:first-child tr:first-child > td br,
.bodylinewidth .bodyline > table:first-child tr:first-child > td div.maintitle
{ display: none }

form {
  font-size: 10px;
}

.selectCode { float:right;
  text-transform: lowercase;
  font-size: 11px;
  font-style: italic;
 color: #81594F;
  cursor:pointer; }


hr { border-color: #B8AAAA; }

body{
  margin-top: -10px;
  margin-bottom: 0px;
}

.bodyline {
padding: 0px;
}

/* réponse rapide */
.sceditor-container.ltr.sourceMode {
  margin-top: 5px !important;
  border: 0px solid #fcf9f7 !important;
  background-color: #e8e7e3 !important;
}
.sceditor-container.ltr.wysiwygMode {
  margin-top: 5px !important;
    border: 0px solid #fcf9f75 !important;
}

div.sceditor-group {
background-color: #B8AAAA !important;
  border-bottom: 0px solid #fcf9f7 !important;
  text-align: justify;
}

body div.sceditor-toolbar {
border-bottom: 1px solid #fff !important;
  background-color: #B8AAAA !important;
}


a.sceditor-button {
 background-color:#D9D7D2 !important;
  width: 15px;
  text-align: center !important;
}




.postbody {
    text-align:justify;
  font-size: 12px;
  padding-left: 2px;
  padding-right: 2px;
  max-width: 750px;
}

/*bottin*/
free {
font-family: arial;
font-style: italic;
text-transform: uppercase;
font-size: 10px;}

taken { font-family: Courier New;
  letter-spacing: 0px;
text-transform: uppercase;
font-size: 10px;
  color: #61453E; }

resa { font-family: Courier New;
  letter-spacing: 0px;
text-transform: uppercase;
font-size: 10px;
  color: #877C7C; }

scena { font-family: Courier New;
  letter-spacing: 0px;
text-transform: uppercase;
font-size: 10px;
  color: #006600; ; }

/* toolbar */
div#fa_search {display:none!important;}
span#fa_share {display:none!important;}
a#fa_welcome {display:none!important;}
#fa_toolbar {
  width: 600px;
  margin: auto;
  left: none;
  right: none;
  background-color: transparent !important;  /* Rend transparent le fond principal */
  text-transform: uppercase;
  font-family: 'Yanone Kaffeesatz', sans-serif!important;
  letter-spacing: 1px;
font-size: 12px;
  border: none!important;
}

ul#notif_list {  text-transform: lowercase!important;
border: none!important;
 font-family: verdana!important;
letter-spacing: 0px!important;}

div.fa_notification { text-transform: lowercase!important;
border: none!important;
 font-family: verdana!important;
letter-spacing: 0px!important;}


#fa_toolbar #fa_hide{
  background-color:  transparent !important;
  background-image: url(http://image.noelshack.com/fichiers/2014/06/1391771402-x.png) !important;
  background-repeat: no-repeat;
  background-position: center center;
}

#fa_toolbar_hidden #fa_show{
    background-color:  #C1C7CD !important;
  background-image: url(http://image.noelshack.com/fichiers/2014/06/1391771402-x.png) !important;
  background-repeat: no-repeat;
  background-position: center center;
}


.code {
  padding: 2px;
  color: #635757;
  background-color: #e8e7e3 !important;
}

.quote {
  padding: 4px;
  border: 1px solid #D9D7D2!important;
  max-width: 500px !important;
  background-color: #e3e2df !important;
}

.quote:hover {
  padding: 4px;
  border: 1px solid #D9D7D2!important;
  max-width: 500px !important;
  color: #6B8568;
  background-color: #e3e2df !important;
}

.spoiler_closed{ /*Spoiler fermé*/
 
    }

.spoiler_content{ /*Spoiler ouvert*/
 padding: 3px;
    }
 
#fa_ticker_block
{ width:130px;
}

#fa_ticker
{ width:130px;
}

#fa_ticker_container
{ width:130px;
}

.annonceé {
  font-size: 12px !important;
  text-align: left;
font-family: 'Open Sans', sans-serif;
}


/* barre nav */
div#nav_forum_1{
 position: fixed;
  display:block;
  bottom: 100px;
right:50px;
  text-align: left;
  color: #000;
padding: 20px;
  }


.vv {
  font-family: 'Open Sans', sans-serif;
  text-transform: uppercase;
  font-size: 10px;
letter-spacing: 1px;

}

.vv:hover {
  font-family: 'Open Sans', sans-serif;
  text-transform: uppercase;
  font-size: 10px;
letter-spacing: 1px;
  text-decoration : underline;
}

.vv2 {
 font-family: 'Open Sans', sans-serif;
  text-transform: uppercase;
  font-size: 10px;
letter-spacing: 1px;

}

.titre {
color : #000 ;
  font-family: 'Satisfy', cursive;
  letter-spacing: -2px;
  font-size: 20px;
  text-transform: lowercase;
}

.titrep {
color : #000 ;
  font-family: 'Satisfy', cursive;
  letter-spacing: -1px;
  font-size: 18px;
  text-transform: lowercase;
}


/* petits titres */
c1 {font-family: 'Pathway Gothic One', cursive;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 11px;
  color: #81594F;
  text-shadow:0 0 1px #FFF;
;}

c2 { font-family: 'Pathway Gothic One', cursive;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 11px;
  color: #BFA6A1;
text-shadow:0 0 1px #FFF;}

uu {font-family: 'Homenaje', cursive;
  letter-spacing: 2px;
text-transform: uppercase;
font-size: 11px;
  color: #81594F;}

er {font-family: 'Homenaje', cursive;
  letter-spacing: 2px;
text-transform: uppercase;
font-size: 11px;}

ll {font-family: 'Homenaje', cursive;
  letter-spacing: 2px;
text-transform: uppercase;
font-size: 11px;
  color: #BFA6A1;}

toptop {font-family: 'Open Sans', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 25px;
  text-shadow:0 0 3px #FFF;
;}

/* barre nav */
.mainmenu img { display: none; }

div#nav_forum_1{
 position: fixed;
  display:block;
  bottom: 100px;
right:50px;
  text-align: left;
  color: #000;
padding: 20px;
  }


/* schroll effect */
.elevator {
  width: 400px;
  height: 100px;
 overflow : auto; }

.elevator::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.elevator::-webkit-scrollbar-track {
  background-color: none !important;  }

.elevator::-webkit-scrollbar-thumb {
  background-color: #CCC2C2;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

/* catégories */

.ListeSousForums a {
  font-size:9px;
  text-align: center;
  text-transform: uppercase;
  font-family: 'Open Sans', sans-serif;
  letter-spacing: 0px; 
}

.sousforum::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #fff; }

.sousforum::-webkit-scrollbar-track {
  background-color: none !important;  }

.sousforum::-webkit-scrollbar-thumb {
  background-color: #CCC2C2;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.sousforum {
  margin-top: 1px;
    font-size:9px !important;
 width: 548px !important;
  height: 12px !important;
  font-family: 'Open Sans', sans-serif !important;
  background-color: #DEDBDB;
  padding: 1px;
  overflow: auto;
  align: center !important;
text-align: center;}

.zz {
  margin-top: 4px !important;
  margin: 2px;
  font-size: 9px;
  height: 12px !important;
  padding: 1px;
  text-align: center;
  text-transform: uppercase;
font-family: 'Open Sans', sans-serif;
  background-color: #DEDBDB;
}

.forumlink {
font-family: 'Open Sans', sans-serif;
  letter-spacing: 0px;
  margin-left: 10px;
  font-size: 18px;
  text-transform: uppercase;
}

.lastpost-avatar {
float: left;
padding: 0px;
}

.lastpost-avatar img {
  margin-top: 0px;
height: 74px;
width: auto;
border-radius: 0px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
  filter: grayscale(1);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(1);
        -o-filter: grayscale(1);
        -ms-filter: grayscale(1);
 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;
}

.lastpost-avatar img:hover {
  margin-top: 0px;
height: 74px;
width: auto;
border-radius: 0px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
  filter: grayscale(0);
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -o-filter: grayscale(0);
        -ms-filter: grayscale(0);
  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;
}

.cate {
  width: 555px;
  height: 57px;
  line-height: 12px !important;
  overflow: auto;
  text-align: justify;
  margin-top: -4px !important;
  margin-bottom: 6px !important;
  text-transform: lowercase;
}

.cate1 {
  padding: 2px;
  margin-top: 0px !important;
  height: 100px;
    background-color: #cfcfcf;

}

.cate11 {
  padding: 2px;
  margin-top: 0px !important;
  height: 100px;
    background-color: #cfcfcf;

}

.derniersmessages {
  width: 140px;
  font-size: 10px !important;
}

.cate::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.cate::-webkit-scrollbar-track {
  background-color: none !important;  }

.cate::-webkit-scrollbar-thumb {
  background-color:  #CCC2C2;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.imagenouv {
 margin-top: 3px;
}


#offlineimg {
background-image: url(http://i.imgur.com/kLz5E8w.png);
  align: center !important;
  margin-left: 1px !important;
 witdh: 212px !important;
  height: 27px;
}

/* PROFIL */
.postdetails img {
  border-radius: 5px;
 text-align: center;
  max-width:200px;
opacity: 0.7;}

.ava { 
 width:200px;
  border: 3px solid #fff;
}

/* Le bloc conteneur */
.conteneurpro {
  background:none;
  position:relative;
  width:200px; /* on fixe la largeur */
  height:320px; /* et la hauteur */
  overflow:hidden; /* Tout ce qui dépasse est caché ! */
}

/* le bloc info */
.continfopro {
  /* positionnement absolu par rapport au conteneur (qui est en relatif) */
  position:absolute;
  bottom:0; /* 0px par rapport au BAS du conteneur */
  left:0; /* 0px par rapport à la gauche du conteneur */
 
  height:320px; /* on fixe la hauteur, par exemple la même chose que notre conteneur (on peut mettre moins)*/
  width:200px;  /* on fixe la largeur, là j'ai mis "tout l'espace disponible", donc 100% */
 
  margin-left:-200px; /* on décale le bloc de 250px vers le bas, comme il "sort" des dimensions du conteneur, il disparait à cause du overflow hidden */
 
  /* on indique la propriété qui nécessitera une transition et le temps de transition pour tous les navigateurs */
  transition:margin 800ms ease;
  -moz-transition:margin 800ms ease;
  -o-transition:margin 800ms ease;
  -htm-transition:margin 800ms ease;
  -webkit-transition:margin 800ms ease;
 
  /* couleur de fond pour la démo */
  background:none;
  background-color: #fff;
  opacity: 0.8;
}

/* lorsqu'on survole le conteneur (:hover), le bloc .info change */
.conteneurpro:hover .continfopro {
  margin:0; /* la marge passe à 0, et le bloc réapparait ! Comme il était en bas, il donne l'impression de monter */
}

.policepseudo {
font-family: 'Damion', cursive;
  text-transform: lowercase;
  font-size: 22px;
  text-shadow: 1 0 0.1em #FFF;
  margin-bottom: -6px;
  margin-top: -5px;
}

.tourpseudo {
  margin: 5px;
  background-color: #fff;
  border: 4px solid #e0d5d6;
}

.tour {
}

.tourtour {
  border: 3px solid #e0d5d6;
 background-image:url(http://i.imgur.com/byeA0ba.png) !important;}


.tourprofil {
  text-align: justify;
  padding-top: 6px !important;
  margin: 2px;
  margin-top: 5px !important;
  padding: 2px;
  text-transform: lowercase;
  background-color: #fff;
  border: 4px solid #e0d5d6;
}

jj { font-family: 'Pathway Gothic One', cursive;
  font-size:12px;
  text-align: center;
  letter-spacing: 3px:
  text-transform: lowercase; }

.imgtop { width:207px;
margin-top: 8px;}

.finpro {
  margin-top: -5px;
  margin-left: 1px;
  margin-right: 1px;
 height: 10px;
  width: 207px;
  border-bottom: 2px solid #fbf6f4;
  border-right: 1px solid #fbf6f4;
  border-left: 1px solid #fbf6f4;
  border-radius: 0px 0px 10px 10px;
}

/* haut de sujets */
ee {
  font-size:20px;
  text-align: center;
  text-transform: lowercase;
  font-family: 'Damion', cursive;
  letter-spacing: 0px;
  line-height: 11px;
}

.hautsuj {
align: center;
  margin-top: 0px !important;
  margin-left: -7px !important;
  width: 100%;
  padding: 3px;
  margin-bottom: 6px !important;
}

/* présentation + scénarios */
/*présa & scénar*/


.titrej {
color: #000000;
  font-family: 'Damion', cursive;
  letter-spacing: -2px;
  font-size: 25px;
  text-transform: lowercase;
  margin-left: 10px;
  margin-bottom: -4px;
}

.titrec {
color: #EBE3E3;
 font-family: 'Damion', cursive;
  letter-spacing: -2px;
  font-size: 25px;
  text-transform: lowercase;
}

.cadrej {
  width: 534px;
  padding: 0px;
  text-align: justify;
background-color: #e8dfe0;
  border-radius: 2px; }

.cadrejj {
  background-image:url(http://i.imgur.com/byeA0ba.png) !important;
  border: 4px solid #e0d5d6;
 padding: 10px;
  width:534px; 
  text-align:center !important;
  align:center !important;
 
}

.cadrec {
  padding: 2px !important;
  width:258px;
  height: 250px;
  text-align:justify;
 background-color: #ffffff;}

.cadrec::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.cadrec::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadrec::-webkit-scrollbar-thumb {
  background-color: #CCC2C2;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.cadress {
  width:250px;
  height: 130px;
  text-align:justify;
padding: 1px;
background-color: none;
overflow: auto;}

.cadress::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.cadress::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadress::-webkit-scrollbar-thumb {
  background-color: #CCC2C2;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.cadinv {
  overflow: auto;
  width: 256px;
  height: 220px;
line-height: 14px;}

.cadrecc {
  margin-top: 6px;
  width: 510px;
  max-height: 200px;
  text-align:justify;
padding: 0px;
background-color: none;
overflow: auto;
margin-bottom: 4px; }

.cadrecc::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.cadrecc::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadrecc::-webkit-scrollbar-thumb {
  background-color: #CCC2C2;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.cadrecp {
  margin-top: 6px;
  width: 510px;
  max-height: 300px;
  text-align:justify;
padding: 0px;
background-color: none;
  margin-bottom: 5px;
  overflow: auto;
}


.cadrecp::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.cadrecp::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadrecp::-webkit-scrollbar-thumb {
  background-color: #c0c0c0;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.cadrect {
  margin-top: 4px;
  width: 510px;
  text-align:justify;
padding: 0px;
background-color: none;}


.refpic {
  margin-left: -12px;
  text-transform: lowercase;
  width: 552px;
  height: 15px;
  padding: 2px;
  text-align: center;
font-size: 10px!important;
  text-transform:uppercase;
  margin-top: 2px;
  margin-bottom: 2px;
 background-color: #e0d5d6;
  }

.cadre {
  width:500px;
  text-align:justify;
padding: 3px;
background-color: #F9FBFC;
border: 2px solid #EEF1F2; }

.pp {
  font-family: tahoma;
  width: 250px;
  border: 3px solid #fff;
  opacity: 0.8; }

.ss {
  font-family: tahoma;
  width: 80px;
  border: 3px solid #fff;
  opacity: 0.8; }

.cp {
  font-family: tahoma;
  width: 150px;
  border: 3px solid #fff;
  opacity: 0.8;
radius: 50px;
-webkit-transform:rotate(-90deg);
  -moz-transform:rotate(-90deg);
  -o-transform:rotate(-90deg);
  -ms-transform:rotate(-90deg); 
  transform:rotate(-90deg);
}

cita {
  font-family: times;
  font-size: 12px;
  font-style: italic;
  text-transform: lowercase; }

/* PA */

.funpic {
  width:35px;
  height: 50px;
  filter: grayscale(1);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(1);
        -o-filter: grayscale(1);
        -ms-filter: grayscale(1);
transform: all;
        -moz-transform: all;
        -o-transform: all;
        -htm-transform: all;
        -webkit-transform: all;
        transition: 1s;
        -moz-transition: 1s;
        -o-transition: 1s;
        -htm-transition: 1
}

.funpic:hover {
  width:35px;
  height: 50px;
    filter: grayscale(0);
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -o-filter: grayscale(0);
        -ms-filter: grayscale(0);
transform: all;
        -moz-transform: all;
        -o-transform: all;
        -htm-transform: all;
        -webkit-transform: all;
        transition: 1s;
        -moz-transition: 1s;
        -o-transition: 1s;
        -htm-transition: 1
}

.picfun { 
    width: 75px;
  filter: grayscale(1);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(1);
        -o-filter: grayscale(1);
        -ms-filter: grayscale(1);
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;
  }

.picfun:hover { 
    width: 75px;
  filter: grayscale(0);
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -o-filter: grayscale(0);
        -ms-filter: grayscale(0);
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;
  }



/* Le bloc conteneur */
.conteneurpa {
  margin-bottom: 2px;
  background:none;
  position:relative;
  width:150px; /* on fixe la largeur */
  height:30px; /* et la hauteur */
  overflow:hidden; /* Tout ce qui dépasse est caché ! */
}


.continfopa {
  /* positionnement absolu par rapport au conteneur (qui est en relatif) */
  position:absolute;
  bottom:0; /* 0px par rapport au BAS du conteneur */
  left:0; /* 0px par rapport à la gauche du conteneur */
 
  height:30px; /* on fixe la hauteur, par exemple la même chose que notre conteneur (on peut mettre moins)*/
  width:150px;  /* on fixe la largeur, là j'ai mis "tout l'espace disponible", donc 100% */
 
  margin-bottom:-30px; /* on décale le bloc de 250px vers le bas, comme il "sort" des dimensions du conteneur, il disparait à cause du overflow hidden */
 
  /* on indique la propriété qui nécessitera une transition et le temps de transition pour tous les navigateurs */
  transition:margin 800ms ease;
  -moz-transition:margin 800ms ease;
  -o-transition:margin 800ms ease;
  -htm-transition:margin 800ms ease;
  -webkit-transition:margin 800ms ease;
 
  /* couleur de fond pour la démo */
  background:none;
  font-family: arial;
  text-align: center;
  line-height: 12px;
  background-color: #fff;
  opacity: 0.9;
}

/* lorsqu'on survole le conteneur (:hover), le bloc .info change */
.conteneurpa:hover .continfopa {
  margin:0; /* la marge passe à 0, et le bloc réapparait ! Comme il était en bas, il donne l'impression de monter */
}

.conteneurpa2 {
  background:none;
  position:relative;
  width:80px; /* on fixe la largeur */
  height:23px; /* et la hauteur */
  overflow:hidden; /* Tout ce qui dépasse est caché ! */
}


.continfopa2 {
  /* positionnement absolu par rapport au conteneur (qui est en relatif) */
  position:absolute;
  bottom:0; /* 0px par rapport au BAS du conteneur */
  left:0; /* 0px par rapport à la gauche du conteneur */
 
  height:23px; /* on fixe la hauteur, par exemple la même chose que notre conteneur (on peut mettre moins)*/
  width:80px;  /* on fixe la largeur, là j'ai mis "tout l'espace disponible", donc 100% */
 
  margin-bottom:-28px; /* on décale le bloc de 250px vers le bas, comme il "sort" des dimensions du conteneur, il disparait à cause du overflow hidden */
 
  /* on indique la propriété qui nécessitera une transition et le temps de transition pour tous les navigateurs */
  transition:margin 800ms ease;
  -moz-transition:margin 800ms ease;
  -o-transition:margin 800ms ease;
  -htm-transition:margin 800ms ease;
  -webkit-transition:margin 800ms ease;
 
  /* couleur de fond pour la démo */
  background:none;
  font-family: arial;
  text-align: left;
  padding-top: 6px !important;
  padding-left: 2px !important;
  background-color: #fff;
  opacity: 0.8;
}

/* lorsqu'on survole le conteneur (:hover), le bloc .info change */
.conteneurpa2:hover .continfopa2 {
  margin:0; /* la marge passe à 0, et le bloc réapparait ! Comme il était en bas, il donne l'impression de monter */
}

.conteneurpa3 {
  background:none;
  position:relative;
  width:130px; /* on fixe la largeur */
  height:30px; /* et la hauteur */
  overflow:hidden; /* Tout ce qui dépasse est caché ! */
}


.continfopa3 {
  /* positionnement absolu par rapport au conteneur (qui est en relatif) */
  position:absolute;
  bottom:0; /* 0px par rapport au BAS du conteneur */
  left:0; /* 0px par rapport à la gauche du conteneur */
 
  height:30px; /* on fixe la hauteur, par exemple la même chose que notre conteneur (on peut mettre moins)*/
  width:130px;  /* on fixe la largeur, là j'ai mis "tout l'espace disponible", donc 100% */
 
  margin-bottom:30px; /* on décale le bloc de 250px vers le bas, comme il "sort" des dimensions du conteneur, il disparait à cause du overflow hidden */
 
  /* on indique la propriété qui nécessitera une transition et le temps de transition pour tous les navigateurs */
  transition:margin 800ms ease;
  -moz-transition:margin 800ms ease;
  -o-transition:margin 800ms ease;
  -htm-transition:margin 800ms ease;
  -webkit-transition:margin 800ms ease;
 
  /* couleur de fond pour la démo */
  background-color: #fff;
  opacity: 0.8;
}

/* lorsqu'on survole le conteneur (:hover), le bloc .info change */
.conteneurpa3:hover .continfopa3 {
  margin:0; /* la marge passe à 0, et le bloc réapparait ! Comme il était en bas, il donne l'impression de monter */
}

.titreadmin {
font-family: arial;
  font-weight: bold;
  letter-spacing: 0px;
  margin-left: 15px;
  font-size: 13px;
  text-transform: uppercase;
}

.picanim {
  width: 50px;
  max-height: 50px;
}
 
  .cadr1 {
  width: 180px;
  padding: 5px;
}

  .cadr11 {
  width: 160px;
  padding: 5px;
}


  .cadr2 {
  margin-top: 3px;
  width: 180px;
  height: 47px;
  line-height: 12px;
  overflow: auto;
  text-align: justify;
  padding: 3px;
  background-color: #e8e3e4;
  border-radius: 1px solid #e8dfe1;
}

.cadr2::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff;}

.cadr2::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadr2::-webkit-scrollbar-thumb {
  background-color:  #e0cec8; 
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
-webkit-border-radius: 15px; }

.cadr22 {
  margin-top: 3px;
  width: 160px;
  height: 47px;
  line-height: 12px;
  overflow: auto;
  text-align: justify;
  padding: 3px;
  background-color: #e8e3e4;
  border-radius: 1px solid #e8dfe1;
}

.cadr22::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff;}

.cadr22:-webkit-scrollbar-track {
  background-color: none !important;  }

.cadr22::-webkit-scrollbar-thumb {
  background-color:  #e0cec8; 
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
-webkit-border-radius: 15px; }

.informations {
  text-transform: lowercase;
  overflow:auto;
  width: 280px;
  height: 100px;
  padding: 5px;
  text-align: justify;
}

 
.informations::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.informations::-webkit-scrollbar-track {
  background-color: none !important;  }

.informations::-webkit-scrollbar-thumb {
  background-color:  #e0cec8;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }


 

  .cadr3 {
  background-color: #e8e3e4;
  border-radius: 1px solid #e8dfe1;
  padding: 4px;
}

  .cadr4 {
  width: 250px;
  height:150px;
  padding: 3px;
  overflow: auto;
  text-align: justify;
}

.cadr4::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #fff; }

.cadr4::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadr4::-webkit-scrollbar-thumb {
  background-color:  #e0cec8;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }




.ong1 {
  margin-bottom: 5px !important;
  margin: 2px;
  font-size: 9px;
  height: 12px !important;
  padding: 1px;
  text-align: center;
  text-transform: uppercase;
font-family: 'Open Sans', sans-serif;
  background-color: #DEDBDB;}

.contextetour {
  text-transform: lowercase;
  padding: 5px;
  text-align: justify;
  background-color: #cfcfcf;
}

.contexte {
  text-transform: lowercase;
  overflow:auto;
  width: 284px;
  height: 96px;
  text-align: justify;
}
 
.contexte::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.contexte::-webkit-scrollbar-track {
  background-color: none !important;  }

.contexte::-webkit-scrollbar-thumb {
  background-color:  #CCC2C2;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.transcontexte {
  overflow: hidden;
  position: relative;
 }
 
 .transcontexte img {
        -moz-transition: all 1s ease-in-out;
  -webkit-transition: all1s ease-in-out;
  transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
    position:absolute;
  top:0px;
 width: 295px;
  height: 71px;
  margin-top: 24px;
  }

.transcontexte:hover img {
  -moz-transform: translate(0px, 70px);/*XX=largeur de ton image pour un  déplacement horizontal; YY=hauteur de l'image pour déplacement vertical*/
  -webkit-transform: translate(0px, 70px);
  -o-transform: translate(0px, 70px);
  -ms-transform: translate(0px, 70px);
  transform: translate(0px, 70px);
  opacity: 0;
  margin-top: 24px;
}

.top {
  padding: 6px;
}

/*ONGLETS*/

/* .systab .tab => les onglet */
.systab .tab {
  cursor: pointer;
  text-align: center;
  filter: grayscale(1);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(1);
        -o-filter: grayscale(1);
        -ms-filter: grayscale(1);
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;
}
/* .systab .tab:hover => les onglets survolés */
.systab .tab:hover {
 
}
/* .systab .tab.selected => les onglets sélectionnés */
.systab .tab.selected{
 filter: grayscale(0);
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -o-filter: grayscale(0);
        -ms-filter: grayscale(0);
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;
 
}
/* .systab .contents => les conteneurs des contenus associés aux onglets  */
.systab .contents {
  text-align:center;
}
/* style des onglets si ils sont à gauche ou à droite */
.systab.s_float .tab,.systab.s_float .tab {
  display: block;
margin-left: 30px;
}
/* flottement des conteneurs si les onglets sont à gauche où à droite */
.systab.s_float .tabs,.systab.s_float .contents {
  float: left;
 
}

.ongletpa {
  padding-top: 2px;
  padding-left: 8px;
    padding-bottom: 2px;
  text-align: left;
  font-family: 'Homenaje', cursive;
  letter-spacing: 2px;
text-transform: uppercase;
font-size: 11px;
  width: 100px;
  background-color: #e8e3e4;
  border-radius: 0px 3px 3px 0px;
}

.ongletpabis {
  padding-top: 2px;
  padding-left: 8px;
    padding-bottom: 2px;
  text-align: left;
  font-family: 'Homenaje', cursive;
  letter-spacing: 2px;
text-transform: uppercase;
font-size: 11px;
  width: 100px;
  background-color: #d7c5c6;
  border-radius: 0px 3px 3px 0px;
  margin-top: 4px !important;
  margin-bottom: 4px !important;
}

 .cadrdr {
  width: 157px;
  padding: 5px;
  background-color: #cfcfcf;
}

.ongletdrpa {
  margin-top: 6px;
  padding-top: 12px;
    padding-bottom: 12px;
    font-size:12px;
  text-align: center;
  text-transform: uppercase;
font-family: 'Open Sans', sans-serif;
  width: 167px;
  background-color: #cfcfcf;
  text-shadow: 0px 0px 2px #D9D7D2, 0px 0px 2px #D9D7D2, 0px 0px 2px #D9D7D2, 0px 0px 2px #D9D7D2;
}



.longcentre {
  margin-top: 4px;
  text-transform: lowercase;
  overflow:auto;
  width: 754px;
  height: 60px;
  padding: 4px;
  text-align: justify;
  background-color: #cfcfcf;
}

 
.longcentre::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.longcentre::-webkit-scrollbar-track {
  background-color: none !important;  }

.longcentre::-webkit-scrollbar-thumb {
  background-color: #CCC2C2;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.animcrédits {
  width: 250px;
  padding: 2px;
  text-align: justify; }

.droitee {
  width: 220px;
  padding: 2px;
  margin-bottom: 4px;
  text-align: justify;
}

/*qeel*/

.cadrepart {
  text-align: center;
  padding: 4px;
  margin-right: 8px;
}
.welcome {
 
}

#avatar_dernier_membre img {
  margin-top: 0px !important;
  width: 60px !important;
margin: 1px;
border: 1px solid #c0c0c0;
 filter: grayscale(1);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(1);
        -o-filter: grayscale(1);
        -ms-filter: grayscale(1);
 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; }

#avatar_dernier_membre img:hover {
  margin-top: 0px !important;
  width: 60px !important;
margin: 1px;
border: 1px solid #c0c0c0;
opacity: 0.7;
 filter: grayscale(0);
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -o-filter: grayscale(0);
        -ms-filter: grayscale(0);
 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; }



.membresco24 {
  margin-top: -5px !important;
  overflow: auto;
  text-transform: lowercase;
  padding: 1px;
    height: 140px;
  text-align: justify;
}

.membresco24::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.membresco24::-webkit-scrollbar-track {
  background-color: none !important;  }

.membresco24::-webkit-scrollbar-thumb {
  background-color: #CCC2C2;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.cadreqeel3::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.cadreqeel3::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadreqeel3::-webkit-scrollbar-thumb {
  background-color: #CCC2C2;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.coco::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.coco::-webkit-scrollbar-track {
  background-color: none !important;  }

.coco::-webkit-scrollbar-thumb {
  background-color: #CCC2C2;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

a.info{
position:relative;
z-index:24;
color:#000;
text-decoration:none
}
 
a.info:hover{
z-index:25;
background-color:none;
}
 
a.info span{
display: none
}
 
a.info:hover span{
display:block;
position:absolute;
top:-2em; left:-2em; width:15em;
background-color: #fff;
  border: 1px solid #eee8e3;
color:#000;
text-align: justify;
font-weight:none;
padding:5px;
}

.tourqeel {
 width: 100%;
  background-color: none;
  padding-top: 3px;
  font-size: 10px !important;
}

.hautqeel {
    font-size:10px;
  text-align: center;
  text-transform: uppercase;
 font-family: Courier New;
  letter-spacing: 1px;
  width: 780px;
  background-color: #fff;
  border: 1px solid #eee8e3;
  color: #c0c0C0;
}


.cliqq {
  letter-spacing:2px;
  font-family:times;
  font-size:15px;
  font-style:italic;
  line-height:14px;
  margin-top:4px;
text-transform: lowercase;
margin-bottom: 4px;}


.picqeel {
  width: 65px;
  height: 5px;
  margin: 2px;
  border-radius: 5px; }


.msgx {
  font-size: 15px !important;
  text-transform: uppercase;
  font-family: 'Yanone Kaffeesatz', sans-serif;
  letter-spacing: 2px;
  text-align: center;
  margin-top: 6px;
}

.userr {
  font-size: 15px !important;
  text-transform: uppercase;
  font-family: 'Yanone Kaffeesatz', sans-serif;
  letter-spacing: 2px;
  text-align: center;
  margin-top: 6px;
}

.nouv {
  text-align: center;
 font-family: 'Satisfy', cursive;
  text-transform: lowercase;
  letter-spacing: -1px;
  font-size: 22px !important;
width: 190px;
  font-style: italic;
  margin-top: -12px;
  margin-left : 15px;
}



#kaboum .row1 {
  background: none;
  max-height: 115px !important;
  overflow: auto !important;
  text-align: justify;
  font-size: 8px !important;
}

.debug td.row1 { background: none;
text-align: justify !important;
max-width: 275px !important;
    height: auto !important;}

.coco {
  margin-left: 2px !important;
  margin-right: 2px !important;
  height: 60px;
  overflow: auto;
margin: 0px !important;}



.cadreqeel1 {
width: 280px;
  height: 130px;
  padding-top: -5px;
  text-align: center;
padding: 2px;
font-size: 10px;!important}

.policeqeel {
 font-family: 'Satisfy', cursive;
  font-size: 22px;
  letter-spacing: -1px;
  margin-top: -5px;
  margin-bottom: -6px;
  text-transform: lowercase; }

.cadreqeel2 {
  text-align: center !important;
  width: 200px;
  margin-top: -10px;
}

.cadreqeel3 {
  margin-top: -10px;
  text-align: justify;
  text-transform: lowercase;
width: auto;
  height: 130px;
overflow: auto;}


.cadreqeel5 {
  text-align: center !important;
  width: 200px;
  height: auto;
  padding: 0px;
  padding: 4px;
}


.whisky {
  text-align:center;
  width: 45px;
  height: 115px;
  border: 3px solid #fff;
}

.cosmo {
  text-align:center;
 width: 45px;
  height: 115px;
  border: 3px solid #fff;
}

.beach {
  text-align:center;
width: 45px;
  height: 115px;
 border: 3px solid #fff;}

.cuba {
  text-align:center;
 width: 45px;
  height: 115px;
  border: 3px solid #fff;
}

.translateq1 {
  overflow: hidden;
  position: relative;
  background: white;
  border-radius: 5px;
  height: 40px;
  width: 130px;
  text-align: left;
  margin-bottom: 3px;
 }
 
 .translateq1 img {
        -moz-transition: all 2s ease-in-out;
  -webkit-transition: all2s ease-in-out;
  transition: all 2s ease-in-out;
  -o-transition: all 2s ease-in-out;
  -ms-transition: all 2s ease-in-out;
    position:absolute;
  top:0px;
 height: 40px;
  width: 130px;
  }

.translateq1:hover img {
  -moz-transform: translate(0px, 130px);/*XX=largeur de ton image pour un  déplacement horizontal; YY=hauteur de l'image pour déplacement vertical*/
  -webkit-transform: translate(0px, 130px);
  -o-transform: translate(0px, 130px);
  -ms-transform: translate(0px, 130px);
  transform: translate(0px, 130px);
  opacity: 0;
}

.translateq2 {
  overflow: hidden;
  position: relative;
  background: #fbf6f4;
  height: 40px;
  width: 200px;
  text-align: left;
  font-size: 9px;
 }
 
 .translateq2 img {
        -moz-transition: all 1s ease-in-out;
  -webkit-transition: all1s ease-in-out;
  transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
    position:absolute;
  top:0px;
 height: 40px;
  width: 200px;
  }

.translateq2:hover img {
  -moz-transform: translate(200px, 0px);/*XX=largeur de ton image pour un  déplacement horizontal; YY=hauteur de l'image pour déplacement vertical*/
  -webkit-transform: translate(200px, 0px);
  -o-transform: translate(200px, 0px);
  -ms-transform: translate(200px, 0px);
  transform: translate(200px, 0px);
  opacity: 0;
  text-align: center;
}

.conteneurqmdm {
  background:none;
  position:relative;
  width:100px; /* on fixe la largeur */
  height:25px; /* et la hauteur */
  overflow:hidden; /* Tout ce qui dépasse est caché ! */
}


.continfoqmdm {
  /* positionnement absolu par rapport au conteneur (qui est en relatif) */
  position:absolute;
  bottom:0; /* 0px par rapport au BAS du conteneur */
  left:0; /* 0px par rapport à la gauche du conteneur */
 
  height:25px; /* on fixe la hauteur, par exemple la même chose que notre conteneur (on peut mettre moins)*/
  width:100px;  /* on fixe la largeur, là j'ai mis "tout l'espace disponible", donc 100% */
 
  margin-bottom:-25px; /* on décale le bloc de 250px vers le bas, comme il "sort" des dimensions du conteneur, il disparait à cause du overflow hidden */
 
  /* on indique la propriété qui nécessitera une transition et le temps de transition pour tous les navigateurs */
  transition:margin 800ms ease;
  -moz-transition:margin 800ms ease;
  -o-transition:margin 800ms ease;
  -htm-transition:margin 800ms ease;
  -webkit-transition:margin 800ms ease;
 
  /* couleur de fond pour la démo */
  background:none;
  font-family: arial;
  text-align: center;
  padding-top: 6px !important;
  background-color: #fff;
}

/* lorsqu'on survole le conteneur (:hover), le bloc .info change */
.conteneurqmdm:hover .continfoqmdm {
  margin:0; /* la marge passe à 0, et le bloc réapparait ! Comme il était en bas, il donne l'impression de monter */
}

.imglast {
  width: 100px;
  margin: 1px;
  filter: grayscale(1);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(1);
        -o-filter: grayscale(1);
        -ms-filter: grayscale(1);
 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; }

.imglast:hover {
  width: 100px;
  margin: 1px;
  filter: grayscale(0);
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -o-filter: grayscale(0);
        -ms-filter: grayscale(0);
 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;
}

a.infobb{
position:relative;
color:#000;
text-decoration:none
}
 
a.infobb:hover{
}
 
a.infobb span{
display: none
}
 
a.infobb:hover span{
display:block;
position:absolute;
top:20px;
  left:-5px;
  width:160px;
  height: 47px;
padding: 3px;
  background-color: #e8e3e4;
  border-radius: 1px solid #e8dfe1;
text-align: center;
font-weight:none;
}

a.infobb2{
position:relative;
color:#000;
text-decoration:none
}
 
a.infobb2:hover{
}
 
a.infobb2 span{
display: none
}
 
a.infobb2:hover span{
display:block;
position:absolute;
top:20px;
  left:-43px;
  width:160px;
  height: 47px;
padding: 3px;
  background-color: #e8e3e4;
  border-radius: 1px solid #e8dfe1;
text-align: center;
font-weight:none;
}

a.infobb3{
position:relative;
color:#000;
text-decoration:none
}
 
a.infobb3:hover{
}
 
a.infobb3 span{
display: none
}
 
a.infobb3:hover span{
display:block;
position:absolute;
top:20px;
  left:-80px;
  width:160px;
  height: 47px;
padding: 3px;
  background-color: #e8e3e4;
  border-radius: 1px solid #e8dfe1;
text-align: center;
font-weight:none;
}

a.infobb4{
position:relative;
color:#000;
text-decoration:none
}
 
a.infobb4:hover{
}
 
a.infobb4 span{
display: none
}
 
a.infobb4:hover span{
display:block;
position:absolute;
top:20px;
  left:-119px;
  width:160px;
  height: 47px;
padding: 3px;
  background-color: #e8e3e4;
  border-radius: 1px solid #e8dfe1;
text-align: center;
font-weight:none;
}

/**slide**/
.slideshow,
.slide {
    width: 140px;
    height: 90px;
}

.slideshow {
    margin: 0;
    overflow: hidden;
  margin-top: 5px;
}

.slideshow div {
    position: relative;
    top: 0;
    left: 0;
}
   
.slide {
    margin: 0;
    overflow: auto;
   
    display: inline-block;
    vertical-align: middle;
       
    text-align: center;
    color: white;
}

.slide p {
    text-align: justify;
}
Revenir en haut Aller en bas
l'administration sans limites
avatar
l'administration sans limites
messages : 47
pseudo : step aside (caca)
avatar : camilla.
crédits : (morrigan)

age : 26
Voir le profil de l'utilisateur
http://botrchangement.forumactif.org
Lun 6 Fév - 18:35
Code:
<div align="center">
                                                                        
   <div style="margin-bottom: -20px;">
                                          <img src="http://i.imgur.com/ypwn1Ds.png" />                                   
   </div>
</div>
                                   
<table>
                                                                                                
   <tbody>
                                                                                                   
      <tr>
                                                                                                      
         <td>
                                                                                                         
            <div class="cadr1">
                                                                                                              
               <center>
                                                                                                                                                                                                                                                                                                               
                  <div class="systab">
                                                                                                                                                                                                                                                                                                                    
                     <div class="selected">
                                                                                                                                                                                          <span>    <img src="http://68.media.tumblr.com/fa5e8652e4e27bba1c790e29c71fcc80/tumblr_inline_ojn3ocIPIx1tm50qw_500.gif" class="picanim" />  </span>                                                                                                                                               
                        <div class="ssstaff">
                                                                                                                                                                                                                                                                    
                           <div class="policepseudo">
                                                                                                                                                                        cola deketh  (mama)                                                                                                                                         
                           </div>
                                                                               <uu>administratrice présente</uu>          <br />                                                                          <a href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=4">  la joindre</a> ▪ <em><a href="http://heybrooklyn.forumactif.com/u4">voir son profil</a></em>                                                                                                                                                                 
                        </div>
                                                                                                                                                                                                                                                                 
                     </div>
                                                                                                                                                                                                                                                                                                                                                        
                     <div>
                                                                                                                                                                                          <span>    <img src="http://68.media.tumblr.com/4c7d0d0022aeba4e1e8d44b249eb0a70/tumblr_inline_o9yzlk2iZe1smwbxg_500.gif" class="picanim" />    </span>                                                                                                                                           
                        <div class="ssstaff">
                                                                                                                                                                                                                                                                  
                           <div class="policepseudo">
                                                                                                                                                                            bo sanders  (caca)                                                                                                                                             
                           </div>
                                                                             <uu>administratrice présente</uu>          <br />                                                                                                <a href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=188">  la joindre</a> ▪ <em><a href="http://heybrooklyn.forumactif.com/u188">voir son profil</a></em>                                                                                                                   
                        </div>
                                                                                                                                                                                                                                                               
                     </div>
                                                                                                                                                                                                                                                                                                      
                     <div>
                                                                                                                                                                                        <span>    <img src="http://68.media.tumblr.com/a57b72b2067ba42ea0f91a9fbbffe809/tumblr_inline_ojfbdzFkGn1uo61z8_500.gif" class="picanim" />    </span>                                                                                                                                           
                        <div class="ssstaff">
                                                                                                                                                                                                                                                                  
                           <div class="policepseudo">
                                                                                                                                                                            kodi abberline (cla)                                                                                                                                             
                           </div>
                                                                             <uu>administratrice absente</uu>          <br />                                                                                                <a href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=152">  la joindre</a> ▪ <em><a href="http://heybrooklyn.forumactif.com/u152">voir son profil</a></em>                                                                                                               
                        </div>
                                                                                                                                                                                                                                                               
                     </div>
                                                                                                                                                                                                                                                                                                                                                      
                  </div>
                                                                                                                 
               </center>
                                                                                                                        
               <div class="cadr2">
                                                                botr est l'entière responsabilité de ses administratrices. toute copie entière ou partielle est interdite. merci de respecter les membres et leur écriture.                                           
               </div>
                                                                                                              
            </div>
                                                                                   
         </td>
                                                                                
         <td>
                                                                                                                   
            <div class="cadr3">
                                                                                                          
               <div class="cadr4">
                                                                  des cartons qui s'empilent, une page qui se tourne. léger sourire sur son visage, clayr sent que son coeur se sert. une aventure, dans cet appartement. des moments forts, avec ses colocataires. clayr, elle a rencontré quelqu'un. un artiste de rue, qui garnit brooklyn de ses créations. clayr, elle est tombée sous son charme en une nuit d'été étoilée. elle n'avait pas besoin de beaucoup plus pour que ce brun devienne sa nouvelle source d'inspiration. une galerie remplie de ses créations, à son nom, et voilà qu'elle quitte sa vie de jeune artiste pour vivre celle d'une jeune femme aimée et épanouie. un nouvel appartement, qu'elle chérie déjà énormément. et un regard, un câlin a ses colocataires. il faut partir, sans se retourner. il faut suivre ses rêves, épaulée par une ville qui répond à toutes ses attentes. suivie de près par une communauté qui s'investit, qui aide. des voisins qui descendent des cartons, pour qu'un passant ramasse une peluche tombée d'un carton mal fermé. une communauté qui fait sourire clayr, ne pensant pas qu'elle trouverait une réelle famille, à brooklyn. baiser sur les lèvres de son brun, pour un déménagement émouvant. les yeux qui brillent, à l'assaut d'un nouveau quartier. a l'assaut d'une nouvelle vie, mais toujours à brooklyn.                                               
               </div>
                                                                                                          
            </div>
                                                                                                                                               
         </td>
                                                                                  
         <td>
                                                                             
            <div class="ongletpa">
                                                                                                                                                                                                                                                                                                                                       <a href="http://heybrooklyn.forumactif.com/t16-le-reglement">                                réglement                                                                              </a>                                                                                                                                                                                                                                                                                                   
            </div>
                                                                           
            <div class="ongletpabis">
                                                                                                                                                                                                                                                                                                                                       <a href="http://heybrooklyn.forumactif.com/t23-le-bottin-des-avatars">                                bottin                                                                            </a>                                                                                                                                                                                                                                                                                                   
            </div>
                                                                             
            <div class="ongletpa">
                                                                                                                                                                                                                                                                                                                                       <a href="http://heybrooklyn.forumactif.com/f9-looking-for-you">                                scénarios                                                                        </a>                                                                                                                                                                                                                                                                                                   
            </div>
                                                                           
            <div class="ongletpabis">
                                                                                                                                                                                                                                                                                                                                       <a href="http://heybrooklyn.forumactif.com/f10-keep-me-close">                              pré-liens                                                                            </a>                                                                                                                                                                                                                                                                                                   
            </div>
                                                                           
            <div class="ongletpa">
                                                                                                                                                                                                                                                                                                                                       <a href="http://heybrooklyn.forumactif.com/f108-integration-bar">                                invités                                                                    </a>                                                                                                                                                                                                                                                                                                   
            </div>
                                                                           
            <div class="ongletpabis">
                                                                                                                                                                                                                                                                                                                                       <a href="http://heybrooklyn.forumactif.com/f12-meet-me-here">        présentations                                  </a>                                                                                                                                                                                                                                                                                                   
            </div>
                                                                         
            <div class="ongletpa">
                                                                                                                                                                                                                                                                                                                                       <a href="http://heybrooklyn.forumactif.com/f91-golden-book">                              livre d'or                                                                  </a>                                                                                                                                                                                                                                                                                                   
            </div>
                                                                     
            <div class="ongletpabis">
                                                                                                                                                                                                                                                                                                                                       <a href="http://heybrooklyn.forumactif.com/t650-liste-des-dcs">      multi-comptes                                  </a>                                                                                                                                                                                                                                                                                                   
            </div>
                                                                           
         </td>
                                                                            
      </tr>
                                                                               
   </tbody>
</table>
<table>
                                                        
   <tbody>
                                                           
      <tr>
                          
         <td>
                         
            <div class="cadr11">
                     <a class="infobb" href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=184"><img src="https://i.imgbox.com/AlOUA4Vx.png" class="funpic" /><span></span></a>
               <div class="policepseudo">
                    yoan michalka 
               </div><a class="infobb" href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=184"><span> <em>kenny, team animation</em> <br /> ( à votre entière disposition )                                </span></a>    <a class="infobb2" href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=466">      <img class="funpic" src="https://i.imgbox.com/tNlKMfFO.png" />      <span>  </span></a>
               <div class="policepseudo">
                    kira abberline 
               </div><a class="infobb2" href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=466"><span> <em>louise, team animation</em> <br /> ( à votre entière disposition )                                </span></a>    <a class="infobb3" href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=529">    <img class="funpic" src="https://i.imgbox.com/KSeA9az4.png" />      <span>  </span></a>
               <div class="policepseudo">
                    flo sanders 
               </div><a class="infobb3" href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=529"><span> <em>amandine, team animation</em> <br /> ( à votre entière disposition )                                </span></a>        <a class="infobb4" href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=1106">    <img class="funpic" src="https://i.imgbox.com/5MsCW9Th.png" />      <span>  </span></a>
               <div class="policepseudo">
                    mattis cook 
               </div><a class="infobb4" href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=1106"><span> <em>margaux, team animation</em> <br /> ( à votre entière disposition )                                </span></a>                                                             
            </div>
                     
            <div class="cadr22">
                   réservation de 3 jours dans la fiche de présentation qui doit être terminée en 1 semaine, initiales interdites dans les pseudos, avertissement de suppression après 2 semaines sans poster. pas d'invités dans le flood. merci de répondre à tous vos sujets.   
            </div>
                     
         </td>
                                            
         <td>
                                           
            <div class="conteneurpa">
                                                                                                                                                                                                                   <img src="http://i.imgur.com/7m9OslB.png" />                                                                                                                                                                                                   
               <div class="continfopa">
                                                                                                                                                                                           
                  <div style="margin-top: 3px;">
                                                                                                                                       <uu>membre du mois 1</uu>  <br /> <a href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=4">  la joindre ▪ <em></em></a><em><a href="http://heybrooklyn.forumactif.com/u4">voir son profil</a></em>                                                                                                 
                  </div>
                                                                                                                                                                                                                                                           
               </div>
                                                                                                                                                                                                                                                                                                                                                                                                                      
            </div>
                                   
            <div style="margin-top:3px;">
                                      
               <div class="conteneurpa">
                                                                                                                                                                                                                      <img src="http://i.imgur.com/7m9OslB.png" />                                                                                                                                                                                                   
                  <div class="continfopa">
                                                                                                                                                                                              
                     <div style="margin-top: 3px;">
                                                                                                                                          <uu>membre du mois 2</uu>  <br /> <a href="http://heybrooklyn.forumactif.com/privmsg?mode=post&u=4">  la joindre ▪ <em></em></a><em><a href="http://heybrooklyn.forumactif.com/u4">voir son profil</a></em>                                                                                                 
                     </div>
                                                                                                                                                                                                                                                              
                  </div>
                                       
               </div>
                                                                                                                                                                                                                                                                                                                                                                                                                      
            </div>
                                                                                                                                           
            <div class="cadrepart">
                                                                                                                                                                               <a href="http://www.fake-lover.com/"> <span style="font-size: 18px;">♔</span></a>  <a href="http://littleblackdress.frbb.net/"> <span style="font-size: 18px;">♖</span></a> <a href="http://hungcalf.forumactif.com/"> <span style="font-size: 18px;">♘</span></a> <a href="http://www.loveiscomplicated.com/"> <span style="font-size: 18px;">♕</span></a> <a href="http://perfectdisorder.forumactif.org/"> <span style="font-size: 18px;">♗</span></a> <a href="http://peoples-glory.forumactif.ws/"><span style="font-size: 18px;">♞</span></a> <br />                                                    <a href="http://heybrooklyn.forumactif.com/f62-some-friends"><strong>devenir partenaires</strong>              </a>                                                                                                                                                               
            </div>
                                                                                                                                         
         </td>
                                                              
         <td>
                                                                 
            <div class="cadr3">
                                                                  
               <div class="informations">
                                                                                                      <c1>février 2017</c1> version saint valentin, réalisée par marie (design) et camille (codes). <c2>janvier 2017</c2> ajout de margaux (mags) à l'équipe animation. <c1>may 2016</c1> changement de l'équipe administrative et ajout de trois personnes à l'équipe animation : kenny (fancy), louise (reckless times) et amandine (mourning dove). <c2>may 2015</c2> ouverture de botr par marie (forward), camille (step aside), clara (freak bitch), victoria (morning wood) et romane (breakfast club).                                                                                 
               </div>
                                                                  
            </div>
                                                                 
         </td>
                                                          
         <td>
                                                             
            <center>
                                       <uu>the award winners</uu>                       
            </center>
                                                           
            <div id="slideshow" class="slideshow">
                                                                                
               <div id="slideshow-container">
                                                                                       
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/ZlT5lDo6.png" />                                     
                  </div>
                                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/JJSudFWB.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/s9662wuf.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/Gtw8e24s.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/kjCmLomV.png" />                                     
                  </div>
                                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/YOlRgFNW.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/F3MAMLdl.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/AEtuSfAQ.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/wacdJnnS.png" />                                     
                  </div>
                                                                         
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/YzteAcZO.png" />                                     
                  </div>
                                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/igGyFx53.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/ChuzGsvk.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/pMQ4JPSf.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/XbrCA4uP.png" />                                     
                  </div>
                                                                         
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/RIWyw3u8.png" />                                     
                  </div>
                                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/gURmfRWn.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/LJWwfBOE.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/GmHNczYf.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/y3tIeeqg.png" />                                     
                  </div>
                                                                           
                  <div class="slide">
                                                                             <img src="https://i.imgbox.com/Vvnu3gou.png" />                                     
                  </div>
                                                                                   
               </div>
                                                              
            </div>
                                                           
         </td>
                                                              
      </tr>
                                                           
   </tbody>
</table>
Revenir en haut Aller en bas
l'administration sans limites
avatar
l'administration sans limites
messages : 47
pseudo : step aside (caca)
avatar : camilla.
crédits : (morrigan)

age : 26
Voir le profil de l'utilisateur
http://botrchangement.forumactif.org
Mer 18 Oct - 9:25
TEMPLATE PROFIL OUT

Code:
  <table class="forumline" border="0" cellspacing="1" cellpadding="0" align="center">
   <tr>
          <td colspan="2" >
            <center><div class="toupro"> <h1 class="h_member">{L_VIEWING_PROFILE}</h1>
      <table width="100%" class="contentProfilTable">
         <tr>  <!-- BEGIN contact_field -->
            <td class="contentProfil"> 
               <span class="gen" style="font-weight:bold;">{contact_field.CONTENT}</span>
            </td>
            <!-- END contact_field -->
         </tr>
      </table>
                  </div></center>
      </td><tr>
 
      <td class="row1" align="center" valign="top" height="120">
         <table width="100%" border="0" cellspacing="1" cellpadding="0">
            <tr>
               <center><uu> <span class="gen">{USER_ONLINE}</span> </uu>
               <div style="margin-bottom:2px;border:1px solid #c0c0c0;width:200px;"></div></center>
               <span class="gen">{AVATAR_IMG}</span>
            </tr><br/>

<!-- BEGIN switch_auth_user -->
            <tr><div style="margin-top:2px;margin-bottom:2px;border:1px solid #c0c0c0;width:200px;"></div>
               <ll> <span class="gen">{ADMINISTRATE_USER} {BAN_USER}</span> </ll>
            </tr>
         </table>
<!-- END switch_auth_user -->
            </td>
      <td class="row1" rowspan="3" valign="top">
         <div class="toupro2">
          <table width="100%" border="0" cellspacing="1" cellpadding="0">
            <tr>
               <span class="gen"><uu>{L_LAST_VISITED}:  </uu></span><span class="gen" style="font-size:10px;">{LAST_VISIT_TIME}</span>
            </tr> <br/>
            <!-- BEGIN switch_dhow_mp -->
            <tr>
               <span class="gen"><ll>{L_PRIVATE_MSG}:  </ll></span><span class="gen" style="font-size:10px;">{PRIVATE_MSG}<br/><br/></span>
            </tr>
            <!-- END switch_dhow_mp -->
            <!-- BEGIN profile_field -->
            <tr>
                                  <td><table><td>
                                    <upq><span class="gen">{profile_field.LABEL}</span></upq></td>
                                  <td>
                                    <upq>{profile_field.CONTENT}</upq>
                                    </td></table>
                                  </td>
            </tr>
            <!-- END profile_field -->
         </table>
         </div>
      </td>                       
   
    <!-- BEGIN profile_field -->
      </tr><tr>
      <td colspan="2">
<center>
  <table width="80%" align="center">

          <!-- BEGIN profil_type_user_posts -->
                          <center><table>
                            <tr><td class="profilTopPost">
                               <ll><a rel="nofollow" class="genmed" href="/st/{PUSERNAME}">{L_SEARCH_USER_POSTS}</a></ll>
                              </td><td class="profilTopPost">
            <ll><a rel="nofollow" class="genmed" href="/sta/{PUSERNAME}">{L_TOPICS}</a></ll>
                              </td><td class="profilTopPost">
            <ll><a rel="nofollow" class="genmed" href="/spa/{PUSERNAME}">{L_POSTS}</a></ll>
                              </td></tr>
                            </table></center>
                          <!-- END profil_type_user_posts -->
  </table>
 </center>
      </td>

<!-- END profile_field -->
          </tr>
<!-- BEGIN switch_rpg -->
   
   <tr>
      <td colspan="2" align="center" class="row1">
         {U_ADMIN_RPG}
      </td>
   </tr>
<!-- END switch_rpg -->

  </table>
<script src="{JS_DIR}jquery/json/jquery.json-1.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
   $(document).ready(function(){
      $('[id^=field_id]').each(function(){
         if ( $(this).find('.field_editable').is('span, div') )
         {
            $(this).hover(function()
            {
               if( $(this).find('.field_editable.invisible').is('span, div') )
               {
                  $(this).find('.field_editable').prev().addClass('ajax-profil_hover').parent().addClass('ajax-profil_parent').append('<div class="ajax-profil_edit"><img src="{AJAX_EDIT_IMG}" /></div>');
                  $(this).find('.ajax-profil_edit').attr({
                        alt: "{L_FIELD_EDIT_VALUE}",
                        title: "{L_FIELD_EDIT_VALUE}"
                     }).click(function(){
                     $(this).prev().prev().removeClass('ajax-profil_hover').addClass('invisible').next().removeClass('invisible').append('<img src="{AJAX_VALID_IMG}" class="ajax-profil_valid" />').find('input,select');
                     $(this).prev().find('.ajax-profil_valid').attr({
                        alt: "{L_VALIDATE}",
                        title: "{L_VALIDATE}"
                     }).click(function(){
                        var content = new Array();
                        $(this).parent().find('[name]').each(function(){
                           var type_special = $(this).is('input[type=radio],input[type=checkbox]');
                           if ( (type_special && $(this).is(':checked')) || !type_special )
                           {
                              content.push(new Array($(this).attr('name'), $(this).attr('value')));
                           }
                        });
                        var id_name = $(this).parents('[id^=field_id]').attr('id');
                        var id = id_name.substring(8, id_name.length);
                        $.post(
                           "{U_AJAX_PROFILE}",
                           {id:id,user:"{CUR_USER_ID}",active:"{CUR_USER_ACTIVE}",content:$.toJSON(content),tid:"{TID}"},
                           function(data){
                              $.each(data, function(i, item){
                                 $('[id=field_id' + i + ']').find('.field_uneditable').html(item).end().find('.ajax-profil_valid').remove().end().find('.field_editable').addClass('invisible').end().find('.field_uneditable').removeClass('invisible');
                              });
                           },
                           "json"
                        );
                     });
                     $(this).remove();
                  });
               }
            },function()
            {
               if( $(this).find('.field_editable.invisible').is('span, div') )
               {
                  $(this).find('.field_editable').prev().removeClass('ajax-profil_hover');
                  $(this).find('.ajax-profil_edit').remove();
               }
            });
         }
      });
   });
//]]>
</script>

<script type="text/javascript">
                    var elements = document.getElementsByClassName("gen");
  for(var i=0; i<elements.length; i++) {
    elements[i].innerHTML = elements[i].innerHTML.replace(/&nbsp;-/,"");
}
  </script>
 
<script type="text/javascript">
                    var elements = document.getElementsByClassName("h_member");
  for(var i=0; i<elements.length; i++) {
    elements[i].innerHTML = elements[i].innerHTML.replace(/Voir le profil :/,"");
}
  </script>
  <script type="text/javascript">
                    var elements = document.getElementsByClassName("genmed");
  for(var i=0; i<elements.length; i++) {
    elements[i].innerHTML = elements[i].innerHTML.replace(/Trouver tous les sujets ouverts par/,"");
    elements[i].innerHTML = elements[i].innerHTML.replace(/:/,"");
}
  </script>
 

_________________
    ☾ you can take many pictures, my look will never change when you're looking at me. i'm attached to your love, for ever and ever. ♡
Revenir en haut Aller en bas
l'administration sans limites
avatar
l'administration sans limites
messages : 47
pseudo : step aside (caca)
avatar : camilla.
crédits : (morrigan)

age : 26
Voir le profil de l'utilisateur
http://botrchangement.forumactif.org
Mer 18 Oct - 10:42
Code:
            <center><div class="toupro"> <h1 class="h_member">{L_VIEWING_PROFILE}</h1></div>


 <table width="81%" class="contentProfilTable">
         <tr>  <!-- BEGIN contact_field -->
            <td class="contentProfil"> 
               <span class="gen" style="font-weight:bold;">{contact_field.CONTENT}</span>
            </td>
            <!-- END contact_field -->
         </tr>
      </table>
   
             
  </center>
      
<center><div class=""><table width="81%" class="forumlineprofil">
 
 
 
  <tr><td width="20%">
               <center><uu> <span class="gen">{USER_ONLINE}</span> </uu>
               <div style="margin-bottom:2px;border:1px solid #c0c0c0;width:200px;"></div></center>
               <span class="gen">{AVATAR_IMG}</span>



<!-- BEGIN switch_auth_user -->
            
            <center><div style="margin-top:2px;margin-bottom:2px;border:1px solid #c0c0c0;width:200px;"></div>
  <ll> <span class="gen">{ADMINISTRATE_USER} {BAN_USER}</span> </ll></center>
            

<!-- END switch_auth_user -->
           
</td>
<td width="80%">
<span class="gen"><uu>✓ {L_LAST_VISITED}:  </uu></span><span class="gen" style="font-size:10px;">{LAST_VISIT_TIME}</span>
  <br />
            <!-- BEGIN switch_dhow_mp -->
            
<span class="gen"><uu>✓ {L_PRIVATE_MSG}:  </uu></span><span class="gen" style="font-size:10px;">{PRIVATE_MSG}<br/><br/></span>
            
            <!-- END switch_dhow_mp -->
            <!-- BEGIN profile_field -->
            
                        <table style="margin-left:2px;line-height:12px;font-size:9px;">  <td>
                                    <uu><span class="gen">{profile_field.LABEL}</span></uu></td>
                                  <td>
                                    <upq>{profile_field.CONTENT}</upq>
                            </td>
                        </table>
                               
            <!-- END profile_field -->

   </td>
  </tr></table>
  </div></center>
    <!-- BEGIN profile_field -->



          <!-- BEGIN profil_type_user_posts -->
                          <center><table width="81%">
                            <tr><td class="profilTopPost">
                               <ll><a rel="nofollow" class="genmed" href="/st/{PUSERNAME}">{L_SEARCH_USER_POSTS}</a></ll>
                              </td><td class="profilTopPost">
            <ll><a rel="nofollow" class="genmed" href="/sta/{PUSERNAME}">{L_TOPICS}</a></ll>
                              </td><td class="profilTopPost">
            <ll><a rel="nofollow" class="genmed" href="/spa/{PUSERNAME}">{L_POSTS}</a></ll>
                              </td></tr>
                            </table></center>
                          <!-- END profil_type_user_posts -->



 
<!-- END profile_field --><br/><br/>
<!-- BEGIN switch_rpg -->
   
   
         {U_ADMIN_RPG}
      
<!-- END switch_rpg -->

<script src="{JS_DIR}jquery/json/jquery.json-1.3.min.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
   $(document).ready(function(){
      $('[id^=field_id]').each(function(){
         if ( $(this).find('.field_editable').is('span, div') )
         {
            $(this).hover(function()
            {
               if( $(this).find('.field_editable.invisible').is('span, div') )
               {
                  $(this).find('.field_editable').prev().addClass('ajax-profil_hover').parent().addClass('ajax-profil_parent').append('<div class="ajax-profil_edit"><img src="{AJAX_EDIT_IMG}" /></div>');
                  $(this).find('.ajax-profil_edit').attr({
                        alt: "{L_FIELD_EDIT_VALUE}",
                        title: "{L_FIELD_EDIT_VALUE}"
                     }).click(function(){
                     $(this).prev().prev().removeClass('ajax-profil_hover').addClass('invisible').next().removeClass('invisible').append('<img src="{AJAX_VALID_IMG}" class="ajax-profil_valid" />').find('input,select');
                     $(this).prev().find('.ajax-profil_valid').attr({
                        alt: "{L_VALIDATE}",
                        title: "{L_VALIDATE}"
                     }).click(function(){
                        var content = new Array();
                        $(this).parent().find('[name]').each(function(){
                           var type_special = $(this).is('input[type=radio],input[type=checkbox]');
                           if ( (type_special && $(this).is(':checked')) || !type_special )
                           {
                              content.push(new Array($(this).attr('name'), $(this).attr('value')));
                           }
                        });
                        var id_name = $(this).parents('[id^=field_id]').attr('id');
                        var id = id_name.substring(8, id_name.length);
                        $.post(
                           "{U_AJAX_PROFILE}",
                           {id:id,user:"{CUR_USER_ID}",active:"{CUR_USER_ACTIVE}",content:$.toJSON(content),tid:"{TID}"},
                           function(data){
                              $.each(data, function(i, item){
                                 $('[id=field_id' + i + ']').find('.field_uneditable').html(item).end().find('.ajax-profil_valid').remove().end().find('.field_editable').addClass('invisible').end().find('.field_uneditable').removeClass('invisible');
                              });
                           },
                           "json"
                        );
                     });
                     $(this).remove();
                  });
               }
            },function()
            {
               if( $(this).find('.field_editable.invisible').is('span, div') )
               {
                  $(this).find('.field_editable').prev().removeClass('ajax-profil_hover');
                  $(this).find('.ajax-profil_edit').remove();
               }
            });
         }
      });
   });
//]]>
</script>

<script type="text/javascript">
                    var elements = document.getElementsByClassName("gen");
  for(var i=0; i<elements.length; i++) {
    elements[i].innerHTML = elements[i].innerHTML.replace(/&nbsp;-/,"");
}
  </script>
 
<script type="text/javascript">
                    var elements = document.getElementsByClassName("h_member");
  for(var i=0; i<elements.length; i++) {
    elements[i].innerHTML = elements[i].innerHTML.replace(/Voir le profil :/,"");
}
  </script>
  <script type="text/javascript">
                    var elements = document.getElementsByClassName("genmed");
  for(var i=0; i<elements.length; i++) {
    elements[i].innerHTML = elements[i].innerHTML.replace(/Trouver tous les sujets ouverts par/,"");
    elements[i].innerHTML = elements[i].innerHTML.replace(/:/,"");
}
  </script>
 

_________________
    ☾ you can take many pictures, my look will never change when you're looking at me. i'm attached to your love, for ever and ever. ♡
Revenir en haut Aller en bas
l'administration sans limites
avatar
l'administration sans limites
messages : 47
pseudo : step aside (caca)
avatar : camilla.
crédits : (morrigan)

age : 26
Voir le profil de l'utilisateur
http://botrchangement.forumactif.org
Mer 18 Oct - 13:41
Code:

  display:table-cell!important;

_________________
    ☾ you can take many pictures, my look will never change when you're looking at me. i'm attached to your love, for ever and ever. ♡
Revenir en haut Aller en bas
l'administration sans limites
avatar
l'administration sans limites
messages : 47
pseudo : step aside (caca)
avatar : camilla.
crédits : (morrigan)

age : 26
Voir le profil de l'utilisateur
http://botrchangement.forumactif.org
Mer 18 Oct - 19:00
CSS

Code:
/* général */
a { text-decoration: none; }
a {text-decoration: none;}
a:link {text-decoration: none;}
a:hover {text-decoration: none!important;}
tr.post span.gensmall { display: none; }
body.chatbox {background-color:#F7F5F4;}

input.liteoption {
border: 1px solid #c0c0C0;
background-position: top;
}
input.mainoption {
border: 1px solid #c0c0C0;
background-position: top;
}

/*BUG DU OU*/
.fb_or {
  font-size : 0px;
  visibility: hidden;
}

/*BUG DU OU*/
.mt10{
  font-size : 0px;
  visibility: hidden;
  width : 0px ;
  height : 0 px;
}

.bodylinewidth .bodyline > table:first-child tr:first-child > td span.gen,
.bodylinewidth .bodyline > table:first-child tr:first-child > td br,
.bodylinewidth .bodyline > table:first-child tr:first-child > td div.maintitle
{ display: none }

    .backannonce {background-color:#fff;}

form {
  font-size: 10px;
}

img.emojione {
max-width: 7px!important;
}

.field_uneditable img {
  max-width : 145px !important ;
  margin-top: 4px;
}

.selectCode { float:right;
  text-transform: lowercase;
  font-size: 11px;
  font-style: italic;
 color: #81594F;
  cursor:pointer; }



hr { border-color: #dde7dd; }

body{
  margin-top: -10px;
  margin-bottom: 0px;
}

.bodyline {
padding: 0px;
}

/* réponse rapide */
.sceditor-container.ltr.sourceMode {
  margin-top: 5px !important;
  background-color: #fff !important;
  border: 0px solid #fff !important;
  /*là où on écrit*/
}
.sceditor-container.ltr.wysiwygMode {
  margin-top: 5px !important;
  border: 0px solid #fff !important;
}

div.sceditor-group {
background-color: #f0edeb !important;
  text-align: justify;
  border: 0px solid #fff !important;
  /*contour groupes*/
}

body div.sceditor-toolbar {
border-bottom: 1px solid #fff !important;
  background-color: #f5f2eb !important;
}

a.sceditor-button {
 background-color:#faf8f5 !important;
  border: 0px solid #fff !important;
  width: 15px;
  text-align: center !important;
} /*intérieur groupe*/




.postbody {
    text-align:justify;
  font-size: 12px;
  padding-left: 2px;
  padding-right: 4px;
  max-width: 750px;
}

/*bottin*/
free {
font-family: arial;
font-style: italic;
text-transform: uppercase;
font-size: 10px;}

taken { font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 10px;
  color: #61453E; }

resa { font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 10px;
  color: #D4AB90; }

scena { font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 10px;
  color: #8c5f3b; }

/* toolbar */
div#fa_search {display:none!important;}
span#fa_share {display:none!important;}
a#fa_welcome {display:none!important;}
#fa_toolbar {
  width: 600px;
  margin: auto;
  left: none;
  right: none;
  background-color: transparent !important;  /* Rend transparent le fond principal */
  text-transform: uppercase;
  font-family: 'Roboto Condensed', sans-serif!important;
  letter-spacing: 1px;
font-size: 12px;
  border: none!important;
}

ul#notif_list {  text-transform: lowercase!important;
border: none!important;
 font-family: verdana!important;
letter-spacing: 0px!important;}

div.fa_notification { text-transform: lowercase!important;
border: none!important;
 font-family: verdana!important;
letter-spacing: 0px!important;}


#fa_toolbar #fa_hide{
  background-color:  transparent !important;
  background-image: url(http://image.noelshack.com/fichiers/2014/06/1391771402-x.png) !important;
  background-repeat: no-repeat;
  background-position: center center;
}

#fa_toolbar_hidden #fa_show{
    background-color:  #F0EBEC !important;
  background-image: url(http://image.noelshack.com/fichiers/2014/06/1391771402-x.png) !important;
  background-repeat: no-repeat;
  background-position: center center;
}


.code {
  padding: 2px;
  color: #b08d71;
  background-color: #fcfaf7 !important;
}

.quote {
  padding: 4px;
  border: 1px solid #f0edeb!important;
  max-width: 500px !important;
  background-color: #fff !important;
}

.quote:hover {
  padding: 4px;
  border: 1px solid #f0edeb!important;
  max-width: 500px !important;
  color: #6B8568;
  background-color: #fff !important;
}

.spoiler_closed{ /*Spoiler fermé*/
 
    }

.spoiler_content{ /*Spoiler ouvert*/
 padding: 3px;
    }
 
#fa_ticker_block
{ width:130px;
}

#fa_ticker
{ width:130px;
}

#fa_ticker_container
{ width:130px;
}

.annonceé {
  font-size: 12px !important;
  text-align: left;
font-family: 'Open Sans', sans-serif;
}


/* barre nav */
div#nav_forum_1{
 position: fixed;
  display:block;
  bottom: 150px !important;
right:-20px !important;
  text-align: left;
  color: #000;
padding: 0px;
  }


.vv {
  font-family: 'Roboto Condensed', sans-serif;
  text-transform: uppercase;
  font-size: 10px;
letter-spacing: 2px;

}

.vv:hover {
  font-family: 'Roboto Condensed', sans-serif;
  text-transform: uppercase;
  font-size: 10px;
letter-spacing: 2px;
  font-style: italic;
}

.vv2 {
 font-family: 'Roboto Condensed', sans-serif;
  text-transform: uppercase;
  font-size: 10px;
letter-spacing: 2px;

}

.titre {
color : #000 ;
  font-family: 'Satisfy', cursive;
  letter-spacing: -2px;
  font-size: 20px;
  text-transform: lowercase;
}

.titrep {
color : #000 ;
  font-family: 'Satisfy', cursive;
  letter-spacing: -1px;
  font-size: 18px;
  text-transform: lowercase;
}


/* petits titres */
c1 {font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 10px;
  color: #d4d0c5;
  text-shadow:0 0 1px #FFF;
}

c2 { font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 10px;
  color: #e8dacf;
text-shadow:0 0 1px #FFF;
}

uu {font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 10px;
  color: #d4d0c5;
}

uupa {font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 0px;
text-transform: uppercase;
font-size: 9px;
  color: #B08D71;}

er {font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 10px;}

ll {font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 10px;
  color: #e8dacf;
}

.toptop h2 {font-family: 'Cedarville Cursive', cursive;
  letter-spacing: 1px;
text-transform: lowercase;
font-size: 20px; }

.table-title{
font-size: 1,5em;
}

upq {width: 20px !important;
  font-family: times;
  letter-spacing: 1px;
text-transform: lowercase;
font-size: 10px;
  color: #946672;
font-style: italic;}

/* barre nav */
.mainmenu img { display: none; }

div#nav_forum_1{
 position: fixed;
  display:block;
  bottom: 100px;
right:50px;
  text-align: left;
  color: #000;
padding: 20px;
  }


/* schroll effect */
.elevator {
  width: 400px;
  height: 100px;
 overflow : auto; }

.elevator::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #f0edeb; }

.elevator::-webkit-scrollbar-track {
  background-color: none !important;  }

.elevator::-webkit-scrollbar-thumb {
  background-color: #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

/* catégories */

.ListeSousForums a {
  text-align: left;
  font-family: 'Pathway Gothic One', cursive;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 11px;
}

.sousforum::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #f0edeb; }

.sousforum::-webkit-scrollbar-track {
  background-color: none !important;  }

.sousforum::-webkit-scrollbar-thumb {
  background-color: #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.sousforum {
  margin-left: 8px !important;
  margin-top: 1px !important;
  width: auto !important;
  height: 13px !important;
    padding: 3px;
  overflow: auto;
  align: left !important;
text-align: left;
font-family: 'Pathway Gothic One', cursive;
  letter-spacing: 1px !important;
text-transform: uppercase !important;
font-size: 11px !important;
background-color: #f2e8e1;
border: 1px solid #eaded5;}

.zz1 {
  width: 63px;
  height: 60px;
 background-color:  #f0edeb;
  border: 1px solid #f0edeb;
  margin-left: -1px;
  padding: 4px;
  margin-top: 0px !important;
  height: 10px !important;
  text-align: center !important;
 font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 8px;
  margin-bottom: -2px;
}
.zz {
  width: 82px;
  height: 60px;
 background-color:  #f0edeb;
  border: 1px solid #f0edeb;
  margin-left: -1px;
  padding: 4px;
  margin-top: 0px !important;
  height: 10px !important;
  text-align: center !important;
font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 8px;
  margin-bottom: -2px;
}

.forumlink {
font-family: 'News Cycle', sans-serif;
  letter-spacing: 1px;
  margin-top: 0px;
  margin-left: 0px;
  text-transform: lowercase;
  font-size: 12px;
  padding-bottom: 2px!important;
}

.lastpost-avatar {
float: left;
padding: 0px;
}

.lastpost-avatar img {
 border-radius: 0px !important;
  border: 4px solid #f2f0ef !important;
  margin-top: 0px;
height: 76px;
width: auto;
  filter: grayscale(1);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(1);
        -o-filter: grayscale(1);
        -ms-filter: grayscale(1);
 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;
}

.lastpost-avatar img:hover {
  border-radius: 0px !important;
    border: 4px solid #E6E4DF !important;
  opacity: 0.8;
  margin-top: 0px;
height: 76px;
width: auto;
  filter: grayscale(1);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(1);
        -o-filter: grayscale(1);
        -ms-filter: grayscale(1);
  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;
}

.cate {
  width: 470px;
  height: 42px;
  line-height: 10px !important;
  overflow: auto;
  text-align: justify;
  text-transform: lowercase;
  font-size: 9px!important;
}

.cadrecate1 {
  width: 175px;
}

.cadrecate2 {
  width: 140px;
  font-size: 10px;
}

.cate1 {
  width: 470px;
  height: auto;
  padding: 8px;
  margin-top: 3px !important;
  margin-left: 8px !important;
    background-color: #faf8f7;
  border: 1px solid #f0edeb;

}

.cate11 {
  padding: 2px;
    height: 85px;
  margin-top: 0px !important;
  height: 100px;
  text-transform: lowercase;
    background-color: #faf8f7;
  border: 1px solid #f0edeb;

}

.derniersmessages {
    background-color: #faf8f7;
  border: 1px solid #f0edeb;
  text-transform: lowercase;
  height: 57px;
  padding-top: 0px!important;
  padding-right: 5px!important;
  padding-left: 5px!important;
  padding-bottom: 1px!important;
  margin: 2px;
  width: 156px;
  line-height:12px!important;
  font-size: 10px !important;
  text-align:center !important;
}

.cate::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #faf8f7; }

.cate::-webkit-scrollbar-track {
  background-color: none !important;  }

.cate::-webkit-scrollbar-thumb {
  background-color:  #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.imagenouv {
 margin-top: 10px;
  margin-bottom: 0px;
  margin-right: 0px;
  margin-left: -10px;
}

.tourbout {
  background-color: #C7BDBD;
  font-size: 9px !important;
  }

.hauttitre {
  color: #fff;
  margin-bottom: 4px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center;
 background-color:#4A3139;
}

#offlineimg {
background-image: url(https://images.imgbox.com/3d/33/Uoikt46R_o.png);
 height: 6px;
 
}

.trypic {
background-image: url(https://68.media.tumblr.com/8093e89a34af0e2019c7bf37d5800ff6/tumblr_nadyj7pfJv1qet0epo1_540.jpg);
  width: 300px;
  height: 70px;
 
}

/* PROFIL */

.forumlineprofil {
  background-color : white;
   
}


polu {font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 4px;
text-transform: uppercase;
font-size: 10px !important;
}

.polu2 {font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 10px !important;
  padding: 2px;
  margin: 2px;
  background-color: #f9f5f2;
    border: 1px solid #f2ece8;
}

.contentProfil {
  margin-left :0px ;
  margin-right :0px ;
  line-height:9px !important;
}

/* Le bloc conteneur */
.contenteurpro {
  background:none;
  position:relative;
  border: 6px solid #FFf;
  margin: 4px;
  width:200px; /* on fixe la largeur */
  height:320px; /* et la hauteur */
  overflow:hidden; /* Tout ce qui dépasse est caché ! */
}

/* le bloc info */
.contentpro {
  /* positionnement absolu par rapport au conteneur (qui est en relatif) */
  position:absolute;
  bottom:0; /* 0px par rapport au BAS du conteneur */
  left:0; /* 0px par rapport à la gauche du conteneur */
 border: 6px solid #FFf;
  height:310px; /* on fixe la hauteur, par exemple la même chose que notre conteneur (on peut mettre moins)*/
  width:200px;  /* on fixe la largeur, là j'ai mis "tout l'espace disponible", donc 100% */
 
  margin-bottom:-220px; /* on décale le bloc de 250px vers le bas, comme il "sort" des dimensions du conteneur, il disparait à cause du overflow hidden */
 
  /* on indique la propriété qui nécessitera une transition et le temps de transition pour tous les navigateurs */
  transition:margin 800ms ease;
  -moz-transition:margin 800ms ease;
  -o-transition:margin 800ms ease;
  -htm-transition:margin 800ms ease;
  -webkit-transition:margin 800ms ease;
 
  /* couleur de fond pour la démo */
  background:none;
  background-color: #fff;
  opacity: 0.8;
}

/* lorsqu'on survole le conteneur (:hover), le bloc .info change */
.contenteurpro:hover .contentpro {
  margin:0; /* la marge passe à 0, et le bloc réapparait ! Comme il était en bas, il donne l'impression de monter */
}

.profilTopPost {
  background-color: #f9efe8;
  border: 1px solid #e2d9d3;
  padding : 5px ;
  width : 100px;
  text-align : center ;
 margin : 3px!important;
 
}

.profilBlock {
  width : 100px ;
}
.postdetails img {
  margin-top: 1px;
 text-align: center;
  max-width:200px;
opacity: 0.7;}

.ava { 
 width:200px;
  border: 6px solid #FFf;
  margin: 4px;
}

/* Le bloc conteneur */
.conteneurpro {
  background:none;
  position:relative;
  width:200px; /* on fixe la largeur */
  height:320px; /* et la hauteur */
  overflow:hidden; /* Tout ce qui dépasse est caché ! */
}

/* le bloc info */
.continfopro {
  /* positionnement absolu par rapport au conteneur (qui est en relatif) */
  position:absolute;
  bottom:0; /* 0px par rapport au BAS du conteneur */
  left:0; /* 0px par rapport à la gauche du conteneur */
 
  height:320px; /* on fixe la hauteur, par exemple la même chose que notre conteneur (on peut mettre moins)*/
  width:200px;  /* on fixe la largeur, là j'ai mis "tout l'espace disponible", donc 100% */
 
  margin-left:-200px; /* on décale le bloc de 250px vers le bas, comme il "sort" des dimensions du conteneur, il disparait à cause du overflow hidden */
 
  /* on indique la propriété qui nécessitera une transition et le temps de transition pour tous les navigateurs */
  transition:margin 800ms ease;
  -moz-transition:margin 800ms ease;
  -o-transition:margin 800ms ease;
  -htm-transition:margin 800ms ease;
  -webkit-transition:margin 800ms ease;
 
  /* couleur de fond pour la démo */
  background:none;
  background-color: #fff;
  opacity: 0.8;
}

/* lorsqu'on survole le conteneur (:hover), le bloc .info change */
.conteneurpro:hover .continfopro {
  margin:0; /* la marge passe à 0, et le bloc réapparait ! Comme il était en bas, il donne l'impression de monter */
}

.policepseudo {
font-family: 'Cedarville Cursive', cursive;
  text-transform: lowercase;
  font-size: 22px;
  line-height: 14px;
  padding-bottom:2px;
}

.policepseudo2 {
font-family: 'Cedarville Cursive', cursive;
  text-transform: lowercase;
  font-size: 22px;
  line-height: 14px;
  margin-bottom: 3px;
}

.tourpseudo {
  margin-top : 0px;
    margin-bottom :  0px;
  padding-top: 6px;
  max-height: 25px;
  background-color: #fff;
  border: 0px solid #dde7dd;
}

.tour { }

.tourtour {
  padding: 5px;
  border: 0px solid #DFE8E2;
 background-color: #f0edeb; !important;}


.tourprofil {
  text-align: justify;
  padding-top: 6px !important;
  margin: 0px;
  margin-top: 5px !important;
  padding: 2px;
  text-transform: lowercase;
  background-color: #fff;
  border: 0px solid #dde7dd;
}

.jj { font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 2px;
text-transform: uppercase;
font-size: 9px;
  text-align: center;
background-color: #F7F5F4;
  padding-top: 6px;
  padding-bottom: 0px !important;
height: 15px;
margin-top: 0px;
margin-bottom: 0px;}

.jjcontact {
  text-align: center;
background-color: #F7F5F4;
height: auto;
padding-bottom: 3px;}

.imgtop { width:207px;
margin-top: 8px;}

.finpro {
  margin-top: -5px;
  margin-left: 1px;
  margin-right: 1px;
 height: 10px;
  width: 207px;
  border-bottom: 2px solid #fbf6f4;
  border-right: 1px solid #fbf6f4;
  border-left: 1px solid #fbf6f4;
  border-radius: 0px 0px 10px 10px;
}

/* haut de sujets */
ee {
  font-size:14px;
  text-align: center;
  text-transform: uppercase;
  font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 4px;
  line-height: 12px;
  color: #E6DDDD;
}

.toupro h1{
 font-size:20px !important;
  text-align: center;
  text-transform: lowercase;
    font-family: 'Cedarville Cursive', cursive;
  letter-spacing: 0px;
  margin-left: 4px;
    margin-right: 4px;
  background-color: #D4AB90;
  height: 40px;
  max-width: 100%;
  border: 1px solid #b7937b;
    margin-bottom: 0px;
}


.toupro2 {
  font-size: 11px !important;
background-color: #fff;
  margin: 5px;
  padding: 20px;
  text-transform: lowercase;
  height: 334px;
  width: 300px;
  line-height: 11px;
  border: 1px solid #f4f1ef;
  overflow: auto;
display: inline-block; !important;
}

.toupro2::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #fff; }

.toupro2::-webkit-scrollbar-track {
  background-color: none !important;  }

.toupro2::-webkit-scrollbar-thumb {
  background-color: #E6E4DF;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.toupro3 {
  background-color: #D4AB90;
  font-size: 10px !important;
background-color: auto;
  padding: 0px;
  margin-top: 0px;
  margin-left: 0px;
  margin-right: 0px;
  text-transform: lowercase;
  overflow: auto;
  height: auto;
  width: auto;
  text-align: justify;
  display:inline-block!important;
}

.toupro3::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #fff; }

.toupro3::-webkit-scrollbar-track {
  background-color: none !important;  }

.toupro3::-webkit-scrollbar-thumb {
  background-color: #E6E4DF;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.hautsuj {
  text-transform: lowercase;
align: center;
  margin-top: 0px !important;
  padding: 0px;
  margin-bottom: -3px !important;
  margin-left: -23px !important;
}

.hautsuj2 {
  background-color: #F0EBEC;
  text-transform: lowercase;
align: center;
  margin-top: 0px !important;
  margin-left: -2px !important;
  width: 560px;
  padding: 0px;
  text-align: center !important;
}

.messagerp {
  background-color: #F0EBEC;
  min-height:300px;
  width:auto;
padding:4px;
margin-top:0px;
margin-right: 4px;
margin-bottom: -10px;}

.fleche_gauche {
  margin-left:5px!important;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right:13px solid #F0EBEC;
}

/* présentation + scénarios */
/*présa & scénar*/


.titrej {
color: #000000;
  font-family: 'Cedarville Cursive', cursive;
  letter-spacing: -2px;
  font-size: 25px;
  text-transform: lowercase;
  margin-left: 10px;
  margin-bottom: -4px;
}

.titrec {
color: #EBE3E3;
 font-family: 'Cedarville Cursive', cursive;
  letter-spacing: -2px;
  font-size: 25px;
  text-transform: lowercase;
}

.cadrej {
  width: 534px;
  text-align: justify;
background-color: #fff;
  border-radius: 0px;
padding-bottom: 4px;}

.cadrejj {
  background-color: #f0edeb !important;
  border: 0px solid #e3dcd7;
 padding: 5px;
  width:534px; 
  text-align:center !important;
  align:center !important;
 
}

.cadrec {
  padding: 2px !important;
  width:258px;
  height: 250px;
  text-align:justify;
 background-color: #ffffff;}

.cadrec::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #ffffff; }

.cadrec::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadrec::-webkit-scrollbar-thumb {
  background-color: #fafafa;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.cadress {
  width:250px;
  height: 130px;
  text-align:justify;
padding: 1px;
background-color: none;
overflow: auto;}

.cadress::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #fafafa; }

.cadress::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadress::-webkit-scrollbar-thumb {
  background-color: #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.cadinv {
  overflow: auto;
  width: 256px;
  height: 220px;
line-height: 14px;}

.cadrecc {
  margin-top: 6px;
  width: 510px;
  max-height: 200px;
  text-align:justify;
padding: 0px;
background-color: none;
overflow: auto;
margin-bottom: 4px; }

.cadrecc::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #fafafa; }

.cadrecc::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadrecc::-webkit-scrollbar-thumb {
  background-color: #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.cadrecp {
  margin-top: 6px;
  width: 510px;
  max-height: 300px;
  text-align:justify;
padding: 0px;
background-color: none;
  margin-bottom: 5px;
  overflow: auto;
}


.cadrecp::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #fafafa; }

.cadrecp::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadrecp::-webkit-scrollbar-thumb {
  background-color: #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.cadrect {
  margin-top: 4px;
  width: 510px;
  text-align:justify;
padding: 0px;
background-color: none;}


.refpic {
  margin-left: -5px;
  text-transform: lowercase;
  width: 540px;
  height: 15px;
  padding: 2px;
  text-align: center;
font-size: 10px!important;
  text-transform:uppercase;
  margin-top: 2px;
  margin-bottom: 2px;
 background-color: #f0edeb;
  }

.cadre {
  width:500px;
  text-align:justify;
padding: 3px;
background-color: #F9FBFC;
border: 2px solid #EEF1F2; }

.pp {
  font-family: tahoma;
  width: 250px;
  border: 3px solid #fff;
  opacity: 0.8; }

.ss {
  font-family: tahoma;
  width: 80px;
  border: 3px solid #fff;
  opacity: 0.8; }

.cp {
  font-family: tahoma;
  width: 150px;
  border: 3px solid #fff;
  opacity: 0.8;
radius: 50px;
-webkit-transform:rotate(-90deg);
  -moz-transform:rotate(-90deg);
  -o-transform:rotate(-90deg);
  -ms-transform:rotate(-90deg); 
  transform:rotate(-90deg);
}

cita {
  font-family: times;
  font-size: 12px;
  font-style: italic;
  text-transform: lowercase; }

/* PA */

.ssstaff {
  background-color: #faf8f7;
  padding-bottom: 2px;
  width: 250px;
  margin-left: 2px;
}

.funpic {
  width:35px;
  height: 50px;
  filter: grayscale(1);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(1);
        -o-filter: grayscale(1);
        -ms-filter: grayscale(1);
transform: all;
        -moz-transform: all;
        -o-transform: all;
        -htm-transform: all;
        -webkit-transform: all;
        transition: 1s;
        -moz-transition: 1s;
        -o-transition: 1s;
        -htm-transition: 1
}

.funpic:hover {
  width:35px;
  height: 50px;
    filter: grayscale(0);
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -o-filter: grayscale(0);
        -ms-filter: grayscale(0);
transform: all;
        -moz-transform: all;
        -o-transform: all;
        -htm-transform: all;
        -webkit-transform: all;
        transition: 1s;
        -moz-transition: 1s;
        -o-transition: 1s;
        -htm-transition: 1
}

.picfun { 
    width: 75px;
  filter: grayscale(1);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(1);
        -o-filter: grayscale(1);
        -ms-filter: grayscale(1);
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;
  }

.picfun:hover { 
    width: 75px;
  filter: grayscale(0);
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -o-filter: grayscale(0);
        -ms-filter: grayscale(0);
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;
  }



/* Le bloc conteneur */
.conteneurpa {
  margin-bottom: 2px;
  background:none;
  position:relative;
  width:80px; /* on fixe la largeur */
  height:35px; /* et la hauteur */
  overflow:hidden; /* Tout ce qui dépasse est caché ! */
}


.continfopa {
  /* positionnement absolu par rapport au conteneur (qui est en relatif) */
  position:absolute;
  bottom:0px; /* 0px par rapport au BAS du conteneur */
  left:0; /* 0px par rapport à la gauche du conteneur */
 
  height:35px; /* on fixe la hauteur, par exemple la même chose que notre conteneur (on peut mettre moins)*/
  width:80px;  /* on fixe la largeur, là j'ai mis "tout l'espace disponible", donc 100% */
 
  margin-bottom:-35px; /* on décale le bloc de 250px vers le bas, comme il "sort" des dimensions du conteneur, il disparait à cause du overflow hidden */
 
  /* on indique la propriété qui nécessitera une transition et le temps de transition pour tous les navigateurs */
  transition:margin 800ms ease;
  -moz-transition:margin 800ms ease;
  -o-transition:margin 800ms ease;
  -htm-transition:margin 800ms ease;
  -webkit-transition:margin 800ms ease;
 
  /* couleur de fond pour la démo */
  background:none;
  font-family: arial;
  text-align: center;
  line-height: 12px;
  background-color: #fff;
  opacity: 0.9;
}

.picadd {
  width:80px; /* on fixe la largeur */
  height:35px; /* et la hauteur */
margin-bottom: 2px;}

/* lorsqu'on survole le conteneur (:hover), le bloc .info change */
.conteneurpa:hover .continfopa {
  margin:0; /* la marge passe à 0, et le bloc réapparait ! Comme il était en bas, il donne l'impression de monter */
}

.conteneurpa2 {
  background:none;
  position:relative;
  width:59px; /* on fixe la largeur */
  height:23px; /* et la hauteur */
  overflow:hidden; /* Tout ce qui dépasse est caché ! */
}


.continfopa2 {
  /* positionnement absolu par rapport au conteneur (qui est en relatif) */
  position:absolute;
  bottom:0; /* 0px par rapport au BAS du conteneur */
  left:0; /* 0px par rapport à la gauche du conteneur */
 
  height:23px; /* on fixe la hauteur, par exemple la même chose que notre conteneur (on peut mettre moins)*/
  width:80px;  /* on fixe la largeur, là j'ai mis "tout l'espace disponible", donc 100% */
 
  margin-bottom:-29px; /* on décale le bloc de 250px vers le bas, comme il "sort" des dimensions du conteneur, il disparait à cause du overflow hidden */
 
  /* on indique la propriété qui nécessitera une transition et le temps de transition pour tous les navigateurs */
  transition:margin 800ms ease;
  -moz-transition:margin 800ms ease;
  -o-transition:margin 800ms ease;
  -htm-transition:margin 800ms ease;
  -webkit-transition:margin 800ms ease;
 
  /* couleur de fond pour la démo */
  background:none;
  font-family: arial;
  text-align: left;
  padding-top: 6px !important;
  padding-left: 2px !important;
  background-color: #fff;
  opacity: 0.8;
}

/* lorsqu'on survole le conteneur (:hover), le bloc .info change */
.conteneurpa2:hover .continfopa2 {
  margin:0; /* la marge passe à 0, et le bloc réapparait ! Comme il était en bas, il donne l'impression de monter */
}

.conteneurpa3 {
  background:none;
  position:relative;
  width:130px; /* on fixe la largeur */
  height:30px; /* et la hauteur */
  overflow:hidden; /* Tout ce qui dépasse est caché ! */
}


.continfopa3 {
  /* positionnement absolu par rapport au conteneur (qui est en relatif) */
  position:absolute;
  bottom:0; /* 0px par rapport au BAS du conteneur */
  left:0; /* 0px par rapport à la gauche du conteneur */
 
  height:30px; /* on fixe la hauteur, par exemple la même chose que notre conteneur (on peut mettre moins)*/
  width:130px;  /* on fixe la largeur, là j'ai mis "tout l'espace disponible", donc 100% */
 
  margin-bottom:30px; /* on décale le bloc de 250px vers le bas, comme il "sort" des dimensions du conteneur, il disparait à cause du overflow hidden */
 
  /* on indique la propriété qui nécessitera une transition et le temps de transition pour tous les navigateurs */
  transition:margin 800ms ease;
  -moz-transition:margin 800ms ease;
  -o-transition:margin 800ms ease;
  -htm-transition:margin 800ms ease;
  -webkit-transition:margin 800ms ease;
 
  /* couleur de fond pour la démo */
  background-color: #fff;
  opacity: 0.8;
}

/* lorsqu'on survole le conteneur (:hover), le bloc .info change */
.conteneurpa3:hover .continfopa3 {
  margin:0; /* la marge passe à 0, et le bloc réapparait ! Comme il était en bas, il donne l'impression de monter */
}

.titreadmin {
font-family: arial;
  font-weight: bold;
  letter-spacing: 0px;
  margin-left: 15px;
  font-size: 13px;
  text-transform: uppercase;
}

.picanim {
  width: 34px;
  max-height: 34px;
}
 
  .cadr1 {
  width: 400px;
  padding: 2px;
}

  .cadr11 {
  width: 180px;
  padding: 5px;
}


  .cadr2 {
  font-family: 'Pathway Gothic One', cursive;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 11px;
  width: 260px;
  height: 24px;
  line-height: 12px;
  overflow: auto;
  text-align: center;
  padding: 3px;
  background-color: #f5f5f5;
}

.cadr2::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #f5f5f5;}

.cadr2::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadr2::-webkit-scrollbar-thumb {
  background-color:  #fff; 
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
-webkit-border-radius: 15px; }

.cadr22 {
  margin-top: -10px;
  width: 215px;
  height: 81px;
  line-height: 12px;
  margin-left: -11px;
  overflow: auto;
  text-align: justify;
  padding: 3px;
  background-color: #faf8f7;
  border: 1px solid #f0edeb;
  text-transform: lowercase;
}

.cadr22::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #faf8f7;}

.cadr22:-webkit-scrollbar-track {
  background-color: none !important;  }

.cadr22::-webkit-scrollbar-thumb {
  background-color:  #fff; 
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
-webkit-border-radius: 15px; }

.cadr23 {
  margin-top: 3px;
  width: 235px;
  height: 40px;
  line-height: 12px;
  overflow: auto;
  text-align: justify;
  padding: 3px;
  background-color: #faf8f7;
  border: 1px solid #f0edeb;
  margin-left:-3px;
}

.cadr23::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #faf8f7;}

.cadr23:-webkit-scrollbar-track {
  background-color: none !important;  }

.cadr23::-webkit-scrollbar-thumb {
  background-color:  #fff; 
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;

 -webkit-border-radius: 15px; }

.cadr24 { margin-top: 0px;
  width: 242px;
  height: 75px;
  line-height: 12px;
  overflow: auto;
  text-align: justify;
  padding: 3px;
  background-color: #faf8f7;
  border: 1px solid #f0edeb;
}

.cadr24::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #faf8f7;}

.cadr24:-webkit-scrollbar-track {
  background-color: none !important;  }

.cadr24::-webkit-scrollbar-thumb {
  background-color:  #fff; 
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
-webkit-border-radius: 15px; }

.zzx {
  width: 113px;
  height: 60px;
 background-color:  #f0edeb;
  border: 1px solid #f0edeb;
  margin-left: -1px;
  padding: 4px;
  margin-top: -3px !important;
  height: 10px !important;
  text-align: center !important;
 font-family: 'Homenaje', cursive;
  letter-spacing: 2px;
text-transform: uppercase;
font-size: 8px;
}
.zzz {
  width: 114px;
  height: 60px;
 background-color:  #f0edeb;
  border: 1px solid #f0edeb;
  margin-left: -1px;
  padding: 4px;
  margin-top: -3px !important;
  height: 10px !important;
  text-align: center !important;
 font-family: 'Homenaje', cursive;
  letter-spacing: 2px;
text-transform: uppercase;
font-size: 8px;
}

.zq {
  width: 100px;
 background-color:  #f0edeb;
  border: 1px solid #f0edeb;
  margin-left: -14px;
  padding: 4px;
  margin-top: -3px !important;
  height: 10px !important;
  text-align: center !important;
 font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 8px;
}
.zqq {
  width: 100px;
 background-color:  #f0edeb;
  border: 1px solid #f0edeb;
  margin-left: -1px;
  padding: 4px;
  margin-top: -3px !important;
  height: 10px !important;
  text-align: center !important;
font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 8px;
}

.za {
  width: 114px;
  height: 60px;
 background-color:  #f0edeb;
  border: 1px solid #f0edeb;
  margin-left: 0px;
  padding: 4px;
  margin-top: 25px !important;
  height: 10px !important;
  text-align: center !important;
 font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 8px;
}

.informations {
  text-transform: lowercase;
  overflow:auto;
  width: 280px;
  height: 100px;
  padding: 5px;
  text-align: justify;
}

 
.informations::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #f0edeb; }

.informations::-webkit-scrollbar-track {
  background-color: none !important;  }

.informations::-webkit-scrollbar-thumb {
  background-color:  #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.cadrq1 {
  margin-top: -12px;
  width: 250px;
  height: 100px;
  line-height: 12px;
  overflow: auto;
  text-align: justify;
  padding: 4px;
  background-color: #f0edeb;
  text-transform: lowercase;
}

.cadrq1::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #f0edeb; }

.cadrq1::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadrq1::-webkit-scrollbar-thumb {
  background-color:  #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }
 
.cadrq2 {
  margin-top: -12px;
  width: 260px;
  height: 100px;
  line-height: 12px;
  text-align: justify;
  padding: 4px;
  background-color: #f0edeb;
}

.cadrq2::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #f0edeb; }

.cadrq2::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadrq2::-webkit-scrollbar-thumb {
  background-color:  #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }


  .cadr3 {
  margin-top: -4px;
  background-color: #f0edeb;
  padding: 4px;
  width: 492px;
}

  .cadr4 {
  width: 485px;
  height:100px;
  padding: 3px;
  overflow: auto;
  text-align: justify;
  background-color: #faf8f7;
}

.cadr4::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #faf8f7; }

.cadr4::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadr4::-webkit-scrollbar-thumb {
  background-color:  #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }




.ong1 {
  margin-bottom: 5px !important;
  margin: 2px;
  font-size: 9px;
  height: 12px !important;
  padding: 1px;
  text-align: center;
  text-transform: uppercase;
font-family: 'Open Sans', sans-serif;
  background-color: #DEDBDB;}

.contextetour {
  text-transform: lowercase;
  padding: 5px;
  text-align: justify;
  background-color: #cfcfcf;
}

.contexte {
  text-transform: lowercase;
  overflow:auto;
  width: 284px;
  height: 96px;
  text-align: justify;
}
 
.contexte::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #f0edeb; }

.contexte::-webkit-scrollbar-track {
  background-color: none !important;  }

.contexte::-webkit-scrollbar-thumb {
  background-color:  #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.transcontexte {
  overflow: hidden;
  position: relative;
 }
 
 .transcontexte img {
        -moz-transition: all 1s ease-in-out;
  -webkit-transition: all1s ease-in-out;
  transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
    position:absolute;
  top:0px;
 width: 295px;
  height: 71px;
  margin-top: 24px;
  }

.transcontexte:hover img {
  -moz-transform: translate(0px, 70px);/*XX=largeur de ton image pour un  déplacement horizontal; YY=hauteur de l'image pour déplacement vertical*/
  -webkit-transform: translate(0px, 70px);
  -o-transform: translate(0px, 70px);
  -ms-transform: translate(0px, 70px);
  transform: translate(0px, 70px);
  opacity: 0;
  margin-top: 24px;
}

.top {
  padding: 6px;
}

/*ONGLETS*/

/* .systab .tab => les onglet */
.systab .tab {
  cursor: pointer;
  text-align: center;
  filter: grayscale(1);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(1);
        -o-filter: grayscale(1);
        -ms-filter: grayscale(1);
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;
}
/* .systab .tab:hover => les onglets survolés */
.systab .tab:hover {
 
}
/* .systab .tab.selected => les onglets sélectionnés */
.systab .tab.selected{
 filter: grayscale(0);
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -o-filter: grayscale(0);
        -ms-filter: grayscale(0);
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;
 
}
/* .systab .contents => les conteneurs des contenus associés aux onglets  */
.systab .contents {
  text-align:center;
}
/* style des onglets si ils sont à gauche ou à droite */
.systab.s_float .tab,.systab.s_float .tab {
  display: block;
margin-left: 0px;
}
/* flottement des conteneurs si les onglets sont à gauche où à droite */
.systab.s_float .tabs,.systab.s_float .contents {
  float: right;
 
}

.ongletpa {
  padding-top: 2px;
  padding-left: 8px;
    padding-bottom: 2px;
  text-align: left;
  font-family: 'Homenaje', cursive;
  letter-spacing: 2px;
text-transform: uppercase;
font-size: 11px;
  width: 100px;
  background-color: #e8e8e8;
  border-radius: 0px 3px 3px 0px;
}

.ongletpabis {
  padding-top: 2px;
  padding-left: 8px;
    padding-bottom: 2px;
  text-align: left;
  font-family: 'Homenaje', cursive;
  letter-spacing: 2px;
text-transform: uppercase;
font-size: 11px;
  width: 100px;
  background-color: #D8D9D9;
  border-radius: 0px 3px 3px 0px;
  margin-top: 4px !important;
  margin-bottom: 4px !important;
}

 .cadrdr {
  width: 157px;
  padding: 5px;
  background-color: #cfcfcf;
}

.ongletdr { margin-top: -8px;
  text-align: center;
  font-family: 'Pathway Gothic One', cursive;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 11px;
  width: 760px !important;
  height: 15px !important;
  background-color: #f5f5f5 !important;
}

.ongletdr2 { margin-top: 2px;
  text-align: center;
  font-family: 'Pathway Gothic One', cursive;
  letter-spacing: 1px;
text-transform: uppercase;
font-size: 11px;
  width: 760px !important;
  height: 15px !important;
  background-color: #f5f5f5 !important;
}



.longcentre {
  margin-top: 4px;
  text-transform: lowercase;
  overflow:auto;
  width: 754px;
  height: 60px;
  padding: 4px;
  text-align: justify;
  background-color: #ffffff;
}

 
.longcentre::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #c0c0c0; }

.longcentre::-webkit-scrollbar-track {
  background-color: none !important;  }

.longcentre::-webkit-scrollbar-thumb {
  background-color: #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.animcrédits {
  width: 250px;
  padding: 2px;
  text-align: justify; }

.droitee {
  width: 220px;
  padding: 2px;
  margin-bottom: 4px;
  text-align: justify;
}

/*qeel*/

.cadrepart {
  text-align: center;
  padding: 4px;
  margin-right: 8px;
}

.membresco24 {
  margin-top: 0px !important;
  overflow: auto;
  text-transform: lowercase;
  padding: 0px;
    height: 102px;
  width: 260px;
  text-align: justify;
    background-color: #faf8f7;
}

.membresco24::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #faf8f7; }

.membresco24::-webkit-scrollbar-track {
  background-color: none !important;  }

.membresco24::-webkit-scrollbar-thumb {
  background-color: #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.cadreqeel3::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #f0edeb; }

.cadreqeel3::-webkit-scrollbar-track {
  background-color: none !important;  }

.cadreqeel3::-webkit-scrollbar-thumb {
  background-color: #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

.coco::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background-color: #f0edeb; }

.coco::-webkit-scrollbar-track {
  background-color: none !important;  }

.coco::-webkit-scrollbar-thumb {
  background-color: #fff;
  width: 3px !important;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px; }

a.info{
position:relative;
z-index:24;
color:#000;
text-decoration:none
}
 
a.info:hover{
z-index:25;
background-color:none;
}
 
a.info span{
display: none
}
 
a.info:hover span{
display:block;
position:absolute;
top:-2em; left:-2em; width:15em;
background-color: #fff;
  border: 1px solid #eee8e3;
color:#000;
text-align: justify;
font-weight:none;
padding:5px;
}

.tourqeel {
 width: 100%;
  background-color: #E8DCDC;
  padding-top: 3px;
  font-size: 10px !important;
}

.hautqeel {
    font-size:10px;
  text-align: center;
  text-transform: uppercase;
 font-family: Courier New;
  letter-spacing: 1px;
  width: 780px;
  background-color: #fff;
  border: 1px solid #eee8e3;
  color: #c0c0C0;
}


.cliqq {
  letter-spacing:2px;
  font-family:times;
  font-size:15px;
  font-style:italic;
  line-height:14px;
  margin-top:4px;
text-transform: lowercase;
margin-bottom: 4px;}


.picqeel {
  width: 65px;
  height: 5px;
  margin: 2px;
  border-radius: 5px; }


.msgx {
  font-size: 15px !important;
  text-transform: uppercase;
  font-family: 'Yanone Kaffeesatz', sans-serif;
  letter-spacing: 2px;
  text-align: center;
  margin-top: 6px;
}

.userr {
  font-size: 15px !important;
  text-transform: uppercase;
  font-family: 'Yanone Kaffeesatz', sans-serif;
  letter-spacing: 2px;
  text-align: center;
  margin-top: 6px;
}

.nouv {
  text-align: center;
 font-family: 'Satisfy', cursive;
  text-transform: lowercase;
  letter-spacing: -1px;
  font-size: 22px !important;
width: 190px;
  font-style: italic;
  margin-top: -12px;
  margin-left : 15px;
}



#kaboum .row1 {
  background: none;
  max-height: 115px !important;
  overflow: auto !important;
  text-align: justify;
  font-size: 8px !important;
}

.debug td.row1 { background: none;
text-align: justify !important;
max-width: 275px !important;
    height: auto !important;}

.coco {
  width: 250px;
  height: 72px;
  text-transform: lowercase;
  margin-left: 2px !important;
  margin-right: 2px !important;
  overflow: auto;
margin: 0px !important;
background-color: #faf8f7;}



.cadreqeel1 {
width: 280px;
  height: 130px;
  padding-top: -5px;
  text-align: center;
padding: 2px;
font-size: 10px;!important}

.policeqeel {
 font-family: 'Satisfy', cursive;
  font-size: 22px;
  letter-spacing: -1px;
  margin-top: -5px;
  margin-bottom: -6px;
  text-transform: lowercase; }

.cadreqeel2 {
  text-align: center !important;
  width: 200px;
  margin-top: -10px;
}

.cadreqeel3 {
  margin-top: -10px;
  text-align: justify;
  text-transform: lowercase;
width: auto;
  height: 130px;
overflow: auto;}


.cadreqeel5 {
  text-align: center !important;
  width: 200px;
  height: auto;
  padding: 0px;
  padding: 4px;
}


.whisky {
  text-align:center;
  width: 45px;
  height: 115px;
  border: 3px solid #fff;
}

.cosmo {
  text-align:center;
 width: 45px;
  height: 115px;
  border: 3px solid #fff;
}

.beach {
  text-align:center;
width: 45px;
  height: 115px;
 border: 3px solid #fff;}

.cuba {
  text-align:center;
 width: 45px;
  height: 115px;
  border: 3px solid #fff;
}

.translateq1 {
  overflow: hidden;
  position: relative;
  background: white;
  height: 100px;
  width: 250px;
  text-align: left;
  margin-bottom: 3px;
 }
 
 .translateq1 img {
        -moz-transition: all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
    position:absolute;
  top:40px;
height: 60px;
  width: 250px;
  }

.translateq1:hover img {
  -moz-transform: translate(0px, 60px);/*XX=largeur de ton image pour un  déplacement horizontal; YY=hauteur de l'image pour déplacement vertical*/
  -webkit-transform: translate(0px, 60px);
  -o-transform: translate(0px, 60px);
  -ms-transform: translate(0px, 60px);
  transform: translate(0px, 60px);
  opacity: 0;
}

.translateq2 {
  overflow: hidden;
  position: relative;
  background: white;
  height: 100px;
  width: 350px;
  text-align: left;
  margin-bottom: 3px;
 }
 
 .translateq2 img {
        -moz-transition: all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
    position:absolute;
  top:40px;
height: 60px;
  width: 350px;
  }

.translateq2:hover img {
  -moz-transform: translate(0px, 60px);/*XX=largeur de ton image pour un  déplacement horizontal; YY=hauteur de l'image pour déplacement vertical*/
  -webkit-transform: translate(0px, 60px);
  -o-transform: translate(0px, 60px);
  -ms-transform: translate(0px, 60px);
  transform: translate(0px, 60px);
  opacity: 0;
}


.translateq4 {
  overflow: hidden;
  position: relative;
  background: transparent;
  height: 80px;
  width: 140px;
  text-align: left;
  margin-bottom: 3px;
 }
 
 .translateq4 img {
        -moz-transition: all 1s ease-in-out;
  -webkit-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  -ms-transition: all 1s ease-in-out;
    position:absolute;
  top:0px;
  opacity: 0.7;
height: 80px;
  width: 140px;
  }

.translateq4:hover img {
  -moz-transform: translate(140px, 0px);/*XX=largeur de ton image pour un  déplacement horizontal; YY=hauteur de l'image pour déplacement vertical*/
  -webkit-transform: translate(140px, 0px);
  -o-transform: translate(140px, 0px);
  -ms-transform: translate(140px, 0px);
  transform: translate(140px, 0px);
  opacity: 0;
}


.conteneurqmdm {
  background:none;
  position:relative;
  width:100px; /* on fixe la largeur */
  height:25px; /* et la hauteur */
  overflow:hidden; /* Tout ce qui dépasse est caché ! */
}


.continfoqmdm {
  /* positionnement absolu par rapport au conteneur (qui est en relatif) */
  position:absolute;
  bottom:0; /* 0px par rapport au BAS du conteneur */
  left:0; /* 0px par rapport à la gauche du conteneur */
 
  height:25px; /* on fixe la hauteur, par exemple la même chose que notre conteneur (on peut mettre moins)*/
  width:100px;  /* on fixe la largeur, là j'ai mis "tout l'espace disponible", donc 100% */
 
  margin-bottom:-25px; /* on décale le bloc de 250px vers le bas, comme il "sort" des dimensions du conteneur, il disparait à cause du overflow hidden */
 
  /* on indique la propriété qui nécessitera une transition et le temps de transition pour tous les navigateurs */
  transition:margin 800ms ease;
  -moz-transition:margin 800ms ease;
  -o-transition:margin 800ms ease;
  -htm-transition:margin 800ms ease;
  -webkit-transition:margin 800ms ease;
 
  /* couleur de fond pour la démo */
  background:none;
  font-family: arial;
  text-align: center;
  padding-top: 6px !important;
  background-color: #fff;
}

/* lorsqu'on survole le conteneur (:hover), le bloc .info change */
.conteneurqmdm:hover .continfoqmdm {
  margin:0; /* la marge passe à 0, et le bloc réapparait ! Comme il était en bas, il donne l'impression de monter */
}

.imglast {
  width: 100px;
  margin: 1px;
  filter: grayscale(1);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(1);
        -o-filter: grayscale(1);
        -ms-filter: grayscale(1);
 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; }

.imglast:hover {
  width: 100px;
  margin: 1px;
  filter: grayscale(0);
        -webkit-filter: grayscale(0);
        -moz-filter: grayscale(0);
        -o-filter: grayscale(0);
        -ms-filter: grayscale(0);
 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;
}

a.infobb{
position:relative;
color:#000;
text-decoration:none
}
 
a.infobb:hover{
}
 
a.infobb span{
display: none
}
 
a.infobb:hover span{
display:block;
position:absolute;
top:20px;
  left:-5px;
  width:160px;
  height: 47px;
padding: 3px;
  background-color: #e8e8e8;
  border-radius: 1px solid #e8dfe1;
text-align: center;
font-weight:none;
}

a.infobb2{
position:relative;
color:#000;
text-decoration:none
}
 
a.infobb2:hover{
}
 
a.infobb2 span{
display: none
}
 
a.infobb2:hover span{
display:block;
position:absolute;
top:20px;
  left:-43px;
  width:160px;
  height: 47px;
padding: 3px;
  background-color: #e8e8e8;
  border-radius: 1px solid #e8dfe1;
text-align: center;
font-weight:none;
}

a.infobb3{
position:relative;
color:#000;
text-decoration:none
}
 
a.infobb3:hover{
}
 
a.infobb3 span{
display: none
}
 
a.infobb3:hover span{
display:block;
position:absolute;
top:20px;
  left:-80px;
  width:160px;
  height: 47px;
padding: 3px;
  background-color: #e8e8e8;
  border-radius: 1px solid #e8dfe1;
text-align: center;
font-weight:none;
}

a.infobb4{
position:relative;
color:#000;
text-decoration:none
}
 
a.infobb4:hover{
}
 
a.infobb4 span{
display: none
}
 
a.infobb4:hover span{
display:block;
position:absolute;
top:20px;
  left:-119px;
  width:160px;
  height: 47px;
padding: 3px;
  background-color: #e8e8e8;
  border-radius: 1px solid #e8dfe1;
text-align: center;
font-weight:none;
}

/**slide**/
.slideshow,
.slide {
    width: 182px;
    height: 54px;
}

.slideshow {
    margin: 0;
    overflow: hidden;
  margin-top: 0px;
}

.slideshow div {
    position: relative;
    top: 0;
    left: 0;
}
   
.slide {
    margin: 0;
    overflow: auto;
   
    display: inline-block;
    vertical-align: middle;
       
    text-align: center;
    color: white;
}

.slide p {
    text-align: justify;
}

/*apparition*/
    .lock  {
      position: relative;
      cursor: pointer;
    }
    .lock .lock-hidden {
      /* positionnement du bloc qui apparait */
      display: none;
      position: absolute;
      top: 10px;
  left: 5px;
     
      /* style du bloc qui apparait */
      border: 2px solid blue;}

_________________
    ☾ you can take many pictures, my look will never change when you're looking at me. i'm attached to your love, for ever and ever. ♡
Revenir en haut Aller en bas
 Sujets similaires
-
» Je viens de perdre un être cher.....
» Changer la batterie, perdre les donnés???
» Comment ne pas perdre le Nord
» Mon PC portable perd de la mémoire
» acompte sur facture ou comment perdre des clients...
Page 1 sur 1 -

botr ::  :: Up high in the street
Sauter vers:  
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum