/* used for graph */
#q-graph {
/* Ceci est la classe du UL principal qui contient toute les autres données */
/* Définir un With est un Height est essentiel, c'est ça qui donne les dimension du graphique */
  width: 600px;
  height: 300px;
/* Ne pas oublier d'enlever le point qui se trouve a coté des LI */
  list-style: none;
/* le reste n'est que positionnement et esthétique */
  position: relative; 
  margin: 1.1em 0 3.5em;
  padding: 0;
  background: #DDD;
  border: 2px solid gray;
  font: 9px Helvetica, Geneva, sans-serif;
}
#q-graph ul {
/* Une colonne étant un UL dans un UL, on défini les paramètres des colonnes */
  margin: 0; 
  padding: 0; 
  list-style: none;
}
#q-graph li {
/* Ceci défini les colonnes (largeur, positionnement des bâton a l'intérieur,position du titre...) */
  position: absolute; 
  bottom: 0; 
  width: 150px; 
  z-index: 2;
  margin: 0; 
  padding: 0;
  text-align: center; 
  list-style: none;
}
#q-graph li.qtr {
/* esthétique des colonnes */
  height: 298px; 
  padding-top: 2px;
  border-right: 1px dotted #C4C4C4; 
  color: #AAA;
}
#q-graph li.bar {
/* esthétique des batons */
  width: 60px;  
  border: 1px solid;  
  border-bottom: none;  
  color: #000;
}
#q-graph li.bar p { 
/* esthétique de titre dans les bâtons */
  margin: 5px 0 0;  
  padding: 0; 
}
#q-graph li.sent {
/* la position left est importante car le bâton 2 a comme left : left(baton1) + espacement. Il faut donc pensé a espacer les bâton !! */
  left: 13px;
/* esthétique d'un baton en particulier */
  background: #DCA;
  border-color: #EDC #BA9 #000 #EDC;
}
#q-graph li.paid {
/* la position left est importante car le bâton 2 a comme left : left(baton1) + espacement. Il faut donc pensé a espacer les bâton !! */
  left: 77px;  
/* esthétique d'un bâton en particulier */
  background: #9D9;
  border-color: #CDC #9B9 #000 #BFB;
}
/* position de la colonne 1 */
#q-graph #q1 {left: 0;}
/* position de la colonne 2 */
#q-graph #q2 {left: 150px;}
/* position de la colonne 3 */
#q-graph #q3 {left: 300px;}
/* position de la colonne 4 */
#q-graph #q4 {left: 450px; border-right: none;}

.codeclient { 
font-size: 14px; text-align: center; font-weight: bold; valign: middle; width: 80; 
}
.infobulle{
    position: absolute; 
    visibility : hidden;
	z-index : 100;
	display : block;
    border: 1px solid Black;
    padding: 10px;
    font-family: Verdana, Arial;
    font-size: 10px;
    background-color: #FFFFFF;
}

/* global */ 
body {
	border: none;
	margin: 0px;
	text-align:center;
	font-family: Arial, Helvetica, sans-serif;
	color:#000000;
	background-image:url("../images/fond.gif");
}

#contentgeneral{
	position: static;
	text-align:left;
	background-color:#FFFFFF;

}
.padding30{
	padding-left:30px;
	padding-right:30px;
}

/* navigation*/
#navhaute{
	position: static;
	text-align: left;
	background-repeat: no-repeat;
	background-position: center bottom;
}
.nav-principale{
	font-size: 12px;
	color: #000000;
	text-decoration: none;
	font-weight: bold;
	

}

/* propriétés des contenus */
#content{
	width: 988px;
	border: 1px none;
	margin: 0px;
	margin-top: 3px;
	padding: 0px;
}
.navgauche{
	width : 257px;
	height : 31px;
	text-align: left;
}
.content-central{
	background-color: #FFFFFF;
}
.navdroite{
	width : 217px;
	text-align: right;
	
}
/* polices */
.titrenavgauche{
	font-size: 11px;
	color: #FFFFFF;
	text-decoration: none;
	font-weight: bold;
	margin-left:10px;
}

#navbas{
		
}
.erreur {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #D43F55;
	text-decoration: none;
}
.passoublie {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: italic;
	font-weight: normal;
	color: #4C6690;
	text-decoration: underline;
}
.deconnex {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #FFFFFF;
}
.titre-rub {

	font-size: 16px;
	color: #000000;
	text-decoration: none;
	font-weight: bold;
}
#barrebt {
	border:none;
	background-color:#C9C9C9;
}
.content {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #000000;
	vertical-align:middle;
}
.inputtexte {

	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	color: #000000;
	border-top: 1px solid #808080;
	border-right: 2px inset #808080;
	border-bottom: 2px inset #808080;
	border-left: 1px solid #808080;
}

.input2 {
 border: 1px solid Silver;
 font-family: Arial, Helvetica, sans-serif;
 font-size: 28px;
 background-color: White;
 height: 30px;
}

#myMenuID {
padding :0px;
margin-top:1px;
height:28px;
width: 994px;
}

