@charset "utf-8";
/* CSS Document */

body{margin:0; background-color: #e5decf;}
#header{ width: 100%; height: 80px; background-color: #000; border-top: 3px solid #dd8718;}
#container1{width: 900px; height: 120px; margin-left: auto; margin-right: auto;}
.logotop{ position: absolute; margin-top: 3px; }
#joindre{ position: relative; float: right; width: auto; height: 18px; background-color: #000; padding-left: 15px; padding-right: 15px; padding-top: 9px;
	-moz-border-radius: 0 0 4px 4px; 
    -webkit-border-radius: 0 0 4px 4px; 
    -khtml-border-radius: 0 0 4px 4px; 
    border-radius: 0 0 4px 4px; cursor: pointer;   }
.iconegroupe{ margin: 2px;}

#header2{ width: 100%; height: 17px; background-color: #000; border-bottom: 4px solid #CCC;}
#container2{width: 900px; height: 22px; margin-left: auto; margin-right: auto;}

#container3{width: 900px; height: auto; margin-left: auto; margin-right: auto; margin-top: 8px;}

#header3{width: 100%; height: 350px; background-image: url(image/fond.png); border-bottom: 1px solid #CCC;}
.imagedefile{position: relative; border: 1px solid #CCC;}

#tableau{ position: relative; width: 900px; margin-top: 15px;}
.cadre1{ width: 175px; height: 165px; margin-right: 6px; background-color: #FFF; border: 1px solid #CCC; padding: 20px;}
.cadre2{ width: 174px; height: 165px; margin-left: 6px; margin-right: 6px; background-color: #FFF; border: 1px solid #CCC; padding: 20px;}
.cadre3{ width: 175px; height: 165px; margin-left: 6px; margin-right: 6px; background-color: #FFF; border: 1px solid #CCC; padding: 20px;}
.cadre4{ width: 174px; height: 165px; margin-left: 6px; margin-right: 6px; background-color: #FFF; border: 1px solid #CCC; padding: 20px;}


.cadre1_2{ width: 175px; height: 165px; margin-right: 6px; background-color: #ECECEC; border: 1px solid #CCC; padding: 20px; cursor: pointer;}
.cadre2_2{ width: 174px; height: 165px; margin-left: 6px; margin-right: 6px; background-color: #ECECEC; border: 1px solid #CCC; padding: 20px; cursor: pointer;}
.cadre3_2{ width: 175px; height: 165px; margin-left: 6px; margin-right: 6px; background-color: #ECECEC; border: 1px solid #CCC; padding: 20px; cursor: pointer;}
.cadre4_2{ width: 174px; height: 165px; margin-left: 6px; margin-right: 6px; background-color: #ECECEC; border: 1px solid #CCC; padding: 20px; cursor: pointer;}

.fleche{ position: absolute; bottom: 0; right: 0;}

#presentation{ width: 840px; height: auto; margin-left: auto; margin-right: auto; margin-top: 15px; background-color: #FFF; border: 1px solid #CCC; padding: 30px;}

#contact{ width: 840px; height: 500px;; margin-left: auto; margin-right: auto; margin-top: 15px; background-color: #FFF; border: 1px solid #CCC; padding: 30px;}

#cadrecontact{ width: 200px; border: 1px solid #CCC; padding: 15px;}
#contact1{ width: 240px; position: absolute; height: auto; padding: 10px;}
#contact2{ width: 480px; position: relative; margin-left: 300px; height: auto; padding: 10px;}

.cadreref{ width: 800px; height: 150px; border: 1px solid #CCC; padding: 15px; margin-left: auto; margin-right: auto;}
.photoref{ width: 180px; height: auto; position: absolute;}
.descriptionref{ width: 600px; position: relative; margin-left: 180px;}


.titre1{ font-family: Arial, Helvetica, sans-serif; color: #333; font-size: 17px; font-weight: 100;}
hr {
clear: both;
width: 100%;
border: 0; /* enleve toute bordure */
border-bottom: 1px #C7C7C7 solid; /* une seule bordure (sinon firefox met une bordure en haut ET en bas mais pas IE */
height: 1px; /* pour IE */
}
.texte1{ font-family: Arial, Helvetica, sans-serif; color: #333; font-size: 12px; font-weight: 500;}
.texte2{ font-family: Arial, Helvetica, sans-serif; color: #333; font-size: 12px; font-weight: 500;}
.texte3{ font-family: Arial, Helvetica, sans-serif; color: #F30; font-size: 12px; font-weight: 500;}
.texte4{ font-family: Arial, Helvetica, sans-serif; color: #FFF; font-size: 12px; font-weight: 500;}
.texte5{ font-family: Arial, Helvetica, sans-serif; color: #CCC; font-size: 12px; font-weight: 500;}
.texte6{ font-family: Arial, Helvetica, sans-serif; color: #FFF; font-size: 11px; font-weight: 500;}
.texte7{ font-family: Arial, Helvetica, sans-serif; color: #000; font-size: 12px; font-weight: 500;}
.texte8{ font-family: Arial, Helvetica, sans-serif; color: #333; font-size: 11px; font-weight: 500;}
.texte9{ font-family: Arial, Helvetica, sans-serif; color: #333; font-size: 12px; font-weight: 500;}

a.link1{font-family: Arial, Helvetica, sans-serif; color: #dd8718; font-size: 11px; font-weight: 500; text-decoration: none;}
a.link1:hover{font-family: Arial, Helvetica, sans-serif; color: #FFF; font-size: 11px; font-weight: 500; text-decoration: underline;}

#header4{width: 100%; height: 140px; background-color: #1B1B1B; border-bottom: 1px solid #CCC; margin-top: 15px;}
#container4{width: 900px; height: auto; margin-left: auto; margin-right: auto; padding-top: 10px;}
#container41{ position: absolute; width: 500px; height: auto; padding-top: 10px;}
#container42{display: block; width: 370px; margin-left: 520px; height: auto; padding-top: 10px; text-align: right;}

.form1{ position: absolute; width: 80px; height: auto; padding: 4px; text-align: right;}
.form2{display: block; width: 250px; margin-left: 100px; height: auto; padding: 4px;}

.inputform{ width: 300px; height: 20px; border: 1px solid #CCC; }
.textform{ width: 300px; border: 1px solid #CCC; }
.boutonform{ width: auto; padding: 5px 20px; background-color: #e5decf; border: 1px solid #CCC;}

/*SLIDE JQUERY--------------------------------*/

#s3slider {
   width: 900px; /* important to be same as image width */
   height: 300px; /* important to be same as image height */
   position: relative; /* important */
   overflow: hidden; /* important */
}

#s3sliderContent {
   width: 900px; /* important to be same as image width or wider */
   position: absolute; /* important */
   top: 0; /* important */
   margin-left: 0; /* important */
}

.s3sliderImage {
   float: left; /* important */
   position: relative; /* important */
   display: none; /* important */
}

.s3sliderImage span {
   position: absolute; /* important */
   left: 0;
   font: Arial, Helvetica, sans-serif;
   font-size: 12px;
   padding: 10px 13px;
   width: 900px;
   background-color: #FFF;
   filter: alpha(opacity=70); /* here you can set the opacity of box with text */
   -moz-opacity: 0.7; /* here you can set the opacity of box with text */
   -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
   opacity: 0.7; /* here you can set the opacity of box with text */
   color: #272727;
   display: none; /* important */
   top: 0;

   /*
       if you put
       top: 0; -> the box with text will be shown at the top of the image
       if you put
       bottom: 0; -> the box with text will be shown at the bottom of the image
   */
}

.clear {
   clear: both;
} 

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