/**
*	Style ADS Technologie
*	Didier Ciochetto - Technimédia
*/
	 

html
{
	background-color: #F8FFCC;
	font-family: Verdana, Arial, sans-serif;
	font-size: 9pt;
	min-width: 900px;
}


/* Pour IE<7. */
body
{
	position: relative;
	margin: 0;
}
.pourIe
{
	margin: 250px 200px 1em 160px;
	padding: 1%;
}

/* Pour les navigateurs. */
html>body
{
	margin: 250px 200px 1em 160px;
	padding: 1%;
	position: static;
}



/*+ Les balises générales. +*/

p
{
	text-align: justify;
	margin: 1ex;
}

a img
{
	border: 0;
	text-decoration: none;
	position: relative;
	top: 3px;
}

hr
{
	visibility: hidden;
	clear: both;
}


/*+ Les titres. +*/
h1
{
	color: white;
	font-size: 1.3em;
	clear: both;
	padding: 27px 0 5px 45px;
	background-repeat: no-repeat;
	background-position: left;
	background-image: url('images-site/h1.png');
	height:34px;
}

h2
{
	font-size: 1.2em;
	padding-left: 1ex;
}
h3, h4
{
	font-size: 1.1em;
	padding-left: 1ex;
}


/*+ Les liens +*/
a, .styleLien
{
	color: #360;
}

a:hover, .styleLien:hover
{
	color: #682;
	text-decoration: none;
	/* background: none; après on doit réécrire tous les fonds des liens... :-/ */
	/* Correction bug IE. Merci Alsacreations. */
}


/* Equilibrage des navigateurs. */
form
{
	margin: 0;
}

small
{
	font-size: 8pt;
}


/* Quand on passe en application/xml l'alignement par défaut n'est pas le m^. */
td
{
	vertical-align: middle;
}


/* Sur la page accessibilité. */
kbd 
{
	padding: 0px 1px;
	border-width: 1px 2px 2px 1px;
	border-style: outset;
	background: #faf6f6;
}

pre
{
	font-family: Verdana, Arial, sans-serif;
	margin-left: 3ex;
}




/************************************************************************************************
 * +++++++++++++++++++ Les positions absolues, présentation générales. ++++++++++++++++++++++++ *
 ************************************************************************************************/

.logo
{
	position: absolute;
	top: 5px;
	left: 0;
	width: 100%;
	text-align: center;
	z-index: 2;
}


.bandeau
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 159px;
	background: url('images-site/bandeau.png') no-repeat top center;
}


.barreOnglets
{
	position: absolute;
	top: 160px;
	left: 0;
	width: 100%;
	text-align: center;
	background: url('images-site/barre-onglets.png') repeat;
	height: 64px;
}

table.onglets
{
	text-align: center;
	margin: 0 auto;
	z-index: 3;
	white-space: nowrap;
}

.onglet, .ongletActif
{
	font-weight: bold;
	font-size: 8pt;
	padding: 10px 0 42px;
}
.onglet a, .ongletActif a
{
	padding: 10px 8px 50px;
}

.onglet a
{
	color: white;
	text-decoration: none;
}
.ongletActif a
{
	color: #ff0;
	text-decoration: none;
}


.onglets .Scooters
{
	background: url('../images/rayons/onglet-scooters-electriques.png') no-repeat;
}
.onglets .Vélos
{
	background: url('../images/rayons/onglet-velos-electriques.png') no-repeat;
}
.onglets .Kits
{
	background: url('../images/rayons/onglet-kits-velos-electriques.png') no-repeat;
}
.onglets .Batteries
{
	background: url('../images/rayons/onglet-batteries-chargeurs.png') no-repeat;
}
.onglets .Vélos
{
	background: url('../images/rayons/onglet-velos-electriques.png') no-repeat;
}
.onglets .Accessoires
{
	background: url('../images/rayons/onglet-accessoires.png') no-repeat;
}

