/* ******************** */
/* STYLES PREDEFINIS */
/* ******************** */

/* Général : */
body {
	 background-color:#651D14;
	 width:900px;
	 margin-left:50px;	
	 color:#FBA74A;	
	 font-family:"Times New Roman", Times, serif;
	 }
*    { margin:0px; margin-top:0px; }
p	 { text-align:justify; 
		margin-left:10px;
		margin-top:10px;
		margin-bottom:10px;
		}	

/* Listes : */
ul   { margin-left:50px;}
li   { margin:0px;	}

/* Tableaux : */
td * { padding-right:2px; }
table, tr, td
	{
	border-style:solid;
	border-width:3px;
	border-color:#651D14;
	background-color:#7D231A;
	}

/* On ajoute cette classe quand on veut écrire sous un objet flottant*/
.sousfloat 	{clear: both;}
.pasimportant	{	font-style:italic;	font-size:smaller; 	}

/* Google AdSense :*/
div.googlead_gauche	{	float:left;	margin-right:15px;	}
div.googlead_droite	{	float:right;	margin-left:15px;	}


/* Citation - Lecteur parle - Anecdote - Attention*/

div.citation,
div.citation-gauche,
div.citation-droite,
div.lecteurparle,
div.lecteurparle-gauche,
div.lecteurparle-droite,
div.anecdote,
div.anecdote-gauche,
div.anecdote-droite,
div.attention,
div.attention-gauche,
div.attention-droite
div.noteregionale,
div.noteregionale-gauche,
div.noteregionale-droite
	{
	padding:5px;	
	border-width: 1px;
	border-style: solid;	
	}

div.citation,
div.lecteurparle,
div.anecdote,
div.attention,
div.noteregionale
	{	margin-left: 100px;	
	    margin-right: 100px;
		margin-top: 10px;
		margin-bottom: 10px;
	}
/*Cette classe etroit est destinée à être ajoutée a citation, lecteurparle, anecdote et notreregionale, pour avoir un cadre moins large au milieu du texte, par exemple pour ne pas interférer éventuellement avec des cadres flottants à gauche et à droite*/
.etroit	{	
        margin-left: 270px;	
		margin-right: 270px;	
		}
/*Je crée de nouvelles classes -gauche, -droite, etc. car si je crée des classes gauche et droite que j'ajoute comme classe additionnelle des anecdotes, attentio, etc., j'ai d'énormes problèmes de marges qui s'additionnent entre elles de manière incontrôlable*/
div.citation-gauche,
div.lecteurparle-gauche,
div.anecdote-gauche,
div.attention-gauche,
div.noteregionale-gauche,
div.citation-droite,
div.lecteurparle-droite,
div.anecdote-droite,
div.attention-droite,
div.noteregionale-droite
	{
	margin:15px;
	width:250px;	
	padding:10px;
	}

div.citation-gauche,
div.lecteurparle-gauche,
div.anecdote-gauche,
div.attention-gauche,
div.noteregionale-gauche
	{
	float:left;
	}
div.citation-droite,
div.lecteurparle-droite,
div.anecdote-droite,
div.attention-droite,
div.noteregionale-droite
	{
	float:right;
	}

div.lecteurparle,
div.lecteurparle-gauche,
div.lecteurparle-droite
	{
	background-color:#a69887;
	border-color: #452b1a;
	border-style:inset;
	color:#452b1a;
	font-family: "Comic Sans MS";
	font-size:small;
	text-align: center;
	}
div.anecdote,
div.anecdote-gauche,
div.anecdote-droite
	{
	background-color:#541610;
	border-color: #DB7504;
	color:#DB7504;
	font-style:italic;
	}

div.citation,
div.citation-gauche,
div.citation-droite
	{
	background-color:#AE491E;
	border-color: #471107;
	color:#471107;
	font-size:90%;
	font-weight:bold;
	text-align:center;
	background-image:url(images/fondcitation.jpg);
	background-repeat:repeat;
	}

div.attention,
div.attention-gauche,
div.attention-droite
	{
	background-color: #42120D;
	color: #CF2507;
	text-align: center;
	font-family: "Courier New", Courier, monospace;
	font-weight:bold;
	border-style: none;
	}

div.noteregionale,
div.noteregionale-gauche,
div.noteregionale-droite
	{
	background-color:#DDDB77;
	border-style:none;
	color:#4B4018;
	font-style:italic;
	}
	
div.attention>span.important,
div.attention-gauche>span.important,
div.attention-droite>span.important
	{
	color:#000000;
	background-color:#8D1A05;
	}
	
/* On ajoute une 2ème classe droite ou gauche afin de choisir ou on veut placer les Citation - Attention - Lecteur parle - anecdote et Images Img*/
img, img.gauche, img.droite {margin:10px}
img.droite	{	float:right;	}	
img.gauche	{	float:left; }


