/**********************************
* General                         *
**********************************/

body {
  background: #8C8C8C;
  margin: 0px;
  padding: 0px;
  line-height: 1.2;
  font-size: 12pt;
  cursor: default
}

img {
  border: 0px;
}

p {
  text-align: justify;
}

#main {
  width: 1020px;
  padding: 0px;
  margin: 20px auto 20px auto;
  background: url(fond.png) center repeat-y;
}

#header {
  height: 120px;
}

/* Alternatives pour le logo et la devise du site */
#header h1, #header h2 {
  display: none;
}

#footer {
  clear: both;
  height: 40px;
  background: url(footer.png) center bottom no-repeat;
  text-align: center;
  font-style: italic;
}

acronym {
    border-bottom: 1px dotted black;
}

/* Code */

pre {
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
 white-space: -pre-wrap;      /* Opera 4-6 */
 white-space: -o-pre-wrap;    /* Opera 7 */
 word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

pre code {
 display: block;
 padding: 0.5em;
 border: 1px solid #C0C0C0;
 border-left-width: 10px;
 background: #F5F5F5
}

code {
  font-size: 10pt;
}

/* Sommaire */

div.sommaire {
  border: 1px solid #DCDCDC ;
  float: right;
  margin: 15px;
  background: #F8F8FF;
  padding: 5px;
}

div.sommaire ul {
  padding: 0px;
  margin: 0px;
  list-style: none;
}

div.sommaire li {
  padding-left: 15px;
  background: url(chevron.png) left center no-repeat;
}


div.sommaire div {
  text-align: center;
  font-style: italic;
}


/**********************************
* Liens                           *
**********************************/

a {
  text-decoration: none;
  color: #1E90FF;
}

a:hover {
  text-decoration: underline;
}

/**********************************
* Menu vertical à gauche          *
**********************************/

#corps.menu-vertical {
  margin-left: 229px;
  margin-right: 30px;
  border-left: 1px solid;
  padding-left: 10px;
}

/* Hack pour qu'IE supporte la propriété clear correctement */
*+html #corps.menu-vertical {
  position: relative;
  left: -1px;
  height: 1%;
}

#menu.menu-vertical {
  margin-left: 30px;
  width: 200px;
  float: left;
  line-height: 1;
}

#menu.menu-vertical ul {
  margin: 0;
  padding: 0;
  list-style: none
}

#menu.menu-vertical a {
  font-weight: bold;
  display: block;
  padding: 5px;
  color: #696969;
  text-decoration: none;
  border-right: 1px solid;
  background-image: url(chevron.png);
  background-position: center left;
  background-repeat: no-repeat;
  padding-left: 15px;
  padding-right: 8px;
}

#menu.menu-vertical a:hover, #menu.menu-vertical li.active>a {
  border-right-width: 8px;
  padding-right: 0px;
}

#menu.menu-vertical li ul {
  margin-left: 20px;
  display: none;
}

#menu.menu-vertical li.open ul {
  display: block;
}

/**********************************
* Menu horizontal en haut         *
**********************************/

#corps.menu-horizontal {
  margin-left: 30px;
  margin-right: 30px;
  clear: left;
  border-top: 1px solid;
  top: -1px;
  position: relative;
  padding-top: 5px;
}

/* Hack: style tout le monde sauf IE */
html>/**/body #corps.menu-horizontal {
  margin-top: 30px;
  padding-top: 10px;
}

#menu.menu-horizontal {
  margin-left: 30px;
  margin-right: 30px;
}

#menu.menu-horizontal ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

#menu.menu-horizontal li {
  float: left;
  position: relative;
  width: 238px;
  border: 0px solid #DCDCDC;
  z-index: 1;
}

/* Ligne de menu de 1er niveau */
#menu.menu-horizontal>ul>li {
  margin: 1px;
}

/* Ligne de menu de 1er niveau survolé */
#menu.menu-horizontal>ul>li:hover {
  border-width: 1px;
  margin: 0px;
}

/* Menu de 2e niveau lors du survol du 1er niveau */
#menu.menu-horizontal li:hover ul {
  display: block;
}

/* Ligne de menu de 2e niveau lors du survol du 1er niveau */
#menu.menu-horizontal li:hover li {
  border-width: 0px 1px 1px 1px;
  margin: -1px 0px 0px -1px
}

/* Menu de 2e niveau */
#menu.menu-horizontal li ul {
  display: none;
  position: absolute;
  /* Les deux lignes suivantes servent à compenser une erreur de positionnement
  dans IE */
  top: 1em;
  left: 0;
}

#menu.menu-horizontal li>ul {
  /* Ignore le hack précédent pour tous les autres browsers */
  top: auto;
  left: auto;
}

/* Lien de menu */
#menu.menu-horizontal a {
  font-weight: bold;
  display: block;
  padding: 5px 8px 5px 15px;
  color: #696969;
  text-decoration: none;
  border: 0px solid;
  background-color: white
}

/* Lien de menu survolé ou actif ou menu de 1er niveau ouvert */
#menu.menu-horizontal a:hover, #menu.menu-horizontal li.active>a, #menu.menu-horizontal li.open>a {
  border-left-width: 8px;
  padding-left: 7px;
}

/* Lien de menu de 2e niveau */
#menu.menu-horizontal ul ul a {
  padding-left: 30px;
}

/* Lien de menu de 2e niveau survolé ou actif */
#menu.menu-horizontal ul ul a:hover, #menu.menu-horizontal ul ul li.active>a {
  border-left-width: 8px;
  padding-left: 22px;
}

/**********************************
* Titre de la page                *
**********************************/

