body {  
	text-align: center;
	background-color: white;
	margin: auto; 
	font-family:"Century Gothic"; 
	font-size: 14px; 
	color: #333333;   
	letter-spacing: 0px;     
} 
 
h4 {   
	font-family:"Century Gothic";   
	font-size:12px;   
	color:#999999;  
	letter-spacing: 0px;   
	margin-bottom:10px;
	text-transform:uppercase; 
	text-align:center;  
   
}   

/* ----------------------------------------------------------------------------------------------
#tabbed_box {   
	margin: 0px auto 0px auto;   
	width:300px;   
}
-------------------------------------------------------------------------------------------------- */
  
.tabbed_area {   
	background-color: white;
	width:890px; 
	text-align:center;
	margin: auto;      
}

/* ------------------------------------------------------------------------------------------------------------
*			
*			Content represente le contenu d'un onglet
* 			
*  ----------------------------------------------------------------------------------------------------------- */ 

.content {   
	background-color:#ffffff;   
	padding:10px;   
	text-align:center;
	height:580px;
	overflow:hidden;
} 
.content h4 {   
	font-family:"Century Gothic";   
	font-size:12px;   
	color:#999999;  
	letter-spacing: 0px;   
	margin-bottom:10px;
	text-transform:uppercase; 
	text-align:center;     
}   
/* ------------------------------------------------------------------------------------------------------------
*			slide0  --------> cadre pour une image
*			slide_0 --------> cadre la fenetre popup
* 			slide1  --------> 
*  ----------------------------------------------------------------------------------------------------------- */ 
 
.slide0 { 
	position:relative;  
	margin-left:auto;
	margin-right:auto;
	margin-top:20px;
	margin-bottom:20px;   
	height:550px;
	width :550px; 
	text-align: center;
}   
.slide_0 {
	display:none;  
	position:absolute;  
	background-color:#ffffff;   
	padding-top:20px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:10px;
	margin:auto;
	text-align: center;  
	border:1px solid #464c54; 
	height:450px;
	width :650px; 
	bottom:0px;
	z-index:1; 
}
.slide1 
{ 
	position:relative; 
	text-align :left; 
}   

/* ------------------------------------------------------------------------------------------------------------
*			conteneur de la taille des images ie: slide0, centré dans la page avec un overflow hidden
*			pour cacher les images qui dépasse et en position relative pour effectivement
* 			cacher les image sous IE
*  ----------------------------------------------------------------------------------------------------------- */ 
.conteneur 
{ 
	margin-left:0px; 
	margin-right:0px; 
	height: 470px; 
	width: 555px; 
	overflow:hidden; 
	position:relative;
	float:left; 
} 
/* --------------------------------------------------------------------------------------------------
*			slidebox en position relative pour que le slide fonctionne avec une taille très large pour 
*			que les images placées dedans restent alignées horizontalement
*  ----------------------------------------------------------------------------------------------------- */ 
.slidebox 
{ 
	position:relative; 
	height: 370px; 
	width:2900px;
	text-align :left;
}

a.menu{
	TEXT-DECORATION: none;
	font-family: "Century Gothic";   
	letter-spacing: 0px;
	margin: 10px;
	font-size: 9px;
	color: #333333;   
}
a.menu:visited {
	TEXT-DECORATION: none;
	font-family: "Century Gothic";   
	letter-spacing: 0px;
	margin: 10px;
	font-size: 9px;
	color: #333333;     
  
}
a.menu:active {
	TEXT-DECORATION: none;
	font-family: "Century Gothic";   
	letter-spacing: 0px;
	margin: 10px;
	font-size: 9px;
	color: #333333;     
  
}
a.menu:hover {
	TEXT-DECORATION: none;
	font-family: "Century Gothic";   
	letter-spacing: 0px;
	margin: 10px;
	font-size: 9px;
	color: #333333;     
   
}
 
/* ------------------------------------------------------------------------------------------------------------
*			
*			ul.tabs represente les menus des onglets
* 			
*  ----------------------------------------------------------------------------------------------------------- */ 

