body {
	margin:0; padding: 0;
	font: normal 12pt Geneva, Arial, Helvetica, sans-serif;
	color: #000;
	background: url(../_images/png/fond.png) ;
}

#site {
	position:absolute;
	top: 30px;left:50%;
	width: 978px;
	height: 511px;
	margin-left:-489px;
	background: url(../_images/jpg/accueil_arabesques.jpg) no-repeat 0 45px;
}

#fond_gauche, #fond_droite {/* les deux oreilles... */
	position: absolute;
	top: 18px; /* idem div site */
	height: 595px;
	width: 10px; /* largeur ajustable par javascript ! */
}

#fond_gauche {
	right:50%; 
	margin-right: 100px;
	margin-right: 489px; /* moitié de la largeur du site */
	background:  url("../_images/png/oreille.png") no-repeat right; 
}
#fond_droite {
	left:50%;
	margin-left: 100px;
	margin-left: 489px; /* moitié de la largeur du site */
	background:  url("../_images/png/oreille.png") no-repeat left; 
}


a {
	text-decoration:none;
}

a:hover {
	color: #CCDB0E;
	text-decoration:none;
}


img {border: none;}

/************************/

#bandeau_haut {
	font: bold 120pt/0.8em Arial, sans-serif;
	margin: 4px 0 0 10px;
	height: 40px;
	width: 660px;
	float:right;
}

#logo {
	position: absolute;
	top: -68px;
	left: 0px;
}

        
#flashcontent {
	height: 40px;
	width: 500px;
	font: 12px 'Trebuchet MS', arial, sans-serif;
	font-weight: bold;
	color: #3333CC;
	text-align:center;
	line-height: 200px;
	
}

#flash{
	display: block;
}

#menu {
	position:absolute;
	background:url("../_images/png/menu.png") no-repeat left; 
	width: 630px;
	height: 44px;
	right: 0;
	top: 1px;
	border: 1px solid red;
}

/*#menu ul {
	padding:0;
	margin:0 0 0 10px;
	position:absolute;
	border: 1px solid red;
	float:left;
}
#menu ul li {
	font: 13pt 'Trebuchet MS', arial, sans-serif;
	margin: 10px 5px 0 5px;
	color: red;
	list-style-type:none;
	float:left;
	border: 1px solid blue;
	width: 70px;
}
#menu ul li a {
	color: #CCCCCC;
}
#menu ul li a:hover {
	color: #CFD624;
}
#menu ul li.petit {
	margin: 10px 10px 0 0;
}
#menu ul li.petit a {
	color: #CCCCCC;
	font: 09pt 'Trebuchet MS', arial, sans-serif;
}
#menu ul li.petit a:hover {
	color: #CFD624;
}
*/

.kwicks {
     list-style-type: none;
     list-style-position:outside;
     position: absolute;
     margin: 0;
     padding: 0;
 }
.kwicks li{
    display: block;
    overflow: hidden;
    padding: 0;
    cursor: pointer;
    float: left;
	width: 42px;
    height: 42px;
    margin-right: 0px;
    background-image:url("../_images/jpg/menu_coulissant.jpg");
    background-repeat:no-repeat;
}
.kwicks li#kwick1{
	width: 79px;
}
.kwicks li#kwick2{
	width: 65px;
}
.kwicks li#kwick3{
	width: 111px;
}
.kwicks li#kwick4{
	width: 89px;
}
.kwicks li#kwick5{
	width: 63px;
}
.kwicks li#kwick6{
	width: 80px;
}
.kwicks a{
	display:block;
	height:42px;
	text-indent:-9999px;
	outline:none;
}

#kwick1 {
	background-position:0px 0px;
}
#kwick2 {
	background-position: -79px 0px;
}
#kwick3 {
	background-position: -297px 0;
}
#kwick4 {
	background-position:-408px 0px;
}
#kwick5 {
	background-position:-497px 0px;
}
#kwick6 {
	background-position:-560px 0px;
}

#kwick1.active, #kwick1:hover {
	background-position: 0 bottom;
}
#kwick2.active, #kwick2:hover{
	background-position: -79px bottom;
}
#kwick3.active, #kwick3:hover {
	background-position: -297px bottom;
}
#kwick4.active, #kwick4:hover {
	background-position: -408px bottom;
}
#kwick5.active, #kwick5:hover {
	background-position: -497px bottom;
}
#kwick6.active, #kwick6:hover {
	background-position: -560px bottom;
}

