/* CSS Document */

/* ----------------------------------------------------------- BALISE GENERALE */
	* {
		margin:0px; padding:0;
		font-size:14px;
		font-family:"Times New Roman", "Courier New", Courier, mono;
	}
	body{
		background:#D5D1C5 url(../images/fond.jpg);
	}
	
	h1 {		
		padding:10px 0 0 5px;
		font-size:18pt;
		font-weight:bold;
		color:#FF7AB3;
	}
	
	h2 {		
		padding:10px 0 10px 30px;
		font-size:18pt;
		font-weight:bold;
		color:#FF7AB3;
	}
	
	p { margin-left:5px; 
		color: #777;}	

	a {
		font-size:12pt;
		font-style:normal;
		text-decoration:none;
		font-weight:bold;
		color:#C32BD8;
	}	
	a:hover { color:#FF97C8; }
	
	
	img {
	border : none;	}
	

/* ----------------------------------------------------------------- CONTENEUR */

/* gestion de l'ombre latérale du conteneur principal */
	div.ombreconteneur {
		position:relative;
		width:816px;
		margin:30px auto;
		background :white  url(../images/ombre_c1.jpg) repeat-y;
		border:1px solid #888;
	}

/* gestion de l'ombre supérieure du conteneur principal */
	div.ombre_sup {
		position:relative;
		width:100%;
		height:10px; 
		margin:0 auto;
		background :white url(../images/ombre_h1.jpg) no-repeat;
		border:0px solid red;
	}
	
/* gestion de l'ombre inférieure du conteneur principal */	
	div.ombre_inf {
		position:relative;
		width:100%;
		height:16px; 
		margin:0 auto;
		background : white url(../images/ombre_b1.jpg) no-repeat;
		border:0px solid red;
	}

/* gestion de mon conteneur principal */
	div.conteneur {
		position:relative;
		width:780px; 
		border: 0px solid #cccccc;
		margin:0px auto;
		background : white;
	}

/* gestion de ma banniere */
	div.banniere {
		position:relative;
		width:100%;
		height:200px;
		background: url(../images/bandeau34.jpg);
		border: 0px solid white;
	}

/* gestion bas de page */
	div.bas {
		position:relative;
		width:100%;
		height:20px;
	}
	
	
/* ----------------------------------------------------------------- CONTENEUR MENU */
	div.menu {
		position:relative;
		width:100%;
		height:60px;
		background: #fff url(../images/menu.jpg) repeat-x;
		border: 0px solid white;
		z-index:2;
	}
	
	#zoneMenu div {
		position:relative;
		width:100px;
		height:40px;
		float:left;
		padding:10px 4px 2px 50px;
		border:0px solid black;
		background:url(../images/coeur.png) no-repeat 0 70%;
		z-index:6;
	}
	#zoneMenu div  a {
		font-size:11pt;
		font-style:normal;		
		font-weight:bold;
		color:#DDDDDD;
	}
	#zoneMenu div a:hover { color:#FFFFFF; }
	
	#ssmenu_1, #ssmenu_2, #ssmenu_3, #ssmenu_4 {
		position:absolute;
		display:none;
		padding-top:0px;
		border:0px solid #45403A;
		border-bottom-width:8px;
		border-left-width:1px;
		border-right-width:1px;
	}
	#ssmenu_1, #ssmenu_2 { width:420px; }
	#ssmenu_3 { width:210px; }
	#ssmenu_4 { width:132px; }
	
	#ssmenu div ul, #ssmenu div li {
		margin: 0;
		padding: 0;
		list-style-type: none;
	}
		
	#ssmenu div li {
		display:block;
		float:left;
		width:200px;
		background-color:#FF81BA;
		padding:2px 5px 4px 5px;
		font-size:10pt;
	}
		#ssmenu #ssmenu_4 li { width:122px; }
		#ssmenu div li.short { font-size:4pt; }
	#ssmenu div ul li a {
		color:#FFFFFF;
		text-decoration:none;
		font-weight:bold;
		font-size:8pt;
	}
	#ssmenu div ul li a:hover { color:#45403A; }

/* ----------------------------------------------------------------- CONTENEUR SECTION */
	div.sectionGauche {
		float:left;
		position:relative;
		width:180px;
		border:0px solid #bbb;
	}	
	div.sectionDroiteCatalogue {
		float:right;
		position:relative;
		width:590px;
		border:0px solid black;
	}
	
	div.sectionCentre {
		float:left;
		position:relative;
		left:10px;
		width:380px;	
		border:0px dotted red;
	}
	
	div.sectionDroite {
		float:right;
		position:relative;
		width:190px;
		border:0px solid black;
		margin: 5px;
	}

