@import url(typo.css);
@import url(skin.css);
@import url(menu1.css);
@import url(menu2.css);
@import "flexcrollstyles.css";


/*===| I. LAYOUT SIZE |====================================================*/

#container, #footer{width: 1002px;}
#header {
	width:561px;
	height:319px;
}
#left-column {width: 435px;}
#right-column {
	width: 561px;
}

/*	--- Important! ----------------------------------------
	#wrap-footer, #footer and .push must be the same height
	-------------------------------------------------------
*/	#wrap-footer, #footer, .push {height: 72px;}

.push	{clear: both;}

/* --- Important! -------------------------------
	The bottom margin of #wrap-container
	is the negative value of the footer's height
	-----------------------------------------------
*/	#wrap-container {	margin: 0 auto -72px;}


/* ===| II. LAYOUT's DEFAULT ELEMENTS |=======================================*/

* {margin: 0;}

html {height: 100%; width: 100%;}
body {width: 100%; text-align: center;}

p{	padding: 0px 0px 10px 0px;}

#wrap-container {
	min-height: 100%;
	height: auto !important;
	height: 100%;}
#container {
	margin:0 auto;
	text-align: left;}
#header {
/*	text-indent: -9999em;*/}
#left-column{
	float:left;
	margin: 0px;}
#right-column{
	float:left;	
	margin:0px 0 0 0px;
	padding:0px 0px 0px 0px;
}

#contenu{
	float:right;
	width:501px;
	height:520px;
	padding-left:25px;
	padding-right:25px;
}
/*.ref {
	position: absolute;
	top: -10000px;
	}
*/
.ref {
	width: 998px;
	margin: 0 auto;
	text-align:center;
	color: #979797;
	font-family:Arial;
	font-size:11px;
}

#diapo{
	width:435px;
	height:465px;
}	
#actualite{
	width:387px;
  padding-left:24px;
  padding-right: 24px;
	height:199px;
} 

#contact-info {
	width: 435px;
	height:175px;
}
	#contact-info p{
		padding-left:25px;
		color:#969696;
		line-height:16px;
		font-size:12px;
		padding-top:85px;
	}
	#contact-info span{
		padding-left:25px;
	}
#info-text{
	float:left; 
	width:290px;
}
#plan-img{
	float:left; 
	padding-top:87px;
}

#footer {
	margin: 0 auto;
	padding: 0;}

#copyright{
	padding: 0px 0px 0px 60px;
	text-align: center;
}

/*	--- Important! -----------------------------------
	If you want space between paragraphs or headers, 
	use padding instead of margin.
	-------------------------------------------------*/

/* ===| III. CONTENT ELEMENTS |===============================================*/

img {border: 0;}

/*	--- Important! ----------------------------------
	Use class "left" or "right" on the html elements 
	you want to float (on the thumbs, for example)
*/	.left{float: left;} .right{float: right;}

.thumb, .thumb1{
	display: block;
	margin:0px 0px;}

.thumb img{
	padding: 0px;
	margin: 0}
.thumb1 img{
	padding:0px 10px 0px 0px;
}
.paragraph{
	clear: both;
	display: table;}

.separator{
	width: 100%;
	height: 0px;
	clear: both;
	padding:0;
	margin:15px 0;
	border-top: 1px solid;
	border-bottom: 1px solid;
	line-height: 0px;
}

.line-left{
	padding-top:5px;
	padding-bottom:4px;
}

#title{
	padding-top:1px;
	padding-bottom:12px;
}

ul.list{
	 padding:5px 0px 15px 20px;
	 list-style:none;
	 float:left;
	 width:175px;
	}
		ul.list li{
			color:#979797;
			font-family:Arial;
			font-size:12px;
			font-weight:normal;
			text-align:justify;
			margin-top:0px;
			background: url(../images/charte/icon-list.jpg) no-repeat left 7px;
			padding-left:15px;
			line-height:16px;
			}
ul.list1{
	 padding:5px 0px 15px 20px;
	 list-style:none;
	 float:left;
	 width:150px;
	}
		ul.list1 li{
			color:#979797;
			font-family:Arial;
			font-size:12px;
			font-weight:normal;
			text-align:justify;
			margin-top:0px;
			background: url(../images/charte/icon-list.jpg) no-repeat left 7px;
			padding-left:15px;
			line-height:16px;
			}
