body{ text-align:center; margin:0px; background:#f6f6f6 url(images/bg.jpg) top center no-repeat; font-size:0.7em; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#5f6060; }

div.myhr{ clear:both; visibility:hidden; height:0px; overflow:hidden; }
img{ border:none; }


/*############################################## OVERALL #####################################################*/
div#container, div#wrap{ width:980px; margin:0 auto 0 auto; text-align:left; position:relative; }
div#wrap{ height:142px; }

div#header{ margin-bottom:12px; }
div#menu-secondaire{ float:right; background:url(images/menu-secondaire.png) top left no-repeat; width:112px; font-size:0.9em; }
div#menu-secondaire ul{ margin:0px; padding:8px 0px 0px 15px; list-style:none; }
div#menu-secondaire ul li{ margin-bottom:10px; }
div#menu-secondaire ul li a:link, div#menu-secondaire ul li a:visited{ text-decoration:none; color:#9c9c9c; }
div#menu-secondaire ul li a:hover{ color:#666666; }

div#logo{ background:url(images/ishare.jpg) top left no-repeat; width:339px; height:109px; float:left; }

div#menu{ clear:both; height:48px; background:url(images/menu.png) top left no-repeat; }
div#menu ul{ margin:0px; padding:0px; list-style:none; }
div#menu ul li{ display:inline; float:left; }
div#menu ul li a:link, div#menu ul li a:visited, div#menu ul li a:active{ outline:none; display:block; height:48px; text-decoration:none; }
div#menu ul li a:hover{ background-image:url(images/menu.png); background-repeat:no-repeat; }
div#menu ul li#installer a:link, div#menu ul li#installer a:visited{ width:230px; }
div#menu ul li#utiliser a:link, div#menu ul li#utiliser a:visited{ width:230px; }
div#menu ul li#moduler a:link, div#menu ul li#moduler a:visited{ width:245px; }
div#menu ul li#commander a:link, div#menu ul li#commander a:visited{ width:273px; }

div#menu ul li#installer a:hover{ background-position:0 -72px; }
div#menu ul li#utiliser a:hover{ background-position:-230px -72px; }
div#menu ul li#commander a:hover{ background-position:-460px -72px; }
div#menu ul li#moduler a:hover{ background-position:-733px -72px; }
div#menu ul li a:link span, div#menu ul li a:visited span, div#menu ul li a:active span, div#menu ul li a:hover span{ visibility:hidden; }

div#menu ul li#installer a.actif:link, div#menu ul li#installer a.actif:visited{ background:url(images/menu.png) 0 -72px no-repeat; }
div#menu ul li#utiliser a.actif:link, div#menu ul li#utiliser a.actif:visited{ background:url(images/menu.png) -230px -72px no-repeat; }
div#menu ul li#commander a.actif:link, div#menu ul li#commander a.actif:visited{ background:url(images/menu.png) -460px -72px no-repeat; }
div#menu ul li#moduler a.actif:link, div#menu ul li#moduler a.actif:visited{ background:url(images/menu.png) -733px -72px no-repeat; }

div#colonne-droite{ float:right; padding:12px 12px 2px 12px; background:url(images/droite.gif); width:283px; margin-bottom:10px; }
div#colonne-droite div.bloc{ background:#FFFFFF; padding:8px 11px 11px 11px; margin-bottom:12px; }
div#colonne-droite div.bloc img.flotteGauche{ float:left; margin:0px 10px 10px 0px; }
div#colonne-droite div.bloc h3{ margin:0px; padding:0px; font-size:1.4em; color:#000000; }
div#colonne-droite div.bloc div.texte{ color:#9b9b9b; padding:0px 0px 5px 0px;  }
div#colonne-droite div.bloc div.texte a:link, div#colonne-droite div.bloc div.texte a:visited, div#colonne-droite div.bloc div.texte a:hover{ color:#9b9b9b; }
div#colonne-droite div.bloc div.readmore{ color:#7f9a17; font-size:0.9em; font-weight:bold; clear:both; }
div#colonne-droite div.bloc div.readmoreright{ color:#7f9a17; font-size:0.9em; font-weight:bold; clear:both; text-align:right }
div#colonne-droite div.bloc div.readmore a:link, div#colonne-droite div.bloc div.readmore a:visited,
div#colonne-droite div.bloc div.readmoreright a:link, div#colonne-droite div.bloc div.readmoreright a:visited{ color:#7f9a17; }
div#colonne-droite div.bloc div.readmore a:hover, div#colonne-droite div.bloc div.readmoreright a:hover{ color:#16b7f2; }

/******* login *********/
div#colonne-droite div.bloc form{ margin:0px; padding:15px 0px 0px 0px; }
div#colonne-droite div.bloc form div.formulaire{ clear:both; height:30px; }
div#colonne-droite div.bloc form div.formulaire label{ display:block; width:90px; float:left; }
div#colonne-droite div.bloc form div.formulaire input{ border:solid 1px #7cb205; font-size:1em; width:160px; padding:2px; background:url(images/input.gif); }
div#colonne-droite div.bloc form div.valid{ clear:both; text-align:right; padding:0px 6px 0px 0px; }

/******** panier ********/
div#colonne-droite div.bloc table{ margin-top:8px; }
div#colonne-droite div.bloc table td{ border-bottom:solid 1px #ccc496; padding:5px 0px 5px 0px; }
div#colonne-droite div.bloc table td.ref{ width:73px; color:#9b9b9b; }
div#colonne-droite div.bloc table td.titre{ width:113px; color:#847c4b; }
div#colonne-droite div.bloc table td.qte{ width:28px; text-align:right; }
div#colonne-droite div.bloc table td.prix{ width:45px; text-align:right; color:#9b9b9b; }
div#colonne-droite div.bloc table td.total{ padding:4px; background:#e9e6d2; text-align:right; color:#8eab1b; font-weight:bold; font-size:1.3em; border:none; }

div#footer{ width:980px; margin:0 auto 0 auto; color:#9a9158; font-size:0.9em; text-align:left; }
div#footer ul{ margin:0px; padding:0px 5px 0px 0px; list-style:none; float:right; }
div#footer ul li{display:inline; margin:0px; padding:0px; }
div#footer ul li a:link, div#footer ul li a:visited{ color:#9a9158; text-decoration:none; }
div#footer ul li a:hover{ text-decoration:underline; color:#666666; }

div#footer a:link, div#footer a:visited{ color:#9a9158; text-decoration:none; }
div#footer a:hover{ text-decoration:underline; color:#666666; }


/*############################################## HOME #####################################################*/
div#logo h1{ font-size:0.1em; margin:0px; padding:0px; text-indent:-9998px; }
div#wrap-home{ background:url(images/wrap-home.jpg) top repeat-x; height:175px; }
div#home{ width:367px; float:right; margin:20px 56px 0px 0px; }
div#home h2{ font-size:1.2em; margin:15px 0px 0px 0px; padding:0px; }
div#home p{ margin:0px; padding:0px; line-height:1.7em; }

div#server-home{ background:url(images/server-home.png) top left no-repeat; width:282px; height:431px; position:absolute; bottom:4px; }
div#baseline{ background:url(images/baseline.gif) 300px 55px no-repeat; height:29px; padding:80px 0px 0px 0px; }
div#baseline strong{ visibility:hidden; }

/*############################################## INTERIEUR #####################################################*/
div#logo a:link, div#logo a:visited, div#logo a:hover, div#logo a:active{ outline:none; text-decoration:none; display:block; 
	width:339px; height:109px; }