.tablo-erreur {
	border-top-width: 1px;
	border-right-width: 2px;
	border-bottom-width: 2px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #E3E2EC;
	border-right-color: #E3E2EC;
	border-bottom-color: #E3E2EC;
	border-left-color: #E3E2EC;
}


/* bcd-style */
.mainUsers { padding : 0px; margin : 0px; border-collapse: collapse}
a:active, a:focus, a:hover, a:link, a:visited {
	text-decoration: none;
	color: Navy;
	font-weight: bold;
}

a:hover {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-decoration: underline;
}

input {
	border: 1px solid #C2C2C2;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	background-color: #FFFFFF;
}

.noborder {
	border: none;
	background:transparent;

}

select {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	background-color: #FFFFFF;
	border: 1px;
	border-color: #000000;
	width: 277px;
}

td {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	color: Black;
	line-height: 16px;

}

.texteblanc { color: white}
.textebleu {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; color: #0b3f8a}
.textebleugd { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 12px; color: #0b3f8a}
.textebleubgd {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;font-weight: bold;font-size: 12px; color: #0b3f8a; text-align: right}
.noir {color: black}
.noirgd {font-size: 12px; color: black}
.stitregris {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #595959;
	font-weight: normal;
}

.stitrenoir {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;	
	color: #000000;
	width: 200px;
}

h3
{
text-indent:2em;
}

a img
{
	border:none;
}


.prixpromo {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: Black;
}
.titre1{
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
}

.visu {width: 60px;}
.ref {font-size: 10px; font-weight: bold; width: 200px}
.mar {font-size: 10px; font-weight: bold; text-align: left; color: #666666; width: 150px}
.na {font-size: 11px; font-weight: bold; text-align: left; color: #333333; width: 450px}
.pri {font-size: 11px; font-weight: bold; text-align: right; color: #333333; width: 25px;}
.pqty {text-align:right; width: 300px; padding-right: 5px}
.qty {width: 20px;}
.pttc { font-size: 10px; color: #3b3b3b}
.debug {margin: auto;padding : 0px;	padding-top : 5px; width: 100%;	background-color: #ffffff;}
.table {width : 90%;	border-collapse: collapse; border: 1px solid #6495ed; margin-top: 2px;}
.table0 { width : 90%; border-collapse: collapse; background-color: #ffffff;	margin-top: 5px; border-top: 1px solid #aaaaaa; border-bottom: 1px solid #aaaaaa}
.menu {border:1px solid #6495ed;	background-color  : #999999; width:100%; height: 50px;	margin:0px;	padding : 2px;}
.spacing{	border-top : 1px solid #6495ed;
	border-left : 1px solid #ffffff;
	border-right : 1px solid #ffffff;
	border-bottom: 1px solid #6495ed;
}
.btva {font-weight: bold; font-size: 14px; padding: 7px; border-top: 1px solid black; text-align: right}
.bfdp {border-top: 1px solid #b2b2b2; text-align: right; padding: 7px;}
.bpdt {border-top: 1px solid #888888; border-bottom: 1px solid #888888; padding: 1px; margin: 1px}
.bpdtpHT {border-top: 1px solid #888888; border-bottom: 1px solid #888888; padding: 1px; margin: 1px; color: grey}
.bpdtPT {border-top: 1px solid #888888; border-bottom: 1px solid #888888; padding: 1px; margin: 1px; text-align: right;font-weight: bold; font-size: 12px}
.scooter {color: #888888}
.ordertop {border-top : 1px solid black; border-bottom: 1px solid black; background-color: #a9bbd6; padding: 4px; margin: 7px;}
.orderhisto {border-bottom: 1px solid black; background-color: #c9c9c9; padding: 0px; margin: 4px;}
.orderh {border-top : 1px solid black; border-bottom: 1px solid black; background-color: #808080; padding: 0px; margin: 4px;}
select
{
	font-family: Arial; 
	font-size:10px;
	width : 100px;
}

.m {font-weight:  bold;}
.m2 {color: blue;}
.m3 {color: #666666}

.sTitle
{
	margin: 3px;
	text-align: left;
	font-size: 12px;
	font-weight: bold;
}
.inputlarge {width : 400px}
.promo {border-bottom : 1px solid black; font-weight: bold; font-size : 14px; padding-top: 10px; background-color: #a9a9a9}
.tableProducts {border-collapse : collapse; width : 310px; vertical-align : top;}
.tableProductsTop {vertical-align : top; padding-top : 3px; padding-left : 5px; height: 40px; color:#ffffff; font-weight: bold; background-color : #999999}
.tableProductsColor {vertical-align : top; padding-top : 15px; padding-left : 5px;}
.titrenoir { font-weight: bold; text-transform: uppercase }
.h_info { visibility: hidden; display: none }

.custom_tip .tip {
	background-color: #333;
	padding: 5px;
        min-width: 300px;
        text-align: left;
        white-space: pre;
}

.custom_tip .tip-title {
	color: #fff;
	background-color: #666;
	font-size: 10px;
	padding: 5px;
}

.custom_tip .tip-text {
	color: #fff;
        font-size: 10px;
	padding: 5px;
}