/* ----------------------------------------------------------------- CONTENEUR CADDIE */
	.caddie {
		width:180px;
		height:50px;
		background:#efeeea url(../images/titre.jpg) no-repeat;
		margin-bottom:20px;
		border:1px solid #ccc;
	}
	.caddie h1 {		
		text-align:center;
		font-size:12pt;
		font-weight:bold;
		color:#FF85BB;
	}
	.caddie span {
		margin-left:15px;
	}
	a#lienPanier:hover { color:#666666; }
	

/* ----------------------------------------------------------------- CONTENEUR NEWSLETTER */
	.news {
		width:190px;
		height:80px;
		background:#E5E4DF url(../images/news.jpg) no-repeat;
		margin-bottom:20px;
		margin-top : 0px;
		border:1px solid #ccc;
	}
	.news h1 {		
		text-align:center;
		font-size:12pt;
		font-weight:bold;
		color:#FF85BB;
	}
	.news span {
		margin-left:10px;
	}
	
	.news a {
		float : right;
		font-size:10pt;
		margin-right:10px;
	}
	
		
/* ----------------------------------------------------------------- CONTENEUR RECHERCHER*/
	.rechercher {
		position : absolute;
		top : 10px;
		left: 10px;
		width:250px;
		height:50px;
		background:#ddd url no-repeat;
		border:0px solid #333;
		z-index : 10;
	}
	.rechercher h1 {		
		text-align:center;
		font-size:12pt;
		font-weight:bold;
		color:#FF85BB;
	}
	.rechercher span {
		margin-left:0px;
	}
	
	.rechercher img {
		border:0px white solid;
	}
	
	.rechercher input {
		border:2px solid #ccc;
		margin-bottom:10px;
	}
	
	
/* ----------------------------------------------------------------- CONTENEUR LISTE */
	.boxListe {
		margin-bottom:20px;		
		border : 1px solid #FF81BA;
		padding-bottom:10px;
	}
	.boxListe ul {		
		color:#fff;
	}
	.boxListe ul span { 
		display : block;
		margin:5px; 	
		font-weight:bold;	
		font-size:14pt;		
		background : #FF81BA;		
		padding-bottom : 5px;
		text-align : center;
	}
	
	 .boxListe li {
		list-style-image : url(../images/puce_catalogue1.jpg); 
		color:#444444;
		font-weight:bold;
		margin-top:1px;
		margin-left:30px;
	}
	 .boxListe li.first {
		margin-top:10px;		
	 }
	 .boxListe li.garantie {
	 	list-style-image : url(../images/plus.png);
	 }
	 .boxListe li a { font-size:13px; }	
	
	 .boxListe li.star {
		list-style-image : url(../images/m-star.gif); 
		color:#444444;
		font-weight:bold;
		margin-top:1px;
		margin-left:30px;
		background-image:none;
	}
	
	 .boxListe li.firststar {
		list-style-image : url(../images/m-star.gif); 
		margin-top:10px;	
	}
	
/* ----------------------------------------------------------------- CONTENEUR SUGGESTIONS */
	#suggestion {
		width:180px;
		margin-bottom:10px;
		background:url(../images/h1.gif) no-repeat top left;
		border:0px solid black;
	}
	#suggestion h4 {
		margin-left:5px;
		font-weight:bold;
		font-size:18pt;
		color:white;
	}
	#suggestion img#artSuggestion {
		float:left;		
		margin-top:10px;
		border:0px solid #ccc;
	}
	#suggestion div { float:right; margin-top:10px; } 	
	
	
