/* --- Styles : www.mariannecornut.ch --- */
					 /* --- Webmaster : www.inforweb.ch --- */
/* -------------------------------------------------------------------
Attention : impossible d'obtenir le 100% pour "leftCol" ---
Donc placé : background-image : url(images/fond_long.gif); dans body ---
------------------------------------------------------------------- */

/* --- Balises de base ----------------------------------------------- */
body {
	height: 100%;
	margin : 0px 0px 0px 0px;
	margin-bottom : 0px;
	margin-left : 0px;
	margin-right : 0px;
	margin-top : 0px;
	
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size : 12px;
	color:#DDDDDD;	
	text-align : left;
	
	background : #000000;
	background-image : url(images/fond_long.gif);
}

/* --- ZONE : ID ------------------------------------------------------- */
		/* --- ZONE : POSITION ABSOLUE ----------------------------------------- */		
			
			#leftCol {
				position: absolute;
				top: 0px;
				left: 10px;
				width: 207px;
				height:100%;
				/*height : 100%; --- si non 100% de l'affichage en cours (ouverture de fenêtre) --- */
				background-color : #000000;
				border : 0px none White;
				border-left: 1px solid #FFFFFF;
				border-right : 1px solid #FFFFFF;
				margin-bottom : 0px;
				margin-left : 0px;
				margin-right : 0px;
				margin-top : 0px;
			}
			#rightCol {
				position: absolute;
				top: 0px;
				left: 218px;
				width : 540px;
				height:100%;
				/*height : 100%; --- si non 100% de l'affichage en cours (ouverture de fenêtre) --- */
				background-color : #333333;
				border-left: 1px solid #FFFFFF;
				border-right : 1px solid #FFFFFF;
				margin : 0px 0px 0px 0px;
				margin-bottom : 0px;
				margin-left : 0px;
				margin-right : 0px;
				margin-top : 0px;
				/*--- overflow: auto; ---*/
			}
			
		/* --- FIN ZONE : POSITION ABSOLUE -------------------------------------- */
		
		/* --- ZONE : ID imbriquées -------------------------------------- */
			#logo {
				width : 207px;
				height : 103px;
				border : 0px none #FFFFFF;
				background-color: #000000;
				background-image : url(images/logo_01.jpg);
				background-repeat : no-repeat;
				background-position : left;
			}
			#menuTop {
				width : 540px;
				height : 139px;
				border : 0px none #FFFFFF;
				background-image : url(images/header_01.jpg);
				background-repeat : no-repeat;
				background-position : left;
			}
			#menuLeft {
				width : 207px;
				margin-top : 30px;
				border : 0px none #FFFFFF;
				background-color : #000000;		
			}
			#content {
				width: 520px;
				float: right;
				padding-left : 20px;
				padding-right : 0px;
				padding-top : 10px;
				padding-bottom : 20px;
				margin: 0;
				border : 0px none #000000;
				background-color : #333333;
			}

			#animFlash {
				margin-top: 20px;
				margin-bottom: 20px;
				border: 0px none #FFFFFF;
				border-top: 1px solid White;
				border-bottom: 1px solid White;
				background-color: #FFFFFF;
			}
			#infoSite {
				margin-top: 20px;
				margin-left: 10px;
				padding-top : 6px;
				padding-bottom : 5px;				
			}
		/* --- FIN ZONE : ID IMBRIQUE -------------------------------------- */
		
/* --- FIN ZONE : ID ---------------------------------------------------- */
	
/* --- ZONE : imbrication dans #rightCol ---------------------------------------------------- */

		.TitleGalerie {
			color:#FFFFFF;
			font-weight : bold;
		}
		.longTXT {
			text-align:left;
			letter-spacing : 0.05em ;
			line-height: 1.3;
		}
		.col1 { 
			float: left;
			width: 320px;
			margin: 0px;
			padding: 0px;
		}
		.col2 { 
			float: right;
			width: auto;
			margin-left: 10px;
			padding: 0px;
		}
		.col_unique { 
			float: left;
			width: 500px;
			margin: 0px;
			padding: 0px;
		}
		.col2  div.headerA {
			width: 150px;
			padding-left: 5px;
			background-color: #4422FF;
			border-bottom: 1px solid #CCCCCC;
			font-weight: bold;
		}
		.col2  div.contentA {
			width: 150px;
			padding-top: 5px;
			padding-left: 5px;
			padding-bottom: 20px;
		}
/* --- FIN ZONE : imbrication dans #rightCol ---------------------------------------------------- */

/* -- MENUS -------------------------------------------------------------*/
		
