/***********************************************************************
**
** `html`, `body` et général.
**
***********************************************************************/

html {
	overflow-y: scroll;
}

html, body {
	margin: 0px;
	padding: 0px;
}

body {
	font-family: Arial, Helvetica, "Liberation Sans", FreeSans, sans-serif;
	font-size: 0.96em;
}

h1, h2, h3, h4, h5, h6, a, a:visited {
	color: #007070;
}

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

h1 {
	font-size: 1.9em;
}

h2 {
	font-size: 1.6em;
}

h3 {
	font-size: 1.3em;
}

h4 {
	font-size: 1.15em;
}

h5 {
	font-size: 1em;
}

h6 {
	font-size: 1em;
	font-style: italic;
}

.liensVisitesDifferencies a:visited {
	color: #441570;
}

a, a code {
	text-decoration: underline;
}

a:hover, a:hover code {
	text-decoration: none;
}

ol, ul {
	padding: 0px;
	margin-left: 20px;
}

ul {
	list-style-type: circle;
}

li {
	margin-top: 5px;
	margin-bottom: 5px;
}

pre, code {
	font-family: Courier, "Courier New", FreeMono, "Liberation Mono", monospace;
	background-color: #ebebeb;
}

pre {
	display: block;
	overflow: auto;
	padding: 5px;
	margin: 5px 0px;
	border: 1px solid #b3b3b3;
	white-space: pre-wrap; /* CSS 3. Merci à <http://labnol.blogspot.com/2006/10/html-css-trick-for-displaying-code.html>. */
}

#ancres {
	position: absolute;
	left: -5000px;
}

div#noticeMaintenance {
	margin: 0px;
	padding: 10px;
	background: #ebebeb;
}

div#noticeMaintenance p {
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, "Liberation Sans", FreeSans, sans-serif;
	font-size: 0.96em;
	font-weight: bold;
}

.blocMessagesScript p {
	margin-top: 0px;
}

.blocMessagesScript ul {
	margin-top: 0px;
	margin-bottom: 0px;
}

.pagination {
	margin-top: 25px;
	margin-bottom: 25px;
	text-align: center;
	font-weight: bold;
}

.pagination img {
	border: none;
	width: 40px;
	height: 40px;
}

.pagination .separateurPaginationTypeImage {
	margin-left: 10px;
	margin-right: 10px;
	visibility: hidden;
}

span.licence img {
	border: none;
}

/* Classes générales. */

.erreur {
	color: #630000;
}

.gauche {
	text-align: left;
}

.centre {
	text-align: center;
}

.droite {
	text-align: right;
}

.imgGauche {
	float: left;
	margin-right: 5px;
	margin-bottom: 5px;
}

.imgCentre {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.imgDroite {
	float: right;
	margin-left: 5px;
	margin-bottom: 5px;
}

.masquer {
	display: none;
}

.sansBordure, /* forme obsolete: */.imgSansBordure {
	border: none;
}

.sansDecoration {
	text-decoration: none;
}

.sep {
	clear: both;
}

.video {
	text-align: center;
	margin-top: 20px;
	margin-bottom: 20px;
}

/***********************************************************************
**
** Page.
**
***********************************************************************/

#page {
	max-width: 900px;
	margin: 0px auto;
	padding: 0px;
	position: relative;
}

body.bordureDroitePage #page {
	border-right: 1px solid #ebebeb;
}

body.bordureBasPage #page {
	border-bottom: 1px solid #ebebeb;
}

body.bordureGauchePage #page {
	border-left: 1px solid #ebebeb;
}

/***********************************************************************
**
** En-tête.
**
***********************************************************************/

div#enTete {
	padding: 2px 5px;
}

div#titre h1, div#titre p {
	margin: 0px;
	padding: 0px;
	font-weight: bold;
	font-size: 1.2em;
	line-height: 1.2em;
}

div#titre h1 img#logo, div#titre p img#logo {
	float: left;
	margin-right: 3px;
}