/* ----------------------------------------------------------------- CONTENEUR ARTICLE NAVIGATION RETOUR-AVANCE */
	.naviX { border:0px solid red; width:90%; }
		.naviGauche { float:left; margin-left:10px; }
		.naviDroite { float: right; /*margin-right:60px;*/ }	
		.navi img{ border : 0px solid #ccc;	}	
	
/* -------------------------------------------------------- CONTENEUR COMPTE CLIENT */
	.boxCompte {
		width:175px;
		background:#e5e4df url(../images/compte.jpg) no-repeat;
		margin-top:5px;
		margin-bottom:20px;
		padding-bottom:10px;
		padding-right:5px;	
		border:1px solid #ccc;
	}
	.boxCompte h1 {
		text-align:center;
		font-size:12pt;
		font-weight:bold;
		color:#FF85BB;
		margin-bottom : 15px;
	}
	
	.boxCompte input {
		margin-left:5px;
		margin-bottom : 3px;
	}
	.boxCompte input.ok {
		padding-top : 5px;
	}
	.boxCompte span {
		display:block;
		font-size:10pt;
		text-align:right;
		margin-left:5px;
	}
	.boxCompte span a {
		display:block;
		font-size:10pt;
		margin-left:5px;
		
	}	
	
/* ---------------------------------------------- CONTENEUR promo centre et COCARDE ACCUEIL*/
	
	div.promo_centre {	
		margin-top : 0px;
		margin-bottom : 20px;
		border : 0px solid #FF83B7;	
		padding : 5px;
		text-align : justify;
	}
	
	
	div.cocarde_accueil {
		position : absolute;
		top:120px;
		left:270px;
		border : 0px solid #777;
		width : 120px;
		height : 120px;
		background: url(../images/badge_coeur.png) no-repeat;
	}
	
		
	
/* ---------------------------------------------- CONTENEUR COMMENTAIRE*/

	div.commentaire {	
		padding-top : 20px;
	}
	
	.commentaire legend {			
		font-size : 12pt;
		font-weight : bold;
	}	
	
	.commentaire fieldset {	
		padding : 5px;
		color : #FF83B7;
		width : 90%;
	}
	
/* ---------------------------------------------- CONTENEUR SELECTION*/

	div.selection {	
		padding-top : 20px;
	}
	
	.selection legend {			
		font-size : 12pt;
		font-weight : bold;
	}	
	
	.selection fieldset {	
		padding : 5px;
		color : #FF83B7;
		width : 90%;
	}
	
	.selection fieldset img {	
		float : left;
		padding-left : 10px;
		padding-right : 10px;
		padding-top : 10px;
		
	}

.selection p {			
		padding : 10px;
		
	}
	
.selection span {	
		float : right;
		margin-right : 10px;
		
	}

/* ---------------------------------------------- CONTENEUR PRESENTATION ARTICLE CATALOGUE*/

	div.boxArticle {		
		float: left; 
		width:270px;
		height: 270px;
		background: white url(../images/boxArticle2.jpg) no-repeat;
		margin:1px;
		border : 1px solid #ccc;
			
	}
	.boxArticle h1 {
		text-align:center;
		font-size:12pt;
		font-weight:bold;
		color:#FF85BB;
		margin-bottom : 5px;
	}
	
	.boxArticle span.img {
		float: left; 
		margin-left:15px;
		border : 0px solid #777;
		width : 130px;
		height : 130px;		
	}
	
	.boxArticle span.texte {
		float : left;
		margin-left:20px;
		margin-top : 10px;
		border : 0px solid #fff;
		width : 240px;
		height : 65px;
		font-size : 10pt;
		color : #666;
	}
	
	.boxArticle span.prix {
		float : right;
		Color : red;
		font-size:18px;
		font-weight : bold;		
		margin-right:15px;
		margin-top : 40px;
	}	

	.boxArticle span.loupe {
		float : left;
		margin-left : -15px;
		margin-top : 10px;
		border : 0px solid #777;
		width : 30px;
		height : 30px;
		background: url(../images/loupe.jpg) no-repeat;
	}	
	
	.boxArticle span.cocarde {
		display:block;
		font-size:10pt;
		text-align:right;
		margin-left:5px;
	}
	
	.boxArticle span.commander {
		float : left;
		margin-right : 10px;
		margin-top : 10px;
		border : 0px solid #777;
		width : 90px;
		height : 25px;
		background: url(../images/ajouter.gif) no-repeat;
		
	}
	
	.boxArticle span.info {
		float : left;
		margin-top : 10px;
		margin-right : 10px;
		margin-bottom : 20px;
		border : 0px solid #777;		
	}


	.boxArticle span.texte a {
		display:block;
		font-size:9pt;
		text-align:right;
		margin-right:15px;
	}	
	
	.boxArticle img {
	border : 0px solid black;}
	
	/* ---------------------------------------------- CONTENEUR PRESENTATION COMPLETE ARTICLE */
	div.boxArticle1 {
		float:left; 
		width:540px;
		background-color:#FFFFFF;
		margin:10px;
		border:0px solid blue;
	}
	.boxArticle1 h1 {
		text-align:left;
		padding:2px 0 2px 10px;
		font-size:17pt;
		font-weight:bold;
		color:#FF85BB;
		border:1px solid #ccc;
		width:100%;
	}	
	#articleImg {
		position:relative;
		float:left;		
		border:0px solid red;
		width:280px;
	}
		#articleImg img {  margin-left:10px; }
	#articleImgMini img { float:left;height:80px; border:1px solid #ccc; }
	
	#articlePte {
		position:relative;
		float:right;
		width:230px;
		border:0px solid blue;
	}
	
	#articlePrix, #articleInfo { margin-top:30px; }
	#imgPromo {
		position:absolute;
		top:200px; left:215px;
		background:url(../images/promo.gif) no-repeat;
		width:65px; height:65px;
		z-index:5;
	}
	.prix { color:red; font-weight:bold; font-size:14pt; }
	.cheminArticle { text-align:right; }
	.cheminArticle a { font-size:8pt; color:#888888; }		
	.technique label { width:65px; margin-left:0px; font-weight:bold; }
	.technique select { width:130px; }
	.technique input { margin-left:90px; }
	
	/* ---------------------------------------------- CONTENEUR le savez-vous? */
	div#savoir {		
		float:left; 
		width:530px;		
		background:url(../images/savoir.jpg) no-repeat;
		margin-bottom :20px;
		border-bottom: 2px dotted #C32BD8;
		padding-bottom : 15px;	
		margin-left : 10px;
	}
	#savoir h1 {	
		text-align:center;
		font-size:15pt;
		font-weight:bold;
		color:#FF85BB;
		margin-bottom:5px;
		top: 40px;
	}
	
	#savoir div.img2 {
		float:left; 
		margin-left:20px;
		margin-top : 95px;
		margin-right : 15px;
		border:0px solid #777;		
	}
	
	#savoir div.texte1 {			
		margin-top:90px;
		margin-right : 10px;
		border:0px solid #fff;					
		font-size:12pt;
		color:#666;
	}
	
	
