/* ========================================================================
                                Général
======================================================================== */
BODY { 
	/* background: url('Duhautdelabutte.jpg') white no-repeat center fixed; */
	background-color: #9CBDDE;
	/*background: url('IMG_0307.JPG') white no-repeat center 40% fixed; */
	PADDING:0px; MARGIN: 0px; COLOR: #000; 
	FONT-FAMILY: "Trebuchet MS",Verdana, Arial, Helvetica,sans-serif 
}

/* ========================================================================
                           Banière du haut
======================================================================== */
DIV.banner {
	PADDING:5px;
	MARGIN-BOTTOM: 0px; VERTICAL-ALIGN: middle 
}
div.banner { 
	FONT-WEIGHT: bold; FONT-SIZE: 1.6em; COLOR: #900; 
	FONT-FAMILY: "Trebuchet MS",Verdana, Arial, Helvetica,sans-serif;
}
div.smallBanner {
	FONT-WEIGHT: bold; FONT-SIZE: 1em; COLOR: black; 
	FONT-FAMILY: "Trebuchet MS",Verdana, Arial, Helvetica,sans-serif
}

A.boxlink{
	text-align: center;
	color: #fff;
	background-color: #036;
	text-decoration: none;
 	padding: 0.2em 0.7em; 
 	FONT-SIZE: 0.9em;
	FONT-FAMILY: "Trebuchet MS",Verdana, Arial, Helvetica,sans-serif
}
A.boxlink:hover{ 	
	background-color: #369;
	color: #fff;
}

/* ========================================================================
                           Boîte d'outils en haut
======================================================================== */


ul.navlist {
	clear: both;
	padding: 0; margin: 0;
	list-style-type: none;
	float: left; 
	width: 100%; 
	color: #fff;
	background-color: #036;
}
ul.navlist li { 
	display: inline; 
}
ul.navlist li a {
	float: left;
	color: #fff;
	background-color: #036;
 	padding: 0.2em 0.7em; 
	text-decoration: none;
	border-right: 1px solid #fff;
	FONT-SIZE: 0.8em;
}
ul.navlist li a:hover{
	background-color: #369;
	color: #fff;
}

/* ========================================================================
                          NavList Top
======================================================================== */


ul.navlistTop {
	clear: both;
	padding: 0; margin: 0;
	list-style-type: none;
	float: right; 
	color: #fff;
}
ul.navlistTop li { 
	display: inline; 
}
ul.navlistTop li a {
	float: right;
	color: #fff;
 	padding: 0.2em 0.7em; 
	text-decoration: none;
	border-left: 1px solid #fff;
	FONT-SIZE: 0.8em;	
	background-color: #036;
}
ul.navlistTop li a:hover{
	background-color: #369;
	color: #fff;
}

/* ========================================================================
                          Barre d'outils secondaire
======================================================================== */
ul.subnavlist {
	clear: both;
	padding: 0; margin: 0;
	list-style-type: none;
	float: left;
	width: 100%;
	color: #fff;
	background-color: #369;
}
ul.subnavlist li { 
	display: inline; 
}
ul.subnavlist li a {
	float: left;
	color: #fff;
	background-color: #369;
	padding: 0.2em 0.7em;
	text-decoration: none; 
	border-right: 1px solid #fff;
	FONT-SIZE: 0.8em; 
}
ul.subnavlist li a:hover{
	background-color: #036;
	color: #fff;
}
#active a {
	FONT-WEIGHT: bold;
}

/* ========================================================================
                           Contenu de la page
======================================================================== */

DIV.contents {
	clear: both;
	float: left; 
	Margin-left: 1%; 
	Margin-top: 2%; 
	width: 96%;  
	
	/*BACKGROUND-color: white; 
	filter: alpha(opacity=30);
	-moz-opacity: 1.0; 
	opacity: 1.0;   */
}

DIV.contents * {
	position: relative;
}

DIV.box {
	Margin: 20px;
	FONT-SIZE: 0.8em;
	/* text-align: justify; */
	/* FONT-WEIGHT: bold;  */
	color: black;
}
DIV.box * {
	POSITION: relative;
}

A.liste {
	FONT-SIZE: 0.8em;
	text-align: center; 
	COLOR: #900;
	FONT-WEIGHT: bold;
	TEXT-DECORATION: none;
}