div#logo a:link span, div#logo a:visited span, div#logo a:hover span, div#logo a:active span{ visibility:hidden; }
div#main{ width:637px; float:left; padding:15px 0px 15px 0px; }
div#main h1{ color:#ccc; font-size:2.7em; font-weight:normal; margin-top:0px; }
div#main h2{ font-size:1.3em; margin:15px 0px 0px 0px; padding:0px; }
div#main p{ margin:0px 0px 20px 0px; padding:0px; line-height:1.7em; }

div#wrap-interieur{ background:url(images/wrap-home.jpg) 0px 26px repeat-x; height:190px; }
div#footer-interieur{ width:980px; margin:0 auto 0 auto; background:url(images/footer.jpg) top left no-repeat; height:170px; }

/***** FAQ ****/
div#main dl{ }
div#main dt{ margin-top:20px; font-size:1.2em; color:#7cb205; }
div#main dt a, div#main dt a:active, div#main dt a:focus{color:#7cb205; text-decoration:none; }
div#main dd{ background:url(images/faq.png) 20px 0px no-repeat; margin:0px; padding:0px 0px 0px 65px; }

/*************** contact ******************/
div#main div.formulaire{ padding:0px 0px 5px 0px; clear:both; }
div#main div.formulaire input, div#main div.formulaire textarea{ background:#f5f5f5; color:#7cb205; border:solid 1px #999; margin-bottom:3px; width:457px; padding:4px; font-size:1.2em; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; 
	font-weight:bold; }
