<!--LINE 1--!>

<!--LINE 1-->

<table width="750px" cellpadding="15px" border="1"><tr><!--LINE 1-->
<td colspan="4"><div style="background-color: #e2e377; width: 750px; height: 40px;"></div></td>
</tr><!--LINE 1 END-->

<tr><!--LINE 2-->
<td colspan="2" background="blue">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores totam illum vel. Deserunt consectetur adipisci voluptate veritatis asperiores architecto doloribus at id eum distinctio dolor error unde accusamus minus suscipit.</td>
<!--PAN-->
<td width="350px">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores totam illum vel. Deserunt consectetur adipisci voluptate veritatis asperiores architecto doloribus at id eum distinctio dolor error unde accusamus minus suscipit.</td>
<td>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores totam illum vel.</td></tr><!--LINE 2 ENDS-->

<tr><!--LINE 3-->
<td width="100px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </td>
<td colspan="2">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores totam illum vel. Deserunt consectetur adipisci voluptate veritatis asperiores architecto doloribus at id eum distinctio dolor error unde accusamus minus suscipit.</td>
<!--MWARF-->
<td>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maiores totam illum vel.</td></tr><!--LINE 3 ENDS-->

<tr><!--LINE 4-->
<td colspan="4">noknoknoknoknoknoknok</td>
<!--ONOM-->
<!--ONOM-->
<!--ONOM--></tr><!--LINE 4 ENDS--></table>

.ligne:after {
 clear: both;
 display: block;
 content: "";
 }
 
.ligne > div {
 float: left;
 margin: 2px;
 }
 

<div class="ligne"> <!-- ligne 1 -->
 <div style="background-color: #a1b1c1; width: 750px; height: 40px;"></div>
 </div>

 <div class="ligne"> <!-- ligne 2 -->
 <div style="background-color: #e2e367; width: 302px; height: 150px;"></div>
 <div style="background-color: #f2e236; width: 220px; height: 150px;"></div>
 <div style="background-color: #eee377; width: 220px; height: 150px;"></div>
 </div>

 <div class="ligne"> <!-- ligne 3 -->
 <div style="background-color: #f2e555; width: 200px; height: 200px;"></div>
 <div style="background-color: #a2e377; width: 270px; height: 200px;"></div>
 <div style="background-color: #b2e577; width: 272px; height: 200px;"></div>
 </div>
 
<div class="ligne"> <!-- ligne 4 -->
 <div style="background-color: #f3a689; width: 750px; height: 40px;"></div>
 </div>

body {
background-repeat: no-repeat;
  background-position: top center;
  cursor: crosshair;
}

/*TABLEAUX*/

.ligne:after {
 clear: both;
 display: block;
 content: "";
 }
 
.ligne > div {
 float: left;
 margin: 2px;
 }

/* QEEEEEEEEL */

.qeelhaut {
  color: #f9cdbe;
  font-family: times new roman;
  font-weight:;
  font-size:28px;
  letter-spacing:-3px;
  text-transform:uppercase;
  text-shadow: 0px 0px 2px #ffffff;
}

.qeeltitre {
  font-family: times new roman;
  font-weight:;
  font-size: 55px;
  letter-spacing:-2px;
  color: #f9cdbe;
  text-shadow: 3px 3px 0px #ffffff;
  margin-top: -25px;
  text-transform: lowercase;
  margin-left:40px;
}

.qeeltout {
  background:url('http://uprapide.com/images/invite/1373627495-test4.png');
}

/* QEEEEEEL FIN */

/*QEEL TEST 2 (à revoir)*/

        /* conteneur du QEEL */
.QeelPerso {
  border: 2px solid #;
  padding: 10px;
  background-color:#ffffff;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-radius: 0px;
    width: 770px;
  margin-left: 6px;
}

/* Centrage image du QEEL */
.ImgQeel {text-align:center;}

/* Mise en forme des liens vers les groupes */
.ListeGroupes a {
  font-size:14px;
  text-transform:uppercase;
  text-decoration: none!important;
  letter-spacing:1px;
  background-color:#FFFFFF;
        height:40px;padding-right:10px;padding-left:10px;padding-bottom:3px;
        font-size:16px ;text-align:center;
        text-decoration: none !important;
    margin-bottom: 7px;
}