.onglets .Déstockage
{
	display: none;
}


.onglet a:hover, td.o a:hover
{
	color: #ed4;
}

.ongletActif a:hover, .sousOnglets a:hover
{
	/* Correction bug IE. */
	background-color: transparent;
	color: #ed4;
}

.sousOnglets, .vide
{
	display: none;
}


/*+cccccccccccccccccccccccccccc Les colonnes gauche / droite. cccccccccccccccccccccccccccccc+*/

.cadres p
{
	font-size: 9pt;
	padding: 5px;
	border: 1px solid silver;
	border-top: none;
	background-color: white;
}


.cadres h4
{
	font-size: 10pt;
	background: url('images-site/fond-cadre.png') no-repeat top left;
	height: 22px;
	padding: 7px 20px 0 10px;
	margin-left: 6px;
	margin-top: 10px;
}
.cadres h4, .cadres h4 a
{
	text-decoration: none;
	color: white;
}
.cadres h4 a:hover, .cadres h3 a:hover
{
	color: #fe6;
}


/*------------ La colonne de gauche. ++++++++++ */
.engagements
{
	position: absolute;
	top: 225px;
	left: 0;
	width: 160px;
	background: #F8FFCC url('images-site/fond-gauche.png') no-repeat top center;
	padding-top: 4em;
	height: 1200px;
}


/* Le téléphone qui n'a pas la m^ image de fond. */ 
h3.téléphone
{
	margin-left: 10px;
	margin-top: 1em;
	padding-right: 15px;
	padding-top: 10px;
	text-align: right;
	height: 53px;
	background: url('images-site/cadre-tel.png') no-repeat top left;
	color: white;
}
h3.téléphone a
{
	color: white;
}

/* Les rayons affichés dans la colonne. */
ul.rayonsPrincipaux
{
	list-style-type: none;
	text-align: right;
	padding: 40px 13px 50px 5px;
	margin-left: 10px;
	line-height: 20px;
	font-size: 8pt;
	background: url('images-site/rayons-principaux.png') no-repeat left 9px;
}
ul.rayonsPrincipaux li
{
	border-bottom: 1px solid white;
}
ul.rayonsPrincipaux a
{
	color: white;
	text-decoration: none;
}
ul.rayonsPrincipaux a:hover
{
	color: #ed4;
}


/*--------------- La colonne de droite. +++++++++++++ */
.dynamiques
{
	position: absolute;
	top: 225px;
	right: 0;
	width: 200px;
	padding-bottom: 3em;
	background: #F8FFCC url('images-site/fond-droit.png') no-repeat top center;
	padding-top: 4em;
	height: 1100px;
}

.dynamiques p
{
	position: relative;
	/* Correction bug IE. */
	font-size: 9pt;
	margin: -18px 18px 0 7px;
	text-align: left;
}


/* Les produits en évidence sur le coté. */
.dynamiques .miniature
{
	float: left;
	margin-right: 3px;
	margin-bottom: 5px;
}

.dynamiques input
{
	font-size: 0.8em;
}
/* Pas possible de ne faire que les input[type="text"] dans IE. */


.dynamiques small
{
	display: block;
	text-align: center;
	clear: both;
}

.dynamiques button
{
	border: none;
	background-color: transparent;
	padding: 0;
	margin: 0;
	width: 40px;
	margin-bottom: -3px;
}


/*-!-!-!-!-!- Les cadres particuliers. +!+!+!+!+!+!+*/

h4.panier
{
	background: url('images-site/panier.png') no-repeat top left;
	text-align: right;
	padding-top: 5px;
	padding-bottom: 40px;
}
h4.panier small
{
	text-align: right;
	margin-top: -3px;
}

.inscriptionLettre #lettre_info, #cadre_recherche_rayon
{
	width: 105px;
}


/*- fin cccccccccccccccccccccccc -*/



