/* Les z-index
 *      0: body
 *      5: header background
 *     10: page et footer
 *     30: bandeaux fondu-enchaîné page Offre
 *     40: catalogue (pièces de puzzle des produits)
 *     50: header
 *     50: boutons ouverture-fermeture bandeaux fondu-enchaîné page Offre
 *  10100: lightbox overlay (matrix/js/lightbox.js)
 *  10102: lightbox contents
 *  65500: #loadingOverlay = le masque qui cache toute la page pendant le chargement (index.php)
 *
 * Les couleurs
 *  #ffffff: couleur du fonds de la page
 *  #666666: couleur des textes par défaut
 *  #999999: couleur du texte de légende des illustrations des contenus
 *  #0033ff: la couleur des liens par défaut
 *  #0000ff: la couleur des liens email
 *  #ffee00: couleur de fond du bloc infos
 *  #ff0000: couleur du titre du bloc infos
 *  #000000: couleur du texte du bloc infos
 *  #cccccc: couleur des entrées du menu (1er niveau) non survolées
 *  #000000: couleur des entrées du menu (1er niveau) survolées
 *  #eeeeee: couleur des séparateurs du menu
 *  #dfff00: couleur du trait qui souligne les entrées survolées, et du fond des menus déroulants
 *  #808852: couleur des entrées de menu déroulant non survolées
 *  #494949: couleur des entrées de menu déroulant survolées
 *  #ffffff: couleur du fond des entrées de menu déroulant survolées
 *  #556066 à #222929: gradient de couleu du fond du footer
 *  #888888: couleur du texte du footer
 */

/*!**** Réglages des textes */

body {
  font-family: Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 0;
  color: #666666;
}

a {
  color: #0099ff;
  text-decoration: none;
  cursor: pointer;
}

a:hover {
  text-decoration: underline;
}

b, strong {
  font-weight: bold;
}

i, em {
  font-style: italic;
}

em em { font-style: normal; }
em em em { font-style: italic; }
em em em em { font-style: normal; }

/*!**** Espace entre paragraphes */

h1, h2, h3, h4,
p, ul {
  line-height: 1.4;
  margin-bottom: 0.75em; /* espace inter-paragraphes */
}

h2, h3, h4 {
  margin-top: 1em;
}

li {
  line-height: 1.4;
  padding-top: 0.5em;
}

li:first-child {
  padding-top: 0em;
}

h2.reset, h3.reset, h4.reset,
p.reset, ul.reset, ul.reset li
{
  margin-bottom: 0em;
  margin-top: 0em;
  padding-top: 0em;
  line-height: 0;
}

ul.reset, ul.sanspuce, ul.sans-puce {
  list-style: none;
}

/*!**** Structure de la page */

html {
  height: 100%;
  background: white url(/site/images/bg-page.jpg) center top no-repeat;
}

body {
  position: relative; /* pour les positionnements absolus et le z-index */
  z-index: 0;
}

div.body,
div.in-body {
  width: 1024px;
  margin: 0px auto;
}

div.body {
  position: relative; /* pour les positionnements absolus */
  background: white;
  box-shadow: 0px 5px 20px rgba(0,0,0,0.2);
}

/*!**** Styles généraux */

ul.normal {
  margin-left: 2em; /* TODO: try padding-left instead */
  list-style: disc;
}

ol.normal {
  margin-left: 2em; /* TODO: try padding-left instead */
  list-style: decimal;
}

div a.bglink { /* pour rendre un div complètement cliquable -- nécessite un position: relative sur le div */
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  text-indent: -9999px;
}