/* Couleurs des groupes */
a.groupe1 { color:#663366 ; }
a.groupe2 { color:#cc3333 ; }
a.groupe3 { color:#336699 ; }
a.groupe4 { color:#339933 ; }
a.groupe5 { color:#666666 ; }
a.groupe6 { color:#663333 ; }

/* Mise en forme des cellules de statistiques */
.statistiques {
  background-color: #f4e6e5;
  padding:10px;
  margin:10px;
  text-align:left;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-radius: 0px;
}

/* Limitation en hauteur des blocs de statistiques */
.BlocStats {
  overflow:auto;
  max-height: 300px;
}

/* Debuggage : on retire le fond de la liste des dernières 24h */
.DeBug td.row1 { background : none; }

/*QEEL TEST 2 FIN*/

/* TEST CATEGORIE DEBUT */

.forumlink2 {
  text-align:left;
  font-family:Georgia;
  font-size:25px;
  border-bottom: 2px solid #ef889d;
  color:black;
  text-transform:lowercase;
  letter-spacing:-2px;
  color: #e995af;
  transition-duration: 1s;
  transition-delay: 1s;
  transition-timing-function: ease-out;
}

.forumlink2:hover{
  letter-spacing: 4px;
  font-style: italic;
  color: #BAE448;
  transition-duration: 1s;
  transition-timing-function: ease-out;
  transition-property:all;}

.derstat2 {
  height:127px;
  width:140px;
  background-color:#f5e9db;
  text-align:center;
  padding:10px;
}

.sousforum2 {
  background-color:#f9cdbe;
  padding:10px;
  width:130px;
  height:85px;
  overflow:auto;
  color:gainsboro;
}

/* TEST CATEGORIE FIN */

/*TITRE CATEGORIE*/

.TitreCategorie {
  background: #f5e9db;
  border-radius:0px 0px 0 0;
  -moz-border-radius:0px 0px 0 0;
  -wekbit-border-radius:0px 0px 0 0;
  width: 500px;
  margin:auto;
  padding: 5px;
  border: 0px solid #;
  border-bottom: 0px; }
 
.TitreCategorie h2 {
  margin:0;
  text-align: center;
  letter-spacing: -2px;
  text-transform: lowercase;
  font-weight: light;
  color: #f9cdbe;
  font-family: Georgia;
  font-size: 20px;
  text-shadow: 1px 1px 4px #ffffff;}

/*TITRE FIN*/

.table{
  width: 100%;
  margin: auto;}

.forum > table {
    width: 100%;}

a {
font-family: 'Oswald', sans-serif;
  text-decoration: none !important;}

.cate_titre{
  width: 820px;
  margin: auto;
  text-align: center;}

.categorie{
  width: 820px;
  margin: auto;
  margin-top: 10px;
  margin-bottom: 10px;
  border-top: 3px solid #;
  border-bottom: 1px solid #;
  border-right: 1px solid #;
  border-left: 1px solid #;
  box-shadow: 0px 0px 5px #;
  -moz-box-shadow: 0px 0px 5px #;
  -o-box-shadow: 0px 0px 5px #;
  -htm-box-shadow: 0px 0px 5px #;
  -webkit-box-shadow: 0px 0px 5px #;
  background: white;
}

.forum{
  width: 820px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 5px;
  margin-bottom: 5px;
  border: 1px dotted #;
}

.forumlink{
  display: block;
  width: 450px;
  font-variant: small-caps;
  letter-spacing: 2px;
  padding-left: 20px;
  color: #e995af;
  text-shadow: 1px 1px 0px #d0e8d5;
 border-radius: 0px 0px 0px 0px;
  -webkit-border-radius: 0px 0px 0px 0px;
  -moz-border-radius: 0px 0px 0px 0px;}

.forumlink a{
  font-size: 16px;
  border-bottom: 2px dotted #d0e8d5;
 border-radius: 0px 0px 0px 0px;
  -webkit-border-radius: 0px 0px 0px 0px;
  -moz-border-radius: 0px 0px 0px 0px;}


/*DESCRIPTIONS, ILLUSTRATIONS*/

.description {
  display: block;
  width: 450px;
  height: 105px;
  overflow: hidden;
  bordure:solid 0px #;
  font-size: 10px;
  background-color: #f6e9e3;
color: #000000;}

.description_contenu {
  position: absolute;
  display: block;
  width: 450px;
  height: 105px;
  overflow: auto;
  background-color: #f6e9e3;
  font-size: 10px;
  color: #000000;
  text-align: justify;
  opacity: 0;
  -moz-opacity: 0;
  -khtml-opacity: 0;
  filter: alpha(opacity=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;
}
.description_contenu:hover {
  opacity: 0.8;
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  filter: alpha(opacity=80);
  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; }

.stats_last{
  display: block;
  width: 140px;
  margin: auto;
  background-color: #f2dbd3;
  padding: 10px;
  border: 1px dotted #;
-moz-box-shadow: 0px 0px 2px #000000;
  box-shadow: 0px 0px 2px #000000;
  -webkit-box-shadow: 0px 0px 2px #000000;}

.stats{
  background-color: #ffffff;
  display: block;
  text-align: center;
  font-size: 10px;
  color: #000000;
  font-weight: none;
  border-bottom: 1px solid #;
  padding-bottom: 4px;
  margin-bottom: 4px;
  margin-top: 5px;
}

.last{
  display: block;
  text-align: center;
  font-size: 11px;}

/* Post */
tr.post span.gensmall {
display: none; }

a:hover {text-decoration: none !important;}

.forumline {-moz-border-radius: 0x;
-webkit-border-radius: 0px;
border-radius: 0px;
padding: 5px;
}

.bodyline{
-moz-border-radius: 0px;
  -moz-box-shadow: 1px 1px 1px ##000000;
  box-shadow: 1px 1px 1px ##000000;
-webkit-box-shadow: 1px 1px 1px ##000000;
}

a { text-decoration: none; }

a:hover{
font-style: italic;
transition-duration: 3s;
}




          #chatbox_header .catBottom .cattitle {
            color: #ffffff;
        }
        #chatbox_header .chatbox-options .genmed,
        #chatbox_header .chatbox-options,
        #chatbox_header .chatbox-options a {
            color: #ffffff;
        }
        .profil_speudo {
            background-color: #F2DCDA;
          -moz-border-radius:1px 1px 1px 1px;
          -webkit-border-radius:1px 1px 1px 1px;
            border-radius:1px 1px 1px 1px;
        }
       
        .profil_avatar {
          border: solid 2px #e9d3bb;
          padding: 5px;
          -moz-border-radius:1px 1px 1px 1px;
          -webkit-border-radius: 1px 1px 1px 1px;
          border-radius:1px 1px 1px 1px;
          img-align: center;
        }
       
        .profil_infos {
          background-color: #
          -moz-border-radius:1px 1px 1px 1px;
          -webkit-border-radius:1px 1px 1px 1px;
          border-radius:1px 1px 1px 1px;
          padding: 5px;
        }
       
        .font_profil{
            border: solid 2px #;
          -moz-border-radius:2px 2px 2px 2px;
          -webkit-border-radius:2px 2px 2px 2px;
          border-radius:2px 2px 2px 2px;
          padding: 5px;
}
 
.description{position: relative;z-index: 0;}


.description span img{border: 1px;padding: 5px;}

/*MISE EN PAGE*/

.title_1{
 background-color: #c9dee1;
 width: 520px;
 height: 30px;
 font-family: Oswald;
 letter-spacing: 3px;
 text-transform: uppercase;
 color: #79b1cc;
 text-shadow: 1px 1px 1px #000000;
 font-size: 30px;
  text-align: right;}

.title_2{
  background-color: #c9dee1;
  width: 500px;
  height: 10px;
  font-family: Oswald;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #79b1cc;
  text-shadow: 1px 1px 1px #000000;
  font-size: 15px;
  text-align: right;}

.title_3{
  font-family: Oswald;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #79b1cc;
  text-shadow: 1px 1px 1px #000000;
  font-size: 20px;
  text-align: center;}
 
.box_1{
  border-left: solid 1px #c9dee1;
  border-bottom: solid 1px #c9dee1;
  border-right: solid 1px #c9dee1;
  width: 520px;
  height: 220px;
  padding: 5px;}

.box_2{
  border-left: solid 1px #c9dee1;
  border-bottom: solid 1px #c9dee1;
  border-right: solid 1px #c9dee1;
  width: 520px;
  padding: 5px;
  text-align: justify;}

.box_3{
  border: solid 1px transparent;
  width: 250px;
  height: 385px;
  text-align: justify;}

.box_4{
  border: solid 1px transparent;
  width: 510px;
  padding: 2px
  text-align: justify;}

.box_5{
  background-color: #c9dee1;
  height: 110px;
  width: 350px;
  text-align: justify;
    padding: 3px;}
 
.over_1{
  overflow: auto;
  height: 200px;
  width: 200px;
  text-align: justify;}
 
.over_2{
  overflow: auto;
  height: 320px;
  width: 250px;
  text-align: justify;}
 
 
/*SPOILS QUOTE CIE*/

.spoiler_closed{
background-color:  #d2d7dd;
  border: 1px dotted #;
padding : 5px;
height: 3px;
}

.spoiler_content{
border: 1px # dotted;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border-radius: 10px 10px 10px 10px;
color: #000000;
  background-color: #d2d7dd;
padding : 10px;
}

.quote
{
background-color: #d2d7dd;
  border-radius: 10px 10px 10px 10px;
  -webkit-border-radius: 10px 10px 10px 10px;
  -moz-border-radius: 10px 10px 10px 10px;
  border: solid 1px #
font-size: 12px;
  color: #000000;
  padding: 4px; }

.code {

-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border-radius: 10px 10px 10px 10px;
padding : 4px;
  color: #000000;
  background: #d2d7dd; }

/*OPACITE*/

a.opacity img {filter:alpha(opacity=75);
-moz-opacity: 0.70;
opacity: 0.70;}

a.opacity:hover img {filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;}


/*PANNEAU LATERAL DES NEWS*/
.fpanel { position: fixed; }
.fpclose,.fpopen { cursor: pointer; }
.fpclose { display: none; }

#fp231 { top: 20%; right: -200px; }
#fp231 .fpcontent { width: 200px;}


/* PAGE D'ACCUEIL PAR ORANGE DE CSSACTIF (http://css-actif.com/)
MERCI DE NE PAS RETIRER CETTE MENTION, PAR RESPECT. */
/* Mise en forme générale */
  .cssactif_pa_main {
      width: 770px; 
      padding: 0px;
      margin: 0 auto;
      position: center;
  }
 
  .cssactif_pa_main h1 { /* Titre principal (Bienvenue sur...) */
      font-family: "Courier New", Courier, monospace;  /* Police de caractère */
      text-align: center; /* Alignement du texte */
      text-transform: uppercase; /* Transformation: met le texte en majuscules */
      font-weight: normal; /* Épaisseur normale */
      letter-spacing: 16px; /* Espacemement des caractères en PX */
      font-size: 32px; /* Grosseur du texte */
      color: #f25faf; /* Couleur du texte */
      text-shadow: 2px 2px 0px #FFFFFF; /* Ombre du texte */
  }
 
  .cssactif_pa_main h2 { /* Titre des colonnes (Contexte, Nouveautés etc.) */
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;    /* Police de caractère */
      font-weight: normal; /* Épaisseur normale */
      color: #FFFFFF; /* Couleur du texte */
      text-transform: uppercase; /* Transformation: met le texte en majuscules */
      text-shadow: 1px 1px 1px #000000; /* Ombre du texte */
      font-size: 18px; /* Grosseur du texte */
      margin:0;
  }
 
  .cssactif_pa_colonne { /* Style général des colonnes */
      float: left; /* Place les colonnes un à côté de l'autre */
      width: 33%; /* Donne la grandeur des colonnes */
      background-color: #FFFFFF; /* Couleur de fond */
      height: 420px; /* Hauteur des colonnes: doit être fixe */
      color: #777777; /* Couleur du texte */
 
      opacity: 0.9; /* Opacité des colonnes */
     
      /* Transition */
      -webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;

/*Ombre porté */
-webkit-box-shadow: 0px 0px 1px 0px #CCCCCC;
box-shadow: 0px 0px 1px 0px #CCCCCC;

 
  }
 
  .cssactif_pa_colonne p { /* Paragraphe des colonnes */
  padding: 0 10px; /* Padding */
  text-indent: 10px; /* Alinéa */
  text-align: justify;  /* Alignement du texte */
  }
  .cssactif_pa_colonne:hover { /* Colonne au survol */
  /* Effet de grossissement */
      -moz-transform: scale(1.05) translate(0px, -20px) ;
-webkit-transform: scale(1.05) translate(0px, -20px) ;
-o-transform: scale(1.05) translate(0px, -20px) ;
-ms-transform: scale(1.05) translate(0px, -20px);
transform: scale(1.05) translate(0px, -20px) ;

opacity: 1; /* Opacité */

/* Nouvelle ombre portée */
-webkit-box-shadow: 0px 5px 10px 0px #CCCCCC;
box-shadow: 0px 5px 10px 0px #CCCCCC;
z-index: 999;

  }
 
.cssactif_pa_header { /* Style commun des header de couleur */
  padding: 10px;
  height: 80px;
}

.cssactif_pa_header p { /* Style du description dans les headers */
margin: 5px; /* Marge */
padding: 0; /* Padding */
color: #FFFFFF; /* Couleur du texte */
text-shadow: 1px 1px 1px #000000;  /* Ombre portée */
font-style: italic; /* Style italic */
opacity: 0.8; /* Opacity du texte */

}
.colgauche .cssactif_pa_header {background-color: #01c6d9;} /* Colonne de gauche, couleur du header */
.colcentre .cssactif_pa_header {background-color: #d9015d;}/* Colonne du centre, couleur du header */
.coldroite .cssactif_pa_header {background-color: #7fbf33;  } /* Colonne de droite, couleur du header */

/* Contenu des colonnes */

.new {
  margin: 0px 0px 5px 10px; /* Marge Haut Droit Bas Gauche */
  padding: 5px; /* Padding */
  border-bottom: 1px solid #d9015d; /* Bordure du séparateur */
 
  text-align: justify; /* Alignement du texte */
}

.new em { /* Dates */
  color: #d9015d;  /* Couleur du texte */
  text-transform: uppercase; /* Transformation du texte en majuscule */
  font-style: normal; /* Enlève le italic par défaut de la balise em */
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; /* Police de caractère */
}

.new em:after {
  content: " ►";  /* Ajoute la flèche après les dates */
}

.pers { /* Cadre du staff */
 border: 1px solid #7fbf33;  /* Bordure du staff*/
 margin: 0px; /* marge externe */
 
 /* Arrondissement des bordures */
 -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;


padding: 3px; /* Marge interne */
text-align: center; /* Alignement du texte */
}

.pers img { /* Image des personnages */
 float: left; /* Place à gauche du texte */
 width: 50px; /* Grandeur de l'image */
 height: 50px;    /* Grandeur de l'image */
 border: 3px solid #7fbf33; /* Bordure de l'image */
 
 /* Arrondissement des bordures */
  -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;   

/* Transformation */
 -moz-transform: rotate(-12deg) translate(0px, -5px) ;
-webkit-transform:  rotate(-12deg) translate(0px, -5px) ;
-o-transform: rotate(-12deg) translate(0px, -5px) ;
-ms-transform:  rotate(-12deg) translate(0px,-5px) ;
transform:  rotate(-12deg) translate(0px, -5px);
}

.pers:first-line { /* Première ligne:contient le nom du personnage */
 color: #7fbf33;/* Couleur du texte */
 font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; /* Police de caractère */
 text-transform: uppercase; /* Transformation du texte */
}

 /* Code par Hiro pour CSSACTIF
  Merci de ne pas supprimer cette mention
  (http://www.css-actif.com) */

#englob { /* Encadrement global des 2 divs */
    position:relative;
    width:200px;
    height:320px;
    border: 0px solid white; /* La vilaine bordure rouge */
    overflow:hidden; /* Permet de cacher ce qui dépasse */
}

.imgp {
    background:blue; /* le bg  de la div qui contient l'avatar */
    position:absolute; /* Laissez comme ceci */
    top:0;/* Laissez comme ceci */
    left:0;/* Laissez comme ceci */
    width:100%;/* Laissez comme ceci */
    height:100%;/* Laissez comme ceci */
    z-index:1;/* La position par rapport à l'autre div qui contient les infos */
    -webkit-transition:all 0.5s;/* Laissez comme ceci */
    -moz-transition:all 0.5s;/* Laissez comme ceci */
    -o-transition:all 0.5s;/* Laissez comme ceci */
    -ms-transition:all 0.5s;/* Laissez comme ceci */
    transition:all 0.5s;/* Laissez comme ceci */
}

#englob:hover > .imgp {
    margin-top:320px; /* Lorsque la souris passe sur la div #englob, on fait glisser l'image vers le bas de 200px */
}

.infosp {
    background:#ecd9d3; /* le bg  de la div qui contient les infos*/
    position:absolute;/* Laissez comme ceci */
    top:0;/* Laissez comme ceci */
    left:0;/* Laissez comme ceci */
    width:100%;/* Laissez comme ceci */
    height:100%;/* Laissez comme ceci */
    z-index:0;/* La position par rapport à l'autre div qui contient les infos (ici en dessous)*/
    opacity:0;/* on met l'opacité à zero pour un effet stylé ;) */
    margin-left:-200px;/* on décale la div de 200px, elle est invisible grâce a l'overflow:hidden de #englob */
    -webkit-transition:all 0.5s;/* Laissez comme ceci */
    -moz-transition:all 0.5s;/* Laissez comme ceci */
    -o-transition:all 0.5s;/* Laissez comme ceci */
    -ms-transition:all 0.5s;/* Laissez comme ceci */
    transition:all 0.5s;/* Laissez comme ceci */
}

#englob:hover > .infosp {
  opacity:1;/* Lorsque la souris passe sur la div #englob, on augmente l'opacité des infos */
  margin-left:0px;/* et on décale cette div à 0px (position par défaut) */
}

.pseudo :
{

      font-family: "Oswald";  /* Police de caractère */
      text-align: center; /* Alignement du texte */
      text-transform: uppercase; /* Transformation: met le texte en majuscules */
      font-weight: normal; /* Épaisseur normale */
      letter-spacing: 10px; /* Espacemement des caractères en PX */
      font-size: 20px; /* Grosseur du texte */
      text-shadow: 2px 2px 0px #FFFFFF; /* Ombre du texte */
  }


/*CHATBOX*/

#chatbox_members ul li,
#chatbox_members ul li a { font-size: 13px;
}

 /******************************************************************
MISE EN FORME DES CATÉGORIES : AFFICHER LES SOUS FORUMS EN COLONNE
-----------------------------------------
Code proposé sur CSSActif : http://www.css-actif.com
*[Début du CSS]****************************************************/

/* IMPORTANT : Ceci est la technique dite "clearfix" qui permet de forcer le conteneur des flottants à s'adapter à leur taille */
.BlocForum:after {
  display:table;
  content:"";
  clear:both;
}

/* Positionnement de la description des forums */
.DescForum {
  float:left; /* flottant à gauche */
  width:80%; /* largeur de 80% */
}

/* Positionnement de la liste des sous-forums */
.ListeSousForums {
  float:left; /* flottant à gauche */
  width:20%; /* largeur de 20% */
}

/* mise en page de la description des forums */
.DescForum > div {
  background:#fff; /* couleur de fond */
  padding:5px; /* marges intérieures, entre le texte et le bord */
  text-align:justify; /* alignement du texte */
  /* des coins arrondis */
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px;
  /* un effet d'ombre */
  -webkit-box-shadow:1px 1px 2px 0px #000000;
  -moz-box-shadow:1px 1px 2px 0px #000000;
  box-shadow:1px 1px 2px 0px #000000;
}

.sousforum2 a {
  display:block; /* on transforme les liens en blocs */
  padding:2px 2px; /* marges internes haut/bas et droite/gauche */
  margin:2px 0px; /*marges externes haut/bas et droite/gauche */
}

/*[fin du CSS]*****************************************************
MISE EN FORME DES CATÉGORIES : AFFICHER LES SOUS-FORUMS EN COLONNE
*******************************************************************/

/*TRANSFORMATION DES IMAGES*/

.rotate{
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  -o-transition-duration: 0.8s;
  transition-duration: 0.8s;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  -o-transition-property: -o-transform;
  transition-property: transform; 
  overflow:hidden;} 

.rotate:hover  {
  -webkit-transform:rotate(360deg);
  -moz-transform:rotate(360deg);
  -o-transform:rotate(360deg);}

.opacity img{
    opacity: 0.6;
-moz-opacity: 0.6;
-khtml-opacity: 0.6;
filter: alpha(opacity=60);} 

.opacity img:hover  {
  opacity: 1;
-moz-opacity: 1;
-khtml-opacity: 1;
filter: alpha(opacity=100)
transition:all 0s 10s;
-webkit-transition:all 0s 10s;
-o-transition:all 0s 10s;}

/*BARRE DE NAVIGATION BITCHES*/
        a.mainmenu {
        text-decoration: none;
        color:#cf540f;
        font-size:20px;
        font-family:Arno Pro;
        text-align:center;
  text-shadow: 2px 2px 5px black;
padding: 0px;}