p.recherche
{
	position: absolute;
	top: 138px;
	left: 0;
	width: 100%;
	text-align: center;
	margin: 0;
	z-index: 2;
}
p.recherche a
{
	color: white;
}
p.recherche button
{
	background: white;
	cursor: pointer;
	border: none;
	background-color: transparent;
	width: 40px;
	margin-bottom: -3px;
	/* Chipotons... */
}
p.recherche input#texte_recherche
{
	font-size: 0.8em;
	width: 150px;
}

p.heure
{
	display: none;
}


/*+++ bas de page +++*/
.piedDePage
{
	position: absolute;
	left: 0;
	margin: 1em 0 0;
	text-align: center;
	padding: 20px 0 10px;
	width: 100%;
	color: white;
	background: #360 url('images-site/pied-de-page.png') repeat-x top;
}

.piedDePage a
{
	color: white;
	text-decoration: none;
}


/* Le contenu entier pour placer le pied de page. */
div.c
{
	/*height: 1270px;*/
	_height:1270px;
}
div[class="c"]
{
	/*height:1280px;*/
	min-height:1280px;
	_height:1280px;
}





/************************************************************************************************
 *+++++++++++++++++++++++++++++++++ Petites classes diverses. ++++++++++++++++++++++++++++++++++*
 ************************************************************************************************/


.cache
{
	display: none;
}

.adroite
{
	text-align: right;
}

.petitFlottant, .flotte
{
	float: right;
}

.centre
{
	text-align: center;
	clear: both;
}



/* Les liens qui ressemblent à des boutons. */
a.lienBouton
{
	color: white;
	font-weight: bold;
	background-color: #682;
	padding: 13px 6ex 7px 2ex;
	text-decoration: none;
	background: url('images-site/bouton.png') no-repeat right;
	white-space: nowrap;
	/* Pour Safari. */
}
a.lienBouton:hover
{
	color: white;
	background-color: transparent;
	/* Réparation du background:none correction bug IE. */
}



/* Les boutons qui ressemblent à des liens. */
.styleLien
{
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	text-decoration: underline;
	margin-right: 0;
}


/* Les boutons avec une image. */
button.b, .boutonPanierProduit
{
	background: transparent url('images-site/bouton.png') no-repeat right;
	color: white;
	font-weight: bold;
	font-size: 1.1em;
	height: 35px;
	padding: 12px 40px 7px 5px;
	border: none;
	cursor: pointer;
}

/* Les liens de retour sur les pages qui necessitent. */
.retour
{
	padding: 5px 0 6px 40px;
	background: url('images-site/retour.png') no-repeat left;
	float: right;
	margin-top: -1em;
}


/*++++++++++++++++++ Les formulaires ++++++++++++++++++++*/

.formulaire
{
	border: 1px solid silver;
	width: 80%;
	margin: auto;
	background-color: white;
}
.formulaire table
{
	width: 100%;
}

.fondForm
{
	background-color: white;
}

/* Les formulaires dans des tableaux. */
table.tableForm
{
	margin: auto;
}

.tableForm td
{
	text-align: right;
	padding: 5px;
}

.tableForm td.i, .variable td.d
{
	text-align: left;
}
.tableForm td.i textarea
{
	width: 100%;
}

/* Les images ? dans les formulaires. */
td.i img
{
	margin-bottom: -1px;
}
td.i #courriel, td.i #ami
{
	width: 80%;
}

/* Les trucs importants. <sup> ce sont les * des champs obligatoires. */
.important, sup
{
	color: red;
}

.valide
{
	color: green;
}


/* D'autres tableaux. */
table.variable
{
	margin: auto;
	width: 100%;
	text-align: center;
}



#bulle, #bulle1
{
	/* Ressemblant à une bulle d'aide. */
	position: absolute;
	color: white;
	font-size: small;
	font-style: normal;
	width: 30ex;
	padding: 3px;
	border: 1px outset gray;
	z-index: 5;
}

