@import url("layout.css");
body {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size:  12px;
	color: #000;
	text-align: justify;
	background-color: #800000;
}
/* contient tous les éléments de la page */
#container {
	width: 950px;
	margin: 0 auto;
	background-color: #c0c0c0;
}

/* concerne l'en tête de la page avec l'image bandeau */
#masthead {
	text-align: right;
	width: 950px;
	overflow: auto;
	background-color: #f7b233;
}

/* concerne le menu de gauche de la page */
#sidebar {
	float: left;
	width: 159px;
	background-color: #c0c0c0;
	position: relative;
	clear: both;
	display: inline;
}
/* concerne le contenu de la page */
#content {
	float: left;
	width: 749px;
	padding: 15px;
	padding-top: 0px;
	overflow: auto;
	background-color: #fff;
	margin: 0px;
	position: relative;
}

#footer {
	clear: both;
	width: 950px;
	background-color: #a9a9a9;
	padding: 0;
	overflow: auto;
	margin-top: 0px;
}

/* Marges texte autour image Gauche */

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

/* Marges texte autour image Droite */

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

/* CONTENU SEPARE EN 2 COLONNES */

/* Positions de la 1ere colonne Gauche */
#colgauche {
	float: left;
	width: 360px;
	padding: 0px 0px 20px 0px;
	}

/* Positions de la 1ere colonne Droite */
#coldroite {
	float: right;
	width: 360px;
	padding: 0px 0px 20px 0px;
	}
	

/* Positions de la 2eme colonne Gauche */
#colgauche2 {
	float: left;
	width: 360px;
	padding: 0px 0px 20px 0px;
	}

/* Positions de la 2eme colonne Droite */
#coldroite2 {
	float: right;
	width: 360px;
	padding: 0px 0px 20px 0px;
	}
/*------------------------------------------------------------------------------------*/
/* instructions pour bordure droite du quatrieme bloc vertical ou horizontal */
#bloc4id{
border-right:1px dotted #444444;
}
/* Bloc de 4 images horizontales avec texte en dessous */
.bloc4ih{
background-color:#ffffff;
border:1px dashed #444444;
border-right:none;
width:185px;
margin:0;
margin-top:5px;
float:left;
color:#999999;
}
/* Traitement des images contenues dans le bloc4 */
.bloc4ih img{
width:160px;
margin:5px;
margin-left:12px;
top:0;
}
/* Traitement du texte paragraphe contenu dans le bloc4 */

.bloc4ih p{
color:#777777;
margin:3px;
}
/*------------------------------------------------------------------------------------*/
/* Pave de 4 images verticales avec texte en dessous */
.bloc4iv{
background-color:#ffffff;
border:1px dotted #444444;
width:185px;
margin:0;
margin-top:5px;
border-right:none;
float:left;
color:#999999;
}

/* Traitement des images contenues dans le pave 4 photos verticales */
.bloc4iv img{
height:192px;
margin:5px;
margin-left:26px;
top:0;
}
/* Traitement du texte paragraphe contenu dans le pave 4 photos verticales*/

.bloc4iv p{
color:#777777;
margin:3px;
}

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

/* Bloc de 4 mini photos horizontales avec texte encadrant image */
.bloc4mih{
background-color:#ffffff;
border:1px dashed #444444;
border-right:none;
width:185px;
margin:0;
margin-top:5px;
margin-bottom:5px;
float:left;
color:#999999;
}
/* Traitement des images contenues dans le bloc4 */
.bloc4mih img{
width:60px;
margin:5px;
top:0;
float:left;
}
/* Traitement du texte paragraphe contenu dans le bloc4 */

.bloc4mih p{
color:#777777;
margin:3px;
text-align:left;
}
/*------------------------------------------------------------------------------------*/