ul.tabs {   
	margin:0px; padding:0px;   
	margin-top:5px;   
	margin-bottom:6px;   
}
ul.tabs li {   
	list-style:none;   
	display:inline;   
}   
ul.tabs li a {   
	background-color: white;  
	color: #a39847;   
	padding:8px 14px 8px 14px;   
	text-decoration:none;   
	font-size:10px;   
	font-family:"Century Gothic";  
	font-weight:bold;   
	text-transform:uppercase;   
	/* border:1px solid #000000; */  
}
ul.tabs li a {   
	background-repeat:repeat-x;     
	background-position:bottom;   
}      
ul.tabs li a:hover {   
	background-color:#ffffff;   
	color:#282e32;   
	border:1px solid #000000;   
}   
ul.tabs li a.active {   
	background-color:#ffffff;   
	color:#282e32;   
	/* border:1px solid #000000; */  
}
ul.tabs li a.active {   
	background-repeat:repeat-x;   
	background-position:top;    
} 

ul.tabs li.actif 
{ 
	background-color:#ffffff;   
	color:#282e32;   
	border:1px solid #ffffff;   
} 
ul.tabs li.actif a 
{ 
	background-color:#ffffff;   
	color:#282e32;   
	/* border:1px solid #000000; */  
} 
ul.tabs li.actif a:hover 
{ 
	background-color:#ffffff;   
	color:#282e32;   
	/* border:1px solid #000000; */  
} 
ul.tabs li.actif a:active 
{ 
	background-color:#ffffff;   
	color:#282e32;   
	/* border:1px solid #000000; */  
}

/* ------------------------------------------------------------------------------------------------------------
*			
*			ul.creations represente les menus dans creation
* 			
*  ----------------------------------------------------------------------------------------------------------- */ 

ul.creations {   
	margin:0px; 
	padding:0px;   
}
ul.creations li {   
	list-style:none;   
	display:inline;
	margin-left: 60px;    
}   
ul.creations li a { 
	display:inline-block;  
	background-color:white; 
	color: #a39847;
	padding:8px 14px 8px 14px;   
	text-decoration:none; 
	width:60px;
	height:15px; 
	font-size:12px;   
	font-family:Arial, Helvetica, sans-serif;   
	font-weight:bold;   
	text-transform:uppercase;   
	/* border:1px solid #a39847; */ 
}
ul.creations li a {   
	background-repeat:repeat-x;     
	background-position:bottom;   
}      
ul.creations li a:hover {   
	background-color:#ffffff;   
	color:#282e32;   
	/*border:1px solid #a39847;    
	 border-bottom: 1px solid #ffffff;  */   
}   
ul.creations li a.active {   
	background-color:#ffffff;   
	color:#282e32;   
	/* border:1px solid #a39847;   
	border-bottom: 1px solid #ffffff;  */   
}
ul.creations li a.active {   
	background-repeat:repeat-x;   
	background-position:top;    
} 

ul.creations li.actif 
{ 
	background-color:#ffffff;   
	color:#282e32;   
	/* border-bottom: 1px solid #ffffff;  */   
} 
ul.creations li.actif a 
{ 
	background-color:#ffffff;   
	color:#282e32;   
	/* border:1px solid #a39847;   
	border-bottom: 1px solid #ffffff;  */   
} 
ul.creations li.actif a:hover 
{ 
	background-color:#ffffff;   
	color:#282e32;   
	/* border:1px solid #a39847;  
	border-bottom: 1px solid #ffffff;  */   
} 
ul.creations li.actif a:active 
{ 
	background-color:#ffffff;   
	color:#282e32;   
	/* border:1px solid #a39847;
	border-bottom: 1px solid #ffffff;  */   
}


/* --------------------------------------------------------------------------------------------------
*			Style pour les miniatures 	
*  ----------------------------------------------------------------------------------------------------- */ 
ul.miniatures 
{ 
	padding:0px; 
	margin-top:10px; 
	margin-bottom:10px; 
	margin-left:0px; 
	margin-right:0px; 
	width:auto; 
} 
ul.miniatures li 
{ 
	display:block; 
	width:80px; 
	background:#ffffcc;
	text-align:center; 
} 
ul.miniatures li a 
{ 
	width:80px; 
	display:inline-block;
	text-decoration:none;  
	text-align:center;
} 
ul.miniatures li a:hover 
{ 
	background: #ffcc66; 
}