.bulle, #bulle, #bulle1
{
	background-color: #b00;
	/* On peut pas mettre la couleur InfoBackground car Safari met du noir. */
}



/************************************************************************************************
 *+AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA Accueil AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA+*
 ************************************************************************************************/

.blanc
{
	margin-top: -13px;
	border: 1px solid silver;
	border-top:none;
	background-color: white;
}

.blanc, p.actualités, p.conseils
{
	padding: 1%;
}

/* Les actus en bas de l'accueil. */
p.actualités
{
	margin-top: 2em;
	height: 190px;
	background: #FCFFE2 url('../images/suppl/picto-actu.png') no-repeat 95% 70%;
	border: 1px solid #360;
}
p.actualités img
{
	display: block;
	margin: auto;
}
p.actualités a, .conseils a
{
	font-weight: bold;
}
p.actualités small, .conseils small
{
	color: #666;
}

/* Les conseils d'achat, presque pareil. */
p.conseils
{
	margin-top: 1em;
	border: 1px solid #ed4;
	background: url('images-site/fond1.png') repeat-x;
}
p.conseils img
{
	display: block;
	margin: auto;
}

td.o, td.o a
{
	color: white;
}


/************************************************************************************************
 *+RARARARARARARARARARARARARARARARARARA Recherche et Accueil RARARARARARARARARARARARARARARARARA+*
 ************************************************************************************************/

/* Les rayons écrit sur l'accueil et recherche. */
.catAccueil
{
	/* Y'a plus. */
}




/************************************************************************************************
 *ARARARARARARARARARARARARARARARARARARARARA Accueil et Rayon ARARARARARARARARARARARARARARARARAR+*
 ************************************************************************************************/

/* Les produits sur l'accueil et tête de rayons. */
.promosAccueil
{
	margin-top: 2em;
	margin-bottom: -2em;
}
.promosAccueil table
{
	width: 100%;
	margin: 0 auto 2em;
	border: 1px outset gray;
}
.promosAccueil table th
{
	display: none;
}

.promosAccueil table td
{
	background-color: white;
	width: 25%;
	vertical-align: top;
	text-align: center;
	font-weight: bold;
	padding: 10px;
	border: 1px solid silver;
	border-collapse: collapse;
}

.promosAccueil table td:hover
{
	background-color: #ffe;
}

.promosAccueil img
{
	display: block;
	margin: 0 auto 7px;
}

.promosAccueil table td .prix
{
	display: block;
	margin-top: 7px;
}
.promosAccueil table td span.prix small
{
	font-size: 1.2em;
}


/************************************************************************************************
 *+RRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRR Rayon RRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRR+*
 ************************************************************************************************/


.texteRayon
{
	background-color: white;
	margin-top: -12px;
	border: 1px solid silver;
	border-top: none;
	padding: 1ex;
}
img.r
{
	float: right;
}


.sousRayons
{
	/* Yen a pas... */
}
.sousRayons h2
{
}
.sousRayons h2 img
{
}

p.hr
{
	clear: both;
}


/* Le tri sur les rayons. */
.tri
{
	text-align: right;
	font-size: 1em;
	margin-bottom: 1em;
	color: #682;
}

.tri select, .tri input
{
	font-size: 1em;
}


/* Entêtes des tableaux, par ex page facture, rayons. */
th
{
	border: 1px solid silver;
	border-collapse: separate;
	height: 2em;
	background-color: white;
}

/* La liste des produits du rayons, ou les produits associés. */
.produits
{
	width: 100%;
}

.produits tr td
{
	border-bottom: 1px solid #ed4;
	height: 92px;
}

.produits td.prix, .produits td.dispo, .produits td.marque
{
	text-align: center;
}
.produits td.prix small
{

}

/* Les promotions dans les rayons ont la classe produit et la classe promotion. */
.promotion
{
	background-color: #f0F8B0;
}