div#titre h1 span#logoSupplement, div#titre p span#logoSupplement {
	display: block;
	padding-top: 18px;
	padding-bottom: 5px;
}

div#titre p a, div#titre p a:hover, div#titre p a:visited {
	color: #007070;
	text-decoration: none;
	border-bottom: none;
}

div#titre p a img {
	border: none;
}

div#sousTitre p {
	margin: 0px;
	padding: 0px;
	font-style: italic;
}

/***********************************************************************
**
** Sur-contenu.
**
***********************************************************************/

#surContenu {
	width: 194px;
	padding: 5px;
}

/***********************************************************************
**
** Contenu.
**
***********************************************************************/

#contenu h1, #contenu .accueilPremierH2 {
	margin-top: 0px;
	padding-top: 0px;
}

#contenu .accueilPremierH2 {
	font-size: 1.9em;
}

#interieurContenu {
	padding: 5px;
}

body.tableDesMatieresArrondie #tableDesMatieres {
	border-color: #ebebeb;
	border-radius: 8px; /* CSS 3. */
}

#infosPublication {
	font-style: italic;
}

/* Chapeau, style `fieldset`. */

div.chapeau {
	margin-top: 20px;
	margin-bottom: 20px;
	border: 1px solid #b3b3b3;
}

div.chapeau p {
	margin-bottom: 5px;
}

div.chapeau p.legende {
	margin-top: -10px;
	margin-bottom: 0px;
	margin-left: 10px;
	padding-bottom: 0px;
	float: left;
}

div.chapeau p.legende span
{
	padding: 0px 10px;
	background-color: #fff;
	font-weight: bold;
}

div.chapeau div.contenuChapeau {
	clear: both;
	padding: 0px 10px 10px 10px;
}

/* Catégories. */

.apercu {
	border-bottom: 1px solid #ebebeb;
	padding-bottom: 25px;
}

.titreApercu {
	margin-top: 20px;
	margin-bottom: 10px;
}

.titreApercu a, .titreApercu a:visited {
	color: inherit;
}

.titreApercu a {
	text-decoration: none;
}

.descriptionApercu {
	margin: 20px 50px;
}

.descriptionApercu h1, .descriptionApercu h2, .descriptionApercu h3, .descriptionApercu h4, .descriptionApercu h5, .descriptionApercu h6 {
	font-size: 1em;
}

div.descriptionApercu div.galerieIntermediaireImgApercu {
	text-align: center;
}

.infosPublicationApercu {
	font-style: italic;
	margin-bottom: 10px;
}

.lienApercu {
	font-weight: bold;
}

/* Contact. */

#formContact label {
	font-weight: bold;
}

#formContact label.labelPhrase {
	font-weight: normal;
}

#formContact input.champInfo {
	width: 35%;
}

#formContact textarea {
	width: 70%;
}

/* Pages d'erreur. */

h1#titrePage401, h1#titrePage404 {
	padding-left: 20px;
}

h1#titrePage401 {
	background: url('../fichiers/acces-interdit.png') no-repeat left center;
}

h1#titrePage404 {
	background: url('../fichiers/attention.png') no-repeat left center;
}

/* Publications récentes (voir la fonction `publicationsRecentes()`). */

p.publicationsRecentesLien {
	margin-left: 20px;
}

div.publicationsRecentesGalerie ul, div.publicationsRecentesGaleries ul {
	list-style-type: none;
}

div.publicationsRecentesGalerie img, div.publicationsRecentesGaleries img {
	padding: 5px 10px 10px 5px;
	border: none;
	margin: 10px;
	background: url('../fichiers/ombre-vignette.png') no-repeat right bottom;
}

/***********************************************************************
**
** Sous-contenu.
**
***********************************************************************/

#sousContenu {
	width: 194px;
	padding: 5px;
}

/***********************************************************************
**
** Bas de page.
**
***********************************************************************/

#basDePage {
	text-align: center;
	padding: 5px;
}

#basDePage img {
	border: none;
	vertical-align: bottom;
}

/***********************************************************************
**
** Blocs
**
***********************************************************************/

