* { padding:0; margin:0; }
    html, body { height:100%;width:100%; }
html {
  position: relative;
}
body {
  font-family: "Lucida Sans", Verdana, sans-serif;
  margin-bottom: 60px;
  min-width:400px; 
  min-height: 480px;
  	/*border:solid 1px #dd0;*/
	overflow:hidden;
	
}
.footer {
  display:block;
  position: absolute;
  margin-top:100%;
  width: 100%;
  height: 60px;
  background-color: #f5f5f5;
}



/* Custom page CSS
-------------------------------------------------- */


body > .container {
	margin-top : -100px;
    padding: 90px 15px 0;
	overflow:hidden;

}
.container .text-muted {
  margin: 20px 0;
}


.footer{
  padding-right: 15px;
  padding-left: 15px;
  position:absolute;
 bottom:0;
  
}


#catalogue,#commande,#paiement,#adresse{
position:absolute;
width:50%;
min-width:400px;
padding: 0px 2px 0;
font-size:10px;

}
#popup1{
position:relative;
float:right;
border : dotted 3px #aaa;
}

#page_produit{
display:block;
	cursor: pointer;
	cursor: hand;
overflow:auto;
height:80%;
margin-top:-95px;
position:absolute;	
z-index:50;
}


#page_produit::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
	background-color: #F5F5F5;
	border-radius: 10px;
}


#page_produit::-webkit-scrollbar
{
	width: 10px;
	background-color: #F5F5F5;
}

#page_produit::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	background-color: #FFF;
	background-image: -webkit-linear-gradient(top,
											  #e4fcf5 0%,
											  #bff9e8 50%,
											  #9fefd8 51%,
											  #2aedb0 100%);
}

.opener{
	cursor: auto;	
}

.tabs{
		/*border:solid 1px #d0d;*/

    position:relative;
	text-align:left;
	margin-left:-5%;
	margin-top:8px;
	margin-bottom:14px;
	width:100%;
	display:in-line;
	/*min-width:400px;*/
	font-size:120%;

}

#fiche{
	position:absolute;
 	z-index:3;
    left:45%;
	margin-top:-45px;

}

#fiche img{
	width:100%;
	height:100%;
	border:solid 1px #000;
	border-radius: 4px;
}

#pub1{
	position:absolute;
	float:right;
    right:0;	
	top:130px;
	left:60%;
	margin-top:0;
	margin-right:20%;
	z-index:1;
		cursor: pointer;
	cursor: hand;
}


#pub1 img{
	width:100%;
	height:100%;
	float:right;
		cursor: pointer;
	cursor: hand;
}

#pub2{
	position:absolute;
	float:right;
    right:0;	
	top:300px;
	left:75%;
	margin-top:0;
	margin-right:0%;
	z-index:0;
	transform:rotate(-10deg);
	 opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */
		cursor: pointer;
	cursor: hand;
}

#pub3{
	position:absolute;
	float:right;
    right:0;	
	top:200px;
	left:55%;
	margin-top:0;
	margin-right:0%;
	z-index:0;
	transform:rotate(10deg);
	 opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */
		cursor: pointer;
	cursor: hand;
}





.tabs b{
	border:solid 1px #ccc;
	padding-top:4px;
	padding-bottom:9px;
	padding-left:8px;
	padding-right:8px;
	margin-right:2px;
	position:relative;
    text-decoration: none;
	color:#fff;
		
background-color:rgb(63,107,79);
background-image: linear-gradient(bottom, rgb(1,77,28) 3%, rgb(1,144,56) 9%, rgb(63,107,79) 92%);
background-image: -o-linear-gradient(bottom, rgb(1,77,28) 3%, rgb(1,144,56) 9%, rgb(63,107,79) 92%);
background-image: -moz-linear-gradient(bottom, rgb(1,77,28) 3%, rgb(1,144,56) 9%, rgb(63,107,79) 92%);
background-image: -webkit-linear-gradient(bottom, rgb(1,77,28) 3%, rgb(1,144,56) 9%, rgb(63,107,79) 92%);
background-image: -ms-linear-gradient(bottom, rgb(1,77,28) 3%, rgb(1,144,56) 9%, rgb(63,107,79) 92%);
}