.produits h4
{
	/* Pour équilibrer les navigateurs. */
	padding: 0;
	margin: 0;
	/* Pour mettre le texte au milieu de l'image. */
	padding-top: 30px;
}
/* L'image est en float pour éviter le soulignement du lien. */
.produits h4 a img
{
	border: 1px solid #682;
	float: left;
	margin-top: -37px;
	margin-right: 10px;
}


/* Les séparations entre 2 marques différentes. */
tr.sep th, table.ventesNouv th
{
	height: 1.5em;
	background-color: #682;
	color: white;
	border: none;
	-moz-border-radius: 1%;
}


/*
.produits tr:hover
{
	background-color: #F6F598;
}
tr.sep:hover
{
	background-color: inherit;
}
*/


/* Les liens page préc, suivante. */
a.préc, a.préc:hover
{
	padding: 6px 10px 6px 24px;
	background: url('images-site/f-precedent.png') no-repeat left;
}
a.suiv, a.suiv:hover
{
	padding: 6px 24px 6px 10px;
	background: url('images-site/f-suivant.png') no-repeat right;
}


.boutonPanierRayon
{
	background: transparent;
	cursor: pointer;
	border: none;
}


.légende span
{
	white-space: nowrap;
	display: block;
	float: left;
	width: 25ex;
	padding-left: 8ex;
	height: 2em;
}


/* Normalement on ne les voit jamais parce qu'il n'y a pas de rayons sans produits. */
table.ventesNouv
{
	margin-top: 5em;
}
table.ventesNouv td
{
	width: 50%;
	border: 1px solid silver;
	background-color: white;
}

.imageRayon
{
	display: none;
}



/************************************************************************************************
 *+RPRPRPRPRPRPRPRPRPRPRPRPRPRPRPRPRPRPRP Rayon et Produit RPRPRPRPRPRPRPRPRPRPRPRPRPRPRPRPRPRP+*
 ************************************************************************************************/

h2.arborescence
{
	font-size: 8pt;
	font-weight: normal;
	margin: 0;
	padding: 0;
}

.prix
{
	color: #b00;
	font-weight: bold;
	clear: left;
	margin-left: 1ex;
}

.detail .prix
{
	background: url('images-site/prix.png') no-repeat;
	width: 118px;
	height: 39px;
	color: white;
	text-align: center;
	padding-top: 10px;
	margin-left: 50%;
}
.detail .prixht
{
	color: silver;
}
.detail .prixht, .produits .prixht
{
	font-size: 10pt;
	font-weight: normal;
}

/* Quand il y a une promo. */
.barré
{
	color: gray;
	text-decoration: line-through;
}




/************************************************************************************************
 *+PPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPP Produit PPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPP+*
 ************************************************************************************************/

div.detail
{
	position: relative;
	/* Correction bug IE encore. */
	padding: 1ex;
	margin-top: -11px;
	border: 1px solid silver;
	border-top: none;
	background-color: white;
}


.référence small
{
	font-size: 8pt;
	color: #8c0;
}

p.chapo
{
	background-color: #eee;
	float: left; 
	position: relative;
	/* Bug IE... */
	width: 50%;
	padding: 2ex;
	-moz-border-radius: 2%;
	border-radius: 2%;
}

.descriptionProduit, .avisProduit
{
	clear: both;
	padding: 10px;
	border: 1px solid silver;
}


/* L'image. */
.imageProduit
{
	
	background: url('images-site/grand-cadre-produit.png') no-repeat;
	cursor: pointer;
	width: 145px;
	height: 134px;
}

.imageProduit img
{
	padding: 4px;
	width: 137px;
	height: 126px;
}
.imageProduit span.fermer
{
	display: none;
}

/* L'image après qu'on ai zoomé. */
.imageZoom
{
	position: absolute;
	left: 0;
	top: 0;
	/* Dans le coin de la fiche produit puisqu'on doit la mettre en relative. */
	cursor: pointer;
	border: 3px outset #682;
	background-color: #682;
	padding: 5px;
	z-index: 4;
	text-align: center;
}
.imageZoom span.zoom
{
	display: none;
}
.imageZoom span.fermer
{
	display: block;
	color: white;
}

