/* Style commun a toutes les pages ---------------------------------------------- */

/* Site de Madeleine Sarrouy : madeleine-sarrouy.com

Version : 1.0
Auteur : Didier Fournet
E-mail : dif@agencedif.com
Site : http://www.agencedif.com/

--------------------------------------------------------------------------------- */

/* 								��������������������							  */

/* Bases communes
--------------------------------------------------------------------------------- */

body
{
	font-family: Verdana, "Trebuchet MS", Tahoma, Impact, Arial, "Arial Black", "Arial Narrow", sans-serif;
	font-size: 62.5%;
	/* ram�ne la base des font � 10px (en g�n�ral), permet de travailler ensuite avec les em dans un rapport simple (ex : 12px = 1.2em) */
	color: #757A96;
	background-color: #33342D;
}

*
{
	margin: 0;
	padding: 0;
	/* neutralise les padding et margin de tous les elements */
}

img, fieldset
{
	border: 0;
	/* Supprime les border autour des images et des formulaires */
}

h1, h2, h3, h4, h5, h6
{
	font-size: 100%;
	/* Normalise la taille de police des titres */
	font-weight: normal;
}

ul, ol
{
	list-style: none;
	/* Supprime le formatage des listes */
}

address, caption, cite, code, dfn, em, strong, th, var
{
	font-style: normal;
	font-weight: normal;
	/* Normalise les police de certains elements */
}

table
{
	border-collapse: collapse;
	border-spacing: 0;
	/* Normalise les tableaux */
}

caption, th
{
	text-align: left;
	/* Normalise la police des tableaux */
}

q:before, q:after
{
	content: '';
	/* Supprime les guillemets de "q" */
}

.engras { font-weight: bold; }
.enitalique { font-style: italic; }
.souligne { text-decoration: underline; }
.chassefixe { font-family: "Courier New", monospace; }
.empattement { font-family: Georgia, Palatino, "Times New Roman", serif; }
.capitale { font-variant: small-caps; }
.majuscule { text-transform: uppercase; }
.taille8 { font-size: 0.8em; }
.taille10 { font-size: 1em; }
.taille12 { font-size: 1.2em; }
.taille14 { font-size: 1.4em; }
.taille15 { font-size: 1.5em; }
.taille18 { font-size: 1.8em; }
.taille20 { font-size: 2em; }
.taille40 { font-size: 4em; }

/* Fin de Bases communes -------------------------------------------------------- */

/* Conteneurs
--------------------------------------------------------------------------------- */

div#conteneurhaut
{
    width: 70%;
	margin-left: 20px;
	background-color: #33342D;
	position: absolute;
	top: 5%;
	left: 20%;
}

h1 { text-indent: -10000em; }

div#conteneurbas
{
    width: 70%;
	margin-left: 20px;
	background-color: #33342D;
	position: absolute;
	top: 83%;
	left: 20%;
}

/* Fin de Conteneurs ------------------------------------------------------------- */

/* Navigation
--------------------------------------------------------------------------------- */

div#navigation
{
	width: 100%;
	height: 15px;
	background-color: #757A96;
	position: absolute;
	top: 80%;
	left: 0;
}

ul#menu
{
	margin-left: 20%;
	list-style: none;
	float: left;
}

* html ul#menu { margin-left: 10%; }
ul#menu li { float: left; }

ul#menu a
{
	margin-left: 20px;
	font-size: 12px;
	color: white;
	text-decoration: none;
	float: left;
	/* Pour IE5/Mac : sinon les li ne float pas */
}

ul#menu a:hover { color: #33342D; }

ul#menu a#encours
{
	color: #33342D;
	cursor: default;
}

/* Fin de Navigation ------------------------------------------------------------- */

/* Constantes
--------------------------------------------------------------------------------- */

div#constantes
{
	width: 20%;
	font-size: 0.5em;
	text-align: center;
	position: absolute;
	top: 83%;
	left: 0;
	clear: both;
	/* ATTENTION : ne pas oublier de porter un clear sur l'element qui suivra la barre de navigation */
}

* html div#constantes { font-size: 0.8em; }

div#constantes p#avertissement
{
	padding: 0 5px 0 5px;
	text-align: justify;
}

/* Fin de Constantes ------------------------------------------------------------- */

/* Pour memoire
------------------------------------------------------------------------------------
� Surfaces utiles en fonction de la r�solution �cran (IE6/Win) :
--> 620 x 309 pour 640 x 480
--> 780 x 429 pour 800 x 600
--> 1004 x 597 pour 1024 x 768
--> 1132 x 793 pour 1152 x 864
--> 1260 x 853 pour 1280 x 1024
--> 1580 x 1129 pour 1600 x 1200
� Familles de polices
--> Arial, "Arial Black", "Arial Narrow", Impact, Tahoma, "Trebuchet MS", Verdana, sans-serif
--> Georgia, Palatino, "Times New Roman", serif
--> "Courier New", monospace
--> "Comic Sans MS", cursive
--> Webdings, fantasy
� Les div ne doivent pas rester vides.
� La position relative preserve l'espace initial de l'element.
� La position absolute supprime l'espace initial de l'element.
� Un element en float: left (right); sera pouss� aussi loin que possible � la gauche (droite) de son parent.
� La fusion des marges verticales n'a lieu qu en presence de boites de type block dans le flux normal du document. Les marges verticales des boites de type inline, flottantes ou positionnees de maniere absolue ne fusionnent jamais.
--> La solution r�side dans l'application d'un border transparent ou d'un padding de 1 px. 
� Les padding, border et margin verticaux n'ont aucun effet sur la hauteur d'une bo�te inline.
� Un texte ajout� dans un �l�ment de niveau block sans �tre d�fini dans un paragraphe est consid�r� comme une bo�te block anonyme.
� Une structure est dite liquide (ou fluide) si elle s'adapte aux dimensions de la fenetre du navigateur et � ses variations. Afin d'obtenir cet effet, on utilise des dimensions exprimees en %. Il est alors bon de specifier une min-width et une max-width.
� Une structure est dite elastique si elle s'adapte aux variations de dimensionnement du texte. Afin dobtenir cet effet, on utilise des dimensions exprim�es en em. Il est alors bon de specifier une min-width et une max-width, et de choisir une base d'�chelle pour font � 62.5% (1em est alors sensiblement �gal � 10px).
� Une structure hybride utilisera la base d'�chelle de font � 62.5%, les dimensions exprim�es en em, des min-width en px et des max-width en % (IE/Win sera laiss� de c�t� pour ces derni�res).
--------------------------------------------------------------------------------- */