.tabs a{
	border:solid 1px #ccc;
	padding-top:4px;
	padding-bottom:9px;
	padding-left:8px;
	padding-right:8px;
	margin-right:2px;
	position:relative;
    text-decoration: none;
    color:#333;
	font-weight:bold;
	cursor: pointer;
	cursor: hand;
	background-color:#ccc;
background-image: linear-gradient(bottom, rgb(137,137,137) 3%, rgb(216,216,216) 9%, rgb(248,248,248) 92%);
background-image: -o-linear-gradient(bottom, rgb(137,137,137) 3%, rgb(216,216,216) 9%, rgb(248,248,248) 92%);
background-image: -moz-linear-gradient(bottom, rgb(137,137,137) 3%, rgb(216,216,216) 9%, rgb(248,248,248) 92%);
background-image: -webkit-linear-gradient(bottom, rgb(137,137,137) 3%, rgb(216,216,216) 9%, rgb(248,248,248) 92%);
background-image: -ms-linear-gradient(bottom, rgb(137,137,137) 3%, rgb(216,216,216) 9%, rgb(248,248,248) 92%);
}
}

#zone_commande p i{
	margin-bottom:-5px;
	padding: 3px;  
	margin-left : 10px; 
	font-size:24px;
	color : #bd0303;
	background-color:#cccc00;
	border:solid 1px #bd0303;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

.vignette{
	width:32px;
	height:32px;
	border:none;
}

.vignetteBig{
	width:96px;
	height:96px;
	border:solid 1px #bd0303;
}

.dessin {
	width : 107px;
	height : 100px;
}


table { 
	width:90%;
	max-width:98%;
	text-align:center;
	margin-top:6px;
	border-collapse:collapse;

	/*border: solid 1px #ccc;*/
	}
	
	
	/* Zebra striping
	.tab	tr { 
		background: #eee;
	}
.tab	tr:nth-of-type(odd) { 
		background: #eee;
	}
 */
 #soufferant_msg{
	 position:absolute;
	 display: none;
	 top : 0px;
	 width:100%;
	 z-index:50;
	 font-weight:bold;
	 text-align:center;
	padding: 3px;  
	margin-left : 10px; 
	color : #bd0303;
	background-color:#cccc00;
	border:solid 1px #bd0303;
 }
 .navigation{
position:relative;
background-color:rgb(63,107,79);
background-image: linear-gradient(bottom, rgb(63,107,79) 3%, rgb(1,144,56) 39%);
background-image: -o-linear-gradient(bottom, rgb(63,107,79) 3%, rgb(1,144,56) 39%);
background-image: -moz-linear-gradient(bottom, rgb(63,107,79) 3%, rgb(1,144,56) 39%);
background-image: -webkit-linear-gradient(bottom, rgb(63,107,79) 3%, rgb(1,144,56) 39%);
background-image: -ms-linear-gradient(bottom, rgb(63,107,79) 3%, rgb(1,144,56) 39%);
z-index:50;
margin-bottom:100px;
 }
 
 .navigation ul {list-style-type:none;padding-top: 3px;text-align: left;}
 .navigation li {display: inline;margin:6px;}
 
