Ajouter une image de séparation des forums

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Ajouter une image de séparation des forums

Message par Xibition le Sam 28 Juil - 5:03

Bonsoir j'aimerais ajouter cette image : http://i47.servimg.com/u/f47/16/77/36/23/barre10.png

ici (en rouge) : http://img11.hostingpics.net/pics/244173GRAPHPERLE.png

C'est à dire juste en dessous des liens des modérateurs Very Happy

Merci d'avance Flowers2

mon template index_box :
Code:
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
  <tr>
      <td valign="bottom">
        <!-- BEGIN switch_user_logged_in -->
     
        <!-- END switch_user_logged_in -->
        <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
      </td>
      <td class="gensmall" align="right" valign="bottom">
        <!-- BEGIN switch_user_logged_in -->
        <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a> ♦
        <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a> ♦
        <!-- END switch_user_logged_in -->
        <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
      </td>
  </tr>
</table>
<!-- BEGIN catrow --><!-- BEGIN tablehead --><center><table class="forumlineac" width="95%" border="0" cellspacing="0" cellpadding="0"></center>
  <tr>
    <td colspan="3" nowrap="nowrap" width="100%" class="fondhaut"> {catrow.tablehead.L_FORUM} </td>
  </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"> </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="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
        <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
      </td>
      <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
        <h{catrow.forumrow.LEVEL} class="hierarchy">
            <span class="forumlink">
              <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
            </span>
        </h{catrow.forumrow.LEVEL}>
                  <div class="stats"><span class="gensmall">Il y a {catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets.</span></div>
        <table width="100%">
                          <tr>
                            <td><div class="descrip"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div>
        <span class="gensmall">
            <!-- BEGIN switch_moderators_links -->
            {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
            <!-- END switch_moderators_links --></span></td>
                            <td><img src="http://i45.servimg.com/u/f45/16/75/16/53/liens10.png" /></td>
            <td><div class="liens" id="subforums">
                                  {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}<script type="text/javascript">jQuery('#subforums').html(jQuery('#subforums').html().replace(/, /g,'<br />')).removeAttr('id');</script></div>
                            </td>
                          </tr>
                  </table> 
      </td>
      <td class="row3 over" align="center" valign="middle" height="50">
        <div class="lastm"><div class="texte-stat"> <span class="gensmall"><div class="derniermess">Dernier message</div><br /><br /><br /><br />
        {catrow.forumrow.LAST_POST}</span></div></div>
      </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 -->
<tr><td height="65" colspan="3"><div class="fondbas"></div></td></tr>
</table><br /><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->


Dernière édition par jiji98 le Sam 28 Juil - 6:53, édité 1 fois

Xibition
****

Féminin
Messages : 457
Inscrit(e) le : 23/05/2011

Xibition a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une image de séparation des forums

Message par Milouze14 le Sam 28 Juil - 5:58

Salut jiji98,


Juste après :
Code:
<span class="gensmall">
<!-- BEGIN switch_moderators_links -->
{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
<!-- END switch_moderators_links --></span>
Mets un saut de ligne:
Code:
<br>
Puis ton image :
Code:
<img src="http://i47.servimg.com/u/f47/16/77/36/23/barre10.png"align="absmiddle">

Ton template modifié:
supprimes tout le contenu de ce template et insères celui-ci Wink :


Code:
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
          <tr>
              <td valign="bottom">
                <!-- BEGIN switch_user_logged_in -->
           
                <!-- END switch_user_logged_in -->
                <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
              </td>
              <td class="gensmall" align="right" valign="bottom">
                <!-- BEGIN switch_user_logged_in -->
                <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a> ♦
                <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a> ♦
                <!-- END switch_user_logged_in -->
                <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
              </td>
          </tr>
        </table>
        <!-- BEGIN catrow --><!-- BEGIN tablehead --><center><table class="forumlineac" width="95%" border="0" cellspacing="0" cellpadding="0"></center>
          <tr>
            <td colspan="3" nowrap="nowrap" width="100%" class="fondhaut"> {catrow.tablehead.L_FORUM} </td>
          </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"> </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="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
                <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
              </td>
              <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
                <h{catrow.forumrow.LEVEL} class="hierarchy">
                    <span class="forumlink">
                      <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>
                    </span>
                </h{catrow.forumrow.LEVEL}>
                          <div class="stats"><span class="gensmall">Il y a {catrow.forumrow.POSTS} messages dans {catrow.forumrow.TOPICS} sujets.</span></div>
                <table width="100%">
                                  <tr>
                                    <td><div class="descrip"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span></div>
                <span class="gensmall">
                    <!-- BEGIN switch_moderators_links -->
                    {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
                    <!-- END switch_moderators_links --></span><br>
                                <img src="http://i47.servimg.com/u/f47/16/77/36/23/barre10.png"align="absmiddle">     
                                     
                                      </td>
                                    <td><img src="http://i45.servimg.com/u/f45/16/75/16/53/liens10.png" /></td>
                    <td><div class="liens" id="subforums">
                                          {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}<script type="text/javascript">jQuery('#subforums').html(jQuery('#subforums').html().replace(/, /g,'<br />')).removeAttr('id');</script></div>
                                    </td>
                                  </tr>
                          </table>
              </td>
              <td class="row3 over" align="center" valign="middle" height="50">
                <div class="lastm"><div class="texte-stat"> <span class="gensmall"><div class="derniermess">Dernier message</div><br /><br /><br /><br />
                {catrow.forumrow.LAST_POST}</span></div></div>
              </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 -->
        <tr><td height="65" colspan="3"><div class="fondbas"></div></td></tr>
        </table><br /><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->



Pense a enregistrer les modifications en cliquant respectivement sur et


a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4565
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une image de séparation des forums

Message par Xibition le Sam 28 Juil - 6:07

bonsoir, merci pour votre réponse Very Happy

Donc j'ai essayé de faire ca mais ca déforme tout :/

regardez : http://img11.hostingpics.net/pics/602013GRAPHPERLE.png

Xibition
****

Féminin
Messages : 457
Inscrit(e) le : 23/05/2011

Xibition a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une image de séparation des forums

Message par Milouze14 le Sam 28 Juil - 6:09

Re,
il me faudrait l'intégralité de ta feuille de style (C.S.S) stp Wink .

a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4565
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une image de séparation des forums

Message par Xibition le Sam 28 Juil - 6:29

d'accord, attention les yeux .. x)

Code:
body {
background-repeat: no-repeat;
  background-color: #f1e07f;
  background-position: center top;
    cursor: crosshair;
}
/*BOUTONS REPONSE*/
button.button2, input.button2 {
border: 1px solid #F5DEAE;
font-family: Tahoma;
font-size: .7em;
overflow: visible;
padding: 1px 0;
vertical-align: middle;
width: auto!important;
background-color: #FFF6D3;
border-radius: 5px;
}

.fontbutton_normal {
background-color: rgba(233, 163, 116, 0.5);
  border-top-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.fontbutton_selected {
background: rgba(230, 143, 86, 0.5);
border-top-left-radius: 5px;
border-bottom-right-radius: 5px;
  border: none;
}
.fontbutton_hover {
background: rgba(230, 143, 86, 0.5);
border-top-left-radius: 5px;
border-bottom-right-radius: 5px;
  border: none;
}
/*GROUPES DU QEEL*/
.BlocGroupes {
  background:url('http://img15.hostingpics.net/pics/695209groupes.png') top center no-repeat;
  width:292px;
  height:281px;
  position:relative;
  float: left;
}
.BlocGroupesContent {
  padding:80px 40px 10px 50px;
  text-align:center;
}
/*FIN*/
td.row1, td.row3.over:hover {
background-color: rgba(255, 250, 207, 0);
}
.postbody {
font-size: 10px;
line-height: 18px;
min-height: 500px;
}

/*PLUS D'INFOS POST*/
.Bouton .PartieCachee {
  height:0;
  overflow:hidden;
  -webkit-transition:All 1s ease;
  -moz-transition:All 1s ease;
  -o-transition:All 1s ease;
  text-align: center;
margin-left: 215px;
}


.Bouton:hover .PartieCachee {
height: 30px;
text-align: center;
margin-left: 215px;
}

/*EN SAVOIR PLUS INFO PROFIL*/

.Boutons .PartieCache {
overflow: hidden;
-webkit-transition: All 1s ease;
-moz-transition: All 1s ease;
-o-transition: All 1s ease;
height: 0px;
width: 0px;
background-color: rgba(241, 220, 154, 0.9);
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-webkit-transition: height 0.5s linear, margin 0.5s linear, width 0.5s linear 0.5s;
-moz-transition: height 0.5s linear, margin 0.5s linear, width 0.5s linear 0.5s;
-o-transition: height 0.5s linear, margin 0.5s linear, width 0.5s linear 0.5s;
-ms-transition: height 0.5s linear, margin 0.5s linear, width 0.5s linear 0.5s;
transition: height 0.5s linear, margin 0.5s linear, width 0.5s linear 0.5s;
position: absolute;
z-index: 15;
  box-shadow:0px 0px 5px 5px rgba(236, 206, 118, 0.22), 0px 0px 5px 5px rgba(252, 232, 167, 0.28);
}
.Boutons:hover .PartieCache {
  height: 200px;
width: 200px;
  overflow:auto;
  padding: 10px;
}

/*FIN*/

.descrisujet {
color: #A54E4E;
font-size: 10px;
font-family: trebuchet ms;
word-spacing: 3px;
}


th {
background-color: #FFFACF;
background-image: url(http://illiweb.com/fa/empty.gif);
color: #DA895C;
font-size: 13px;
font-weight: 700;
padding: 10px 3px;
font-family: Sancreek, cursive;
text-transform: lowercase;
text-decoration: underline;
border-bottom: 1px dashed #FFCCB0;
}
a:link{
text-decoration: none !important;
cursor: ne-resize;
-webkit-transition: all 0.4s ease-in;
-moz-transition: all 0.4s ease-in;
-o-transition: all 0.4s ease-in;
transition: all 0.4s ease-in;
  color: #BB6925;
}

a:hover{
text-decoration: none !important;
cursor: ne-resize;
-webkit-transition: all 0.4s ease-in;
-moz-transition: all 0.4s ease-in;
-o-transition: all 0.4s ease-in;
transition: all 0.4s ease-in;
 color: #e27113;
}
a:link, a:active, a:visited {
text-decoration: none !important;
  color: #BB6925;
}
 
.gen {
    font-size : 10px;
    }
.genmed {
    font-size : 10px;
    }
.gensmall {
    font-size : 10px;
    }
.gen,.genmed,.gensmall {
    color : #B39046;
    }
a.gen,a.genmed,a.gensmall {
    color: #B39046;
    text-decoration: none;
    }
a.gen:hover,a.genmed:hover,a.gensmall:hover{
    color: #e27113;
    text-decoration: none !important;
      cursor: help;
    }
a.mainmenu {
font-family: arial;
text-transform: uppercase;
color: #5F3329;
letter-spacing: 3px;
text-shadow: 0px 1px 0px #F1DAC1;
  -webkit-transition: padding-left .20s linear .1s, color .20s linear .1s, background-color .20s linear .1s;
transition: padding-left .20s linear .1s;
}

a.mainmenu:hover{
  padding-top: 3px;
  background-image: url('http://icons.iconarchive.com/icons/aha-soft/jewelry/16/Gem-icon.png');
background-position: 5% 15%;
background-repeat: no-repeat;

}

/*MES CATEGORIES*/
 
/*contour*/
.forumlineac{
 width: 812px;
  padding-left: 3px;
  padding-right: 3px;
}

/*image du haut*/
.fondhaut {
background-image: url(http://img4.hostingpics.net/pics/401196ENteete.png);
background-position: center;
background-repeat: no-repeat;
height: 136px;
}
 
/*apparence des titres des catégories*/
.fondhaut h2 {
-webkit-transition: padding-left .2s linear .1s, color .2s linear .1s, background-color .2s linear .1s;
color: #B67E36;
font-family: Times New Roman;
font-size: 20px;
letter-spacing: -3px;
line-height: 80%;
margin-top: 10px;
text-align: center;
text-shadow: 0 1px 0 #ECC5B5;
text-transform: uppercase;
transition: padding-left .2s linear .1s;
}
 
/*sous-forums*/
.liens {
display: block;
font-size: 17px;
color: #C4A96D;
word-spacing: 3px;
font-family: arial;
text-shadow: white 1px 1px 2px;
text-align: left;
width: 100px;
height: 130px;
overflow: auto;
outline: none;
background-color: #FEFDC6;
padding: 5px 5px 5px 5px;
border-radius: 10px;
border-left: 2px solid rgba(255, 223, 194, 0.56);
}
 
.liens:hover{
  color: #F6AD69;
display: block;
  cursor: crosshair;
-webkit-transition: all 0.4s ease-in;
-moz-transition: all 0.4s ease-in;
-o-transition: all 0.4s ease-in;
transition: all 0.4s ease-in;
}

/*TEXTE DERNIER MESSAGE*/

.derniermess {
color: rgba(243, 195, 123, 0.78);
font-family: 'Sue Ellen Francisco', cursive;
font-size: 18px;
font-style: italic;
font-weight: 700;
letter-spacing: -1px;
margin-top: -82px;
text-shadow: white 0 2px 0;
text-transform: lowercase;
text-decoration: underline;
}
/*partie centrale*/
.centrefo{
  width: 100%;
  height: 120px;
  padding: 5px;
  margin: 10px;
background-color: #fefdc6;
border-left: 3px solid #f3eaa8;
border-right: 3px solid #f3eaa8;
border-radius: 7px 7px 7px 7px;
  text-align: justify;
}

.centrefo:hover{background-color: #fefdc6;
border-left: 3px solid #b8d46c;
border-right: 3px solid #b8d46c;
border-radius: 7px 7px 7px 7px;
  text-align: justify;
}
 
 



/*image du bas*/
.fondbas{
  height: 67px;
  background-image: url('http://i45.servimg.com/u/f45/16/75/16/53/footer10.png');
  background-position:  center;
  background-repeat: no-repeat;
  }
 
.lastm{
background-image: url(http://img15.hostingpics.net/pics/510513lienss.png);
padding-top: 15px;
width: 170px !important;
padding-bottom: 15px;
text-align: center;
  height:90px;
}
 
.texte-stat{
margin-top:20%;
}

.descrip{
height: 110px;
 width: 280px;
text-align: justify;
overflow-y: auto;
  margin: 5px;
padding: 5px;
  background-color: #fefdc6;
}

.descrip:hover{
  -webkit-transition: background 2s ease;
      -moz-transition: background 2s ease;
        -ms-transition: background 2s ease;
        -o-transition: background 2s ease;
      transition: background 2s ease;
}
 
.stats{
text-align: center;
width: 200px;
margin: auto;
padding: 3px;
}
 
.mod-text {
font-weight: 700;
color: rgba(247, 178, 103, 0.51);
font-family: trebuchet ms;
}
 
/* -------- TITRE FORUM ------ */
.forumlink {
color: #D1A781;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease;
font-weight: normal;
font-size: 20px;
font-family: 'Sancreek', cursive;
text-transform: uppercase;
margin-left: 80px;
text-align: center;
letter-spacing: -3px;
font-size: 35px;
}
/* -------- TITRE FORUM AU SURVOL ------ */
.forumlink:hover{
margin-left: 100px;
}
.M14_bordure_forum
{
  -moz-box-shadow: 0px 0px 7px #bb8e66;
-webkit-box-shadow: 0 0 3px #602B11;
padding:10px 5px 10px 5px ;
border-radius: 60px;
-moz-border-radius: 60px;
-webkit-border-radius: 60px;
-khtml-border-radius: 60px;
-moz-box-shadow: 0px 0px 7px #bb8e66;
background-color: #FFFACF;
border: 2px white solid;
  width: 850px;
}


/*MESSAGES*/
.posts {
font-size: 8px;
font-weight: bold;
text-transform: uppercase;
color: #B3A78C;
word-spacing: 3px;
font-family: tahoma;
}
/*SUJETS*/
.topics {
  font-size: 8px;
font-weight: bold;
text-transform: uppercase;
color: #B3A78C;
word-spacing: 3px;
font-family: tahoma;
}
 


 
.navig {
top: 0px;
  z-index: 20;
position: fixed;
filter: alpha(opacity=80);
-moz-opacity: 0.8;
opacity: 0.8;
background-color:
#f1e07f;
position: fixed;
top: 0px;
left: 0px;
width: 100%;
padding: 3px;
border-bottom: 5px #E6D274 double;
-moz-box-shadow: 0px 2px 3px #888;
-webkit-box-shadow: 0px 2px 3px #888;
filter: alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;

  word-wrap: break-word;
}
.navig:hover {z-index: 10;
filter: alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
position: fixed;
top: 0px;
width: 100%;
background-color:
#f1e07f;
  -moz-transition-property: opacity;
-webkit-transition-property: opacity;
-o-transition-property: opacity;
-moz-transition-duration: 2s;
-webkit-transition-duration: 2s;
-o-transition-duration: 2s;
}


/* FORMULAIRE DE CONNEXION RAPIDE AMÉLIORÉ de ORANGE pour CSSACTIF (css-actif.com) - Merci de ne pas retirer */



.cssactif_connexrapide {
  /* Style général: à modifier à votre guise ! */
  background:url(http://theme3.cssactif.com/js/slider/img/sample_slides/thumb_about.png) no-repeat left center
    ; /* Ajoute une icône de fond no-répétée à gauche et une couleur de fond */
    padding-left: 48px; /* Donne la marge pour l'icône de fond */
  /* Bordure du formulaire */
  margin: 5px; /* Espacement entre le formulaire et le contenu voisin */
  /*Arrondissement des bordures */
  -webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;

/* Ombre portée de la boîte */
-webkit-box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.1);
 
  /* Style du texte intérieur */
  font-size: 12px;
  color: #bc7f05;


 
}

.cssactif_connexrapide_form { /* Correspond à la cellule qui contient le formulaire comme tel */
 text-align: center;
   
}
.cssactif_connexrapide_form input.post{ /* Correspond aux entrées de texte qui contiennent les informations de connexion */
 margin-bottom: 3px; /* Marge qui empêche que les champs de se toucher  */
 
 /* Style des entrées: à modifier à votre guise ! */
 background-color: #fef0bd;
 border: 1px solid #edae0c;
 padding: 3px;
 
 -webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;

-webkit-box-shadow: 0px 1px 0px 0px #fef0bd;
-moz-box-shadow: 0px 1px 0px 0px #fef0bd;
box-shadow: 0px 1px 0px 0px #fef0bd;

font-size: 11px;
color: #bc7f05;
}

.cssactif_connexrapide_form input.mainoption{ /* Correspond au bouton "Connexion" */
 
    /* Style du bouton: à modifier à votre guise ! */
  background-color: #fef0bd;
 
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
 
  border: none;
  border-bottom: 2px solid #edae0c;
 
}

.cssactif_connexrapide_form input.mainoption:active { /* Correspond au bouton "Connexion" lors du clic */

    /* Style du bouton lors du clic: à modifier à votre guise ! */

border: none;
border-top:  2px solid #edae0c;
}

/* FIN du FORMULAIRE DE CONNEXION RAPIDE AMÉLIORÉ */

/*QEEL*/
.tableauqueel{
background-color : #COLOR ;
border : solid Xpx #COLOR ;
-moz-border-radius : Xpx Xpx Xpx Xpx}

.partiedroite {
font-size : 12px ;
border-left : Xpx dotted #COLOR ;
padding-left : 10px;
}


.tableqeel1{
  height: 220px;
  width: 250px;
  margin-left: 93px;
  margin-top: -60px;
}

.tableqeel2{
  height: 170px;
  width: 270px;
  margin-left: -360px;
  margin-top: -130px;
}
/*BARRE DE DEFILEMENT*/
::-webkit-scrollbar {
background-color: #F0BC6F;
height: 15px;
width: 5px;
}
::-webkit-scrollbar-thumb {
background-color: #CE8848;
border-radius: 10px;
-webkit-border-radius: 10px;
}
::-webkit-scrollbar-button {

}
::-webkit-scrollbar-track {
background-color: #E4D56C;
}
/*PA PA PA*/

.ongletpa{            /* bordure img onglet  */
    cursor:pointer;
    display:inline-block;
}


.toggleopacity:hover {
filter:alpha(opacity=100);
-moz-opacity:1;
-khtml-opacity: 1;
opacity: 1;
}
/* contenu du menu */
 
.contenu_onglet{
margin-top: 0px;
margin-bottom: 0px;
    font-weight:bold;
    padding:0px;
    display:none;
  width: 330px;
height: 175px;
}

.cynthia {
  background-color:
#F9FAF5;
border-right: 4px solid
#F2EDDA;
border-left: 4px solid
#F2EDDA;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 0px 0px 1px #FFFFFF;
margin-top: 0px;
margin-bottom: 0px;
width: 330px;
height: 90px;
background-image: url(http://i45.servimg.com/u/f45/16/75/16/53/cynthi10.png);
}

.desc1 {
background-color: rgba(197, 144, 7, 0.1);
border-right: 4px solid #F5E6AC;
border-left: 4px solid #F5E6AC;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 0px 0px 1px #f9faf5;
margin-top: 0px;
margin-bottom: 0px;
width: 330px;
height: 35px;
letter-spacing: -1px;
word-spacing: 2px;
font-size: 18px;
line-height: 12px;
font-family: times new roman;
color: #DF3E0B;
text-shadow: 0px 0px 1px;
text-align: center;
text-transform: uppercase;
}
.desc2{

}
.nathan {
-moz-border-radius: 5px;
-webkit-border-radius: 40px;
align: center;
margin-left: 0;
margin-right: 0;
opacity: 1;
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 500ms;
}

.nathan:hover {
opacity: .5;
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 500ms;
}
.window {
  background-color:
#F9FAF5;
border-right: 4px solid
#F2EDDA;
border-left: 4px solid
#F2EDDA;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 0px 0px 1px #FFFFFF;
margin-top: 0px;
margin-bottom: 0px;
width: 330px;
height: 90px;
background-image: url(http://i45.servimg.com/u/f45/16/75/16/53/window10.png);
}

.sofia {
  background-color:
#F9FAF5;
border-right: 4px solid
#F2EDDA;
border-left: 4px solid
#F2EDDA;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 0px 0px 1px #FFFFFF;
margin-top: 0px;
margin-bottom: 0px;
width: 330px;
height: 90px;
background-image: url(http://i45.servimg.com/u/f45/16/75/16/53/moi10.png);
}

.xiang {
  background-color:
#F9FAF5;
border-right: 4px solid
#F2EDDA;
border-left: 4px solid
#F2EDDA;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 0px 0px 1px #FFFFFF;
margin-top: 0px;
margin-bottom: 0px;
width: 330px;
height: 90px;
background-image: url(http://i45.servimg.com/u/f45/16/75/16/53/xiang10.png);
}

.lana {
  background-color:
#F9FAF5;
border-right: 4px solid
#F2EDDA;
border-left: 4px solid
#F2EDDA;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 0px 0px 1px #FFFFFF;
margin-top: 0px;
margin-bottom: 0px;
width: 330px;
height: 90px;
background-image: url(http://img11.hostingpics.net/pics/929177lana.png);
}

.kim {
  background-color:
#F9FAF5;
border-right: 4px solid
#F2EDDA;
border-left: 4px solid
#F2EDDA;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 0px 0px 1px #FFFFFF;
margin-top: 0px;
margin-bottom: 0px;
width: 330px;
height: 90px;
background-image: url(http://img11.hostingpics.net/pics/456419kim.png);
}

.burberry{
  background-color:
#F9FAF5;
border-right: 4px solid
#F2EDDA;
border-left: 4px solid
#F2EDDA;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px 15px 15px 15px;
-moz-box-shadow: 0px 0px 1px #FFFFFF;
margin-top: 0px;
margin-bottom: 0px;
width: 330px;
height: 90px;
background-image: url(http://img15.hostingpics.net/pics/434222burberry.png);
}
 
/*Personnalisation du Profil*/
.profilentour {
background: url(http://img4.hostingpics.net/pics/182297382620fond1.png) no-repeat;
height: 295px;
margin-top: -20px;
width: 231px;
}
 
.profil_bas {
background: url(http://img4.hostingpics.net/pics/594225709263fond3.png) no-repeat;
height: 100px;
margin-left: 2px;
width: 231px;
z-index: 5;
}
.profil_milieu {
background: url(http://img4.hostingpics.net/pics/396506455506fond2.png);
background-repeat: repeat-y;
height: auto;
margin-top: 0;
position: relative;
width: 231px;
z-index: 10;
}
/*AVATAR*/

.postdetails.poster-profile a img {
-moz-border-radius: 14px;
-moz-opacity: .8;
-ms-filter: alpha(opacity=80);
-webkit-border-radius: 14px;
border-radius: 14px;
cursor: ne-resize;
filter: alpha(opacity=80);
margin-top: -30px;
opacity: .8;
height: 320px;
width: 200px;
}


.postdetails.poster-profile a img:hover{
  opacity: 1;
  cursor: ne-resize;
  -webkit-border-radius: 14px;
-moz-border-radius: 14px;
border-radius: 14px;
  height: 320px;
width: 200px;
}
/*Personnalisation du Rang*/
.onglet_rang {
height: 50px;
margin-top: 50px;
padding: 30px 3px;
}
 
.sous_rang{ border-top: 1px solid #DEC36E;
color: #B8A054;
font-family: times new roman;
font-size: 8px;
text-align: center;
text-transform: uppercase;
width: 175px;
margin-left: 30px;
}


/*Personnalisation du Pseudo*/
.pseudo_membre {
background: url(http://img15.hostingpics.net/pics/308628fondpseudo.png) no-repeat;
color: #2D2926!important;
cursor: ne-resize;
font-family: time new roman;
font-size: 13px;
height: 53px;
margin-left: -2px;
margin-top: -180px;
padding-top: 29px;
position: relative;
text-align: center;
text-shadow: 1px 0 1px white!important;
text-transform: uppercase;
width: 237px;
word-spacing: 2px;
z-index: 10;
}

.profileinfo{
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
border-right: 3px
#F6CCA6 solid;
border-left: 3px
#F6CCA6 solid;
padding-left: 15px;
padding-right: 15px;
padding-top: 5px;
padding-bottom: 5px;
background-color:
#F9F0E5;
-moz-box-shadow: #DAC6B2 0px 1px 1px;
-webkit-box-shadow:
#DAC6B2 0px 1px 3px;
box-shadow:
#DAC6B2 0px 1px 1px;
}
.profileinfo:hover{
  -moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
border-right: 3px
#F6CCA6 solid;
border-left: 3px
#F6CCA6 solid;
padding-left: 15px;
padding-right: 15px;
padding-top: 5px;
padding-bottom: 5px;
background-color:
#F9F0E5;
-moz-box-shadow: #DAC6B2 0px 1px 1px;
-webkit-box-shadow:
#DAC6B2 0px 1px 3px;
box-shadow:
#DAC6B2 0px 1px 1px;
}



 

/*offline*/

#onoutline {
background: url('http://i45.servimg.com/u/f45/16/75/16/53/off12.png') no-repeat;
position: absolute;
float: left;
width: 57px;
height: 45px;
margin-left: -55px;
margin-top: 50px;
    z-index: 10;
}

    .fleche {
    background-image: url('http://img15.hostingpics.net/pics/919076FLECHE.png');
width: 39px;
height: 20px;
position: relative;
top: 100px;
left: 18px; }
    .bulle {
-khtml-border-radius: 30px;
-moz-border-radius: 30px;
-moz-box-shadow: #BFAD9B 1px 1px 2px;
-webkit-border-radius: 30px;
-webkit-box-shadow: #83613E 1px 1px 4px;
background-color: rgba(250, 223, 138, 0.36);
border-radius: 30px;
box-shadow: #EBD08D 1px 1px 7px 1px;
margin-left: 50px;
margin-top: 10px;
padding: 12px 12px 32px;
width: 500px;
}
.auteur{
  text-align: left;
  font-size: 8px;
font-weight: bolder;
text-transform: uppercase;
color: #DFAB5E;
}
.vues {
font-size: 8px;
font-weight: bolder;
text-align: center;
text-transform: uppercase;
color: #DFAB5E;
}
.dernier{
 border: none;
border-top: 1px dashed #BDB95C;
}

.postdetails {
color: #DA895C;
font-size: 8px;
font-weight: 700;
}


/*INFOBULLE PROFIL*/

 div.infobulle_profil div {
display:none; /*pour que l'infobulle ne soit pas visible*/
}

div.infobulle_profil:hover {
background: none; /* pour corriger un bug present sur IE */
z-index: 999; /* l'ordre d'affichage*/
cursor: hand; /* pour modifier le curseur */
position: relative; /*position*/
text-decoration:none; /*pas de soulignement du texte*/
border: 0; /*bordure*/
}

div.infobulle_profil:hover div {
font-style: normal; /* style de la police */
font-size: 10px; /* taille de la police */
color: #C9785E!important; /* couleur de la police */
padding: 10px; /* espace intérieur, entre le texte et la bord */
display: block; /* on le défini en block */
position: absolute; /* position */
top: 50px; /* placer l'infobulle à 130px du haut*/
left: 60px; /* pour placer l'infobulle à 100px vers la gauche */
background-color: rgba(241, 220, 154, 0.9);
box-shadow: 0px 0px 5px 5px rgba(241, 220, 154, 0.9);
 border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
width: 220px; 
}

/*FICHE */



/*boutons du fofo*/
input {
background-color: #fef0bd;
 
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
 
  border: none;
  border-bottom: 2px solid #edae0c;
}
input, select, textarea {
border-width: 1px;
}

#text_editor_iframe, input, select, textarea {
ackground-color: #fef0bd;
 
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
 
  border: none;
  border-bottom: 2px solid #edae0c;
}


/*SELECTION DU TEXTE*/
 ::selection {
background: #ECD58D;
color: white;
}
/*BOUTON AFFICHER MASQUER*/
.bouton-profil {
    cursor: pointer; /* curseur au survol */
    margin: 2px 0; /* petite marge en haut et en bas */
    padding: 2px; /* espacement entre le texte et la bordure */
    text-align: center; /* centrage du texte dans le bloc */
  /* -- mise en forme -- */
 background: #ECD0A5;
border-radius: 10px;
box-shadow: 0 0 5px rgba(182, 123, 77, 0.74), 0 -1px 0 rgba(209, 36, 36, 0.39);
color: #C9853A;
font-family: Times New Roman;
font-size: 17px;
font-style: italic;
font-weight: bolder;
height: 13px;
letter-spacing: -2px;
text-align: center;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
width: 100px;
word-spacing: 6px;
margin-top: -29px;
margin-left: 60px;
padding: 2px 6px 9px 6px;

}

.bouton-profil:hover{  color: #A86923;

  }


.profil-cache {
color: #CC845C;
font-family: trebuchet ms;
font-size: 10px;
font-weight: normal;
height: 84px;
margin-left: 0;
padding: 2px;
position: absolute;
width: 300px;
text-align: center;
}

/*SPOILER QUOTE CODE*/

.spoiler_closed {
background-color: #FFF6D5;
border: #F0DAA2;
border-style: solid;
border-width: 1px;
color: #FD5A23;
display: block;
font-family: Tahoma;
font-size: 10px;
line-height: 125%;
border-bottom-left-radius: 10px;
border-top-right-radius: 10px;

}
.spoiler_content {
background-color: #FFF6D5;
border: #F0DAA2;
border-style: solid;
border-width: 1px;
color: #FC5A24;
display: block;
font-family: Tahoma;
font-size: 10px;
line-height: 125%;
border-bottom-left-radius: 10px;
border-top-right-radius: 10px;
overflow: auto;
}
/* ------------ LISTE DES SUJETS ------------ */

.sujet_tfa {
color: #E6C36B;
font-family: Sancreek, cursive;
font-size: 17px;
font-weight: 700;
letter-spacing: 8px;
line-height: 66px;
padding-top: 10px;
text-align: center;
text-shadow: 0 0 1px #925023;
vertical-align: middle;
width: 100%;
}
/* configuration de la premiere lettre du titre de la liste des sujets */
.sujet_tfa::first-letter {
color: #F0B358!important;
font-size: 30px;
font-weight: 700;
}
/* fond liste des sujets */
.espace-tfa {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
margin: 10px;
}


/* ------------ BLOC RUBAN ------------ */

.top_cat {
position: relative;
width: 100%;
height: 66px;
vertical-align: bottom;
margin: 0;
padding: 0;
margin-top: 20px;
}
.tfa_cat_gauche {
background: url(http://img15.hostingpics.net/pics/504122cot2.png) no-repeat transparent;
height: 66px;
left: -24px;
margin: 0;
padding: 0;
position: absolute;
width: 24px;
}
.tfa_cat_droite {
background: url(http://img15.hostingpics.net/pics/348350cot.png) no-repeat transparent;
height: 66px;
margin: 0;
padding: 0;
position: absolute;
right: -24px;
width: 24px;
}
.tfa_cat_center {
background: url(http://img15.hostingpics.net/pics/441585barree.png) repeat-x scroll center bottom transparent;
bottom: 0;
height: 66px;
line-height: 66px;
margin: 0;
padding: 0;
}

/* Slide New sujet - Code par Quierra themes-fa.com - 18/01/2011 - */
div#New_sujet {
list-style: none;
margin: 0;
padding: 0;
position: fixed;
right: -3px;
top: 80px;
z-index: 999;
}

div#New_sujet ul {
width: 200px; /* largeur totale du slide */
background: transparent;
margin-left: -40px;
/margin-left: 0px;
}

div#New_sujet ul li{
background: transparent;
display:block;
position: relative;
width: 200px; /* largeur totale */
height:300px; /* hauteur totale */
}

div#New_sujet #comments_scroll_div {
border: 1px solid #FFE680;
color: #EBCACD;
font-family: Arial;
font-size: 10px;
height: 300px;
padding: 5px 1px 5px 0;
width: 158px;
border-top-left-radius: 50px;
border-bottom-right-radius: 50px;
background-color: rgba(245, 224, 139, 0.89);
}
div#New_sujet #comments_scroll_container{
width: 148px !important; /* largeur du scroll, mettre une largeur plus petite que la cellule qui le contient pour éviter les débordements */
color: #D57041;
}


div#New_sujet #comments_scroll_div a {
color: #CE883D;
font-family: trebuchet ms;
font-size: 12px;
font-weight: bolder;
letter-spacing: -2px;
word-spacing: 4px;
text-align: center;
}
div#New_sujet #comments_scroll_div a:hover {
color: #B83F10;
text-align: center;
}
div#New_sujet .td_2{
background: transparent; /* couleur de fond de la cellule contenant la barre d'ouverture */
}


/*HAUT ET BAS BOUTONS*/
/* bloc contenant les boutons */
.top_bottom {
padding: 8px;
position: fixed;
right: 0;
z-index: 999;
bottom: 30px;
}
/* bloc au survol */
.top_bottom:hover{   

}
/* bouton haut */
.haut{
display: block;
width:18px;
height:22px;
background:url(http://img15.hostingpics.net/pics/150952fleche1.png) no-repeat 0 0;
}
/* bouton haut au survol */
.haut:hover{
background:url(http://img15.hostingpics.net/pics/150952fleche1.png) no-repeat 0 -22px;
}
/* bouton bas */
.bas{
display: block;
width:18px;
height:22px;
background:url(http://img15.hostingpics.net/pics/903111fleche2.png) no-repeat 0 0;
}
/* bouton bas au survol */
.bas:hover{
background:url(http://img15.hostingpics.net/pics/903111fleche2.png) no-repeat 0 -22px;
}

/* BLOC CONTENEUR CONNEXION */
#tfa_connexion{
  width: 250px; 
  position: fixed;   
  top: 0; 
  left: 10px;
  z-index: 999;
  margin: 0;
  padding: 0; 
}
/* LIEN LOGIN */
a #login_form{
  text-decoration: none;
}
#login_form {
  margin: 0;
  padding: 0;
}
/* CHAMPS DE REPONSE */
#login_boite input {
  background:#ededed;
  color: #000;
  width: 110px;
  padding: 2px;
  border: 1px solid #000;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -moz-box-shadow: 0px 0px 1px #000;
  -webkit-box-shadow: 0px 0px 1px #000;
  box-shadow: 0px 0px 1px #000;
}
/* TEXTE DE DROITE - LE LABEL - */
#login_boite label {
  color: #fff;
  font: 14px Arial;
  width: 130px;
  padding: 2px;
  text-shadow: 1px 1px 1px #000;
}
/* TEXTE DE DROITE - LE LABEL - AU SURVOL */
#login_boite label:hover{
  color: #9de00c;
}
/* BOUTON CONNEXION */
#login_boite #submit {   
  background: url(http://i25.servimg.com/u/f25/11/95/30/70/t410.jpg) #404040 top ;
  width: 200px;
  padding: 3px;
  border: 1px solid #000;
  font: bold 15px Arial;
  color: #000f1c;
  cursor: pointer;
  margin: 0 auto;
  margin-top: 10px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -moz-box-shadow: 0px 0px 1px #000;
  -webkit-box-shadow: 0px 0px 1px #000;
  box-shadow: 0px 0px 1px #000;
  text-shadow: 1px 0px 1px #fff;
}
/* BOUTON CONNEXION AU SURVOL */
#login_boite #submit:hover {   
  background: url(http://i25.servimg.com/u/f25/11/95/30/70/513.jpg);
  color: #002849;
}
/* BLOC DE CONNEXION */
#login_boite{
  background: url(http://i25.servimg.com/u/f25/11/95/30/70/mm12.jpg) #000;
  margin: 0 auto;
  margin-top: -1px;
  width: 250px;
  padding: 10px;
  border: 1px solid #707070;
  -webkit-border-radius: 0px 0px 15px 15px;
  -moz-border-radius:  0px 0px 15px 15px; 
  border-radius:  0px 0px 15px 15px;
  -moz-box-shadow: 0px 0px 5px #000;
  -webkit-box-shadow: 0px 0px 5px #000;
  box-shadow: 0px 0px 5px #000;
  display: none;
}
/* BOUTON SE CONNECTER */
.bouton_ouverture{
  background: url(http://i25.servimg.com/u/f25/11/95/30/70/mm12.jpg) #ff0000 center ;
  width: 120px;
  height: 25px;/min-height: 10px;
  border: 1px solid #707070;
  border-top: 0px;
  display: block;
  margin: 0 auto;
  padding: 4px;
  -webkit-border-radius: 0px 0px 15px 15px;
  -moz-border-radius:  0px 0px 15px 15px; 
  border-radius:  0px 0px 15px 15px;
  -moz-box-shadow: 0px 1px 5px #000;
  -webkit-box-shadow: 0px 1px 5px #000;
  box-shadow: 0px 1px 5px #000;
}
/* BOUTON SE CONNECTER - PARTIE TEXTE */
.bouton_ouverture{
  font: 14px Verdana; 
  text-align: center;
  text-decoration: none !important;
  color: #70a400 !important;
  uppercase: 1px;
  text-shadow: 1px 0px 1px #000;
}
/* BOUTON SE CONNECTER - PARTIE TEXTE AU SURVOL */
.bouton_ouverture:hover {
  color: #9de00c !important;
  uppercase: 2px;
  text-decoration: none !important;
  text-shadow: 1px 0px 1px #000;
}
.bouton_ouverture a{
 border: 0;
}



/*#################################DEBUT LIGHTBOX#####################################*/
/**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */
#jquery-overlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 90;
  width: 100%;
  height: 500px;
}
#jquery-lightbox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
  text-align: center;
  line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
  position: relative;
  background-color: #fff;
  width: 250px;
  height: 250px;
  margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
  position: absolute;
  top: 40%;
  left: 0%;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}
#lightbox-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
  width: 49%;
  height: 100%;
  zoom: 1;
  display: block;
}
#lightbox-nav-btnPrev {
  left: 0;
  float: left;
}
#lightbox-nav-btnNext {
  right: 0;
  float: right;
}
#lightbox-container-image-data-box {
  font: 10px Verdana, Helvetica, sans-serif;
  background-color: #fff;
  margin: 0 auto;
  line-height: 1.4em;
  overflow: auto;
  width: 100%;
  padding: 0 10px 0;
}
#lightbox-container-image-data {
  padding: 0 10px;
  color: #666;
}
#lightbox-container-image-data #lightbox-image-details {
  width: 70%;
  float: left;
  text-align: left;

#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
  display: block;
  clear: left;
  padding-bottom: 1.0em; 
}       
#lightbox-secNav-btnClose {
  width: 66px;
  float: right;
  padding-bottom: 0.7em; 
}
/*#################################FIN LIGHTBOX#####################################*/


/* BLOC CONTENANT L'INFOBULLE - L’ICÔNE */
.transition-tfax{
position: relative;
width: 68px;
margin: 10px auto;
padding: 0;
  display:inline;
}
.block_transitionx {
-moz-border-radius: 20px;
-moz-transition: width .5s linear 0.2s, height .5s linear 0.2s, padding .5s linear .2s;
-o-transition: width .5s linear 0.2s, height .5s linear 0.2s, padding .5s linear .2s;
-webkit-border-radius: 20px;
-webkit-transition: width .5s linear 0.2s, height .5s linear 0.2s, padding .5s linear .2s;
background: rgba(241, 220, 154, 0.9);
border: 0 dashed rgba(201, 170, 117, 0.48);
border-radius: 20px;
color: #E28A74;
font-family: arial;
font-size: 10px;
font-weight: bolder;
height: 0;
left: 10px;
overflow: hidden;
padding: 0;
position: absolute;
text-align: center;
top: 10px;
transition: width .5s linear 0.2s, height .5s linear 0.2s, padding .5s linear .2s;
width: 0;
z-index: 999;
}
.block_transitionx {
text-align: center;
font-size: 10px;
font-family: arial;
font-weight: bolder;
color: #E28A74;
}
/* INFOBULLE AU SURVOL */
.transition-tfax:hover .block_transitionx {
border-width: 1px;
height: 70px;
padding: 5px 5px 5px 5px;
width: 200px;
}
/* IMAGE (icône) */
.transition-tfax img {
position: relative;
z-index: 999;
left: 0;
bottom: 0;
-webkit-transition: all 1.5s ease; /* pour navigateur webkit */
-moz-transition: all 1.5s ease; /* pour navigateur mozilla */
-o-transition: all 1.5s ease; /* pour navigateur opera */
transition: all 1.5s ease; /* pour les navigateurs récents */
}
/* IMAGE (icône) AU SURVOL */
.transition-tfax:hover img {
-webkit-transform: rotate(-360deg);/* pour navigateur webkit */
-moz-transform: rotate(-360deg); /* pour navigateur mozilla */
-o-transform: rotate(-360deg);/* pour navigateur opera */
transform: rotate(-360deg); /* pour les navigateurs récents */
}
/* TITRE DANS INFOBULLE */
.block_transitionx h3 {
border-bottom: 3px double rgba(235, 149, 82, 0.48);
color: #E09B50;
font-family: Sancreek, cursive;
font-size: 17px;
font-style: normal;
font-variant: normal;
font-weight: normal;
margin: auto;
padding: 0;
text-align: center;
width: 96%;
}

/*ENLEVE LES BORDURES BLANCHES AUTOUR DES SUJETS*/
th.thBottom, th.thCornerL, th.thCornerR, th.thHead, th.thLeft, th.thRight, th.thSides, th.thTop {
border: #FFFACF;
border-style: solid;
font-weight: 700;
}
th.thBottom, th.thCornerL, th.thCornerR, th.thHead, th.thLeft, th.thRight, th.thSides, th.thTop {
border: #FFFACF;
border-style: solid;
font-weight: 700;
}


/*chatbox*/

 
body.chatbox {
    background-image: url('http://img11.hostingpics.net/pics/763633chat.png');
  background-repeat: repeat;
}
.chatbox_row_1 {
background-color: rgba(240, 215, 117, 0.52);
padding: 4px;
}
.chatbox_row_2 {
background-color: rgba(240, 215, 117, 0.52);
padding: 4px;
}

#chatbox_members .member-title {
background-color: #FFE680;
background-image: none;
color: #E06D03;
font-family: trebuchet ms;
font-size: 12px;
padding: .5em .25em;
text-align: center;
  border-bottom: 1px dashed #DFA845;
}

#chatbox_members {
border-right: 1px dashed #DFA845;
bottom: 30px;
overflow: auto;
position: absolute;
top: 30px;
width: 180px;
}
#chatbox p {
line-height: 0.8em;
color: rgba(211, 167, 27, 0.48);
}