/*------------------------------------------------------------------------------------*/
/* instructions pour bordure droite du quatrieme bloc vertical ou horizontal */
#bloc3id{
border-right:1px dashed #444444;
}
/* Bloc de 4 images horizontales avec texte en dessous */
.bloc3ih{
background-color:#ffffff;
border:1px dashed #444444;
border-right:none;
width:247px;
margin:0;
margin-top:5px;
float:left;
color:#999999;
}
/* Traitement des images contenues dans le bloc4 */
.bloc3ih img{
width:200px;
margin:5px;
margin-left:22px;
top:0;
}
/* Traitement du texte paragraphe contenu dans le bloc4 */

.bloc3ih p{
color:#777777;
margin:3px;
}
/*------------------------------------------------------------------------------------*/
/* Pave de 4 images verticales avec texte en dessous */
.bloc3iv{
background-color:#ffffff;
border:1px dashed #444444;
width:247px;
margin:0;
margin-top:5px;
border-right:none;
float:left;
color:#999999;
}

/* Traitement des images contenues dans le pave 4 photos verticales */
.bloc3iv img{
height:170px;
margin:5px;
margin-left:70px;
top:0;
}
/* Traitement du texte paragraphe contenu dans le pave 4 photos verticales*/

.bloc3iv p{
color:#777777;
margin:3px;
}


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

/* Bloc AGENDA */
.bloc1ih{
background-color:#f3f3f3;
border:1px dotted #444444;
border-right:1px dotted #444444;
width:100%;
margin:0;
margin-top:5px;
margin-bottom:5px;
float:left;
color:#999999;
}

.bloc1ih{
background-color:#f3f3f3;
border:1px dotted #444444;
border-right:1px dotted #444444;
width:100%;
margin:0;
margin-top:5px;
margin-bottom:5px;
float:left;
color:#999999;
}
/* Traitement des images contenues dans le bloc agenda */
.bloc1ih img{
width:130px;
margin:5px;
top:0;
float:left;
}
/* Traitement du texte paragraphe contenu dans le bloc agenda */

.bloc1ih h1 {
font-family:Verdana;
font-size: 13px;
font-variant:small-caps;
font-style:normal;
color:#ab0105;
	}

.bloc1ih h2 {
font-family:Verdana;
font-size: 12px;
font-style:normal;
color:black;
	}

.bloc1ih h3 {
	font-family:Verdana;
	font-size: 12px;
	font-style:normal;
	color:#4c7d8a;

}

.bloc1ih p{
color:#777777;
margin:3px;
text-align:justify;
}


/*-------bloc portail une photo à gauche une ligne  et une légende -----*/

.portail1ig{
background-color:#ffffff;
border:1px dotted #444444;
border-right:1px dotted #444444;
width:100%;
margin:0;
margin-top:5px;
margin-bottom:5px;
float:left;
color:#999999;
}
/* traitement des images contenues dans le bloc portail 1g */
.portail1ig img{
width:200px;
margin:5px;
top:0;
float:left;
}

/* traitement du texte paragraphe contenu dans le bloc portail 1g */

.portail1ig h1 {
font-family:Verdana;
font-size: 18px;
font-variant:small-caps;
font-style:normal;
color:#ab0105;
	}

.portail1ig h2 {
font-family:Verdana;
font-size: 15px;
font-style:normal;
	}

.portail1ig h2 {
font-family:Verdana;
font-size: 15px;
font-style:normal;
	}

.portail1ig h3 {
	font-family:Verdana;
	font-size: 12px;
	font-style:normal;
	color:black;

}

.portail1ig p{
color:black;
margin:3px;
text-align:justify;
}

/*------- fin bloc portail une photo à gauche une ligne  et une légende -----*/


/*------------bloc portail une photo à droite une ligne  et une légende -----*/

.portail1id{
background-color:#f3f3f3;
border:1px dotted #444444;
border-right:1px dotted #444444;
width:100%;
margin:0;
margin-top:5px;
margin-bottom:5px;
float:left;
color:#999999;
}
/* Traitement des images contenues dans le bloc portail 1d */
.portail1id img{
width:200px;
margin:5px;
top:0;
float:right;
}
/* Traitement du texte paragraphe contenu dans le bloc portail 1d */