.navigation a {width:80px;color: #fff;font-size: 1.4em;text-decoration: none;text-align: left;font-weight:bold;}	
.navigation a:hover {color: #000;cursor:hand;cursor:pointer;}

 
.tab th { 
height:24px;
font-size:12px;
color : #bd0303;
font-weight: bold; 
padding: 3px; 
text-align:center;
border : 1px solid  #eee;

background-color:#eee;
background-image: linear-gradient(bottom, rgb(137,137,137) 2%, rgb(216,216,216) 9%, rgb(248,248,248) 92%);
background-image: -o-linear-gradient(bottom, rgb(137,137,137) 3%, rgb(216,216,216) 9%, rgb(248,248,248) 92%);
background-image: -moz-linear-gradient(bottom, rgb(137,137,137) 3%, rgb(216,216,216) 9%, rgb(248,248,248) 92%);
background-image: -webkit-linear-gradient(bottom, rgb(137,137,137) 2%, rgb(216,216,216) 9%, rgb(256,256,256) 92%);
background-image: -ms-linear-gradient(bottom, rgb(137,137,137) 3%, rgb(216,216,216) 9%, rgb(248,248,248) 92%);
	}
	
.tab td{
	font-size:12px;
	height:48px;
	border: solid 1px #ccc;


	}
	.tab tr{
				background-color:#fff;

	}
	
.tab td input{
width:40px;
margin-left:2px;
margin-right:2px;
	}

.left{
	text-align:left;
	padding: 5px; 
	padding-left:10px;
}

.rigth{
	text-align:right;
	padding: 5px; 
	padding-right:10px;
}

.center{
	text-align:center;
	padding: 5px; 
}
tr:hover{
    background-color: #bdb;
	cursor:hand;cursor:pointer;
}




.table_bottom{
position:relative;
left:0px;
text-align : left;
	font-size:24px;

}

.table_bottom a{
z-index:0;
border:solid 1px #000;
   float:left;
   font-weight:bold;
	position:relative;
    text-decoration: none;
	color:#bd0303;
	background:#d9d9d9;
	width:24px;
	height:24px;
	padding-top:4px;
	padding-bottom:1px;
	padding-left:5px;
	padding-right:5px;
	margin-right:3px;
	border : 1px solid #bd0303;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	cursor: pointer;
cursor: hand;
background-image: linear-gradient(to bottom, #ffffff 0%, #dcd9d9 20%);
}
.table_bottom b{
	float:left;
	font-weight:bold;
	position:relative;
    text-decoration: none;
	color:#000;
	background:#fff;
	width:24px;
	height:24px;
	padding-top:4px;
	padding-bottom:1px;
	padding-left:5px;
	padding-right:5px;
	margin-right:3px;
    border: 1px solid #ccc;

	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	cursor: pointer;
cursor: hand;
}

.cl_adress{
	position : relative;
	display:block;
	margin-left:10px;	
	margin-top:40px;

	}

.cl_adress .titres {
	float:left;	
	position : relative;
	line-height:20px;	
	left :10px;	
	width : 120px;	
	padding-bottom:5px;	
	margin-top:10px;	
	font-size: 11px;	
	text-align: left;	
	font-weight:bold;	
	color : #000;
	}

.cl_adress .cases {
	position : absolute;
	line-height:20px;	
	left :160px; 
	width : 220px;	
	
	}

.cl_adress .cases input[type=text],.cl_adress .cases input[type=password],.cl_adress .cases input[type=email]  {
	border: 1px solid #bd0303;	
	background : #fff;	
	color : #000;    
	font-size: 12px;
    padding-left:2px;	
	text-align: left;
	width : 200px;	
	margin-top:0px;	
	padding-bottom:5px;	
	-moz-border-radius: 4px;	
	-webkit-border-radius: 4px;	
	border-radius: 4px;
	}
	
	.cl_adress .cases input[type=radio] {
	color : #000;    
	font-size: 24px;
    padding-left:2px;
    vertical-align:text-bottom;	
	}
	
	.cl_adress .submit {
	float:left;
	position : relative;
	margin-top:155px;	
	margin-left:160px;
	border:solid 1px #ccc;
	padding-top:4px;
	padding-bottom:4px;
	padding-left:8px;
	padding-right:8px;
	background : #ddd;	
	color : #000;    
	font-size: 12px;	
	text-align: center; 
	border-radius: 4px;
	margin-bottom:10px;	
	text-decoration: none;
	cursor: pointer;
	cursor: hand;
	}
	
	.cl_adress .submit2 {
	float:left;
	position : relative;
	margin-top:100px;	
	margin-left:160px;
	border:solid 1px #ccc;
	padding-top:4px;
	padding-bottom:4px;
	padding-left:8px;
	padding-right:8px;
	background : #ddd;	
	color : #000;    
	font-size: 12px;	
	text-align: center; 
	border-radius: 4px;
	margin-bottom:10px;	
	text-decoration: none;
	cursor: pointer;
	cursor: hand;
	}
	
.cl_adress .submit3 {
	float:left;
	position : relative;
	margin-top:250px;	
	margin-left:160px;
	border:solid 1px #ccc;
	padding-top:4px;
	padding-bottom:4px;
	padding-left:8px;
	padding-right:8px;
	background : #ddd;	
	color : #000;    
	font-size: 12px;	
	text-align: center; 
	border-radius: 4px;
	margin-bottom:10px;	
	text-decoration: none;
	cursor: pointer;
	cursor: hand;
	}
	#btnFiche{
	float:left;
	position : absolute;
	border:solid 1px #ccc;
	margin-top:10px;
	margin-left:10px;
	padding-top:4px;
	padding-bottom:4px;
	padding-left:8px;
	padding-right:8px;
	background : #ddd;	
	color : #000;    
	font-size: 12px;	
	text-align: center; 
	border-radius: 4px;
	margin-bottom:10px;	
	text-decoration: none;
	cursor: pointer;
	cursor: hand;
	
	}
	
	.cl_adress .submit4 {
	float:left;
	position : relative;
	border:solid 1px #ccc;
	margin-top:10px;
	padding-top:4px;
	padding-bottom:4px;
	padding-left:8px;
	padding-right:8px;
	background : #ddd;	
	color : #000;    
	font-size: 12px;	
	text-align: center; 
	border-radius: 4px;
	margin-bottom:10px;	
	text-decoration: none;
	cursor: pointer;
	cursor: hand;
	}