html, body {
margin: 0;
padding: 0;
height: 100%
}

a {
	text-decoration: none;
	color: #333333;
}

a:hover{
	text-decoration: underline;
}

img {
	padding: 0px;
	margin: 0px;
	border: 0px;
}

body {
	background-color: #d9eaf7;
	font-family: Verdana, Perpetua, sans-serif; 
	font-size: 8pt; 
	color: #333333; 
	background-image:url("images/fond.jpg");
	background-repeat:no-repeat;
	background-position:center top;
	background-attachment: fixed;
	margin: 0;
	padding: 0;
	height: 100%;
}

/*#page {
	width: 930px;
	height: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: white;
}*/

#header {
	margin: 0px;
	padding: 0px;
	height: 170px;
	/*margin-top: 30px;*/
	padding-top: 30px;
}

#main {
	/*height: 565px;*/
	width: 925px;
	background-color: white;
	margin-left: auto;
	margin-right: auto;
}

#footer {
	height: 40px;
	color: #333333;
	font-weight: bold;
	clear: both;
}

/* ENTETE */
#client {
	height: 30px;
	background-color: #f39b3f;
	position: fixed;
	width:100%;
	z-index: 11;
	top: 0px;
	left: 0px;
}

#bandeau {
	width: 925px;
	background-color: white;
	text-align: left;
	margin: auto;
	margin-top: 0px; /* Pour le décalage en haut de la page */
	padding: 5px 0px 5px 10px;
}

#bandeau #box span {
	position: absolute;
	z-index: 0;
	display: inline;
}

#bandeau h1 {
	color:#A6C8E3;
	font-size:13pt;
	font-weight:normal;
	width:180px;
	float: right;
	display: inline;
	margin-top: 15px;
}

#menu {
	height: 30px;
}

#panier {
	position: absolute;
	top: 0px;
	right: 0px;
	height: 30px;
	background-color: #1c267d;
	width:239px;
	text-align:right;
}

	a.button {
		display:block;
		font-size: 9pt;
		color:#1c267d;
		margin: 0px 0px 0px 0px;
		border: 1px solid #1c267d;
		padding: 0px 1px;
		background-color: #d9e9f6;
	}

	a:hover.button{
		background-color: #a2caed;
		border: 1px solid #a2caed;
		color:#1c267d;
		text-decoration:none;
	}

.couche {
	background-color: #c5d1db;
	display:block;
	height: 100%;
	width: 100%;
}

.login {
	background-color: #f39b3f;
	display:block;
	height: 30px;
	width: 925px;
	margin: auto;
	position: relative;
	top: -30px;
	text-align: left;
	color: #333333;
	padding-left: 10px;
}

.login .commande {
	display: inline;
}

.login .welcome {
	width: 200px;
}

.login input.compte{
	background-color: white;
	border: 1px solid #b8bec4;
}

.login input.submit{
	vertical-align: bottom;
}

.login form {
	display: inline;
}

.login p {
	display: inline-block;
	padding: 0px;
	margin: 0px;
	margin-left: 0px;
	text-align: left;
	width: 110px;
	font-size: 7pt;
}

.menu_inst {
	background-color: #ccd0d5;
	display:block;
	height: 30px; 
	width: 850px; /* On diminue la largeur à cause du padding */
	margin: auto;
	position: relative;
	top: -30px;
	text-align: center;
	padding-left: 80px;
	z-index: 10;
}

.menu_inst ul {
	padding: 0px;
	margin: auto;
	height: 100%;
	width: auto;
	text-align: center;
	clear: both;
}

.pied_page {
	background-color: #ccd0d5;
	display:block;
	height: 40px;
	width: 925px;
	margin: auto;
	position: relative;
	margin-top: -13px;
	z-index: 5;
}

.btn_menu {
	margin: 0px 5px;
	padding: 8px 2px 0px 2px;
	height: 22px;
	float: left;
	list-style-type:none;
}

.btn_menu.a:hover {
	background-color: #a1caec;
	cursor: pointer;
}

.btn_menu a:hover {
	text-decoration: none;
}

/* CONTENU */
#col1 {
	width: 250px;
	min-height: 566px;
	float: left;
	position: relative;
	background-color: #f6bfd6;
	margin-top: -30px;
	/*height: 566px;*/
}

#col2 {
	min-height: 565px;
	width: 675px;
	position: relative;
	float: left;
	/*overflow-y: auto;*/
	overflow: hidden;
	margin-top: -30px;
	background-color: #F5F7F7;
}

html[xmlns*=""] body:last-child #col2 {
	margin-top: 0px;
}

#col2 p {
	padding-left: 15px;
}

.catalogue {
	padding-left: 10px;
	padding-bottom: 40px;
	padding-top: 30px;
	background-color: white;
}

.catalogue ul{
	padding-left: 10px;
}

.catalogue li{
	list-style-type:none;
	font-family: Verdana;
	font-size: 12pt;
	border-bottom: 1px solid #b8bec4;
	margin-bottom: 5px;
	color: #333333;
	list-style-position : inside;
}