.portail1id h1 {
font-family:Verdana;
font-size: 18px;
font-variant:small-caps;
font-style:normal;
color:#ab0105;
	}

.portail1id h2 {
font-family:Verdana;
font-size: 15px;
font-style:normal;
	}

.portail1id h3 {
	font-family:Verdana;
	font-size: 12px;
	font-style:normal;
	color:black;

}

.portail1id p{
color:black;
margin:3px;
text-align:justify;
}

/*------------ fin bloc portail une photo à droite une ligne  et une légende -----*/


/*--------------travail bloc 2 images horizontales ------------------------*/
/*------------------------------------------------------------------------------------*/


/* Bloc de 2 images horizontales avec texte en dessous */
.portail2ih{
background-color:#ffffff;
border:1px dotted #f7b233;
border-right:none;
width:373px;
margin:0;
margin-top:5px;
margin-bottom:15px;
float:left;
color:#999999;
}
/* Traitement des images contenues dans le bloc 2 images */

.portail2ih img{
width:205px;
margin:5px;
top:0;
float:left;
}
/* Traitement du texte paragraphe contenu dans le bloc portail 2 images h */

.portail2ih h1 {
font-family:Verdana;
margin:3px;
font-size: 18px;
font-variant:small-caps;
font-style:normal;
color:#ab0105;
	}

.portail2ih h2 {
font-family:Verdana;
font-size: 15px;
font-style:normal;
	}

.portail2ih h3 {
	font-family:Verdana;
	font-size: 12px;
	font-style:normal;
	color:black;

}

.portail2ih p{
color:black;
margin:3px;
text-align:justify;
}



/*------------------------------------------------------------------------------------*/
/* instructions pour bordure droite du second bloc vertical ou horizontal */
#portail2ih{
border-right:1px dotted #444444;
}
#portail2ih0{
border-right:1px dotted #f7b233;
}
#portail2ih1{
border-right:1px dotted #444444;
}
#portail2ih2{
border-right:1px dotted #444444;
}
#portail2ih3{
border-right:1px dotted #444444;
}
#portail2ih4{
border-right:1px dotted #444444;
}

/* FIN instructions pour bordure droite du second bloc vertical ou horizontal */
/*------------------------------------------------------------------------------*/




/*------------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------*/
/*----------- bordure pointillee -------------------------------------*/

/* ligne separatrice en pointilles couleur bordeaux */

.hrl1 { /* Un premier filet en pointilles */
  border: none;                   /* pas des bordures */
  border-top: 2px dashed #800000; /* juste UNE ligne en pointillés, de hauteur 2 pixels */
  height: 0px;                    /* Le filet est rendu grâce à la bordure haute donc pas besoin de contenu */
  width: 100%;  
} 
/*------------------------------------------------------------------------------------*/


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


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


/* Style pour 4 blocs photos verticales */

.bloc1 {background-color: white;height: 192px;
width: 128px;
float: left;}
.bloc2 {background-color: white;height: 192px;
width: 128px;
float: left;margin-left: 75px;}
.bloc3 {background-color: white;height: 192px;
width: 128px;
float: left;margin-left: 75px;}
.bloc4 {background-color: white;height: 192px;
width: 128px;
float: left;margin-left: 75px;}

/* Style pour 4 blocs photos verticales  160x240 */

.bloc21 {background-color: white;height: 240px;
width: 160px;
float: left;}
.bloc22 {background-color: white;height: 240px;
width: 160px;
float: left;margin-left: 33px;}
.bloc23 {background-color: white;height: 240px;
width: 160px;
float: left;margin-left: 33px;}
.bloc24 {background-color: white;height: 240px;
width: 160px;
float: left;margin-left: 33px;}

/* Style pour 3 blocs photos horizontales */

.bloc5 {background-color: white;height: 160px;
width: 240px;
float: left;}
.bloc6 {background-color: white;height: 160px;
width: 240px;
float: left;margin-left: 13px;}
.bloc7 {background-color: white;height: 160px;
width: 240px;
float: left;margin-left: 13px;}