ul.list2{
	 padding:5px 0px 15px 20px;
	 list-style:none;
	 float:left;
	}
		ul.list2 li{
			color:#ffffff;
			font-family:Arial;
			font-size:12px;
			font-weight:normal;
			text-align:justify;
			margin-top:0px;
			background: url(../images/charte/icon-list.jpg) no-repeat left 12px;
			padding-left:15px;
			line-height:30px;
			}

.image-page{
	padding-left:7px;
}

.line{
	padding-top:10px;
	padding-bottom:10px;
}

.bg-text{
	width:356px;
	height:71px;
	float:left;
	text-align:center;
	padding-top:15px
}

/*==================== category =======================*/
#category{
    width:400px;
    float:left;
    padding:0px 20px 0px 80px;
}
#txtCategory_id{
  background-color: #4b4b4b;
  color:#ffffff;
  width:100px;
}
#categ-label{
  font-weight: bold;
  color:#c7c7c7;
  font-size:12px;
  font-family:Arial;
  float: left;
  padding:3px 10px 10px 10px;
}

#categ-label p{padding-left:5px;}

.submit{
   background:url(../images/charte/recherche.jpg) no-repeat 0px 4px;
   width: 92px;
   height: 27px;
   cursor: pointer;
   border: none;

}

.submitover{
   background:url(../images/charte/recherche-over.jpg) no-repeat 0px 4px ;
   width: 92px;
   height: 27px;
   cursor: pointer;
   border: none;
}
.text{
    font-family:Arial;
	font-size: 12px;
    text-align: left;
    color:#c6c6c6;
}
.text-non{
	text-align:center; 
	width:100%; 
	padding-top:50px; 
	clear:both;
}
#pages{
  width:500px;
  float:left;
}

.product{
  width:145px;
  float:left;
  margin:0px 10px 5px 0;
  padding:0px 0px 5px 0px;
  border:solid 2px #5d5d5d;
  text-align:center;
}
.categ-title{
    font-family:Arial;
    text-align: left;
    color:#5a3608;
    float: left;
    width:280px;
    padding:5px 0 5px 0;
    border-bottom: solid 1px #eddcb8;
    font-weight: bold;
}
.categ-title span{
  font-weight: bold;
  color:#7f0105;
  font-size: 12px;
  padding-right: 5px;
}

.descriptif{
    width:135px;
    margin-top: 10px;
    float:left;
	padding-left:5px;
	padding-right:5px;
    font-family:Arial;
	font-size: 12px !important;
    color:#c7c7c7;
    line-height: 16px;
    background-color: #2d2d2d;
	text-align:justify;
}

.product-detail{
    width:130px;
    float:right;
    font-family:Arial;
	font-size: 12px;
    text-align: right;
    padding-top:0px;
	margin-bottom:2px;
	padding-right:2px;
}

.image-prod{
	color:#f9e6c3;
}
.img-prod{
	border:solid 1px #7e7e7e;
}

#pagination{
    font-family:Arial;
    font-size: 12px;
    text-align: center;
    line-height: 12px;
    color:#c7c7c7;
	padding-bottom:10px;
}

#pagination a{
  text-decoration: none;
  color:#ffffff !important;
  font-weight:bold;
  background-color: #1a1a1a;
  padding:2px 5px 2px 5px;
}

#pagination a:hover{
  text-decoration: underline !important;
  color:#404040 !important;
  font-weight:bold;
  background-color:#ffffff;
}
.produits-title1{
    float: left;
    width:145px;
    padding:0px 0 5px 0;
	  margin-bottom:5px;
}


/*........................nos produits details................................*/
.text1-produits{
  width:470px;
  float:left;
  margin:0px 5px 10px 4px;
  border:solid 2px #3f3f3f;
  background-color:#000000;
  text-align:justify;
}
.produits-title{
    float: left;
    width:470px;
    padding:4px 0 5px 0;
}
.image1-produits{
	color:#f9e6c3;
	float:left;
	padding:0px 5px 0px 0px;
}

#retour{
    width:92px;
	margin:0px;
	clear:both;
	float:left;
	padding-top:5px;
	padding-left:15px;
}

/* ===| IV. NAVIGATION |===============================================*/
#menu2 ul li{display: inline;}
/* ---| THE END |------------------------- */

#mdm-text{
  padding-top: 50px;
}
#actualite-img {
	margin: 0px 0px 0px 5px;
	float: right;
  width: 75px;
}