body {
  font-family: sans-serif ;
  font-size: medium ;
  font-weight: normal ;
}

a:link, a:visited {
  text-decoration: underline ;
  color: inherit ;
}

a:hover, a img:hover {
  text-decoration: none ;
  color: inherit ;
  border: thin solid ;
}

a:active, a img:active {
  text-decoration: none ;
  color: inherit ;
  border: medium solid ;
}

a.sans_cadre {
  border: none !important;
}

#menu a:visited {
  font-style: italic ;
}

h1 {
  font-size: 200% ;
  font-weight: bold ;
  text-align: center ;
  padding: 0.5em ;
}

h2 {
  font-size: 150% ;
  font-weight: bold ;
  text-align: center ;
  padding: 0.5em ;
  margin-top: 1em ;
}

h3 {
  font-size: 125% ;
  font-weight: bold ;
  text-align: left ;
  padding: 0.5em 0em ;
}

h4 {
  font-weight: bold ;
  font-style: italic ;
  text-align: left ;
  padding: 0.5em 0em ;
}

dt {
  padding-top: 0.5em ;
  font-weight: bold ;
}

dd {
  padding-left: 2em ;
}

#contenu blockquote {
  margin: 0.5em 3em ;
  text-align: justify ;
}

.centre {
  text-align: center ;
}

.nowrap {
  white-space: nowrap;
}

.gauche {
  float: left ;
}

.droite {
  float: right ;
}

.invisible {
  position: absolute ;
  top: -3000em ;
  height: 1% ;
}

/*** structure d'ensemble de la page ***/

* {
    margin: 0 ;
    padding: 0 ;
}

body {
  margin-top: 2em ; /* laisse la place au bandeau_cookie */
}

#haut_de_page {
  width: 20% ;
  float: left ;
}

#menu {
  width: 20% ;
  float: left ;
  margin-left: 1% ;
}

#contenu {
  width: 77% ;
  float: right ;
  margin-right: 1% ;
}

#pied {
  clear: both ;
  margin: 1em 2em 2em ;
}

/*** couleurs des éléments ***/

body, #haut_de_page, #pied, #contenu #bref, #contenu h1 /* l'emporte sur #contenu */ {
  background-color: #002000 ;
  color: yellow ;
}

#menu {
  background-color: #90EE90 ;
  color: black ;
}

#contenu {
  background-color: white ;
  color: black ;
}

hr {
  width: 100% ;
  height: 6pt ;
  background-color: #002000 ;
  border: none ;
}

hr.courte {
  width: 20% ;
  height: 2pt ;
  text-align: center ;
}

/*** mise en forme de chaque élément ***/

#haut_de_page #logo {
  width: 40px ;
  float: left ;
}

#contenu #logo_section {
  float: right ;
  margin: 5px 0 0 0 ;
}
#logo_section img {
  height: 50px ;
}
h1 + p {
  clear: right ;
}

#contenu > * {
  margin-left: 1em ;
  margin-right: 1em ;
}

#contenu hr {
  margin: 4px 0px ;
}

#contenu h1 {
  margin: 0 ;
}

#contenu ol {
  margin-left: 4em ;
}

#contenu ul {
  margin-left: 2em ;
}

#contenu p, #contenu li {
  margin-top: 0.5em ;
}

#contenu #bref {
  margin: 0em ;
}

#contenu #bref p {
  margin: 0em ;
  padding: 0.5em 1em ;
}

#contenu #bref h2, #contenu #encore h2 {
  /* pareil que .invisible */
  position: absolute ;
  top: -3000em ;
  height: 1% ;
}

#contenu #references {
  border-top: thick solid #002000 ;
  margin: 0.5em 0em 0em 0em ;
  padding-right: 1em ;
  padding-left: 1em ;
}

#contenu .image {
  display: table ;
  margin: 1em auto ;
  border: thin solid ;
  padding: 1em ;
  text-align: center ;
}

#contenu .note {
  margin: 1em 4em ;
  font-style: italic ;
  font-size: 90% ;
}

#contenu span.note {
  margin: 0 ;
}

.note em, .note cite, em cite, cite em, .signature cite {
  font-style: normal ;
}

#contenu .conseil {
  margin: 2em auto ;
  display: table ;
  background-color: #A00 ;
  color: white ;
  padding: 1.5em ;
  font-weight: bold ;
  font-size: 120% ;
}

#contenu .exergue {
  display: table ;
  margin: 1em 2em 1em auto ;
  max-width: 50% ;
  border-left: thin solid #CCCCCC ;
  padding-left: 0.6em ;
  font-size: 80% ;
}

#contenu .en_tete_mail {
  font-family: monospace ;
  margin: 1em ;
  border: thin outset ;
  padding: 0.5em ;
  background-color: #DDD ;
}

.logo_comm, .logo_rev {
  padding: 0 0.3em ;
  background-color: green ;
  color: white ;
  font-weight: bold ;
  text-decoration: none ;
  display: inline-block ; /* évite que text-decoration soit propagé depuis le bloc parent */
}

.lien_commentaire {
  text-align: center ;
  font-weight: bold ;
  margin-bottom: 0.5em ;
}

.signature {
  text-align: right ;
  font-style: italic ;
  margin-top: 0 ;
}

#menu {
  list-style: none ;
}

#menu ul {
  list-style-image: url("/nicolas/include/puce.svg") ;
  padding-left: 20px ;
}

#menu ul a[href] {
  text-decoration: none ;
}

#menu .exp, #menu .page_courante, #menu .intertitre {
  list-style: none ;
}

#menu .page_courante {
  background-color: #FF6600 ;
  color: black ;
  font-weight: bold ;
}

#menu .exp, #menu .exp a:visited {
  background-color: green ;
  color: white ;
}

#menu .intertitre {
  font-weight: bold ;
  font-size: 110% ;
  text-align: center ;
}

#menu .groupe {
  font-weight: bold ;
  font-size: 120% ;
  text-align: center ;
  padding: 0.2em ;
  border-top: thick solid #002000 ;
}

#pied {
  text-align: center ;
}

#pied #menu_general {
  background-color: green ;
  color: white ;
  display: table ;
  margin: 0 auto ;
  padding: 0.5em ;
}

#pied #menu_general a {
  font-family: serif ;
  font-size: large ;
  font-weight: bold ;
  padding: 0.5em ;
  background-color: green ;
  color: white ;
}

#pied #menu_general a.courant {
  background-color: #FF6600 ;
  color: black ;
}

#bandeau_cookie {
  position: absolute ;
  top: 0 ;
  left: 0 ;
  width: 100% ;
  height: 2em ;
  line-height: 2em ;
  vertical-align: middle ;
  text-align: center ;
  background-color: #BBB ;
  color: #222 ;
}

*:target {
  border: thin dotted blue ;
}