DIV.box_english {
	width: 30%;
	float:right;
	Margin: 20px;
	FONT-SIZE: 0.75em;
	color: black;
	Padding-left: 10px; Padding-right: 10px;
	BORDER: #036 2px solid;
	background-color: #538CC6;
}
/* ========================================================================
                           Images à gauche et à droite
======================================================================== */
DIV.box_image-gauche {
	BORDER: #036 1px solid;	
	FLOAT: left;
	PADDING: 5px;
	FONT-SIZE: 0.9em; 
	MARGIN: 1%;
	color: black;
}
DIV.box_image-droite {
	BORDER: #036 1px solid;	
	FLOAT: right;
	PADDING: 5px;
	FONT-SIZE: 0.9em; 
	MARGIN: 1%;
	color: black;
}

DIV.box_image-titre {
	text-align: center;
	MARGIN: 5px;
	FONT-SIZE: 1.0em; 
	FONT-WEIGHT: bold; 
	color: black;
}

/* ========================================================================
                           Barre de côté 
					(déterminer si float left ou rigth)
======================================================================== */

DIV.sidebar-box {
	Margin-RIGHT: 1%; Margin-LEFT: 1%; 
	MARGIN-TOP: 10px; MARGIN-BOTTOM: 10px; 
	BORDER: #036 1px solid; 
	FONT-SIZE: 0.7em; 
}
DIV.sidebar-box-title {
	PADDING: 1%;
	FONT-WEIGHT: bold; FONT-SIZE: 1.1em; 
	BACKGROUND: #036; COLOR: #ffffff; 
	TEXT-ALIGN: center
}
DIV.sidebar-box-contents {
	PADDING: 5px; 
	text-align: center;
}
DIV.sidebar-box-footer {
	FONT-SIZE: 1.1em; FONT-WEIGHT: bold;
	PADDING-BOTTOM: 2px; PADDING-TOP: 2px; 
	text-align: center
}

/* ========================================================================
                           Gallerie de Photos
======================================================================== */

DIV.photo{ 
	BORDER-LEFT: #900 2px solid;	BORDER-TOP: #900 2px solid;
	Margin: 20px; 
	COLOR: black;
	FONT-SIZE: 1.0em;
	PADDING: 5px;
	FLOAT: left;
	height:8.8em;
	width:18%;
}
DIV.photo-titre{
	TEXT-ALIGN: left;
	MARGIN: 5px;
	FONT-SIZE: 0.8em; 
	color: black;
}
A.photo{
	FONT-SIZE: 1.0em; 
	text-align: center; 
	COLOR: black; 
	TEXT-DECORATION: none;
}
DIV.photo-clear{
	clear:both;
}

/* ========================================================================
               Style de point pour listes et énumérations
======================================================================== */
.bullet {
	list-style-type:disc;
}


/* ========================================================================
               Liens en bas de la page et info sur le site web
======================================================================== */
DIV.bottom {
	clear: both;
	float: left;
	Margin: 1%; 
}
DIV.liens { 
	PADDING-LEFT: 1%; 
	PADDING-TOP: 5px; 
	PADDING-BOTTOM: 5px; 
	COLOR: white;
}
A.liens {
	FONT-SIZE: 0.8em; 
	text-align: center; 
	COLOR: white; 
	TEXT-DECORATION: none;
}
A.liens:hover{ 
	COLOR: cc1100;
}
DIV.infoWeb {
	PADDING-LEFT: 1%; 
	PADDING-RIGHT: 1%;
	PADDING-TOP: 2px; 
	PADDING-BOTTOM: 5px; 
	FONT-SIZE: 0.6em; 
	COLOR: white; 
}

/* ========================================================================
                       Polices et styles de polices
======================================================================== */
H1 {
	COLOR: #900; FONT-FAMILY: "Trebuchet MS",Arial; LETTER-SPACING: 0.2em;
}
H2 {
	COLOR: #900; FONT-FAMILY: "Trebuchet MS",Arial; LETTER-SPACING: 0.2em; Font-size: 1.3em;
}
H3 {
	COLOR: #900; FONT-FAMILY: "Trebuchet MS",Arial; LETTER-SPACING: 0.2em
}
H4 {
	COLOR: #900; FONT-FAMILY: "Trebuchet MS",Arial; LETTER-SPACING: 0.1em;
}
H5 {
	COLOR: #900; FONT-FAMILY: "Trebuchet MS",Arial; LETTER-SPACING: 0.1em
}

header4 {
	COLOR: #900; FONT-FAMILY: "Trebuchet MS",Arial; LETTER-SPACING: 0.1em; FONT-WEIGHT: bold; 
}

td { 
	FONT-SIZE: 0.8em;
}