/* ---------------------------------------------------- DIAPORAMA / COUP DE COEUR */	

	
	
	#container {
		position:relative;
		width:180px;height:280px;
		left:0;
		top:0px;
		border:0px solid black;
		overflow:hidden;
	}
	#content {
		position:absolute;
		width:180px;
		left:0;top:0px;
	}
	
	.boxListe h1 { 
		display : block;
		margin:5px; 	
		font-weight:bold;	
		font-size:14pt;		
		background : #FA4C4B;
		padding-top : 1px;
		padding-bottom : 5px;
		color : white;
		text-align:center;
	}
	
	#content h4 {
	color : #777;
	margin-bottom : 5px;
	margin-top : 5px;
	border-top : 0px dotted #FF81BA;
	}
	
	#content img {
	width : 170px;	
	margin: 5px;	
	}
	
	#content h5 {
	color : #FF81BA;
	margin : 10px;	
	}
		
/* ------------------------------------------------------------------- PANIER */	
	td, th { border:1px solid #666666; margin:0; }
	td.noBorder { border:0px solid #666666; }
	tbody td, tfoot td { padding:1px 4px; }
	tfoot td { text-align:right; }
	.titreCell { font-weight:bold; }
	.btnPanier { margin-left:230px; }
	
/* ----------------------------------------------------------------- PAGE ENTREE */
span#attention {			
		text-align:center;
		font-size:12pt;
		font-weight:bold;
		color:red;
	}
	p#avertissement {
		text-align:justify;
		margin:10px 100px;
		padding:10px;
		border: 1px solid #666;		
	}
	
	img.entrer {
	margin: 20px;
	border : 0px;}
	
	body#fond {
	background : url(../images/fond1.jpg);
	}
	
/* ----------------------------------------------------- FORMULAIRE / LIGNEBOX */	
	legend { margin:0 10px; }
	label { 
		float:left; 
		width:110px; 
		margin-top:5px; 
		margin-left:7px; 
	}
	input { font-family:"Courier New", Courier, mono; font-size:10pt; }
	input, select, textarea { margin-top:4px; }
	input.bouton { 
		font-family:Georgia, "Times New Roman", Times, serif; 
		font-size:10pt; 
		width:90px; 
		margin-left:15px; 
	}
	
	.noFloat {
		float:none;
		margin:0px 10px 0px 20px;
	}
	.ligneBox {
		width:95%;
		margin-bottom:15px;
		border:1px solid #999999;
		margin-left:10px;
	}
	.ligneBox h3 { margin-left:10px; }
	.ligneBox input, .ligneBox select, .ligneBox textarea { margin-left:15px; }
	label.ligneBox_lbl { 
		color:#444444; 
		font-size:0.9em; 
		font-weight:normal; 
		float:none; 
		margin-left:19px; 
	}
	
	.ligneBox_col_95 { float:left; width:95%; margin-bottom:8px; border:0px solid red; }
	.ligneBox_col_70 { float:left; width:70%; margin-bottom:8px; border:0px solid red; }
	.ligneBox_col_45 { float:left; width:45%; margin-bottom:8px; border:0px solid red; }
	.ligneBox_col_36 { float:left; width:36%; margin-bottom:8px; border:0px solid red; }
	.ligneBox_col_25 { float:left; width:25%; margin-bottom:8px; border:0px solid red; }
	
	.identifiant { text-align:right; }
	.attention { font-weight:bold; color:#dd0000; }


/* ----------------------------------------------------------------- CLASSE */
	.floatClear { clear:both; }


/* ----------------------------------------------------------------- TAGLINE */
	#tagLineZone { border:0px solid black; overflow:hidden; width:170px; }
		#tagLineZone p { text-align:justify; }