/*----------
  - TITRES -
  ----------*/
h1,h2,h3,h4,h5,h6	{	color:#E17906;	
						padding-left:30px;
						padding-top:10px;
						margin-top:100px;
						border-top-style:solid;
						border-top-color:#884c44;
						border-top-width:1px;
						background-image:url(images/fondtitre.gif);
						background-repeat:repeat-y;						
						}
h1                  {   margin-top:50px;
                        color:#F3F1F1;
						text-align:center;  }
h2					{ color:#FCCC98; } 

/* Ces styles précisent un comportement à adopter lorsqu'un style en suit un autre. Ici, lorsqu'un titre suit un autre titre, 
   il est plus clair et esthétique de se passer d'une marge entre les deux titres */
h1+h2, h1+h3, h1+h5, h2+h3, h2+h5, h3+h5 {margin-top:0px;}

/* Cette première occurrence de H1 ne doit pas avoir de fond image en dégradé, parce que c'est une image : */
h1:first-child {background-image:none; border-style:none;}

/* Utilisons h5 plutôt que titreminime, pour garder un poids sémantique*/
h5 					{font-size:130%;	}
	
/*--------------------
  - LIENS HYPERTEXTE -
  --------------------*/
/* Les liens hypertextes et les ancres sont tous deux représentés par la balise a. Du coup, comme je désire encadrer les liens internes par
   des pointillés, il m'encadre aussi les ancres avec des pointillés. Comme les ancres n'ont pas de largeur, on a l'impression qu'il y a juste une
   ligne verticale à gauche des titres, puisque les ancres sont à côté des titres. Je dois donc préciser que les ancres ont une bordure "None".
   Pour ce faire, je dois demander une propriété CSS qui s'applique aux balises hypertexte a qui ont une propriété "name", car c'est ainsi qu'on
   reconnaît les ancres dans le code HTML. Malheureusement, ce code ne marche pas avec Explorer*/
a[name] { border-style:none!important;}
a
	{
	border-style:dotted;
	border-width:1px;
	font-family:"Courier New", Courier, monospace;
	font-size:90%;
	}
a.externe	{border-style:none;	}
a:link      {color:#EFCD0E; } /* Lien pas encore visité : jaune pâle*/
a:visited   {color:#D3CE03} /* Lien déjà visité : jaune kaki */
a:hover     {color:#FFFFFF;} /* La souris passe par dessus (sans clic): blanc*/
a:active    {color:#FFFFFF; font-weight:bold;} /* le bouton de la souris est appuyé: violet*/


/*--------------------
  - PETITS SPAN      -
  - Rarement utilisés-
  --------------------*/
.rouge	{	color:#FF0000;	}
.vert	{	color:#00CC00;	}



/* ******************** */
/* TABLE DES MATIERES */
/* ******************** */


h1.tm , h2.tm , h3.tm , h4.tm , h5.tm , h6.tm , div.titrechapitre
	{ 
	text-align:left;
	display:block;
	color:#E17906;
	margin:0;
	border-top-style:none;
	border-top-color:#884c44;
	border-top-width:1px;
	font-weight:normal;
    background-image:none;
	padding:0;
	}

div.section
	{
	background-color:#581B12;
	padding:7px;
	margin-top:50px;
	}
	
div.titrechapitre  
	{
	color:#E17906;
	font-size:120%;
	font-weight: bold;
	}	
div.intro
	{
	color:#E2AB94;
	background-color:#69351F;
	font-size:small;
	font-style:italic;
	text-align:justify;
	margin:5px;
	margin-left:50px;
	margin-right:50px;
	padding:8px;
	}
						
h1.tm  { margin-left:12px; font-size:100%;  }
h2.tm  { margin-left:24px; font-size:95%;}
h3.tm  { margin-left:36px; font-size:90%; }
h4.tm  { margin-left:48px; font-size:90%%;}
h5.tm  { margin-left:60px; font-size:90%; }
h6.tm  { margin-left:72px; font-size:90%; }

a.tm
	{
	border-style:none;
	font-family:"Times New Roman", Times, serif;
	font-size:100%;
	}
a.tm:link {
	color:#D3CE03;;
} /* Lien pas encore visité : jaune pâle*/
a.tm:visited {color:#E17906} /* Lien déjà visité : jaune kaki */
a.tm:hover {color:#FFFFFF;} /* La souris passe par dessus (sans clic) : blanc*/
a.tm:active {color:#FFFFFF;
font-weight:bold;} /* le bouton de la souris est appuyé : violet*/

.gras
	{
	font-weight:bold;
	}
div.enteteactualite
	{
	background-color:#501414;
	text-align:center;
	font-size:large;
	font-weight:bold;
	margin:0;
	padding:0;
	margin-bottom:5px;
	margin-top:5px;
	}