.bloc {
	margin-top: 0px;
	margin-bottom: 20px;
}

#finInterieurContenu .bloc {
	margin-top: 30px;
}

.contenuBloc {
	padding-left: 2px;
	padding-right: 2px;
}

.bloc h2 {
	margin: 0px 0px 5px 0px;
	padding: 0px;
	font-size: 1em;
}

.bloc ul {
	margin-top: 0px;
	margin-bottom: 0px;
}

a.actif {
	font-weight: bold;
}

li.actif {
	list-style-image: url('../fichiers/puce.png');
}

li.actif li {
	list-style-image: none;
}

li.parent {
	list-style-type: disc;
}

/* Coins arrondis. */

.blocArrondi {
	background-color: #ebebeb;
}

div.haut-gauche {
	background: url(../fichiers/coins/haut-gauche.gif);
}

div.haut-droit {
	float: right;
	background: url(../fichiers/coins/haut-droit.gif);
}

div.bas-gauche {
	background: url(../fichiers/coins/bas-gauche.gif);
}

div.bas-droit {
	float: right;
	background: url(../fichiers/coins/bas-droit.gif);
}

div.haut-gauche, div.haut-droit, div.bas-gauche, div.bas-droit {
	height: 8px;
	width: 8px;
	background-repeat: no-repeat;
	font-size: 1px; /* À cause d'un bogue d'IE. */
}

/* Balise `h1`. */

div#baliseH1 .contenuBloc {
	padding-left: 0px;
	padding-right: 0px;
}

/* Flux RSS. */

#fluxRss ul {
	list-style-type: none;
	margin-left: 0px;
}

#fluxRss a {
	display: block;
	padding-left: 19px;
	background: url('../fichiers/rss.png') no-repeat left center;
}

/* Informations de publication. */

#infosPublication div.contenuBloc, div.infosPublicationApercu {
	padding-left: 19px;
	background: url('../fichiers/info.png') no-repeat left center;
}

/* Module «Envoyer à des amis». */

#modeleMessageEnvoyerAmis {
	margin: 25px;
	padding: 5px;
	background-color: #ebebeb;
	border-radius: 8px; /* CSS 3. */
}

h2#titreEnvoyerAmis {
	clear: both;
}

#envoyerAmis a {
	display: block;
	padding-left: 22px;
	background: url('../fichiers/enveloppe.png') no-repeat left center;
}

/* Recherche Google. */

#rechercheGoogle #inputMotsCles {
	width: 184px;
}

/***********************************************************************
**
** Arrière-plans des colonnes.
**
***********************************************************************/

/*
Note: il y a beaucoup de classes CSS ci-dessous pour la gestion des arrière-plans. Ceci est pour conserver une compatibilité avec IE6. En effet, malheureusement, ce navigateur ne gère pas les classes multiples dans les sélecteurs d'une feuille de style.

Par exemple, on peut normalement faire référence dans une feuille de style à la div suivante:

	<div class="deuxColonnes sousContenuAgauche avecRayures">
	...
	</div>

en utilisant le sélecteur qui suit:

	div.deuxColonnes.sousContenuAgauche.avecRayures {...}

ce qui permet de diminuer le nombre de classes à créer. Cependant, IE6 ne reconnaît que la dernière classe d'un sélecteur contenant une chaîne de classes...
*/

/* Général. */

body.colonneAgaucheAvecRayures #page {
	background: url('../fichiers/rayures-204px.png') repeat-y left top;
}
body.colonneAgaucheAvecRayuresEtBordure #page {
	background: url('../fichiers/rayures-avec-bordure-droite-205px.png') repeat-y left top;
}
body.colonneAgaucheAvecFondUni #page {
	background: url('../fichiers/uni-204px.png') repeat-y left top;
}
body.colonneAgaucheAvecBordure #page {
	background: url('../fichiers/bordure-1px.png') repeat-y 204px top;
}

/* */