.catalogue li img{
	vertical-align: bottom;
	margin: 0px;
	margin-right: 5px;
}

.catalogue a:hover {
	text-decoration: none;
	font-weight: bold;
}

.catalogue .square {
	display: inline-block;
	width: 21px;
	height: 21px;
	border: none;
	vertical-align: bottom;
	border-radius: 2px;
	-moz-border-radius: 2px;
	margin-right: 5px;
}

.rose {
	background-color: #f6bfd6;
	font-family: Verdana;
	color: #333333;
	padding-bottom: 50px;
}

.rose span {
	display: block;
	width: 100%;
	border-bottom: dashed 2px white;
	margin-bottom: 20px;
}

.rose img {
	margin-left: 20px;
}

.rose img.cb {
	position: absolute;
}

.rose ul {
	text-align: justify;
	width: 160px;
}

.rose li {
	list-style-image: url("images/puce.gif");
	margin-bottom: 2px;
}

div.flux {
	clear: both;
}


input.bouton {
	background:url(images/btn_panier.png) no-repeat;
	width:162px;
	height:26px;
	border:0px;
}

input.bouton:hover {
	background:url(images/btn_panier.png) no-repeat;
	background-position: 0px -26px;
	cursor : pointer; 
}

/* PIED DE PAGE */
.pied_page ul {
	width: 100%;
	padding-top: 0px;
	padding-left: 0px;
	margin: 0px;
}

.pied_page li {
	list-style-type: none;
	display: inline;
	border-right: 1px solid #333333;
	padding: 0px 80px;
}

.pied_page li.last {
	border-right: none;
}

.pied_page li img {
	vertical-align: bottom;
}

/* CORPS */
.top {
	width: 100%;
	height: 380px;
}

.left {
	background-color: #f5f7f7;
	width: 400px;
	float: left;
	position: relative;
	color: #333333;
	text-align: justify;
	padding-left: 45px;
	padding-top: 30px;
}

.left p {
	padding: 25px;
	width: 320px;
	padding-left: 0px;
	font-size: 9pt;
}

.right {
	/*margin-top: -18px;*/
	width: 225px;
	position: relative;
	margin-left: 450px; /* On décale à cause du contenu de gauche */
	padding-top: 30px;
	background-color: white;
}

.right_top {
	background-color: white;
	background-image: url(images/fleur_verte.png);
	background-position: center bottom;
	background-repeat: no-repeat;
	padding-right: 25px;
	padding-bottom: 25px;
	border-bottom: 1px dashed #b1c903;
	height: 50%;
	font-size: 9pt;
	height: 172px;
	padding-left: 25px;
}

.right_top p {
	padding-top: 5px;
}

.right_top a{
	color: #f47f4c;
}

.right_bottom p {
	padding-top: 5px;
}

.right_bottom {
	background-color: white;
	background-image: url(images/fleur_mauve.png);
	background-position: center bottom;
	background-repeat: no-repeat;
	padding: 25px;
	height: 50%;
	font-size: 9pt;
}

.right_bottom  .suite{
	color: #f47f4c;
	display: block;
	text-align: right;
}

.promo {
	height: 186px;
	width: 675px;
	background-color: #92979c;
	position: relative;
	z-index: 5;
	overflow: hidden;
}

.promo h1 {
	padding: 10px 0px 0px 50px;
	margin: 0px;
	width: 625px;
	background-color: #bdd9f0;
	height: 20px;
}

.promo span {
	width: 290px;
	display: inline-block;
	height: 100%;
}

.promo span img {
	/*float: right;*/
	top: -50px;
	right: 10px;
	left: 5px;
	position: relative;
}

.promo1 {
	border-right: 2px dotted white;
	padding-left: 0px;
}

.promo1 p {
	text-align: center;
	width: 130px;
	float: left;
	color: white;
	position: relative;
}

.promo2 {
	padding-left: 0px;
}

.promo2 p {
	text-align: center;
	width: 130px;
	float: left;
	color: white;
	position: relative;
}

.promo2 p.prix {
	display: inline;
	color: #f39b3f;
	font-size: 11pt;
	font-weight: bold;
	
}

.promo h3 {
	width: 140px;
	text-align: center;
	font-size: 10pt;
	height: 32px;
}

.presentation {
	width: 440px;
	background-color: #f5f7f7;
	float: left;
	height: auto;
	font-size: 9pt;
	padding-bottom: 25px;
}

.presentation .fil_ariane {
	font-size: 7pt;
	float: right;
	color: #f39b3f;
}

.options {
	width: 235px;
	background-color: white;
	margin-left: 440px;
	text-align: center;
	padding: 0px;
	padding-top: 30px;
	padding-bottom: 20px;
}