/* -----------------------------------------------------------------------------------------------
*  		Style concernant le diapo
* ------------------------------------------------------------------------------------------------- */

#slideshow {
	POSITION: relative; 
	MARGIN: 0px auto; 
	WIDTH: 1000px;  
	no-repeat 0px 0px; 
	HEIGHT: 450px;
	background:#EEE;
}
#slideshow #slidesContainer {
	POSITION: relative; MARGIN: 20px auto; WIDTH: 840px; HEIGHT: 450px; OVERFLOW: hidden;
		background:#AAA;
}
#slideshow #slidesContainer .slide {
	MARGIN: 0px auto; WIDTH: 820px; HEIGHT: 450px
}
.control {
	POSITION: absolute; 
	TEXT-INDENT: -10000px;
	WIDTH: 39px; 
	DISPLAY: block; 
	HEIGHT: 450px; 
	CURSOR: pointer;
	margin-top:100px;
}
#navDiapo {
	POSITION: absolute; 
	WIDTH: 20px; 
	BOTTOM: 10px; 
	DISPLAY: block; 
	HEIGHT: 20px; 
	CURSOR: pointer; 
	RIGHT: 25px;
}
#leftControl {
	BACKGROUND: url(../images/control_left.jpg) no-repeat 0px 0px; TOP: 0px; LEFT: 0px
}
#rightControl {
	BACKGROUND: url(../images/control_right.jpg) no-repeat 0px 0px; TOP: 0px; RIGHT: 0px
}
.slide H2 {
	MARGIN: 15px
}
.slide P {
	MARGIN: 15px
}
.slide H2 {
	FONT: italic 24px Georgia, "Times New Roman", Times, serif; LETTER-SPACING: -1px; COLOR: #ccc
}
.slide IMG {
	MARGIN: 0px 15px; FLOAT: right
}
/* -------------------------------------------------------------------------------------------------
*   		Mise en forme de formulaire
*
*  ------------------------------------------------------------------------------------------------ */
form{  
	width:360px;  
	background-color:#fff;
	text-align: justify;
	/* border-radius:1em; Trop cool pour IE :) */  
	/* -moz-border-radius:1em; Trop cool pour IE :) */  
}  
form *{  
	font-family:"Century Gothic";  
	font-size: 12px;   
	color: #000000;   
	letter-spacing: 0px;  
}  
form fieldset{  
	border:none;  
}  
  
/* form legend{  
	font-size:1.em;  
	color:#777;  
	margin-top:0.3em;  
}  */
form label{  
	display:block;  
	float:left;  
	width:150px;  
	text-align:right;  
}  
form input, form select, form textarea{  
	width:320px;  
	margin-bottom: 0em;  
	margin-left:0em;  
}  
form button{  
    position:relative;  
    left:160px;  
} 

/* -------------------------------------------------------------------------------------------------
*   		Mise en forme ...
*
*  ------------------------------------------------------------------------------------------------ */
#portrait{
	margin-left:50px;
	margin-right:50px;
	margin-top:10px;
	margin-bottom:10px;
	/* border:1px solid #0000ff; */
}
#portrait-texte{
	margin-left:0px;
	margin-right:0px;
	margin-top:0px;
	margin-bottom:0px;
	position:relative;
	float:left; 
	width:520px;
	text-align:justify;
	font-family: verdana; /* "Century  Gothic"; */
	font-size:13px;   
	color: #333;   
	letter-spacing: 0px;
}
#portrait-image{
	margin:auto;
	/* margin-left:10px;
	margin-right:0px;
	margin-top:0px;
	margin-bottom:0px; */
	position:relative;
	float:right; 
	width:230px;
}

.dd{
	float: left;
	position: relative;
	margin: 10px;
	height:500px; 
	background:#ffffcc;
	text-align:center;
}
.dd a { 
	text-decoration:none;
	}
.ddtest{
	float: left;
	position: relative;
	width: 580px;
	margin-top : 50px;
	text-align: center;
}

.ddtest a { 
	text-decoration:none;
	}
