.infobulle1 {
   position: relative;
   color: black;
   text-decoration: none;
   border-bottom: 1px gray dotted; /* On souligne le texte. */
}
.infobulle1 span {
   display: none; /* On masque l'infobulle. */
}
.infobulle1:hover {
   background: none; /* Correction d'un bug d'Internet Explorer. */
   z-index: 500; /* On définit une valeur pour l'ordre d'affichage. */

   cursor: help; /* On change le curseur par défaut par un curseur d'aide. */
}
.infobulle1:hover span {
   display: inline; /* On affiche l'infobulle. */
   position: absolute;

   white-space: nowrap; /* On change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non désiré. */

   top: 30px; /* On positionne notre infobulle. */
   left: 20px;

   background: white;

   color: green;
   padding: 3px;

   border: 1px solid green;
   border-left: 4px solid green;
}

/* *************************************** */

.infobulle2 {
   position: relative;
   color: black;
   text-decoration: none;
   border-bottom: 1px gray dotted; /* On souligne le texte. */
}
.infobulle2 span {
   display: none; /* On masque l'infobulle. */
}
.infobulle2:hover {
   background: none; /* Correction d'un bug d'Internet Explorer. */
   z-index: 500; /* On définit une valeur pour l'ordre d'affichage. */

   cursor: help; /* On change le curseur par défaut par un curseur d'aide. */
}
.infobulle2:hover span {
   display: inline; /* On affiche l'infobulle. */
   position: absolute;

   white-space: nowrap; /* On change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non désiré. */

   top: 30px; /* On positionne notre infobulle. */
   left: 20px;

   background: white;

   color: #359EF0;
   padding: 3px;

   border: 1px solid #359EF0;
   border-left: 4px solid #359EF0;
}

/* *************************************** */

.infobulle3 {
   position: relative;
   color: black;
   text-decoration: none;
   border-bottom: 1px gray dotted; /* On souligne le texte. */
}
.infobulle3 span {
   display: none; /* On masque l'infobulle. */
}
.infobulle3:hover {
   background: none; /* Correction d'un bug d'Internet Explorer. */
   z-index: 500; /* On définit une valeur pour l'ordre d'affichage. */

   cursor: help; /* On change le curseur par défaut par un curseur d'aide. */
}
.infobulle3:hover span {
   display: inline; /* On affiche l'infobulle. */
   position: absolute;

   white-space: nowrap; /* On change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non désiré. */

   top: 30px; /* On positionne notre infobulle. */
   left: 20px;

   background: white;

   color: #662D45;
   padding: 3px;

   border: 1px solid #662D45;
   border-left: 4px solid #662D45;
}
