/*on commence une feuille de style en général par un "reset"
pour mettre toutes les marges à zéro (intérieures padding et extérieures margin)
cela doit permettre d'avoir tous les navigateurs avec, à peu près, le même état de départ*/
html, body{
	margin:0; padding:0;
	}
hml{
	height:100%;
	font-size:1em; /*Voir -> Note 6 */
	}
body{
	background-image:url("../image/fond_1.png"); background-attachment:fixed; background-repeat:repeat;  
	padding:20px 30px;/* Voir -> Note 1 */        
	font-size:1em;/* Voir -> Note 5 */ color:#000000; font-family:Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif;/*polices cohéntes de fontes*/   
	}
#global{
	width:100%; height:100%;
	}
#entete{
	width:100%;
	}	
#sousentete{
	background-image:url("../image/sous_entete.png"); background-repeat:no-repeat;
	width:100%; height:2em;
	font-size:1em;
	}
#navigation{
	margin:0; padding:0;	
	width:9%;
	}
#contenu{
	width:83%; margin-left:15%; /* Voir -> Note 4 */ margin-top:1%; padding:10px 20px;
	font-size:1em;		 
	}
#contenu > :first-child{
	margin-top:10px;
	}   
h2{
	margin:1em 0.5em 0; /* Voir -> Note 8 */ 
	letter-spacing:2mm; font-variant:small-caps; /*lettres petites capitales*/ 
	}
h3{ 
	margin:1em 0.5em 0; /* Voir -> Note 8 */
	letter-spacing:2mm; font-variant:small-caps;  
	}
a{
	text-decoration:none;  
	}
a img{
	border:none;
	}
hr{
	width:100%;
	background-color:#FF0000;
	height:5px;
	}
li{
	list-style-type:none;  
	}	
/*NOTES

1.  Ce gabarit utilise du padding sur l'élément BODY pour créer un retrait
    esthétique tout autour du conteneur principal.
    Rappel: "padding: 20px 30px;" se lit ainsi:
    - padding-top et padding-bottom de 20px;
    - padding-left et padding-right de 30px.

4.  Les éléments flottants ne repoussent pas les blocs, mais repoussent
    uniquement leur contenu. Pour que notre bloc de contenu principal forme
    une colonne distincte du menu, on lui donne donc une marge à gauche de 13%.
    Il existe une autre technique pour adapter la largeur d'un bloc aux
    flottants qui le précèdent. On pourra lire l'article suivant:
    http://css.alsacreations.com/Faire-une-mise-en-page-sans-tableaux/
    design-trois-colonnes-positionnement-flottant

5.  Taille du texte de base de la page. Dépend de la taille du texte par
    défaut du navigateur (souvent 16px), et des réglages de l'utilisateur.
    À adapter en fonction de la fonte choisie, et du rendu souhaité.
    En général, on utilisera une valeur de base entre .65em et 1em
    (ou 65% et 100%).
    
6.  Ce "font-size: 90%" est normalement inutile. On l'utilise uniquement
    pour éviter un bug de redimensionnement du texte dans Internet Explorer.
    
7.  Les navigateurs donnent souvent aux images placées dans des liens
    une bordure disgracieuse. On annule ce style souvent gênant en appliquant
    un "border: none" aux images qui se trouvent à l'intérieur d'un lien.
    
8.  En général, les styles par défaut des navigateurs font que les marges
    en haut et en bas des titres sont équivalentes. Ici, en diminuant la
    marge du bas, on cherche à rapprocher le titre du contenu qu'il introduit. 
*/