/***********************************************/

#contenu {
}


#texte {
	float: left;
	margin: 80px 0 0 30px;
	width: 440px;
	font: normal 0.7em Geneva, Arial, Helvetica, sans-serif;
	color:#FFFFFF;
}

#texte h1 {
	margin: 10px 0 5px 0;
	color: #FFFFFF;
	text-align: left;
	font: normal 1.1em Geneva, Arial, Helvetica, sans-serif;
}

#texte h2 {
	margin: 0 0 20px 0;
	color:#FFF;
	font: normal 1.4em/1.2em  Geneva, Arial, Helvetica, sans-serif;
	text-align: left;
}

#texte h3 {
	margin: 40px 0 40px 0;
	color:#CCDB0E;
	font: normal 1.8em/1.2em Geneva, Arial, Helvetica, sans-serif;
	text-align: left;
}

#texte h4 {
	margin: 30px 10px 0 0;
	color:#CCDB0E;
	font: normal 1.8em/1.2em Geneva, Arial, Helvetica, sans-serif;
	text-align: right;
	font-variant:small-caps;
}
#texte h4 a {
	color:#CCDB0E;
}

#anim {
	float: left;
	border: none;
	margin: 14px 0 0 70px;
}

#book {
	float: left;
	margin: 45px 0 0 10px;
	width: 836px;
	font: normal 0.7em Geneva, Arial, Helvetica, sans-serif;
	color: #999999;
	border: 5px solid #999999;
}

#titre_rub {
	float: left;
	margin: 100px 0 0 35px;
	width: 67px;
	height: auto;
}

#cadre {
	float: left;
	border: none;
	margin: 30px 0 0 10px;
	background:  url("../_images/png/cadre.png") no-repeat right; 
	width: 461px;
	height: 395px;
}

#images_defilent {
	float: left;
    width: 292px;
    height: 248px;
	margin: 80px 0 0 108px;
  }

/***************************************

fieldset {background: black; color: white; border: none; margin:0; float: left; padding:0;}
fieldset legend { display: none;color: #FF0033; margin: 35px 5px 5px 10px; background: none;}
fieldset textarea { width: 545px; margin-top: 10px}
fieldset ul { margin: 0; padding: 10px;}
fieldset li { list-style-type:none; margin: 5px 0}
fieldset li.saisie_email_message_auteur input { margin: 5px 0 0 46px}
.erreur_message {font-size: 0.7em; color:#FF0033; position:absolute;right: 25px}
.boutons input { background: black; border: none; color: #FFFFFF; margin: 5px 0}


fieldset.previsu{ width: 567px; margin-top: 10px}
fieldset.previsu .boutons input { color: #FF0033; margin: 5px 0; font-size: 0.9em}

.reponse_formulaire { color: #FF0033; margin: 5px 0; font-size: 1.5em}


/*********************/

.main_image {
    width: 595px;
    height: 375px;
    float: left;
    background: #333;
    position: relative;
    overflow: hidden; /*--Overflow hidden allows the description to toggle/tuck away as it slides down--*/
    color: #FFFFFF;

}
.main_image h1 {
    margin: 0;
    padding: 5px 0 0 10px;
	font: normal 1.3em Geneva, Arial, Helvetica, sans-serif;
	color:#CCCCCC;
	font-variant:small-caps;
}
.main_image p, .image_thumb p {
    padding: 0 5px;
    margin: 0 0 5px 0;
	font: normal 1em Geneva, Arial, Helvetica, sans-serif;
	color:#CCCCCC;
}
.main_image .block h2 {
    padding: 0 5px;
    margin: 3px 0 5px 5px;
	font: normal 1em Geneva, Arial, Helvetica, sans-serif;
	color:#CCCCCC;
}
.main_image .block a{
    padding: 0 5px;
    margin: 0 0 5px 0;
	font: normal 1em Geneva, Arial, Helvetica, sans-serif;
	color: #D6D61A;
}

