body , html
{
        /*  Les margin, les scrolls, et la hauteur sont les seuls propriétés a redefinir dans le body   */
        
        font: 8pt/16pt arial; 
        color: #555753; 
        margin : 0px 0px 0px 0px;
        height:100%;
        background-color:#000;
        scrollbar-base-color: #000;
}

/*
td
{
        font: 8pt/12pt arial; 
        font-weight: normal;
        font-style: normal;
        color: #000000;

}
  */

#container
{        
        width:100%;
        height:100%;
        text-align:center;
        background-color:#000000;
        
}

#table_charte
{
        /*  Définir ici ce que vous mettiez auparavant dans la balise table */
        /*  Dans la page HTML, quand vous voulez vous servir de ce style pour votre tableau faites comme ceci : */
        /*  <table id="table_charte">   */
        height:100%;
        min-height:100%;

        
        /*  pour un site centré utilisez les propriétés suivantes*/
        width:950px;
        background-attachment:scroll;
        background-image:url(images/charte/fond-page.gif);
        background-repeat:repeat-y;
        margin-left:auto;
        margin-right:auto;
           
        
        /*  pour un site en 100%, utilisez les propriétés suivantes  
        width:100%;
        background-color:#B0D262;  */
}

#td_charte        
{
       /* height:100%; */
        width:100%;
        text-align:left;
        background-attachment:scroll;
        background-image:url(images/charte/fond.jpg);
        background-repeat:no-repeat;
        background-position:top left;
        
        padding-left:0px;
        padding-right:0px;

}

#menu
{
        float:left;
        width:302px;
        height:100%;

}

#bandeau{
        float:left;
        width:648px;
        height:101px;



}
#contenu{
        float:left;
        width:518px;
       /* height:101px; */
       height:auto;
        padding-top:10px;
        padding-left:20px;
        padding-right:20px;
       /* border:1px #fff solid; */

}

h1
        {
        font-family:Verdana, Arial, Helvetica, sans-serif;
        font-size:16px;
        font-weight:bold;
        font-style:normal;
        color:#BB0C0D;
        background:transparent url('images/charte/titre-page.gif') no-repeat 0 0;
        padding-left:30px;
        padding-bottom:10px;
        }
h2
        {
        font-family:Verdana, Arial, Helvetica, sans-serif;
        font-size:13px;
        font-weight:bold;
        color:#555753;
        border-left:4px #bb0c0d solid;
        padding-left:6px;
        border-bottom:1px #bb0c0d solid;
        }
#contenu p,
#contenu p.text01,
#contenu .text01
        {
        font-family:Verdana, Arial, Helvetica, sans-serif;
        font-size:12px;
        font-weight:500;
        color:#555753;
        text-align:justify;
        margin:0 0 10px 0;
        padding:0;
        }
#contenu p b
        {
        color:#bb0c0d;
        }
#contenu .text01
        {
         text-align:left;
        }
#contenu p.text01
        {
        margin:0 0 10px 0;
        }
#contenu p a
        {
        color:#bb0c0d;
        text-decoration:none;
        font-weight:bold;
        }
#contenu p a:hover
        {
        color:#555753;
        text-decoration:none;
        font-weight:bold;
        }
#contenu p.text02
        {
        font-family:Verdana, Arial, Helvetica, sans-serif;
        font-size:12px;
        font-weight:500;
        color:#bb0c0d;
        text-align:left;
        margin:0 0 0 0;
        padding:0;
        }
/*
a:link {
        font-weight: bold; 
        text-decoration: none; 
        color: #003EFA;
        }
a:visited { 
        font-weight: bold; 
        text-decoration: none; 
        color: #003EFA;
        }
a:hover, a:active { 
        text-decoration: underline; 
        color: #003EFA;
        }

*/
/************* form *********************/
.forminput, .forminput1, .forminput2, .formtextareadress, .formtextareacomment
        {
        border:1px #bb0c0d solid;
        padding:0;
        margin:2px;
        font-family:Verdana, Arial, Helvetica, sans-serif;
        font-size:13px;
        font-weight:500;
        color:#555753;
        background-color:#F6EFDF;
        text-align:justify;
        }
		
.forminput
       {
       padding:0 3px 0 3px;
        height:20px;
        line-height:20px;
        width:260px;
       }

.forminput1
       {
       padding:0 3px 0 3px;
        height:20px;
        line-height:20px;
        width:160px;
       }
.forminput2
       {
       padding:0 3px 0 3px;
        height:20px;
        line-height:20px;
        width:160px;
       }

	   
.formtextareadress
        {
        padding:0 3px 0 3px;
        height:110px;
        width:260px;
        }
.formtextareacomment
        {
        padding:0 3px 0 3px;
        height:110px;
        width:260px;
        }