body.colonneAdroiteAvecRayures #page {
	background: url('../fichiers/rayures-204px.png') repeat-y right top;
}
body.colonneAdroiteAvecRayuresEtBordure #page {
	background: url('../fichiers/rayures-avec-bordure-gauche-205px.png') repeat-y right top;
}
body.colonneAdroiteAvecFondUni #page {
	background: url('../fichiers/uni-204px.png') repeat-y right top;
}
body.colonneAdroiteAvecBordure #page {
	background: url('../fichiers/bordure-gauche-205px.gif') repeat-y right top;
}

/* */

body.deuxColonnesAvecRayures #page {
	background: url('../fichiers/rayures-204px.png') repeat-y left top;
}
body.deuxColonnesAvecRayures #interieurPage {
	background: url('../fichiers/rayures-204px.png') repeat-y right top;
}
body.deuxColonnesAvecRayuresEtBordure #page {
	background: url('../fichiers/rayures-avec-bordure-droite-205px.png') repeat-y left top;
}
body.deuxColonnesAvecRayuresEtBordure #interieurPage {
	background: url('../fichiers/rayures-avec-bordure-gauche-205px.png') repeat-y right top;
}
body.deuxColonnesAvecFondUni #page {
	background: url('../fichiers/uni-204px.png') repeat-y left top;
}
body.deuxColonnesAvecFondUni #interieurPage {
	background: url('../fichiers/uni-204px.png') repeat-y right top;
}
body.deuxColonnesAvecBordure #page {
	background: url('../fichiers/bordure-1px.png') repeat-y 204px top;
}
body.deuxColonnesAvecBordure #interieurPage {
	background: url('../fichiers/bordure-gauche-205px.gif') repeat-y right top;
}

/* body.colonneAgauche */

body.colonneAgauche #enTete {
	margin-left: 205px;
}

body.colonneAgauche div#sousTitre {
	margin-left: 79px;
}

body.colonneAgauche #contenu {
	margin-left: 204px;
}

body.colonneAgauche #surContenu, body.colonneAgauche #sousContenu {
	position: absolute;
	top: 87px;
}

body.colonneAgauche #basDePage {
	margin: 25px 0px 0px 204px;
}

/* body.uneColonneAgauche */

body.uneColonneAgauche #surContenu, body.uneColonneAgauche #sousContenu {
	left: 0px;
}

/* body.colonneAdroite */

body.colonneAdroite div#sousTitre {
	margin-right: 210px;
}

body.colonneAdroite #contenu {
	margin-right: 204px;
	text-align: justify;
}

body.colonneAdroite #surContenu, body.colonneAdroite #sousContenu {
	position: absolute;
	top: 87px;
}

body.colonneAdroite #basDePage {
	margin: 25px 204px 0px 0px;
}

/* body.uneColonneAdroite */

body.uneColonneAdroite div#sousTitre {
	margin-left: 84px;
}

body.uneColonneAdroite #surContenu, body.uneColonneAdroite #sousContenu {
	right: 0px;
}

/* body.deuxColonnes */

body.deuxColonnes #basDePage {
	margin: 25px 204px 0 204px;
}

body.deuxColonnes #contenu {
	margin-right: 204px;
	text-align: justify;
}

/* body.deuxColonnesSousContenuAgauche */

body.deuxColonnesSousContenuAgauche #page {
	padding-right: 0px;
}

body.deuxColonnesSousContenuAgauche #surContenu {
	right: 0px;
}

body.deuxColonnesSousContenuAgauche #sousContenu {
	left: 0px;
}

/* body.deuxColonnesSousContenuAdroite */

body.deuxColonnesSousContenuAdroite #page {
	padding-left: 0px;
}

body.deuxColonnesSousContenuAdroite #contenu {
	margin-left: 204px;
}

body.deuxColonnesSousContenuAdroite #surContenu {
	left: 0px;
}

body.deuxColonnesSousContenuAdroite #sousContenu {
	right: 0px;
}

/* body.aucuneColonne */

body.aucuneColonne #page {
	max-width: 750px;
}

body.aucuneColonne #interieurContenu {
	padding-bottom: 0px;
}

