img{
border:0;
}

body{
font-family:arial;
background-image:url('../image/home.jpg');
}
	 
#global {
width:997px;
height:800px;
background-image:url('../image/photo_fond.jpg');
margin-right:auto;
margin-left:auto;
box-shadow: 0px 0px 20px #575656;
-webkit-box-shadow: 0px 0px 20px #575656;
-moz-box-shadow: 0px 0px 20px #575656;
}

#global_sac {
width:997px;
height:800px;
background-image:url('../image/fond_produit.png');
margin-right:auto;
margin-left:auto;
box-shadow: 0px 0px 20px #575656;
-webkit-box-shadow: 0px 0px 20px #575656;
-moz-box-shadow: 0px 0px 20px #575656;
}

#bandeau{
width:997px;
height:112px;
background-image:url('../image/bandeau_arthur.png');
margin-left:0px;
}

#bandeau_sac{
width:997px;
height:112px;
background-image:url('../image/bandeau_arthur2.png');
margin-left:0px;
}

#menu_bandeau{
width:337px;
height:64px;
position:relative;
font-size:80%;
top:35px;
float:left;
}

#menu a{
color:#31221d;
text-decoration:none;
}
/*-----------------------------*/

#retour{
width:580px;
height:112px;
position:relative;
float:left;
}

#gauche{
width:168px;
height:64px;
position:relative;
float:left;
top:5px;
}

#femme{
width:79px;
height:22px;
position:relative;
float:left;
}

#femme :hover{
background-color:#ffffff;
}

#femme a{
color:#31221d;
text-decoration:none;
}

#homme{
width:79px;
height:22px;
position:relative;
float:left;

}

#homme :hover{
background-color:#ffffff;
}

#homme a{
color:#31221d;
text-decoration:none;
}

#automne{
width:168px;
height:24px;
position:relative;
float:left;
}

#automne :hover{
background-color:#ffffff;
}

#automne a{
color:#31221d;
text-decoration:none;
}

#permanent{
width:168px;
height:24px;
position:relative;
float:left;
}

#permanent :hover{
background-color:#ffffff;
}

#permanent a{
color:#31221d;
text-decoration:none;
}

/*-----------------------------*/
#droite{
width:159px;
height:64px;
position:relative;
float:left;
left:20px;
top:0px;
}

#vente{
width:164px;
height:20px;

position:relative;
float:left;
}

#vente :hover{
background-color:#ffffff;
}

#vente a{
color:#31221d;
text-decoration:none;
}

#contact{
width:168px;
height:20px;

position:relative;
float:left;
}

#contact :hover{
background-color:#ffffff;
}

#contact a{
color:#31221d;
text-decoration:none;
}

#texte_goo{
text-indent: -5000px;
}
/*----------------------*/
#centre{
width:997px;
height:661px;

}

#nouvelle_collection{
width:471px;
height:436px;
position:relative;
left:500px;
top:23px;
}

/*----------------------*/
#pied{
width:997px;
height:36px;
}

#contenu_pied{
width:980px;
margin-left:auto;
margin-right:auto;
position:relative;
top:-12px;
}

#contenu_pied_sac{
width:980px;
margin-left:auto;
margin-right:auto;
position:relative;
top:-12px;
}
#contenu_pied_sac a{
text-decoration:none;
color:#31221d;
font-size:70%;
}

#contenu_pied a{
text-decoration:none;
color:#00376a;
font-size:70%;
}

#contenu_pied_mention{
width:980px;
margin-left:auto;
margin-right:auto;
position:relative;
top:-12px;
}

#contenu_pied_mention a{
text-decoration:none;
color:#31221d;
font-size:70%;
}

/*----------------------------------------*/
/*test deroul*/
body {behavior: url(csshover.htc);}
div#menu2 {width: 164px; position:relative; z-index:30;}

/* fond blanc pour le menu */ 
div#menu2 a {color:#31221d;  }
div#menu2 ul {padding: 0; width: 164px; margin:0px; }

/* fond different au survol de la souris pour les sous menu et les "basiques"*/ 
div#menu2 li:hover {background: #ffffff;}
div#menu2 li.sousmenu2:hover {background: #ffffff; }

/* Rajout d'une petite fleche pour les sous menu */ 
div#menu2 li.sousmenu2 {}

div#menu2 ul li {position:relative; list-style: none; height}
div#menu2 ul ul {position: absolute; top: 0px; left: 100px; display:none}

/* on rajoute une bordure a gauche et des padding, on doit donc r&eacute;ajuster la taille 100-(8 de bordure + 8 de padding) =84 */ 
div#menu2 li a {text-decoration: none; padding: 0px 0 4px 0; display:block; width:164px}
div#menu2 ul.niveau12 li.sousmenu2:hover ul.niveau22, 
div#menu2 ul.niveau22 li.sousmenu2:hover ul.niveau32 {display:block; background: #5a6c97;}

/* la bordure de chaque hauteur a une couleure de survol*/ 
div#menu2 li a:hover {border-left-color: #5a6c97;}
div#menu2 ul ul li a:hover {border-left-color: #5a6c97;}
div#menu2 ul ul ul li a:hover {border-left-color:#5a6c97;}
/*---------------------------------------------------*/
/*---------------------------------------------------*/
/*test deroul2*/
body {behavior: url(csshover.htc);}
div#menu3 {width:79px; position:relative; z-index:30;}

/* fond blanc pour le menu */ 
div#menu3 a {color:#2b2b2b;  }
div#menu3 ul {padding: 0; width: 79pxpx; margin:0px; }

/* fond different au survol de la souris pour les sous menu et les "basiques"*/ 
div#menu3 li:hover {background: #ffffff;}
div#menu3 li.sousmenu32:hover {background: #ffffff; }

/* Rajout d'une petite fleche pour les sous menu */ 
div#menu3 li.sousmenu32 {}

div#menu3 ul li {position:relative; list-style: none; height}
div#menu3 ul ul {position: absolute; top:20px; left: 0px; display:none}

/* on rajoute une bordure a gauche et des padding, on doit donc r&eacute;ajuster la taille 100-(8 de bordure + 8 de padding) =84 */ 
div#menu3 li a {text-decoration: none; padding: 0px 0 4px 0; display:block; width:79px}
div#menu3 ul.niveau312 li.sousmenu32:hover ul.niveau322, 
div#menu3 ul.niveau322 li.sousmenu32:hover ul.niveau332 {display:block; background: #a69490;}

.niveau322 li { width:164px;}
.eur{ width:164px;}
.asi li { width:164px;}

.europe{ width:164px;}
.asie li { width:164px;}

/* la bordure de chaque hauteur a une couleure de survol*/ 
div#menu3 li a:hover {border-left-color: #908F8E;}
div#menu3 ul ul li a:hover {border-left-color: #908F8E;}
div#menu3 ul ul ul li a:hover {border-left-color:#908F8E;}
/*---------------------------------------------------*/
/*----------------------SAC------------------------------*/
#ariane{
width:300px;
height:20px;
}

#liste_famille{
width:716px;
height:74px;
position:relative;
left:38px;
z-index:10;
overflow:hidden;
float:left;
}

#liste_famille img{
border:1px solid #ffffff;
}

#liste_famille img:hover{
border:1px solid #ffffff;
}

#sac{
width:719px;
height:533px;
position:relative;
float:left;
left:50px;
top:7px;
}

#plv{
width:348px;
height:527px;
position:relative;
float:left;
left:6px;
top:3px;
border:1px solid #ffffff;
}

#detail_sac{
width:348px;
height:527px;
position:relative;
float:left;
left:20px;
top:0px;
}

#image_sac{
width:342px;
height:342px;
position:relative;
top:3px;
left:4px;
border:1px solid #ffffff;
}

#sac_desc{
width:336px;
height:156px;
position:relative;
top:15px;
left:10px;
font-size:;
color:#9d9b99;
}

#liste_sac{
width:174px;
height:345px;
position:relative;
float:left;
top:7px;
left:55px;
}

#liste_sac img{
border:1px solid #dddbdb;
cursor:pointer;
margin-right:4px;
}

#prix{
font-size:80%;
}

#ref{
font-size:80%;
}

#taille{
font-size:80%;
}

#mat{
font-size:80%;
}

#coul{
font-size:80%;
}

#form{
font-size:80%;
}


/*maj*/


#envoi_amie{
width:170px;
height:170px;
position:relative;
top:30px;
left:55px;
float:left;
color:#ffffff;
text-align:center;
}


#global_contact {
width:997px;
height:800px;
background-image:url('../image/fond.jpg');
margin-right:auto;
margin-left:auto;
}

#contact_fond{
width:891px;
height:533px;
margin-left:auto;
margin-right:auto;
position:relative;
background-image:url('../image/fond_contact.png');
top:60px;
}

#mention_fond{
width:891px;
height:533px;
margin-left:auto;
margin-right:auto;
position:relative;
background-image:url('../image/mention.png');
top:60px;
}

#oeil_fond{
width:891px;
height:533px;
margin-left:auto;
margin-right:auto;
position:relative;
background-image:url('../image/fond_oeil.png');
top:60px;
}


#formu_contact{
width:528px;
height:348px;
position:relative;
top:0px;
left:0px;
}

#formulaire{
width:528px;
height:347px;
position:relative;
left:380px;
top:10px;
font-size:90%;
}

.erreur{
width:300px;
height:20px;
font-size:80%;
color:#ff0000;
position:relative;
left:380px;
top:-30px;
}

.envoyer{
width:69px;
height:25px;
position:relative;
left:330px;
}

#envoi_amie_contact{
width:170px;
height:170px;
position:relative;
top:-105px;
left:775px;
float:left;
color:#ffffff;
text-align:center;
}

#magasin{
width:384px;
height:533px;
position:relative;
left:30px;
top:20px;
color:#ffffff;
font-size:90%;
}
#texte_magasin {
width:270px;
height:264px;
position:relative;
left:20px;
top:-20px;
color:#fffffff;
font-family:arial;
font-size:80%;
overflow:hidden;
}

#bas{
width:20px;
height:13px;
position:relative;
background-image:url('../image/bas.png');
top:234px;
left:288px;
}
#haut{
width:20px;
height:10px;
position:relative;
background-image:url('../image/haut.png');
top:0px;
left:288px;
}

#mag_fond{
width:891px;
height:533px;
margin-left:auto;
margin-right:auto;
position:relative;
background-image:url('../image/fond_mag.png');
top:60px;
}

#envoi_amie_mag{
width:170px;
height:170px;
position:relative;
top:-100px;
left:775px;
float:left;
color:#ffffff;
text-align:center;
}

#contenu_pied_mag{
width:1140px;
position:relative;
left:-150px;
top:-12px;
}
#contenu_pied_mag a{
text-decoration:none;
color:#31221d;
font-size:70%;
}

#fleche_gauche{
width:15px;
height:29px;
background-image:url('../image/fleche G.png');
position:relative;
float:left;
left:25px;
top:20px;
}

#fleche_droite{
width:15px;
height:29px;
background-image:url('../image/fleche D.png');
position:relative;
float:left;
left:50px;
top:20px;
}

#oeil{
width:500px;
height:347px;
position:relative;
left:380px;
top:10px;
font-size:110%;
}

.phrase_contact{
width:320px;
color:#ffffff;
}