h2 {
	color: #333333;
	height: 62px;
	background-image: url(images/fleur.png);
	background-position: left;
	background-repeat: no-repeat;
	padding-top: 30px;
	padding-left: 35px;
	margin: 0px;
	margin-left: 10px;
}

.description {
	padding-left: 35px;
	padding-right: 35px;
	text-align: justify;
	color: #333333;
	display: block;
}

.photo {
	text-align: center;
}

.photo img {
	border: 2px solid #94979a;
}

h4 {
	color: #5898cb;
	font-size: 10pt;
	margin: 0px;
	padding: 0px;
	margin-bottom: 25px;
}

.dispo {
	padding-left: 5px;
	padding-right: 20px;
	margin-bottom: 20px;
}

.options img.color {
	width: 60px;
	height: 60px;
	display: block;
	text-align: left;
	border: 1px solid #ccd0d5;
	position: absolute;
	z-index: 1;
}

.infos {
	position: relative;
	/*top: -60px;*/
	left: 25px;
	margin-top: -60px;
}

.couleur {
	font-size: 10pt;
	padding: 0px;
	margin: 0px;
	margin-bottom: 3px;
	margin-left: 10px;
	font-weight: bold;
}

.reference {
	font-size: 10pt;
	padding: 0px;
	margin: 0px;
	margin-bottom: 3px;
}

.matiere {
	font-size: 8pt;
	padding: 0px;
	margin: 0px;
	width: 100px;
	margin-left: 50px;
}

.prix {
	display: block;
	text-align: right;
	margin-top: 15px;
	border-bottom:1px dotted #ccc;

}

.prix p {
	display: table-cell;
	width: 120px;
}

.prix select {
	background-color: #efefef;
	width: 50px;
}

.prix p.input{
	text-align: right;
	text-align: left;
	width: 50px;
}

.liste {
	background-color: #f5f7f7;
	padding: 0px 10px;
	width: 655px;
	height: auto;
	min-height: 565px;
	/*overflow-x: hidden;
	overflow-y: hidden;*/
}

/*.liste  table{
	width: 100%;
}

.liste table tr {
	border-bottom : 2px dotted #c8c511;
}

.liste table td {
	padding: 5px;
	text-align: center;
	vertical-align: middle;
	border-bottom : 2px dotted #c8c511;
}

.liste table h5 {
	font-size: 9pt;
	padding: 0px;
	margin: 0px;
	padding-bottom: 5px;
}

.liste td img{
	border: 2px solid #f5f7f7; /*Pour ne pas créer de décalage au survol */
/*}

.liste td img:hover{
	border: 2px solid #c8c511;
}*/

.liste span.table {
	display: inline-block;
	width: 30%;
	text-align: center;
	border-bottom : 2px dotted #c8c511;
	padding: 5px;
	vertical-align: top;
	height: 240px;
}

.liste .table h5 {
	font-size: 9pt;
	padding: 0px;
	margin: 0px;
	padding-bottom: 5px;
	height: 14px;
	overflow: hidden;
}

.liste .table .img{
	border: 2px solid #f5f7f7; /*Pour ne pas créer de décalage au survol */
}

.liste .table .img:hover{
	border: 2px solid #c8c511;
}

.liste div.img {
	width: 175px;
	height: 175px;
	overflow: hidden;
	background-color: #f5f7f7;
	border: 2px solid #f5f7f7;
}

.titre-panier {
	font-size: 10pt;
	font-weight: bold;
}

#zoommep {
	position: absolute;
	width: 300px;
	background-color: #d8eaf6;
	height: 50px;
	font-size: 12pt;
	top: 100px;
	left: 50px;
	border: 3px solid #1b2779;
	padding: 30px;
	color:#1b2779;
}



/* --------------------------- POUR CHROME ------------------------------- */
@media screen and (-webkit-min-device-pixel-ratio:0) { 
	#col2 {
		margin-top: -5px;
		/*min-height: 575px;*/
	}
	#col1 {
		margin-top: -5px;
	}
	
	.pied_page {
		margin-top: -13px;
		height: 53px;
	}
	.table {
		margin-bottom: 30px;
	}
	
	.presentation {
		margin-bottom: 30px;
	}
	
	.infos {
		position: relative;
		margin-top: -60px;
	}
	img.color {
		position: absolute;
		z-index: 1;
	}
	.prix {
		margin-top: 40px;
	}
	
	#zoommep {
		z-index: 10;
	}
	
	.options {
		margin-bottom: 20px;
	}
}

/* -------------------------- POUR FIREFOX 3.0 ------------------------------ */
/* Target FireFox 3 [!] */
.menu_inst ul, x:-moz-any-link, x:default {
	clear: none;
}

.menu_inst li, x:-moz-any-link, x:default {
	margin: 0px;
}

#bandeau h1, x:-moz-any-link, x:default {
	margin-top: -110px;
}

/* -------------------------- POUR FIREFOX 3.6 ------------------------------ */
@media screen and (min-width: 0px) {
    #bandeau h1 {
		margin-top: 0px;
    }
}