/* Le texte "zoom" sur les images des produits. */
.imageProduit span
{
	display: none;
}
.imageProduit:hover span
{
	visibility: visible;
}

.textePromo
{
	color: Highlight;
}


/* La marque, le prix, ajouter au panier... */
.infosProduit
{
	text-align: right;
}
.infosProduit img
{
	margin-bottom: -5px;
	margin-top: 2em;
}
.infosProduit p.prix
{

}

p.dispo img
{
	margin-bottom: -3px;
}

/* Dans les rayons, et les autres produits présentés dans la fiche d'un produit. */
.miniature
{
	width: 80px;
	height: 70px;
	padding-bottom: 10px;
	text-decoration: none;
}


.liensProduit
{
	/* Différent ici. */
}


/* Sur la page des images du produit. */
.imagesProduit img
{
	border: 3px outset #682;
	background-color: #682;
	padding: 5px;
}


/************************************************************************************************
 *+PPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPP Panier PPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPP+*
 ************************************************************************************************/

.produitsPanier th, .produitsCompte th
{
	background-color: white
	color: black;
}
.produitsPanier tr
{
	background-color: #F0F8B0;
}
td.total
{
	background-color: #F0F8B0;
}
td.total strong
{
	font-size: 1.3em;
}

/* Les libéllés (réduc, total). */
.produitsPanier .l
{
	color: black;
	text-align: right;
	background-color: #EAF399;
	padding: 1em;
}
.produitsPanier .total
{
	text-align: right;
	padding-left: 1ex;
}

.produitsPanier td.montant
{
	text-align: right;
	font-size: 1.2em;
}

td.blanc
{
	background-color: #F8FFCC;
	border: none;
}

td.b
{
	background-color: #F8FFCC;
	text-align: right;
	padding-top: 10px;
	padding-bottom: 10px;
	vertical-align: top;
}

.quantitePanier
{
	font-size: 0.9em;
	color: gray;
}

a.lienPanier
{
	font-size: 1.1em;
	font-weight: bold;
	color: #682;
	text-decoration: none;
}

a.retourPanier
{
	background: url('images-site/bouton-retour.png') no-repeat left;
	padding: 13px 5px 7px 40px;
}



/************************************************************************************************
 *+CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC Contact CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC+*
 ************************************************************************************************/

h2.entr, h2.part
{
	display: inline;
	position: relative;
	top: -2px;
	left: 10%;
	padding: 4px 2%;
	-moz-border-radius-topleft: 1ex;
	-moz-border-radius-topright: 1ex;
	cursor: pointer;
	border: 1px solid silver;
	border-bottom: none;
}
.part
{
	background-color: #eee;
}
.entr
{
	background: #ccc;
}

#formContact
{
	padding-top: 1.5em;
	padding-bottom: 1.5em;
	border: 1px solid silver;
	margin: auto 10%;
}


/************************************************************************************************
 *+RRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRR Recherche RRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRR+*
 *              et aussi les pages toutes les marques, promos, nouveautés, zoom-sur.            *
 ************************************************************************************************/


/* L'arborescence du résultat. */
.arboRech, .refPanier
{
	display: block;
	margin-top: 5px;
	font-size: 8pt;
	padding-left: 55px;
	color: gray;
}
.arboRech a, .arboRecherche a
{
	color: gray;
	text-decoration: none;
}
.arboRecherche
{
	font-size: 8pt;
	color: gray;
}

.miniMiniature
{
	width: 3em;
	height: 3em;
	text-decoration: none;
	background-color: inherit;
	float: left;
	margin: -0.3em 0.5em 0 0;
}

a:hover .miniMiniature
{
	width: 3.5em;
	height: 3.5em;
	margin: -0.75em 0.25em -0.25em -0.25em;
}