div#main div.formulaire strong{ display:block; width:170px; float:left; padding:2px 0px 0px 0px; }

div#main div.formulaire span.message-ok{ color:#CC77CC; font-size:1.2em; }
div#main div.formulaire span.message-ok strong{ width:auto; }

div#main div.formulaire input.bouton{ background:#999; color:#fff; border:solid 1px #666; margin-bottom:3px; width:164px; padding:2px; font-size:1.1em; font-weight:bold;
	border-bottom:solid 1px #444; border-right:solid 1px #444;  }

div#main strong.formulaire_error { color:#FF0000;}
div#main strong.formulaire_ok { color:#00FF00;}

div#main span.error_message { padding-left:170px; color:#847; display:block;}
/*************** listing accessoires ******************/
div.accessoire{ margin:35px 0px 15px 0px; }
div.accessoire h3{ margin:0px 0px 8px 0px; padding:0px; font-size:1.4em; font-weight:normal; color:#4b4215; border-bottom:solid 1px #c18dc3; }
div.accessoire div.chapeau{ color:#898989; }
div.accessoire div.infos{ color:#7d723e; font-weight:bold; margin:8px 0px 15px 0px; }
div.accessoire div.price_DF{ color:#CC00EE; font-size: 1.6em; font-weight:bold; margin:8px 0px 15px 0px; }
div.accessoire div.ajout{ clear:both; }

div.accessoire div.photo{ position:relative; float:right; width:109px; height:96px; overflow:hidden; border:solid 1px #c18dc3; margin-left:20px; }
div.accessoire div.photo div.loupe{ position:absolute; bottom:0px; right:0px; }

div.span_slideshow { display: block; width:635px; text-align: center; height: 250px; /*border: 1px #AAAAAA solid; background-color: #FFFFFF;*/ clear: both; margin: 10px auto 20px auto;}
div.span_slideshow div.photo{ border:none; margin:5px; }


div.accessoire div.infos ul, div.accessoire div.infos li {margin:10px 0 10px 0; padding:0; list-style: none;}

/******** panier ********/
table#resume-panier{ font-size:1.1em; }
table#resume-panier td{ border-top:solid 1px #ccc496; padding:5px 0px 5px 0px; }
table#resume-panier td.ref{ width:73px; color:#9b9b9b; }
table#resume-panier td.titre{ width:463px; color:#847c4b; }
table#resume-panier td.qte{ width:40px; text-align:right; }
table#resume-panier td.qte input{ width:25px; text-align:right; }
table#resume-panier td.prix{ width:65px; text-align:right; color:#9b9b9b; }
table#resume-panier td.total{ padding:4px; background:#e9e6d2; text-align:right; color:#8eab1b; font-weight:bold; font-size:1.3em; border:none; }
table#resume-panier tr.suggestion{  }
table#resume-panier tr.suggestion td.recommandation strong{ color:#cb57e0; font-size:1.2em; }
table#resume-panier tr.suggestion td.recommandation small{ color:#cb57e0; font-size:0.8em; }
table#resume-panier tr.suggestion td.suggestionQte{ padding:10px 0px 10px 0px; width:28px; text-align:right; }
table#resume-panier tr.suggestion td.suggestionPrix{ color:#cb57e0; padding:10px 0px 10px 0px; width:65px; text-align:right; font-size:1.2em; font-weight:bold; padding-right:5px; }
table#resume-panier tr.suggestion td{ border:none; }
table#resume-panier tr.suggestion td table{ margin:10px 0px 10px 0px; border:solid 1px #c18dc3; background:url(images/recommandation.gif); }
table#resume-panier tr.suggestion td table td{ padding:5px; }

fieldset#actions{ padding:20px; border:1px solid #E5E5E5; margin-top:35px; background:url(images/droite.gif); }

/******** connexion et création de compte ********/
div#bloc-pasdecompte{ border:solid 1px #ccc496; float:left; width:280px; padding:15px 15px 19px 15px; background:#fff; }
div#bloc-connexion{ border:solid 1px #ccc496; float:right; width:280px; padding:15px;background:#fff; }

div#bloc-connexion div.formulaire input{ background:url(images/input.gif); color:#333; border:solid 1px #999; margin-bottom:3px; width:195px; padding:1px; font-size:1.1em; font-weight:bold; }
div#bloc-connexion div.formulaire strong{ display:block; width:70px; float:left; padding:2px 0px 0px 0px; }
div#bloc-connexion div.formulaire input.bouton{ background:none; border:none; margin-bottom:0px; width:70px; padding:0px; }

/******** page récap ********/
fieldset#actionsFacture{  padding:20px; border:1px solid #E5E5E5; margin-top:10px; background:url(images/droite.gif); }
fieldset#actionsFacture a:link, fieldset#actionsFacture a:visited{ color:#8eab1b; border:solid 1px #8eab1b; background:#FFF url(images/pdf.png) left no-repeat; display:block; padding:5px 5px 5px 30px; margin-right:20px; float:left; width:200px; text-decoration:none; }

div#bloc-etat{ border:solid 1px #ccc496; float:left; width:280px; padding:15px; background:#fff; }
div#bloc-adresse{ border:solid 1px #ccc496; float:right; width:280px; padding:15px;background:#fff; }
div#bloc-confirmation{ border:solid 1px #ccc496; float:left; width:280px; padding:15px; background:#fff; }
div#bloc-etat a:link, div#bloc-etat a:visited{color:#8eab1b; }
div#bloc-etat a:hover{ color:#666; }

div#main div#bloc-etat p, div#main div#bloc-adresse p{ margin:0px 0px 7px 0px; padding:0px; line-height:1.2em; }
span.panier-tot-ttc {font-size: 0.7em; color:#000000; font-weight: normal; }
/******** orders ********/
table#order-list{ font-size:1.1em; }
table#order-list td{ border-bottom:solid 1px #ccc496; padding:5px 0px 5px 0px; }
table#order-list td.order-name{ width:213px; text-align:left; }
table#order-list td.order-date{ width:173px; color:#9b9b9b; }
table#order-list td.order-amount{ width:90px; color:#847c4b; }
table#order-list td.order-state{ width:155px; text-align:left; }

/******** orders-status ********/
table#status-list{ font-size:1.1em; }
table#status-list td{ border-bottom:solid 1px #ccc496; padding:5px 0px 5px 0px; }
table#status-list td.state{ width:458px; text-align:left; }
table#status-list td.date{ width:173px; color:#9b9b9b; }


/*############################################## STYLES #####################################################*/
h2.gris{ color:#afafaf; }
h2.vert, strong.vert{ color:#7cb205; }
p.vert{ color:#8eab1b; }
div#main p.confirmation{ margin:0px 0px 3px 0px; padding: 0px 0px 0px 0px; }
h2.bleu{ color:#488bc1; }
p.bleu{ color:#325d87; }
h2.violet{ color:#cb57e0; }
h2.orange{ color:#a79119; }

img.imageGauche{ float:left; margin:0px 10px 10px 0px; }
img.imageDroite{ float:right; margin:0px 0px 10px 10px; }

span.error{ color:#884477 ; font-weight:bold;}

