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

html, body {height: 100%;}

#bandeau{position:absolute; top:0; left:0; z-index:10;}

#main{ margin-left:auto; margin-right:auto; overflow:hidden; background-image:url(../images_css/main.png); background-repeat:no-repeat; background-position:top left; min-height: 100%; margin-bottom:-101px; position:relative;}

#header{height:300px;}

/* --------------------------------------
MENU HORIZONTAL
---------------------------------------*/

#menu {float:left;	display:block; margin:0 10px 0 0; padding:0 0 0 0; height:36px; z-index:1000; position:absolute; }

#menu div {float:left; height:50px; width:144px; margin-right:8px; }

#menu div p{margin-top:40px; text-indent:-9000px;}

#age {background-image:url(../images_css/age.png); background-position:top; margin-left:126px;}

#age:hover {background-image:url(../images_css/age.png); background-position:bottom;}

#filles {background-image:url(../images_css/filles.png); background-position:top;}

#filles:hover {background-image:url(../images_css/filles.png); background-position:bottom;}

#garcons {background-image:url(../images_css/boy.png); background-position:top;}

#garcons:hover {background-image:url(../images_css/boy.png); background-position:bottom;}

#mixte {background-image:url(../images_css/mixte.png); background-position:top;}

#mixte:hover {background-image:url(../images_css/mixte.png); background-position:bottom;}

#menu div ul {position:absolute; margin: -5px 0 0 0; padding:5px 0 5px 0; background-image:url(../images_css/ul.png); background-position:top; line-height:20px; display:none; width:188px; }

#menu ul, #menu li { list-style-type: none; list-style-position:outside;}

#menu ul li { padding:0 10px 0 10px; font-size:1.00em; border-bottom:solid 1px #CCC;}
	
#menu ul li a { color:#333; text-decoration: none; text-transform:uppercase;}

#menu ul li a:hover { color: #990000 ;}

/* --------------------------------------
BLOCK LEFT
---------------------------------------*/

#blokeLeft {background-image:url(../images_css/paper.jpg); background-position:0px 50px; background-repeat:no-repeat;}

#leftContent {margin-right:0px; margin-top:30px;}

#blokeLeftBottom{width:229px; height:166px; background-image:url(../images_css/paper_bottom.jpg); background-repeat:no-repeat;}

/* --------------------------------------
Formulaire RECHERCHER
---------------------------------------*/

.formulaire {width:145px; display:block; overflow:hidden;}

.text{width:100px; float:left; margin-top:5px;}

.image {width:32px; height:32px; float:right;}

.menu_deroulant {width:145px; margin-bottom:10px;}

/* --------------------------------------
TOISE
---------------------------------------*/

#toise{margin-right:0px; float:right; background-image:url(../images_css/toise.png); background-repeat:no-repeat;}

#toise ul{margin-top:60px;}

#toise ul li{background-image:url(../images_css/li_toise.jpg); background-repeat:no-repeat; background-position:0px 10px; margin-left:21px; padding-left:8px; display:block; padding-bottom:10px;}

/* --------------------------------------
MAIN
---------------------------------------*/

/* PRODUIT*/

.produit{margin-bottom:30px;}

.vignette{height:140px; width:134px; background:url(../images_css/vignette.png); background-repeat:no-repeat; padding:9px 0 0 10px;}