td.cat, td.catBottom, td.catHead, td.catLeft, td.catRight, td.catSides {

background-image: url(http://illiweb.com/fa/empty.gif);
height: 28px;
}


.barrebas{
  float: center;
  background-image: url(http://i47.servimg.com/u/f47/16/77/36/23/barre10.png);
  height: 10px;
  width: 600px;
}

Xibition
****

Féminin
Messages : 457
Inscrit(e) le : 23/05/2011

Xibition a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une image de séparation des forums

Message par Milouze14 le Sam 28 Juil - 6:37

Re,
ton image est bien trop large 600px Wink .

Réduit sa taille à 200 px pour ne pas avoir de déformations Wink .


Edit:
je vois que dans ta css tu as déjà cette image:
Code:
.barrebas{
  float: center;
  background-image: url(http://i47.servimg.com/u/f47/16/77/36/23/barre10.png);
  height: 10px;
  width: 600px;
}


a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4565
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une image de séparation des forums

Message par Xibition le Sam 28 Juil - 6:47

Oui ca marche en effet, mais là l'image est vraiment vraiment vraiment minuscule lol!

Mais merci quand meme Very Happy Y'a vraiment pas moyen de la mettre entière ? Embarassed

EDIT : ouii au fait j'avais pas fait attention parce que je la mettais dans les sujets avant .. j'enlève elle ne sert à rien :p

Xibition
****

Féminin
Messages : 457
Inscrit(e) le : 23/05/2011

Xibition a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une image de séparation des forums

Message par Milouze14 le Sam 28 Juil - 6:50

Re,
mais là l'image est vraiment vraiment vraiment minuscule
Very Happy Very Happy et on voit pas grand chose Very Happy .

Y'a vraiment pas moyen de la mettre entière ?

L'image va casser l'apparence du contenant Wink .
Donc il vaut mieux s'abstenir jiji Wink .


EDIT : ouii au fait j'avais pas fait attention parce que je la mettais dans les sujets avant .. j'enlève elle ne sert à rien :p
Wink Wink
a++

Milouze14
+ Hyperactif +

Masculin
Messages : 4565
Inscrit(e) le : 18/04/2005

http://www.milouze14.com/
Milouze14 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Ajouter une image de séparation des forums

Message par Xibition le Sam 28 Juil - 6:52

Merci beaucoup tongue

Xibition
****

Féminin
Messages : 457
Inscrit(e) le : 23/05/2011

Xibition a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum