/*
  chocolat : #462f06
  chocoat clair: #603b05
  bleu clair: #a8e3fa
  
  bleu pâle: #ccd8e9
  cyan: #00adef
  
*/

/* Correction des bug Internet Explorer
-------------------------------------------------------- */
body {behavior: url("csshover.htc");}


html
{
	margin: 0;
	padding: 0;
}

body
{
	margin: 0;
	padding: 0;
	background-color: #ccd8e9;
	background-image: url('img/BandeVerticaleTissuCourt.png');
	background-repeat: repeat-x;
	color: #462f06;
	font-family: "Bitstream Vera Sans", "Lucida Sans Unicode", "Franklin Gothic Book", Tahoma, sans-serif;
}



a
{
	text-decoration: none;
}

a img
{
	border: none;
}

#entete
{
	text-align: center;	
	height: 190px;
}

#entete h1
{
	margin: 0;
}

#entete p
{
	margin: 0;
	color: #fff;
}

#global
{
	
}

#col1
{
	float: left;
	width: 10em;
}

#col2
{
	float: right;
	width: 10em;
}

#colContenu
{
	margin-left: 11em;
	margin-right: 11em;
	min-height: 27em;
}

#colContenu h2
{
	background-image: url('img/Fil1.png');
	background-position: left bottom;
	background-repeat: no-repeat;
	padding-bottom: 10px;
	padding-left: 1em;
	font-weight: normal;
	font-size: 1.75em;
}

#pied
{
	clear: both;
	font-size: 0.7em;
	text-align: center;
	background-color: #462f06;
	color: #00adef;
}

#pied a
{
	color: #00adef;
	font-weight: bold;
	text-decoration: none;
}

#pied a:hover
{
	text-decoration: underline;
}


.blocNouveaute,
.blocPromo,
.blocMozaique
{
	/* display: none; */
	/* visibility: hidden;*/
}


/* Bloc Mozaïque (utilisé en page d'accueil et en page produit)
-------------------------------------------------------- */

.blocMozaique {
	float: left;
	width: 100%;
	border: 1px #462f06 solid;
	background-color: #ccd8e9;
	color: #462f06;
}

.blocMozaique h3 {
	background-color: #462f06;
	color: #fff;
	margin: 0;
	padding: 0.5em 0 0.5em 0;
	font-weight: normal;
}

.blocMozaique p {
	margin: 0;
	padding: 0;
}

.blocMozaique p a img {
	border: 2px #ccd8e9 solid;
	margin: 0;
	padding: 0;
}

.blocMozaique p a img:hover {
	border: 2px #fff solid;
}


#col1 h2,
#col2 h2
{
	color: #462f06;
	font-size: 0.7em;
	font-weight: normal;
	border-bottom: 1px #462f06 solid; 
	padding-left: 1em;
	text-align: left;
}


#chemin
{
	color: #603b05;	
	font-size: 0.8em;
}

#chemin a
{
	color: #462f06;
	text-decoration: underline;
}

#chemin a:hover
{
	color: #603b05;
	text-decoration: none;
}


.petitBlocProduit 
{
	float: left;
	padding-left: 2%;
	padding-right: 2%;
	width: 46%;
	height:320px;
	overflow:hidden;
	background-image: url('img/RefletHautGaucheBlanc.png');
	background-repeat: no-repeat;
	background-position: left top;
}

.petitBlocProduit h3
{
	font-size: 1em;
	
}

.petitBlocProduit h3 a
{
	color: #462f06;
}

.petitBlocProduit .contenu .image
{
	/*float: left;*/
	margin-right: 0.7em;
}

.petitBlocProduit .contenu .description
{
	margin-right: 0.7em;
}

a .acheter
{
	float: left;
	display: block;
}


.acheter img
{
	vertical-align: middle;
}

.prixProduit
{
	font-size: 1.5em;
	font-weight: bold;
}

.blocProduit .blocDImages
{
	float: left;
	margin-right: 0.5em;
}

.description
{
	margin-top: 1em;
	margin-left: 0.5em;
	
}

#pages
{
	clear: left;
	margin:0;
	width:100%;
} 


#etapesDeCommande
{

}

.plusmoins img
{
	vertical-align: middle;
}

.declinaison_panier,
.reference_panier
{
	font-size: 0.8em;
}

.declinaison_panier:before
{
	content: "(";
}

.declinaison_panier:after
{
	content: ")";
}

.colonne_insecable
{
	white-space: nowrap;
}

#panier,
{
	border-width: 0 1px 1px 0;
	border-style: solid;
}

#panier tbody tr th
{
	border: none;
}

#panier tbody tr,
#panier tbody tr td
{
	border-width: 1px 0 0 1px;
	border-style: solid;
}

#panier tr th
{
	background-color: #462f06;
	color: #fff;
}

#panier tr:hover td
{
	background-color: #ccd8e9;
	color: #462f06;
}

#panier tr td
{
	background-color: #fff;
	color: #603b05;
}

.queFaire,
.queFaire p
{
	text-align: center;
}

label
{
	min-width: 20em;
}

#nouveau table tr:hover td,
#connexion table tr:hover td
#contact table tr:hover td
{
	background-color: #fff;
	color: #603b05;
}

textarea
{
	width: 100%;
}

.obligatoire
{
	border-style: none;
	color: #f00;
	font-weight: bold;
}

/* Menu déroulant */
/*----------------*/
.menu {width: 100%;
	font-size: 0.75em;
}

/* fond blanc pour le menu */ 
.menu a {color: #603b05}
.menu ul {padding: 0; width: 13em; border:1px solid; margin:0px; background: white}

/* fond different au survol de la souris pour les sous menu et les "basiques"*/ 
.menu li:hover {background-color: #B5EAFF}
.menu li.sousmenu:hover {background-color: #77D8FF;}

/* Rajout d'une petite fleche pour les sous menu */ 
.menu li.sousmenu 
{
	background-image: url("img/TriangleDroite.png");
	background-position: 95% 50%;
	background-repeat: no-repeat;
}

.menu ul li {position:relative; list-style: none; border-bottom:1px solid;}
.menu ul ul {position: absolute; top: -1px; left: 13em; display:none}

/* on rajoute une bordure a gauche et des padding, on doit donc réajuster la taille 100-(8 de bordure + 8 de padding) =84 */ 
.menu li a {text-decoration: none; padding: 0.25em 0 0.25em 0.5em; display:block; /*border-left: 3px solid #603b05;*/ width:12.5em}
.menu ul.niveau1 li.sousmenu:hover ul.niveau2, 
.menu ul.niveau2 li.sousmenu:hover ul.niveau3 {display:block;}

/* la bordure de chaque hauteur a une couleure de survol*/ 
.menu li a:hover {border-left-color: #00adef;}
.menu ul ul li a:hover {border-left-color: #00adef;}
.menu ul ul ul li a:hover {border-left-color: #00adef;}


#moteurDeRecherche fieldset
{
	background-color:#fff;
	border:1px solid #603b05;
	margin:0;
	padding:0;
}

#moteurDeRecherche input 
{
	/*display: inline;*/
	border-style: none;
	background-color:#fff;
	color: #603b05;
}

#motcle
{
	float: left;
	width: 80%;
}

#rechercher
{
	float: right;
}

.epuise
{	
	font-weight: bold;
	min-width: 90px;
}

.choix_possible
{
	color: red;
	font-weight: bold;
	font-size: 0.75em;
}

#contenu.document h3 {
	margin-top: 1em;
	margin-bottom: 0;
}

#contenu.document p {
	text-align: justify;
	margin-top: 0.5em;
	margin-bottom: 0;
}

#contenu.document .piecesjointes {
	font-size: 0.8em;
	margin-bottom: 1em;
}

/* Correction des bug Internet Explorer
-------------------------------------------------------- */

* html button {width:1%; overflow:visible;} 
*:first-child+html button {overflow:visible;}