h1, h2 {
  padding: 2px;
  background-image: url(chevron.png);
  background-position: center left;
  background-repeat: no-repeat;
  padding: 0px;
  padding-left: 15px;
  margin: 0px;
  margin-bottom: 15px;
  font-variant: small-caps;
}

h1 {
  font-size: 16pt;
  border-bottom: 2px solid;
  font-weight: bold;
}

h2 {
  font-size: 14pt;
  border-bottom: 1px solid;
}

/**********************************
* Titre de section                *
**********************************/

/*h2 {
  font-weight: bold;
  font-size: 18pt;
  margin-bottom: 5px;
  font-variant: small-caps;
}*/

/* lien sous le titre de section */

p.link {
  margin-top: 5px;
  font-style: italic;
}

/**********************************
* Séparateur et cleaner           *
**********************************/

hr {
  border: none;
  height: 2px;
}

*+html hr { /* Hack pour IE */
  margin: 0;
}

.clear {
  clear: both;
}

hr.cleaner {
  height: 0px;
  width: 0px;
  clear: both;
}

*+html hr.cleaner { /* Hack pour IE */
  display: none;
}

/**********************************
* Illustrations                   *
**********************************/

.illustration-gauche, .illustration-droite {
  margin: 10px;
}

.illustration-droite {
  float:right;
}

.illustration-gauche {
  float:left;
}

/**********************************
* Panoramas                       *
**********************************/

div.panoramas {
    display: none
}

div.panoramas.actif {
    display: block
}

div.panoramas h2 {
    display: none
}

div.panoramas p {
    text-align: center;
}

div.panoramas p strong {
    display: block;
    font-style: italic;
}

/*** menu ***/

#menu-panoramas {
    background: url(tab-bottom.png) repeat-x bottom;
    margin: 15px 0px;
}

/* Hack pour qu'IE supporte la propriété clear correctement */
*+html #menu-panoramas {
  position: relative;
  height: 1%;
}

#menu-panoramas ul {
    padding: 0px 15px;
    margin: 0px;
    list-style: none;
}

#menu-panoramas ul li {
    float: left;
    background: url(tab-left.png) top left no-repeat;
}

#menu-panoramas ul li a {
    background: url(tab-right.png) top right no-repeat;
    padding: 4px 8px 2px 8px;
    display: block;
    color: #D96C00;
}

#menu-panoramas ul li a:hover {
    text-decoration: none;
    color: red
}

#menu-panoramas ul li.actif {
    background: url(tab-left-hover.png) top left no-repeat;
}

#menu-panoramas ul li.actif a {
    background: url(tab-right-hover.png) top right no-repeat;
    color: black;
    padding-bottom: 3px;
}

/**********************************
* CV                              *
**********************************/

a.fichier
{
  text-decoration: none;
  width: 300px;
  height: 100px;
  background: white url(PDF.png) no-repeat top left;
  padding-left: 100px;
  margin: 15px auto;
  display: block;
  color: black;
}

a.fichier:hover
{
  background-position: 0px -146px;
}

a.fichier span.description
{
  display: block;
  margin: 5px;
  color: gray;
  font-style: italic;
}

a.fichier:hover span.titre
{
    color: #000066;
}

a.fichier span.titre
{
    display: block;
    margin: 5px;
    font-size: 25px;
    font-weight: bold
}

/**********************************
* YAG                             *
**********************************/

code .balise {
    color:#DC143C;
}

code .classe {
    color:#0000CD;
}


/****************************** COULEURS **************************************/

/*********** ROUGE */

#main.rouge #corps h1, #main.rouge #corps h2 {
 color: #E11313;
 border-color: #FFEDED;
}

#main.rouge hr {
  background: #FFEDED;
  color: #FFEDED;
}

#main #menu a.rouge:hover, #main #menu li.active>a.rouge {
  color: #E11313;
  border-color: #E11313;
  background-color: #FFEDED;
}

#main.rouge #menu a, #main.rouge #corps {
  border-color: #E11313;
}

#main.rouge #header {
  background-image: url(header-rouge.png);
}

/*********** VERT */

#main.vert #corps h1, #main.vert #corps h2 {
 color: green;
 border-color: #EDFFED;
}

#main.vert hr {
  background: #EDFFED;
  color: #EDFFED;
}

#main #menu a.vert:hover, #main #menu li.active>a.vert {
  color: green;
  border-color: green;
  background-color: #EEFFEE;
}

#main.vert #menu a, #main.vert #corps {
  border-color: green;
}

#main.vert #header {
  background-image: url(header-vert.png);
}


/*********** BLEU */

#main.bleu #corps h1, #main.bleu #corps h1 {
 color: blue;
 border-color: #EDEDFF;
}

#main.bleu hr {
  background: #EDEDFF;
  color: #EDEDFF;
}

#main #menu a.bleu:hover, #main #menu li.active>a.bleu {
  color: blue;
  border-color: blue;
  background-color: #EEEEFF;
}

#main.bleu #menu a, #main.bleu #corps {
  border-color: blue;
}

#main.bleu #header {
  background-image: url(header-bleu.png);
}

/*********** ORANGE */

#main.orange #corps h1, #main.orange #corps h2 {
 color: #FF9933;
 border-color: #FFF5EE
}

#main.orange hr {
  background: #FFF5EE;
  color: #FFF5EE;
}

#main #menu a.orange:hover, #main #menu li.active>a.orange {
  color: #FF9933;
  border-color: #FF9933;
  background-color: #FFF5EE;
}

#main.orange #menu a, #main.orange #corps {
  border-color: #FF9933;
}

#main.orange #header {
  background-image: url(header-orange.png);
}