/*--- du menu '#leftCol' ---*/
	.menuVertical {			
		text-indent: 25px;
		padding-top : 6px;
		padding-bottom : 5px;
		margin-left : 14px;
		background-image: url(images/menu_vert.gif);
		background-repeat : no-repeat;
		background-position : left;
	}
		
		/*--- du menu '.menu Vert' ---*/
		.menuPrincipal {
			font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
			font-size : 12px;
			font-weight : bold;
			color : #FFFFFF;
			letter-spacing : normal;
			text-decoration : none;
		}
		a.menuPrincipal:link { color: #FFFFFF; text-decoration : none; }
		a.menuPrincipal:visited { color: #FFFFFF; text-decoration : none; }
		a.menuPrincipal:hover { color: #FFFF66; text-decoration : none; }
		a.menuPrincipal:focus { color: #FFFF66; text-decoration : none; }
		a.menuPrincipal:active { color: #FF0000; text-decoration : none; }

			/*--- du menu '.menu Vert' ---*/
			.small {
				color: #CCCCCC;
				font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
				text-decoration : none;
				font-size : 10px;
			}
			a.small:link { color: #CCCCCC; text-decoration : none; }
			a.small:visited { color: #CCCCCC; text-decoration : none; }
			a.small:hover { color: #CCCC66; text-decoration : underline; }
			a.small:focus { color: #CCCC66; text-decoration : none; }
			a.small:active { color: #FF0000; text-decoration : none; }
		
/*--- du menu '#menuTop' ---*/		
	.menuHoriz {
		position: relative;
		top: 87px;
		left: 11px;
		display: inline;
		padding-left : 8px;
		padding-right : 8px;
	}
		
		/*--- du menu '.menuHoriz' ---*/
		.menuGal {
			font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
			font-size : 11px;
			font-weight : bold;
			color : #FFFFFF;
			letter-spacing : normal;
			text-decoration : none;
		}
		a.menuGal:link { color: #FFFFFF; text-decoration : none; }
		a.menuGal:visited { color: #FFFFFF; text-decoration : none; }
		a.menuGal:hover { color: #FFFF66; text-decoration : none; }
		a.menuGal:focus { color: #FFFF66; text-decoration : none; }
		a.menuGal:active { color: #FF0000; text-decoration : none; }
		

/* -- Standard -------------------------------------------------------------*/
		table, th, td {
			font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		}
		
		a { color:#AEAEC8; text-decoration: underline; }
		a:link { color: #AEAEC8; text-decoration: underline; }
		a:visited { color:#AEAEC8; text-decoration: underline; }
		a:hover { color:#3399FF; text-decoration: underline; } 
		a:focus { color:#0099FF; text-decoration: underline; }
		a:active  { color: #FF0000; text-decoration: underline; }
		
		h1 {
			font-family : monospace;
			font-size : 17px;
			color : #FFFFFF;
		}
		h1.maj {
			text-transform : capitalize;
		}
		h1.souligne {
			text-decoration : underline;
		}
		
		h2 {
			font-size : 14px;
			padding : 0px;
			color : #FFFFFF;
			border-bottom: 1px dotted #CCCCCC;
		}
		
		h3 {
			font-size : 12px;
			font-weight : bold;
			color : #FFFFFF;
		}
		
		li {
			padding-top: 4px;
			padding-bottom:4px;
			display: list-item;
		}
		
		hr {
			height: 1px;
			line-height : 1px;
		}
		
/* -- IMAGES -------------------------------------------------------------*/
		img {
			border:0px;
		}
		.imgToLeft {
			float: left;
			margin-right: 8px;
			margin-bottom: 4px;
		}
		.imgToRight {
			float: right;
			margin-left: 4px;
			margin-bottom: 4px;
		}
		.imgCenter {
		vertical-align: middle ;
		}
		
/* -- DIVERS -------------------------------------------------------------*/
		
		.spacerRight {
			clear: right;
		}
		.spacerLeft {
			clear: left;
		}

/* -- Formulaires et boutons -------------------------------------------------------------*/

		.champForm {
			padding-bottom: 5px;
		}
		
		.needField {
			font-size: 9px;
			color: #FFFF00;
		}
		
		.formfield {
			BORDER-RIGHT: #999999 1px solid;
			BORDER-TOP: #333333 1px solid;
			BORDER-LEFT: #333333 1px solid;
			BORDER-BOTTOM: #999999 1px solid;
			font-family: Verdana, Arial, Helvetica, sans-serif;
			FONT-SIZE: 12px;
			COLOR: #000000;
			BACKGROUND-COLOR: #FFFFFF;
			width: 250px;
		}
		
		.formbutton {
			BORDER-RIGHT: #999999 1px solid;
			BORDER-TOP: #999999 1px solid;
			BORDER-LEFT: #999999 1px solid;
			BORDER-BOTTOM: #999999 1px solid;
			font-family: Verdana, Arial, Helvetica, sans-serif;
			FONT-WEIGHT: bold;
			FONT-SIZE: 12px;
			COLOR: #FFFFFF;
			BACKGROUND-COLOR: #999999;
		}
		
		input.align {
			vertical-align: middle;
		}
		
		select {
			BORDER-RIGHT: #999999 1px solid;
			BORDER-TOP: #333333 1px solid;
			BORDER-LEFT: #333333 1px solid;
			BORDER-BOTTOM: #999999 1px solid;
			FONT-SIZE: 12px;
			COLOR: #000000;
			font-family: Verdana, Arial, Helvetica, sans-serif;
			BACKGROUND-COLOR: #FFFFFF ;
		}
		
		textarea {
			BORDER-RIGHT: #999999 1px solid;
			BORDER-TOP: #333333 1px solid;
			BORDER-LEFT: #333333 1px solid;
			BORDER-BOTTOM: #999999 1px solid;
			FONT-SIZE: 12px;
			COLOR: #000000;
			font-family: Verdana, Arial, Helvetica, sans-serif;
			BACKGROUND-COLOR: #FFFFFF ;
			width: 250px;
		}
/* -- Accessibilité sans feuille de style -------------------------------------------------------------*/
		.noDisplay {
			display: none;
		}