body.aucuneColonne #surContenu, body.aucuneColonne #sousContenu {
	width: auto;
}

body.aucuneColonne #surContenu {
	margin-bottom: 10px;
}

body.aucuneColonne #menuLangues {
	position: absolute;
	top: 0px;
	right: 5px;
	margin-top: 0px;
	text-align: right;
}

body.aucuneColonne #menuLangues ul {
	list-style-type: none;
}

body.aucuneColonne #menu {
	margin-top: 10px;
}

body.aucuneColonne #menu ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	text-align: center;
}

body.aucuneColonne #menu li {
	display: inline;
	margin-right: 20px;
}

/* body.enTetePleineLargeur */

body.enTetePleineLargeur div#enTete {
	background-color: white;
	margin-left: 0px;
	border-bottom: 1px solid #ebebeb;
}

/***********************************************************************
**
** Galerie.
**
***********************************************************************/

body.galerie #page {
	max-width: 1000px;
}

body.galerieAucuneColonne #page {
	max-width: 750px;
}

p#galerieSousTitre {
	font-weight: bold;
}

div#galerieIntermediaire div#galerieIntermediaireTexte {
	margin-bottom: 15px;
}

div.minivignetteImageEnCours img {
	border-left: 5px solid #b3b3b3 !important;
	border-right: 5px solid #b3b3b3 !important;
}

div.sepGalerieMinivignettes {
	clear: both;
	margin-bottom: 15px;
}

#galerieLienSansJavascript a {
	padding-left: 22px;
	background: url('../fichiers/sans-javascript.png') no-repeat left center;
}

#galerieIntermediaireTexte ul {
	margin-left: 25px;
}

#galerieIntermediaireTexteHorsContenu #galerieIntermediaireTexte {
	padding-left: 5px;
	border-left: 3px solid #007070;
}

#galerieIntermediaireTexteHorsContenu ul {
	margin-top: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-left: 15px;
}

#galerieLienOriginalLegende {
	margin-top: 15px;
}

div.galerieNavigationPrecedent {
	float: left;
}

div.galerieNavigationPrecedent img {
	border: none;
	float: left;
	clear: both;
}

div.galerieNavigationSuivant {
	float: right;
}

div.galerieNavigationSuivant img {
	border: none;
	float: right;
	clear: both;
}

.galerieFleche img {
	border: none !important;
}

div.galerieNavigationPrecedent img, div.galerieNavigationSuivant img, .galerieFleche img, div.galerieNavigationVideFleche, div.galerieNavigationVideVignette {
	width: 50px;
	height: 50px;
}

div#galerieIntermediaire {
	text-align: center;
}

div#galerieMinivignettes {
	margin-top: 20px;
	margin-bottom: 20px;
}

div#galerieMinivignettes img {
	float: left;
	height: 35px;
	border: 1px solid #b3b3b3;
	margin: 2px;
}

div#galerieAccompagnementVignettePrecedent img {
	float: left;
	border: none;
}

div#galerieAccompagnementVignetteSuivant img {
	float: right;
	border: none;
}

div#galerieIntermediaireExif {
	text-align: left;
	margin-top: 15px;
}

div#galerieIntermediaireExif ul {
	margin-bottom: 0px;
}

div#galerieIntermediaireExif li {
	margin-top: 10px;
}

div.galerieNavigationAccueil img {
	float: left;
	background: url('../fichiers/ombre-vignette.png') no-repeat right bottom;
}

div#galerieIntermediaireImg img, div.galerieIntermediaireImgApercu img {
	background: url('../fichiers/ombre.png') no-repeat right bottom;
}

div#galerieLienOriginalIcone {
	margin-bottom: 5px;
}

div#galerieLienOriginalIcone img {
	border: none;
}

div.galerieNavigationAccueil img, div#galerieIntermediaireImg img, div.galerieIntermediaireImgApercu img {
	padding: 5px 10px 10px 5px;
	border: none;
	margin: 10px;
}

body.galerie div.pagination {
	clear: both;
}