.resultat
{
	padding: 0.6em;
	border: 1px solid silver;
}
.fond1
{
	/* background-color: #f6ffb9; */
	background: url('images-site/fond1.png') repeat-x;
	
}
.fond2
{
	/* background-color: #fbffe1; */
	background: url('images-site/fond1.png') repeat-x;
}





/************************************************************************************************
 *+PlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPl Plan PlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPlPl+*
 ************************************************************************************************/
.planSite
{
	list-style-type: square;
}




/************************************************************************************************
 *+IIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIII Identification IIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIII+*
 ************************************************************************************************/

.zoneIdentif
{
    margin: auto;
	padding: 2em;
	background: white url('images-site/fond.jpeg') no-repeat top right;
	border: 2px solid #682;
	width: 80%;
}

.zoneIdentif #id, .zoneIdentif #mdp
{
	width: 99%;
}


.zoneIdentif h3, .zoneNouveauClient h3
{
	text-transform: uppercase;
	font-size: 1.1em;
	padding: 0;
	margin: 0;
}

.zoneNouveauClient
{
    margin: 2em auto;
	padding: 2em;
	background-color: white;
	border: 2px solid #8c0;
	width: 80%;
}




/************************************************************************************************
 *+IIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIII Livraison IIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIII+*
 ************************************************************************************************/

.zoneLivraison, .zonePaiement
{
    margin: auto;
	padding: 2em;
	background: white url('images-site/fond.jpeg') no-repeat top right;
	border: 2px solid #682;
	width: 80%;
}



/************************************************************************************************
 *+CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC Compte CCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCCC+*
 ************************************************************************************************/

.zoneCoord, .zoneMenu
{
    margin: 1em;
	padding: 1em;
	background: white url('images-site/fond.jpeg') no-repeat top right;
	border: 1px solid silver;
}
.zoneMenu
{
	border: 2px solid #682;
}


/* Le contenu des commandes dans compte.php. */
.contenu
{
	display: block;
	padding: 1em 2em;
	font-style: normal;	
	/* Parce qu'on est dans un <var> donc sinon italique. */
}

.produitsCompte th small
{
	font-weight: normal;
}

.alivraison
{
	width: 50%;
	margin: 1em auto;
	border: 2px solid #682;
	padding: 1em;
	background-color: white;
}
.alivraison hr
{
	margin-left: 0;
	visibility: visible;
	border: none;
	border-bottom: 1px solid silver;
}
.alivraison a
{
	float: right;
	margin-top: 0.7em;
	text-decoration: none;
}
/* C'estoù?
.adresse
{
	border: 1px dashed #49d;
	padding: 1ex;
	width: 30ex;
}
*/


/************************************************************************************************
 *+FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF Facture FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF+*
 ************************************************************************************************/


table#facture
{
	width: 90%;
	border-collapse: collapse;
}




/************************************************************************************************
 *+HHHHHHHHHHHHHHHHHHHHHHHHHHHHHHH Les H1 avec un picto HHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHH+*
 ************************************************************************************************/
h1.h1
{
	/* Tous les h1 ont la m^ image. */
}


/* Les H2 avec picto. */
h2.adresse
{
	margin-top: 4em;
	background: url('images-site/picto-enveloppe.png') no-repeat left;
	padding: 15px 0 9px 70px;
}

h2.tel
{
	background: url('images-site/picto-pacman.png') no-repeat left;
	padding: 20px 0 9px 70px;
}

/*- fin HHH -*/


input, select, textarea
{
	background-color: #ffe;
}
input:focus, select:focus, p.recherche input#texte_recherche:focus, textarea:focus
{
	background-color: #ffa;
}


/* Classes supplémentaires pour la déco. */
.supplementaire1
{
}
.supplementaire2
{
}
.supplementaire3
{
}



@media print
{
	.pasImpr
	{
		display: none;
	}

}