.vignette img {border:#999 1px solid;}

.vignette img:hover{border:#911218 1px solid;}

.prix {width:48px; height:37px; background:url(../images_css/etiquette.png); background-repeat:no-repeat; text-align:center; padding-top:15px; margin-top:-160px; margin-left:100px; position:absolute;}

/*CHEMIN*/

.chemin {text-align:center; height:30px;position: relative; margin-bottom:20px; padding-top:10px; float:left; width:100%}

.next {	position:absolute; top:0; right:0; width: 33px; height: 48px; cursor: pointer; background:url(../images_css/next.jpg) no-repeat 0 0;}

.next:hover {
	background-position: -33px 0;
	text-decoration: none;
}

.next:active {
	background-position: -66px 0;
	text-decoration: none;
}

.prev {position:absolute;top:0;left:0; width: 33px; height: 48px; cursor: pointer; background:url(../images_css/prev.jpg) no-repeat 0 0;}

.prev:hover {
	background-position: -33px 0;
	text-decoration: none;
}

.prev:active {
	background-position: -66px 0;
	text-decoration: none;
}

.gauche{float:left; margin-left:35px; width:100px;}

.numero_chemin{width:41%; float:left;}

.droite{float:right; margin-right:33px; width:100px;}

/*DETAIL PRODUIT*/

.photo_produit{float:left; width:285px; height:291px; background-image:url(../images_css/photo_produit.png); padding:9px 0 0 9px; margin-left:10px;}

.photo_produit img{border:#999 solid 1px; margin-bottom:15px;}

.photo_produit img:hover{border:#911218 solid 1px;}

.prix_produit {width:82px; height:63px; background:url(../images_css/etiquette_produit.png); background-repeat:no-repeat; text-align:center; padding-top:25px; margin-top:-300px; margin-left:200px; position:absolute;}

.titre_produit {height:200px; margin-top:100px; width:150px; float:right;}

.descriptif_produit{ float:left; width:98%; margin-top:10px; margin-left:10px; text-align:justify; margin-bottom:20px;}

#ajouter_panier{display:block; width:150px; height:50px; background-image:url(../images/ajouter_panier.jpg); background-position:0 0; margin-top:20px;}
#ajouter_panier:hover{background-position:0 50px;}

/*AVIS*/

#avis{ float:left; width:98%; margin-bottom:20px; text-align:justify;}

#bouton_avis{display:block; width:150px; height:50px; background-image:url(../images_css/avis.jpg); background-position:0 0; float:left;}
#bouton_avis:hover{background-position:0 50px;}

#bouton_ecrire_avis{display:block; width:150px; height:50px; background-image:url(../images_css/ecrire.jpg); background-position:0 0; float:right;}
#bouton_ecrire_avis:hover{background-position:0 50px;}

.detail_avis{margin-bottom:10px; float:left; width:100%;}

.ecrire_avis{margin:10px 0 10px 0; float:left; width:100%;}

.formulaire_main { width:95%; display:block; overflow:hidden; margin:0 0 0 0; padding:10px; background:#CCC; -moz-border-radius: 10px; border: 1px solid #999;}

.text_main{width:200px; float:left; margin-top:5px;}

.legend {display:block; float:left; width:100%; margin:10px 0 10px 0;}

.formulaire_main label{display: block; float: left; width: 40%; text-align: right; margin: 5px 10px 0 0; padding: 0.1em;}

.formulaire_main input .text{ width: 50%; background-color:#fff; border: 1px solid #666; margin-right: 5px;}

#fonction{width:200px; margin-top:-5px;}

textarea {background-color:#FFF; border: 1px solid #666; float:right;}

.message{ width:340px; margin-top:5px; margin-right:38px;}

.captcha{width:80%; float:right; margin-right:30px; text-align:right; display:block;}

/*COMPTE*/

.bouton_modifier{display:block; width:111px; height:41px; background-image:url(../images_css/modifier.jpg); background-position:0 0; float:left;}
.bouton_modifier:hover{background-position:0 41px;}

.bouton_commandes{display:block; width:154px; height:52px; background-image:url(../images_css/commandes.jpg); background-position:0 0; float:left; margin-right:10px;}
.bouton_commandes:hover{background-position:0 52px;}

.bouton_factures{display:block; width:154px; height:52px; background-image:url(../images_css/factures.jpg); background-position:0 0; float:left;}
.bouton_factures:hover{background-position:0 52px;}

#commandes_historique .grid_1demi{display:inline; float:left; width:100px;}

.grid_articles{display:inline; float:left; width:210px;}

.grid_quantite{display:inline; float:left; width:50px;}

.grid_trash{display:inline; float:left; width:20px; padding-left:5px; padding-right:5px;}

.commande{background-color:#CCC; border-left:#FFF 1px solid; padding:5px; }

.commande p{border-top:#FFF 1px dashed;}

/*PANIER*/

#commandes .grid_1, #commande .grid_2, #commande .grid_3 {margin-left:0; margin-right:0;}

#commandes p{height:10px; padding:5px 0 5px 0;}

#commandes .grid_1demi{display:inline; float:left; width:62px;}

.quantite{width:30px; margin-left:5px; height:15px;}

#etapes p{float:left; margin-right:10px;}

.etape{ margin-right:5px; vertical-align:middle;}

.bouton_souhait{display:block; width:150px; height:52px; background-image:url(../images_css/souhaits.jpg); background-position:0 0; float:left;}
.bouton_souhait:hover{background-position:0 52px;}

.bouton_calculer{display:block; width:151px; height:52px; background-image:url(../images_css/calculate.jpg); background-position:0 0; float:left; margin-top:20px;}
.bouton_calculer:hover{background-position:0 52px;}

.bouton_verifier{display:block; width:153px; height:52px; background-image:url(../images_css/check.jpg); background-position:0 0; float:right; margin-top:20px;}
.bouton_verifier:hover{background-position:0 52px;}

.bouton_calculer{display:block; width:151px; height:52px; background-image:url(../images_css/calculate.jpg); background-position:0 0; float:left; margin-top:20px;}
.bouton_calculer:hover{background-position:0 52px;}

.bouton_payer{display:block; width:150px; height:51px; background-image:url(../images_css/payer.jpg); background-position:0 0; float:right; margin-top:20px;}
.bouton_payer:hover{background-position:0 51px;}

.bouton_imprimer{display:block; width:151px; height:51px; background-image:url(../images_css/imprimer.png); background-position:0 0; float:right; margin-top:20px;}
.bouton_imprimer:hover{background-position:0 51px;}

/* --------------------------------------
BLOCK RIGHT
---------------------------------------*/

#blokeRight {float:right; margin-right:10px; margin-top:-20px;}

#panier {width:160px; height:158px; background-image:url(../images_css/panier.png); background-repeat:no-repeat; padding:10px 20px; margin-bottom:40px;}

.submit{vertical-align:middle;}

/* --------------------------------------
FOOTER
---------------------------------------*/

#footer{height:51px; position:relative; background-image:url(../images_css/footer.png); background-position:middle; background-repeat:no-repeat; text-align:center; padding-top:50px;}

.clearfooter { height: 101px; clear: both;}