/* Style pour blocs mixtes 2 photos horizontales et 1 verticale */

.bloc8 {background-color: white;height: 192px;
width: 240px;
float: left;margin-left: 22px;}
.bloc9 {background-color: white;height: 192px;
width: 128px;
float: left;margin-left: 42px;}
.bloc10 {background-color: white;height: 192px;
width: 128px;
float: left;margin-left: 42px;}

/* Style pour blocs photos petits formats mixtes 2 photos horizontales et 2 verticales */

.bloc11 {background-color: white;height: 140px;
width: 210px;
float: left;margin-left: 15px;}
.bloc12 {background-color: white;height: 192px;
width: 128px;
float: left;margin-left: 15px;}
.bloc13 {background-color: white;height: 192px;
width: 128px;
float: left;margin-left: 15px;}
.bloc14 {background-color: white;height: 140px;
width: 210px;
float: left;margin-left: 15px;}

/* propriétés des titres H1 */
h1 {
font-family:Verdana;
font-size: 28px;
font-style:normal;
color:#ab0105;
	}
/* propriétés des titres H2 */
h2 {
font-family:Verdana;
font-size: 24px;
font-style:italic;
color:black;
	}
	
/* propriétés des titres H6 */
h6 {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: white;
background-color: black;
text-indent: 5pt;
border-left-width: 12px;
border-left: solid;
border-color: #ab0105;
}

/* propriétés des titres H3 */
h3 {
	font-family:Verdana;
	font-size: 20px;
	font-style:normal;
	color:#808080;

}

/* propriétés des titres H4 */
h4 {
	font-family: Verdana;
	color:#0044bb;
	text-transform:none;
	font-size: 18px;
	font-weight:bold
}

/* propriétés des titres H5 */
h5 {font-family:Verdana;
font-size: 15px;
color:#4c7d8a;
}

/* propriétés des titres H6 */
h6 {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: white;
background-color: black;
text-indent: 5pt;
border-left-width: 12px;
border-left: solid;
border-color: #ab0105;
}

/* concerne les propriétés des éléments spécifiques à chaque cadre */

#content img {
	display: block;
}

#masthead img {
	float: left;
}
p {
	text-align: justify;
	margin: 0;
	margin-top: 0px;
	margin-right: 0px;
	padding: 0;
}
/* Styles pour les éléments de navigation */
/* Puces uniquement utilisées pour le menu gauche */
#sidebar ul {
	list-style-type: none;
	width: 100%;
	display: block;
	margin: 0;
	padding: 0;
}
#sidebar li {
	display: block;
	border: 1px solid #c0c0c0;
}
/* Gestion des couleurs du premier bloc menu de gauche */
#sidebar .couleur1{
background-color:#f7b233;
}
/* Gestion des couleurs du dernier bloc menu de gauche spécifique aux liens */
#sidebar .couleur2 a{
background-color:#04b;
color:#c0c0c0;
}

/* concerne les liens du menu de gauche */
#sidebar a {
	font-weight: bold;
	text-decoration: none;
	color: #04b;
	display: block;
	padding: 5px;
	border-bottom: 1px solid #f9f9f9;
}
/* concerne le survol des liens du menu de gauche */
#sidebar a:hover {
	font-weight: bold;
	text-decoration: none;
	color: #04b;
	border-bottom: 1px solid #f9f9f9;
	background-color: #f9f9f9;
}
/* Styles pour le pied de page */
#footer p {
	font-size: 0.9em;
	text-align: center;
	margin: 0px;
	padding: 2px;
}
/* concerne les liens du bas de page */
#footer a {
	color: #333;
	text-decoration: underline;
}

/* concerne le survol des liens spécifiques au bas de page */
#footer a:hover {
	color: #333;
	text-decoration: none;
}
a {
	color: #04b;
	text-decoration: underline;
}

/* concerne le survol de tous les autres liens du site */
a:hover {
	color: #800000;
	text-decoration: underline;
}
.style_bold {
	font-weight: bold;
}
.style_italic {
	font-style: italic;
}