.formbt
        {
       border:1px #bb0c0d solid;
        height:25px;
        width:100px;
        text-align:center;
        padding:0;
        /*margin:2px; */
        font-family: Arial, Helvetica, sans-serif;
        font-size:12px;
        line-height:18px;
        font-weight:600;
        letter-spacing:0.1em;
        color:#bb0c0d;
        background-color:#F6EFDF;
        }



/****************** footer ***********/
#basdepage
{
      width:100%;
        height:75px;
        text-align:center;
        background-color:#D3090A;
}
/*****************************  ********** DEBUT INTEGRATTION **************  ****************************/
/******/
/******/
/******/

/************************PRESENTATION***********************************/

.ul1{
float:left;
list-style-image:url(images/charte/puce1.jpg);
width:190px;
}

.ul1 li {
margin-left:20px;
list-style-image:url(images/charte/puce1.jpg);
}


.ul11{
float:left;
list-style-image:url(images/charte/puce1.jpg);
width:400px;
}

.ul11 li {
margin-left:20px;
list-style-image:url(images/charte/puce1.jpg);
}


.ul2{
float:left;
margin-left:20px;
}

.ul2 li {
margin-left:40px;
list-style-image:url(images/charte/puce2.jpg);
}

.photo_acc1{
float:left;
width:270px;
padding:3px;
text-align:center;
}

.photo_acc1 img{
padding:3px;
border:1px solid  #FF1A25;
}

.photo_acc{
float:left;
margin:10px 0px 10px 60px;
padding:3px;
text-align:center;
}


.photo_acc img{
padding:3px;
border:1px solid  #FF1A25;
}

/**************************************/

.bloc_detail_img2{
	float:left;
	width:520px;
	margin:5px 10px 5px 5px;
	padding:0px;
}


.bloc_detail_img2 img{
	border:1px solid  #F6EFDF;
	}
	
.vignette_group2{
	margin-right:5px;
	float:left;
	width:110px;
}


	
.vignette_num{
	margin-right:5px;
	float:left;
	width:50px;
	display:block;
}


.vignette{
	float:left;
	width:50px;
	height:50px;
	margin:0px 0px 9px 0px;

}

.bloc_detail_img1{
	float:left;
	width:400px;
	height:416px;	
	}
	
.bloc_detail_imgNum{
	float:left;
	width:50px;
	padding-top:158px;
	border:0;
	}
.bloc_detail_imgNum img{
	border:0;
	}
	

/*-------------------------- Galerie  ---------------------------*/

#galerie {
	margin-top:50px;
	width:520px;
	height:115px;
	float:left;
	height:96px;
	padding-bottom:20px;
}

#defilgauche {
  float: left;
  margin: 0 5px 5px 0;
  cursor: pointer;
  z-index: 9;
  }
#defildroite {
  float: right;
  margin: 0 0 5px 5px;
  cursor: pointer;
  z-index: 10;
  }

#flowcut {
  width: 423px;
  overflow: hidden;
  position: relative;
  }
  
#flow{
  position: relative;
  }
.vign{
  float: left;
  margin-right :10px;
  width: 142px;

  }
  
  /************AUTRE **********************/
  
.ul_autre li{
	margin-left:20px;
	list-style: url(images/charte/puce1.jpg);
	font-size:12px;
	margin-top:50px;
}

.ul_autre2 li{
	margin-left:20px;
	list-style: url(images/charte/puce1.jpg);
	font-size:12px;
	margin-top:10px;
}

.qualite_img1 {
float:left;
text-align:center;
padding:3px;
margin-bottom:10px;
}

.qualite_img {
float:left;
text-align:center;
padding:3px;
border:1px solid red;
margin-bottom:10px;
}

.qualite_img  img{
width:500px;
}

.ref_img {
text-align:center;
float:left;
width:210px;
margin-left:30px;
}

.press_img {
text-align:center;
float:left;
margin-left:30px;
}

.photo_contact1{
float:right;
padding:3px;
text-align:center;
}
.photo_contact1 img{
padding:3px;
border:1px solid  #FF1A25;
}


/****offre emploui recrutement*****/

.unOffre{
float:left;
width:500px;
margin-bottom:20px;
}

#contenu .unOffre a:hover {
color:#CC3300;}

.unOffre  a:visited, .unOffre  a:link{
color:#666666;
}

.unOffre p{
line-height:15px;}



#pagination {
	float:left;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	margin:20px 0 30px 130px;
	text-align:center;
	color: #CC3300  ;
	vertical-align:middle;
}

.flesh_left{ 
	float:left;
	width:20px;
	
}

.flesh_right{
	float:left;
	width:20px;
}

.pages {
	float:left;
	text-align:center;
	width:200px;
	}
	
#pagination a:visited, #pagination a:link{
	margin:0 5px 0 5px;
	color: #CC3300  ;
	text-decoration:underline;
}

#pagination a:hover {
	margin:0 5px 0 5px;

	color: #666666;
	text-decoration:none;
}

.catalogue_ref {
	color:#E0E0E0;
	font: 11px ;
}