.block small { /*--We'll be using this same style on our thumbnail list--*/
    font-size: 1em;
    padding: 0 0 0 20px;
    background: url(icon_calendar.gif) no-repeat 0 center;
}
.main_image .block small {margin-left: 10px;}
.main_image .desc{
    position: absolute;
    bottom: 0;
    left: 0; /*--Stick the desc class to the bottom of our main image container--*/
    width: 100%;
    display: none; /*--Hide description by default, if js is enabled, we will show this--*/
}
.main_image .block{
    width: 100%;
    background: #111;
    border: 1px solid #666666;
	padding:0;

}
.main_image a.collapse { /*--This is our hide/show tab--*/
    background: url("../_images/gif/btn_collapse.gif") no-repeat left top;
    height: 27px;
    width: 67px;
    text-indent: -99999px;
    position: absolute;
    top: -27px;
    right: 0px;
	border: 1px solid #CCCCCC;    

}
.main_image a.show {background-position: left bottom;}


/****** slideshow ******/

.image_thumb {
    float: left;
    width: 221px;
	height: 363px;
    background: #999999;
    border: 0;
    padding: 12px 0 0 20px;
}
.image_thumb img {
    border: 1px solid #ccc;
    padding: 1px;
	margin: 0;
    background: #CCCCCC;
    float: left;
}
.image_thumb ul {
    float: left;
    margin: 0;
    padding: 0;
    list-style: none;
}
.image_thumb ul li{
    margin: 3px;
    padding: 3px;
    background: #999999 url(nav_a.gif) repeat-x;
    /*width: 279px;*/
    float: left;
	color: #000099;
    border: 0;

}
.image_thumb ul li.hover { /*--Hover State--*/
    background: #CCCCCC;
    cursor: pointer;
}
.image_thumb ul li.active { /*--Active State--*/
    background: #CCCCCC;
    cursor: default;
}
html .image_thumb ul li h1
.image_thumb ul li .block {
    float: left;
    margin-left: 10px;
    padding: 0;
    width: 170px;
}
.image_thumb ul li p{display: none;}/*--Hide the description on the list items--*/

.image_thumb h1, .image_thumb h2 {
	display:none;
}


/*******************************************/


#colonne1, #colonne2 {
	float: left;
	width: 300px;
	height: 410px;
	margin: 40px 0 0 0;
	padding: 0 10px 0 10px;
	color:#fff;
	font: normal 0.7em/1.4em Geneva, Arial, Helvetica, sans-serif;
}
#colonne1 h2, #colonne2 h2 {
	font: bold 1.3em/1.2em Geneva, Arial, Helvetica, sans-serif;
	margin:0;
	padding:0;
	color:#CCDB0E;
}
#colonne1 h3, #colonne2 h3 {
	font: bold 1.1em/1em Geneva, Arial, Helvetica, sans-serif;
	margin: 5px 0 0 0;
	padding:0;
	color:#B3B3B3;
}
#colonne1 ul, #colonne2 ul {
	margin: 10px 0 10px 15px;
	padding:0;
}


#colonne1 {
	border-right: 2px solid #CCDB0E;
}
#colonne1 h1{
	margin:0 0 10px 0;
	padding:0;
	font: normal 1.2em/1.3em Geneva, Arial, Helvetica, sans-serif;
	color:#CCDB0E;

}

#colonne3 {
	float: right;
	width: 230px;
	height: 400px;
	margin: 40px 0 0 0;
}
#colonne3 img {
	margin: -10px 0 0 0;
}

#contenu {
	float: left;
	width: 800px;
	height: 410px;
	margin: 40px 0 0 0;
	padding: 0 10px 0 10px;
	color:#fff;
}

#contenu li {
	margin: 10px 0 0 0;
	font: normal 0.8em/1.4em Geneva, Arial, Helvetica, sans-serif;
}

#contenu p {
	margin: 5px 0 0 0;
	padding: 0;
	color: #CCCCCC;
}

#contenu li a {
	color:#fff;
	font: normal 1.1em/1.3em Geneva, Arial, Helvetica, sans-serif;
	margin: 10px 0 0 0;
}

#contenu li a:hover {
	color: #CCDB0E;
}

#contenu.clients {
	float: left;
	width: 750px;
	height: 390px;
	margin: 40px 0 0 40px;
	padding: 0 10px 0 45px;
	color:#fff;
	background: #FFFFFF;
}

.bloc_clients {
	float:left; 
	width:141px; 
	margin: 10px 0 5px 0;
}

.bloc_clients .logo {
	float:left;
}

.bloc_clients .logo img {
	width:130px;
	height: 79px;
	overflow:hidden;
}

