
  /*** Info-bulle ********
Balisage :

Balise "lien":
class="info_bulle"
<span>
</span>

=
class="info_bulle"><span></span>

Exemple (Jdr_3/Celinir/Combat_Protections.html#Attaque_en_finesse)

<td><a href="LIEN" class="info_bulle">TEXTE du LIEN<span>"Texte de l'info-bulle</span></a></td>

**********************************/

a.info_bulle span
{
  display : none; /* Rend invisible tout notre bloc span */
}

a.info_bulle
{
  color: #d00000;
  text-decoration: none;
  background-color: transparent;
  position : relative; /* Indispensable pour le bon positionnement de l'info-bulle */
}


a.info_bulle:visited {
  color: #d00000;
  text-decoration: none;
  background-color: transparent;
}
a.info_bulle:active {
  color: #d00000;
  text-decoration: none;
  background-color: transparent;
}


a.info_bulle:hover
{
  color: #d00000;
  text-decoration: none;
  background-color: #fff0f0;
  border : 0; /* ligne qui corrige le bug d'IE6 et inférieur */
}

a.info_bulle:hover span
{
display : block; /* Rend visible notre bloc span */
position : absolute; /* Sort notre bloc de son conteneur afin de le positionner */
background : #fff0f0; /* Définition du fond, sinon on a le même que notre lien */
border : 3px solid #000000; /* Définition des bordures */
padding : 6px; /* Définition des marges intérieures */
font-size : 9pt;
font-weight: normal;
font-style: normal;
width : 180px; /* On fixe une largeur par défaut */
color : #000; /* Réinitialisation de la couleur du texte */
text-align : left; /* Justification du texte */
cursor : default; /
* Réinitialisation de notre curseur, sinon par défaut on a le même que notre lien */
/* Positionnement de notre info-bulle */
top : 1.8em;
left : 65px;

z-index : 1000; /* Positionne au premier plan l'info-bulle en cas de chevauchement */
}


/**** Titres ********************/


h1, h2, h3, h4, h5 { margin: 0px; padding: 0px; }


h1 {
  background: #FE0000;
  font-size: 140%;
  line-height: 180%;
  font-weight: bold;
  font-style: normal;
  text-align: center;
  color: white;
  margin-top: 25px;
  margin-bottom: 15px;
}
h2 {
  font-size: 120%;
  line-height: 140%;
  font-weight: bold;
  font-style: normal;
  text-align: center;
  color: black;
  margin-top: 25px;
  margin-bottom: 10px;
}
h3 {
  font-size: 120%;
  line-height: 140%;
  font-weight: bold;
  font-style: italic;
  text-align: center;
  color: black;
  margin-top: 20px;
  margin-bottom: 10px;
}
h4 {
  font-size: 120%;
  font-weight: bold;
  font-style: normal;
  text-align: left;
  color: black;
  margin-top: 15px;
  margin-bottom: 5px;
}
h5 {
  font-size: 110%;
  font-weight: bold;
  font-style: normal;
  text-align: left;
  color: black;
  text-decoration: underline;
  margin-top: 10px;
  margin-bottom: 5px;
}
h6 {
  font-size: 110%;
  font-weight: bold;
  font-style: normal;
  text-align: left;
  color: black;
  text-indent: 25px;
  margin-top: 10px;
  margin-bottom: 5px;
}


/*** Mises en forme des styles de texte (Paragraphes) *************************************/

p {
  text-align: justify;
}

.gras {
font-weight: bold;
}
.gros {
font-size: 110%;
}
.centre {
text-align: center;
text-indent: 0px;
}
.italique {
font-style: italic;
}
.normal {
  font-size: 10pt;
}
.encadrement {
  padding: 0.2em;
  margin-left: 1em;
  margin-right: 1em;
  border: 2px #FE0000;
}
.encadrement_dashed {
  padding: 0.2em;
  margin-left: 1em;
  margin-right: 1em;
  border: 1px dashed #FE0000;
}

/*** Mises en forme du texte :
Utilisation des styles "officiels" :
- <b> et </b> : GRAS
- <big> et </big> : GROS
- <center> et </center> : CENTRE
*************************************/



/*** AUTRES *************************************/


table.menu td.item2 a,
table.menu td.sousitem2 a {
  display: block;
  color: #404040;
  font-size: 100%;
  font-weight: bold;
  margin-left: 4px;
  padding-top: .5em;
}

table.menu td.rubrique {
  padding-left: 0.2em;
  padding-right: 0.2em;
  margin-bottom: 5px;
  font-weight: bold;
  text-align: right;
  color: white;
  background-color: #d00000;
}

table.menu td.titre {
  margin-left: 0px;
  margin-bottom: 5px;
  font-weight: bold;
}

table.menu td.soustitre {
  font-weight: bold;
}

table.menu td.chapeau,
table.menu td.ps {
  font-style: oblique;
  text-align: justify;
  margin: 0.5em;
}

table.menu td.chapeau {
  margin-bottom: 0px;
}

table.menu td.ps {
  margin-top: 0px;
}

table.menu td.texte {
  text-align: justify;
}

.nav table.menu td.date {
  text-align: right;
  font-size: 80%;
  font-style: oblique;
}

table.menu td.hover:hover {
  color: black;
  background-color: #fff0f0;  
}


/*****************************************************************************/

.encadrer dl {
  padding: 0.5em;
  margin-left: 1em;
  margin-right: 1em;
  margin-top: 1em;
  margin-bottom: 1em;
  border: 1px solid #FE0000;
}

.encadrer dt.titre {
  font-size: 100%;
}

.encadrer table.menu td.item {
  padding-left: 0.2em;
  padding-right: 0.2em;
  font-weight: normal;
  font-style: oblique;
}

.encadrer h1 {
  background: #FE0000;
  font-size: 140%;
  line-height: 180%;
  font-weight: bold;
  font-style: normal;
  text-align: center;
  color: white;
  margin-top: 5px;
  margin-bottom: 15px;
}

dl h1 {
  background: #FE0000;
  font-size: 140%;
  line-height: 180%;
  font-weight: bold;
  font-style: normal;
  text-align: center;
  color: white;
  margin-top: 10px;
  margin-bottom: 15px;
}

/********* LISTES A PUCES ********************************************************************/

.corner {
list-style-image: url(img/puce_corner.gif);
vertical-align: middle;
margin-top: 5px;
margin-bottom: 5px;
}

/********* LIENS PIED DE PAGE ********************************************************************/

.lienimg {
list-style-image: url(img/icone_image.png);
line-height: 200%;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 5px;
}

.lienext {
list-style-image: url(img/icone_article_externe.jpg);
line-height: 200%;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 5px;
}

.lienint {
list-style-image: url(img/icone_article_interne.png);
line-height: 200%;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 5px;
}

.lienadr {
list-style-image: url(img/icone_arrobase.png);
line-height: 200%;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 5px;
}

.lienpdf {
list-style-image: url(img/icone_pdf.gif);
line-height: 200%;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 5px;
}

.liendoc {
list-style-image: url(img/icone_document.png);
line-height: 200%;
vertical-align: middle;
margin-top: 5px;
margin-bottom: 5px;
}

/*****************************************************************************/