.bloc_clients .texte_clients {
	float:left; font-size:0.8em; text-align:center; width:150px; color: #000000; font-variant:small-caps
}

#contenu.clients img.gauche {
	position:absolute; left:110px; 
	margin-top: -10px
}

#contenu.clients img.droit {
	position:absolute; right:10px; 
	margin-top: -10px
}
/******************* contact *****************/

fieldset legend  {
	margin: 15px 0;
	padding: 19px;
	height: 40px;
	display:none;
}
fieldset  {
	margin: 0;
	/*background: blue;*/
	float: left;
	border: none;
	padding: 0;
}

fieldset ul {width: 500px; float: left; margin: 0 0 0 10px;padding:0}


ul li.saisie_prenom, ul li.saisie_nom, ul li.saisie_sujet,ul li.saisie_texte, ul li.saisie_organisation, ul li.saisie_mail, ul li.saisie_adresse, ul li.saisie_telephone {
	display: inline;
	float: left;
	clear:none;
	margin: 0 15px 0 0;
	width: 500px; 
	/*border: 1px solid green;*/
}
ul li.saisie_prenom, ul li.saisie_nom, ul li.saisie_telephone, ul li.saisie_mail, ul li.saisie_sujet {
	display: inline;
	float: left;
	clear:none;
	margin: 0 15px 0 0;
	width: 240px; 
}

ul li.saisie_nom label, ul li.saisie_adresse label,ul li.saisie_telephone label, ul li.saisie_prenom label, ul li.saisie_organisation label, ul li.saisie_mail label, ul li.saisie_sujet label, ul li.saisie_texte label {
	font: normal 10pt Arial, Helvetica, sans-serif; 
	color: #FFF;
	/*width: 180px;*/
	float:left;
}

ul li strong {
	font: normal 9pt Arial, Helvetica, sans-serif; 
	color: #CCDB0E;
}

ul li.saisie_nom .text, ul li.saisie_adresse .text,ul li.saisie_telephone .text, ul li.saisie_prenom .text, ul li.saisie_organisation .text, ul li.saisie_mail .text, ul li.saisie_sujet .text, ul li.saisie_texte .text {
	margin: 0 10px 0 0;
	width: 220px;
	float:left;

}
ul li.saisie_mail {
	padding: 0 0 10px 0;

}

ul li.saisie_texte { margin: 25px 0 5px 0; width: 500px; }

ul li textarea { margin:0 0 0 0; height: 80px;}
ul li textarea#texte { margin:0 0 0 0; width: 457px;color:#000000;font: normal 1em Arial, Helvetica, sans-serif; padding: 5px;
}

.erreur_message {
	margin: 2px 0 0 10px; 
	position: absolute;
	color: #beec04;
	font: normal 8pt Arial, Helvetica, sans-serif; 

}


ul li.saisie_texte.obligatoire.erreur .erreur_message {
	margin: 3px 0 0 0px;
	position: absolute;
	font: normal 8pt Arial, Helvetica, sans-serif; 

}

.display {display: none;}


/* Previsualisation du message */
.formulaire_spip fieldset.previsu {border: 1px solid #beec04; width: 500px;float: left;}
.formulaire_spip fieldset.previsu legend { padding: 0 0.50em; font-weight: bold; color: #beec04; }
.formulaire_spip fieldset.previsu li { list-style-type:none;}
.formulaire_spip fieldset.previsu li strong { color:#beec04}

/* Reponse du formulaire */
.reponse_formulaire { font-weight: bold; color: #076FA8; font: normal 1.4em/2em Arial, Helvetica, sans-serif; }
fieldset.reponse_formulaire { border-color: #076FA8; font-weight: normal; }
fieldset.reponse_formulaire.reponse_formulaire legend { color: #076FA8; } /* Preciser la couleur des legend et du fond pour IE/Win */


/*.submit {margin: 50px 0 0 0 }*/


/* Boutons */
.formulaire_spip .boutons { float:left; width: 299px; margin: 0; padding: 0; text-align: left; bottom: 50px; }
.formulaire_spip .boutons input { margin-left: 1em; }


#contact_mail img { width: 250px; float: right; margin: 15px -10px 0 0 }
#infos {  width: 250px; position: absolute; margin: 15px -10px 0 0; right: 30px; top: 300px }
#infos ul { margin:0; padding:0 }
