﻿

@charset "utf-8";
@import url(styles_boutons.css);
@import url(styles_icomenus.css);
/* CSS Document */

.iconeTitre, img { 
	behavior: url(/_css/iepngfix/iepngfix.htc); 
}

body {
	height: 100%;
	width: 100%;
	text-align: center;
	/*background: url(../images/fonds/fond_mariniere4.png) ;*/
	padding: 0;
	margin: 0;
}

/* -------------------- textes ----------------- */

* {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color: #004c90;
}
h1 {
	font-size:24px;
}
h2,
.titre,
.titrePage {
	color: #000000;
	height: 30px;
	vertical-align:middle;
	background: url('../img/gradientvb.png') repeat-x;
	color: ##ffffff;
	font-size:15px; 
	font-weight:bold; 
	width:100%; 
}
.titrePage {
	height: 36px;
	border-bottom: 1px solid #000000;
	margin-bottom: 10px;
}
.titrePage td{
	border: 0px solid #ffffff;
}
.aide {
	font-style: italic;
	font-size: 10px;
	border: 1px solid #ffffff;
	
	color: #ffffff;
	padding: 5px 5px 5px 22px;  /* 5px 5px 5px 22px; */
	-moz-border-radius: 10px;
	margin: 5px;
	background: #485570 url(../images/boutons/aide.png) 2px 2px no-repeat;
}
.contenuTitre {
	/*position: relative;
	bottom: 10px;*/
	font-size:15px; 
}
.iconeTitre {
	margin-right: 5px;
	border: 0px solid #ff0000;
	background-repeat: no-repeat;
	padding: 10px 16px;
}


/* icones pour la barre de titre 
la compatibilité des images png sous ie6 est gérée par iepngfix.htc, pas besoin d'image de remplacement en gif
par contre le positionnement de l'image doit être "hackée" pour ie6 (todo) */

#transco {
	background-image: url(../images/icones_titre/transco.png);
}


#edit {
	background-image: url(../images/icones_titre/edit.png);
}

#home {
	background-image: url(../images/icones_titre/home.png);
}

#news {
	background-image: url(../images/icones_titre/knewsticker.png);
}

#mesures {
	background-image: url(../images/icones_titre/mesures.png);
}

#package {
	background-image: url(../images/icones_titre/package.png);
}

#aidebt {
	background-image: url(../images/icones_titre/aide.png);
}

#contacts {
	background-image: url(../images/icones_titre/contacts-big.png);
}

#radar {
	background-image: url(../images/icones_titre/radar.png);
}
#trouver {
	background-image: url(../images/icones_titre/trouver.png);
}
#rechercher {
	background-image: url(../images/icones_titre/rechercher.png);
}
#argent {
	background-image: url(../images/icones_titre/argent.png);
}
#porteuf {
	background-image: url(../images/icones_titre/portefeuille.png);
}
#ded {
	background-image: url(../images/icones_titre/kded.png);
}

#kdf {
	background-image: url(../images/icones_titre/kdf.png);
}

#calendrier {
	background-image: url(../images/icones_titre/calendrier.png);
}

#ark2 {
	background-image: url(../images/icones_titre/ark2.png);
}

#kthememgr {
	background-image: url(../images/icones_titre/kthememgr.png);
}

#certificat {
	background-image: url(../images/icones_titre/certificate.png);
}

/*
* html #edit {
	background-image: url(../images/icones_titre/edit.gif);
}
* html #news {
	background-image: url(../images/icones_titre/knewsticker.gif);
}
* html #mesures {
	background-image: url(../images/icones_titre/mesures.gif);
}
* html #package {
	background-image: url(../images/icones_titre/package.gif);
}
* html #contacts {
	background-image: url(../images/icones_titre/contacts-big.gif);
}
* html #ded {
	background-image: url(../images/icones_titre/kded.gif);
}
* html #kdf {
	background-image: url(../images/icones_titre/kdf.gif);
}
* html #calendrier {
	background-image: url(../images/icones_titre/calendrier.gif);
}
* html #ark2 {
	background-image: url(../images/icones_titre/ark2.gif);
}
* html #kthememgr {
	background-image: url(../images/icones_titre/kthememgr.gif);
}
*/
/* fin des icones pour la barre de titre  */
#caseAide  {
	width: 30px;
}
#caseTitre  {
	text-align: center;
}
.lienAide {
	display: block;
	color: #ffffff;
	background: url(../images/boutons/khelpcenter.png) no-repeat top center;
	padding-top: 22px;
	border: 0px dashed #ff0000;
	text-align: center;
	text-decoration: none;
}
#caseCreation  {
	font-style: italic;
	font-size: 10px;
	width: 350px;
	text-align: right;
}


h3,
.sstitre,
.titreListe {
	color:#6C0056;
	font-size:13px;
	font-weight:bold;
	text-align: left;
}
h3 {
	margin: 0px;
}
.copy a { 
	color: white;
}
.erreur {
	background-color:#dddddd;
	border: 2px dashed #ff0000;
	text-align: left;
	margin: 20px auto;
	padding: 15px 5px 25px 60px;
	background: #dddddd url(../images/boutons/alerte.png) top left no-repeat;
}
.urgente {
	background-color:#dddddd;
	border: 2px dashed #ff0000;
	text-align: left;
/*	margin: 20px auto;     */
	padding: 10px 5px 10px 60px;
	background: #dddddd url(../images/boutons/alerte.png) top left no-repeat;
	background-size: 30px ;
	background-position: 2%;
	width: 250px;
	height: 15px;
	float : left;
}

.info {
	background-color:#dddddd;
	border: 2px dashed #415A8A;
	text-align: left;
	margin: 20px auto;
	padding: 15px 5px 25px 60px;
	background: #dddddd url(../images/boutons/info.png) top left no-repeat;
}

.message {
	background-color:#ffffff;
	border: 2px solid #0000ff;
	-moz-border-radius: 20px;
	text-align: center;
	margin: 20px;
	padding: 10px;
}
.tdb1 {
	background-color:#D4D4D4;
	border: 0px solid #0000ff;
	-moz-border-radius: 20px;
	text-align: left;
	opacity: 0.8;
	color: #039;
	margin: 20px;
	font-weight: bold;
}

.tdb1titre {
	background-color:#938988;
	-moz-border-radius-topleft: 20px;
	-moz-border-radius-topright: 20px;	
	text-align: center;
	opacity: 0.8;
	color: #FFF;
	font-weight: bold;
}
.tdb1resultvert {
	background-color: #5B9F48;
	text-align: right;
	color: #FFF;
	font-weight: bold;
}
.tdb1resultneutre {
	background-color: #938988;
	text-align: right;
	color: #FFF;
}
.tdb1resultrouge {
	background-color: #E84015;
	text-align: right;
	color: #FFF;
	font-size: 14px;
}
.tdb1resultorange {
	background-color: #F90;
	text-align: right;
	color: #FFF;
}
.tdb1titreorange {
	background-color: #F90;
	-moz-border-radius-topleft: 20px;
	-moz-border-radius-topright: 20px;	
	text-align: center;
	opacity: 0.8;
	color: #FFF;
	font-weight: bold;
	font-size: 14px;
	vertical-align: middle;
}
.tdb1titrevert {
	background-color: #5B9F48;
	-moz-border-radius-topleft: 20px;
	-moz-border-radius-topright: 20px;	
	text-align: center;
	opacity: 0.8;
	color: #FFF;
	font-weight: bold;
	font-size: 14px;
	vertical-align: middle;
}
.tdb1titreneutre {
	background-color: #938988;
	-moz-border-radius-topleft: 20px;
	-moz-border-radius-topright: 20px;	
	text-align: center;
	opacity: 0.8;
	color: #FFF;
	font-weight: bold;
	font-size: 14px;
	vertical-align: middle;
}
.tdb1titrerouge {
	background-color: #E84015;
	-moz-border-radius-topleft: 20px;
	-moz-border-radius-topright: 20px;	
	text-align: center;
	opacity: 0.8;
	color: black;
	font-weight: bold;
	font-size: 14px;
	vertical-align: middle;
}
.bulrem {
	background: #ffffff url(../images/ledred.png) top center no-repeat;
}

.bulred {
	background: #ffffff url(../images/ledred.png) top center no-repeat;
}
.bulora {
	background: #ffffff url(../images/ledorange.png) top center no-repeat;
}
.bulver {
	background: #ffffff url(../images/ledgreen.gif) top center no-repeat;
}
.bulpur {
	background: #ffffff url(../images/ledpurple.png) top center no-repeat;
}

.bulblu {
	background: #ffffff url(../images/ledblue.png) top center no-repeat;
}
.buljau {
	background: #ffffff url(../images/ledyellow.png) top center no-repeat;
}
.frb {
	background: #ffffff url(../images/flc-reb_b.png) top right no-repeat;
	text-align: left;
	font-weight:bold;
}
.f2rb {
	background: #ffffff url(../images/flc-2reb_b.png) top right no-repeat;
	text-align: left;
	font-weight:bold;
}
.fvh {
	background: #ffffff url(../images/flc_vert_up.png) top right no-repeat;
	text-align: left;
	font-weight:bold;
}	
.f2vh {
	background: #ffffff url(../images/flc_2vert_up.png) top right no-repeat;
	text-align: left;
	font-weight:bold;
}	
.fbn {
	background: #ffffff url(../images/flc-blue-hor.png) top right no-repeat;
	text-align: left;
	font-weight:bold;
}
.fbng {
	background: #ffffff url(../images/flc-blue-hor-g.png) top right no-repeat;
	text-align: left;
	font-weight:bold;
}
/* -------------------- fin de textes ----------------- */
/* -------------------- éléments de formulaire ---------- */



.formulaireRecherche {
	width: 90%;
	background-color: white;
	opacity: 0.9;
	color: black;
	border: 1px solid #000000;
	margin: 10px auto;
	-moz-border-radius: 20px;
	padding: 10px;
	overflow-x: auto;
}

/* ie */
*+ html .formulaireRecherche {
	filter:alpha(opacity=90);
}
* html .formulaireRecherche {
	filter:alpha(opacity=90);
}
.formulaireRecherche table{
	margin-left: auto;
	margin-right: auto;
}
.formulaireStandard {
	width: 95%;
	background-color: white;
	opacity: 0.9;
	color: black;
	border: 1px solid #000000;
	margin: 5px auto;
	-moz-border-radius: 20px;
	padding: 20px;
	overflow-x:auto;
}

/* ie */
*+ html .formulaireStandard {
	filter:alpha(opacity=100);
}
* html .formulaireStandard {
	filter:alpha(opacity=90);
}
.formulaireStandard table{
	margin-left: auto;
	margin-right: auto;
}

.x-tabs-body {
	background-color: white;
	opacity: 0.9;
}
.x-tabs-strip-wrap {
	background-color: transparent;
}
.conteneurArticle {
	height: 150px;
	border: 2px inset #000000;
	overflow: auto;
	background-color: #ffffff;
}
.conteneurArticle table {
	width: 100%;
}
.conteneurVignetteArticle {
	height: 44px;
}

.champsObligatoire {
	border: 1px inset #ff0000;
}
.dpDiv {
	border: 1px outset #000000;
	padding: 0px;
}
.dpTR td {
	border: 1px solid #888888;
	text-align: center;
}
.divy {
	height:300px;
	overflow-y:auto;
}


/* -------------------- fin de éléments de formulaire ---------- */

/* --------------------- légendes bon de livraison ------------- */
.bl { background-color: #FFFFFF; }
.bl_P { background-color: #ffff99; }
.bl_K { background-color: #ffcc66; }
.bl_T { background-color: #ff6633; }
.bl_V {	background-color: #FF66CC; }
.bl_L { background-color: #ccffcc; }
.bl_X { background-color: #9999ff; }
.bl_R { background-color: #209334; }
.bl_Z { background-color: #0080FF; }
/* --------------------- fin de légendes bon de livraison ------------- */

/* --------------------- légendes statut commande ------------- */
.cde_gmmpn { background-color: #2255B5; }
.cde { background-color: #FFFFFF; }
.cde_N {background-color: #3300CC; color: #FFFFFF;}
.cde_B {background-color: #CC0033; }
.cde_T {background-color: #FF99FF; }
/* --------------------- fin de légendes statut commande ------------- */

/* --------------------- légendes echanges ------------- */
.ech { background-color: #FFFFFF; }
.ech_N { background-color: #FFFF99; }
.ech_O{ background-color: #DEBDF0; }
.ech_V { background-color: #FFCC66; }
.ech_R { background-color: #CCFFCC; }
.ech_C { background-color: #209334; }
.ech_D { background-color: #FF4500; }
.ech_P { background-color: #CC0033; }
.ech_A { background-color: #AD2799; }
.ech_L { background-color: #87F8B7; }

/* --------------------- fin de légendes echanges ------------- */

/* -------------------- tableaux ---------- */
#cache {
	position: absolute;
	left: 0px;
	right: 0px;
	top: 0px;
	bottom: 0px;
	/*height: 100%;
	width: 100%;*/
	background-color: white;
	opacity: 0.9;
	font-size: 14px;
	color: black;
	text-align: center;
	padding-top: 170px;
	z-index: 1000;
}
*+ html #cache {
	filter:alpha(opacity=90);
}
* html #cache {
	filter:alpha(opacity=90);
}
#cache div {
	/*border: 1px solid #000000;
	-moz-border-radius: 50px;
	padding: 50px;*/
	width: 340px;
	margin: 0px auto;
}
td, th {
	text-align: left;
}
.tableauResultats {
	width: 96%;
	background-color: white;
	opacity: 0.8;
	border-collapse:collapse;
	margin-right: auto;
	margin-left: auto;
}
*+ html .tableauResultats {
	filter:alpha(opacity=90);
}
* html .tableauResultats {
	filter:alpha(opacity=90);
}
.tableauResultats th,
.tableauResultats td {
	border-left: 1px solid #eeeeee;
	padding: 5px;
}
.tableauResultats th,
td.col_titre { 
	font-weight:bold; 
	background:#aaaaaa; 
	color:white; 
}
.tableauResultats th,
td.nombre { 
	text-align: right;
}
.tableauResultats th,
td.nombrez { 
	text-align: right;
	background: #ffffff url(../images/loupe.png) top center no-repeat;	
}	
.tableauResultats th,
td.totaux { 
	font-weight:bold; 
	background:#aaaaaa; 
	color:white; 
	text-align: right;
}	
.tableauResultats tbody tr:hover,
.tableauResultats tbody tr:hover a {
	background-color: #8080ff;
	color: white;
	height:12px;
}

html>/**/body .tableauResultats tbody {/* ok pour ff3 */
	overflow-y: auto;
	overflow-x: hidden;
}

.tableauResultats tr{
	/*height: 400px;*/
	overflow-y: auto;
	height: 12px;;
}

.tableauCommandes {
	width: 100%;
	background-color: white;
	border-collapse:collapse;
	margin-right: auto;
	margin-left: auto;
	cursor:default;
}
.tableauCommandes th,
.tableauCommandes td {
	border-bottom: 1px solid #aaaaaa;
	border-right: 1px solid #aaaaaa;
	padding: 2px;
}
.tableauCommandes th,
td.col_titre { 
	font-weight:bold; 
	background:white; 
	color:#000000;
	text-align: center;
	font-size:11px;
}
.tableauCommandes th,
td.totaux { 
	font-weight:bold; 
	background:#aaaaaa; 
	color:white; 
	text-align: center;
}	
.tableauCommandes tbody tr:hover,
.tableauCommandes tbody tr:hover a {
	background-color: #00ffff;
	color: #000000;
}
html>/**/body .tableauCommandes tbody {/* ok pour ff3 */
	
	overflow: visible;	
}
.tableauCommandes tr{
	/*height: 400px;
	overflow-y: auto;*/
	height: auto;
}

.tableauSimple {
	width: 90%;
	background-color: white;
	border-collapse:collapse;
	margin-right: auto;
	margin-left: auto;
	cursor:default;
}
.tableauSimple th,
.tableauSimple td {
	border: 1px solid black;
	padding: 2px;
}
.tableauSimple th,
td.col_titre { 
	font-weight:bold; 
	background:#aaaaaa; 
	color:#FFFFFF;
	text-align: center;
	font-size:11px;
}
.tableauSimple td.totaux { 
	font-weight:bold; 
	background:white; 
	color:#000000; 
	text-align: center;
}	
html>/**/body .tableauSimple tbody {/* ok pour ff3 */
	
	overflow: visible;	
}
.tableauSimple tr{
	/*height: 400px;
	overflow-y: auto;*/
	height: auto;
}

.tableauEchanges {
	width: 100%;
	background-color: white;
	border-collapse:collapse;
	margin-right: auto;
	margin-left: auto;
}
.tableauEchanges th,
.tableauEchanges td {
	border-right: 1px solid #000000;
	border-bottom: 1px solid #D7D7D7;
	padding: 3px 2px 3px 2px;
}
.tableauEchanges th,
td.col_titre { 
	font-weight:bold; 
	background:#aaaaaa; 
	color:white;
	text-align:center;
}
.tableauEchanges td.nombre { 
	text-align: right;
}	
.tableauEchanges td.totaux { 
	font-weight:bold; 
	background:#aaaaaa; 
	color:white; 
	text-align: right;
}	
.tableauEchanges tbody tr:hover,
.tableauEchanges tbody tr:hover a {
	background-color: #D7D7D7;
}

html>/**/body .tableauEchanges tbody {/* ok pour ff3 */
	
	overflow: visible;	
}

.tableauEchanges tr{
	/*height: 400px;
	overflow-y: auto;*/
	height: auto;
}

/* -------------------- fin de tableaux ---------- */

/* -------------------- INDEX ---------------------*/
#conteneurIndex {
 	border: solid #000000 1px;
	height: 100px;
	width: 780px;
	margin-left: auto;
    margin-right: auto;
	margin-top: 00px;
	position: relative;
}
#msgbox{
	padding: 12px;
	margin-left: auto;
	margin-right: auto;
	width: 400px;
	border: solid #000000 1px;
}
#logosIndex {
	text-align: center;
}
#logosIndex img {
	padding: 10px;
	background-color: white;
}
#login {
	border: solid #000000 0px;
	margin: 10px auto;
	
}
/* ------------------ fin de index ---------------------- */

/* ------------------ MENU ------------------------------ */
#menu {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0px;
	background-color: #FFFFFF;
	border-bottom: 1px outset #000000;
	text-align: left;
	position: absolute;
	z-index: 2;
	height: 100px;
}
#menu td {
	border: 0px solid #ffffff;
}

#espaceHauteurMenu {
	height: 100px;
}
#logoArmorBandeau {
	background-color:#FFFFFF;
	text-align: center;
	color: #000000;
	font-size:10px;
}
.elementMenu,
.elementMenu_actif {
	background: #dddddd;
	border: 1px solid #000000;
	text-align:center;
	-moz-border-radius: 6px;

	
	padding: 5px;
	/* pour faire "mordre" sur le sous-menu */
	padding-bottom: 2px;
	position: relative;
	z-index: 4;
}
.elementMenu a,
.elementMenu_actif a {
	color: black;
	font-weight: bold;
	font-size: 12px;
	text-decoration: none;
}
.elementMenu:hover, 
.elementMenu_actif {
	border-bottom: 1px #bbbbbb solid;
	background: #bbbbbb;
}
.elementMenu:hover a, 
.elementMenu_actif a {
	color: white;
}

#legende {
	border: 0px #000000 solid;
	font-style: italic;
	text-align: left;
}

#legende {
	margin-left: 220px;
}
#page {
	border: 0px solid #ff0000;
	top: 100px;/* cf hauteur #menu */
	position: absolute;
	left: 210px;
	right: 0px;
	bottom: 0px;
	overflow: auto;
} 
#conteneurMenu  {
	border: 0px solid #ff0000;
	width: 200px;
	text-align: left;
	
	
	margin: 2px 0px 0px 0px;
	background-color: #ffffff;
	position: fixed;
	top: 100px;
	bottom: 0px;
	left: 0px;
	border-right: 1px solid #000000;
	padding-right: 10px;
	z-index: 2;
	overflow: auto;
}
#conteneurMenu img {
	border: 0px outset #000000;
}
#conteneurMenu ul {
	list-style-type: none;
	padding-left: 0px;
	border: 1px inset #000000;
	margin-left: 0px;/* pour ie */
}

#conteneurMenu dt {
	text-align: left;
	
}
#conteneurMenu dt a{
	position: relative;
	bottom: 6px;
}
#conteneurMenu dt:hover {
	cursor: pointer;
}
#conteneurMenu dd {
	margin-left: 0px;
	border: 0px dashed #00ff00;
}
#conteneurMenu li {
	text-align: left;
	padding: 5px 5px 5px 10px;
	border-bottom: 1px solid #000000;
	background-color: #eeeeee;
}

/* ---------- fin nouveau menu : vertical --------------- */
#aideVideo {
	/*float: right;*/
}
.spacer {
	clear: both;
}
#sommaireAide {
	/*float: left;
	width: 20%;*/
}
#sommaireAide ul li {
	text-align: left;
}
/* --------------- articles ---------------------*/
#conteneurGlobalArticle {
	position: absolute;
	left: 265px;
	top: 50px;
	bottom: 5px;
	right: 5px;
	overflow-y: auto;
	/*margin-left: 265px;*//* cf largeur colonne panier */
	
	border: 0px dotted #000000;
}
#contenuPanier img {
	float: left;
	margin-right: 5px;
	margin-top: 5px;
}
#contenuPanier dt {
	clear: left;
	font-weight: bold;
	margin-top: 10px;
}
#contenuPanier dd {
	font-style: italic;
}
.conteneurPanoplie {
	position: relative;
	margin: 0px;
	padding-left: 5px;
}

.libellePanoplie {
	float: left;
	font-size: 18px;
	/*display: block;
	float: left;*/
	/*cursor: ns-resize;*/
}
.enteteOngletPanoplie {
	text-align: right;
	border: 0px solid #000000;
	padding: 5px;
	
}
.contenuOngletPanoplie {
	border: 0px solid #000000;
	/*background-color: #eeeeee;*/
	margin: 0px 0px 10px 0px;
	text-align: left;
}
.contenuOngletPanoplie h3:hover{
	cursor: pointer;
	color: #000000;
}
.conteneurFamilleArticle {
	position: relative;
	border: 1px solid #000000;
	padding: 10px;
	margin: 10px;
}
.libelleFamilleArticle {
	text-align: left;
	font-size: 14px;
	font-style: italic;
	margin: 10px 0px 5px 0px;
}
#panier {
	position: relative;
	border: 2px inset #000000;
	overflow: auto;
	margin-bottom: 10px;
	padding: 5px;
}
#infosPanier {
	position: absolute;
	bottom: 5px;
	top: 260px;
	left: 5px;
	right: 5px;
	border: 0px solid #000000;
	overflow: auto;
}
.zoneArticle {
	float: left;
	position: relative;
	width: 200px;
	height: 300px;
	border: 1px solid #cccccc;
	-moz-border-radius: 10px;
	margin: 0px 10px 10px 0px;
	background-color: #ffffff;
	padding: 5px;
	z-index: 10;
}
.zoneArticle form {
	padding: 0px;
	border: 0px dotted #ff0000;
	text-align: center;
}
.dragArticle {
	cursor: move;
	border: 0px dotted #ff0000;
	
	
	height: 210px;/* hauteur de l'image */
	width: 100%;
	
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	
}
*+ html .dragArticle {
	filter:alpha(opacity=0);
	background-color: #ffffff;
}
.donneesArticle {
	position: absolute;
	left: 0px;
	right: 0px;
	bottom: 0px;
	border: 0px dotted #00ff00;
	padding: 5px;
}
.photoArticle {
	border: 0px dotted #00ff00;
	height: 240px;
	width: 190px;
	overflow: hidden;
	text-align: center;
	background: url(../images/boutons/cursor_move.gif) no-repeat center center;
}
.libelleArticle {
	width: 96%;
	font-size: 14px;
	border: 1px solid #000000;
	
	text-align: center;
	background-color: #ffffff;
	opacity: 0.8;
}
*+ html .libelleArticle {
	filter:alpha(opacity=80);
}
.optionArticle {
	float: left;
}
.quantiteArticle {
	margin-top: 5px;
	clear: both;
	text-align: left;
}

.quantiteArticle SELECT{
	font-size:10px;
}
.quantiteArticle OPTION{
	font-size:10px;
}

.quantiteMinMaxArticle {
	text-align: left;
	font-style: italic;
	display: inline;
}
.colorisArticle{
	text-align: left;
	
}
.tailleArticle {
	
	text-align: left;
	margin-bottom: 5px;
}
.tailleArticle select {
	width: 100px;
}
.conteneurPrixArticle {
	border: 1px solid #000000;
	-moz-border-radius: 10px;
	position: absolute;
	background-color: #ffffff;
	opacity: 0.7;
	top: 10px;
	left: 10px;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	padding: 5px;
}
*+ html .conteneurPrixArticle {
	filter:alpha(opacity=70);
}

.pointsArticle, .prixArticle {
}

.bandeauFamilles 
{
	border: 0px solid #000000;
	overflow-x: auto;
	overflow-y: hidden;
}

[if !IE].bandeauFamilles 
{
	position:static;
	height: 110px;
	padding-bottom: 20px;
}

.famille{
	position: absolute;
	border: 1px outset #000000;
	height: 105px;
	top: 0px;
	cursor: pointer;
	text-align: center;
	padding: 5px;
	background-color: #ffffff;
	-moz-border-radius: 5px;	
}
.famille:hover{
	 border: 1px solid #ff0000;
}
.ndis {
	background-color:#CC3300;
	text-align: left;
	color:#FFFF00;
}
.paginationCurPage {
	BORDER-BOTTOM: #aaaaaa 1px solid; BORDER-LEFT: #aaaaaa 1px solid; PADDING-BOTTOM: 3px; MARGIN: 1px; PADDING-LEFT: 3px; PADDING-RIGHT: 3px; COLOR: #aaaaaa; BORDER-TOP: #aaaaaa 1px solid; FONT-WEIGHT: bold; BORDER-RIGHT: #aaaaaa 1px solid; PADDING-TOP: 3px;
}
.infoBulle{
	position: absolute;   
	display : none;
	border: 1px dotted Black;
	padding: 1px;
	font-size: 10px;
	background-color: #FFFFFF;
	opacity: 0.6;
}
.loading {
	background:url(../img/loading1.gif);
	background-repeat:no-repeat;
	background-position:center;
	border:none;
	min-width:16px;
	min-height:16px;
}

.obligatoire{
	color:red;
	font-weight:bold;
	font-size:12px;
	text-align:center;
	height:18px;
}

.bonjour{
	color:#FFFFFF;
}

.ariane{
	font-size:11px;
	color:#CCCCCC;
}

.msgPage{
	background-image: url(../images/transparence.png);	
	position:absolute;
	width:100%;
	height:100%;
	z-index:5000;
	vertical-align:middle;
	text-align:center;
}

.msgTitre{
	-moz-border-radius-topright:20px;	
	-moz-border-radius-topleft:20px;
	background:#415A8A url(../images/boutons/info.png) top left no-repeat;
	color:white;
	font-weight:bold;
	font-size:12px;
	height:30px;
	margin-left:20px;	
	text-align:center; 
	vertical-align:middle;
	width:100%;	
}

.msgTitreOK{
	-moz-border-radius-topright:20px;	
	-moz-border-radius-topleft:20px;
	background:#415A8A url(../images/boutons/apply32.png) top left no-repeat;
	color:white;
	font-weight:bold;
	font-size:12px;
	height:30px;
	margin-left:20px;	
	text-align:center; 
	vertical-align:middle;
	width:100%;	
}

.msgTitreKO{
	-moz-border-radius-topright:20px;	
	-moz-border-radius-topleft:20px;
	background: red url(../images/boutons/urgence.png) top left no-repeat;
	color:white;
	font-weight:bold;
	font-size:12px;
	height:30px;
	margin-left:20px;	
	text-align:center; 
	vertical-align:middle;
	width:100%;	
}

.messageOk {
	-moz-border-radius: 20px;
	border: 2px solid black;				
	text-align: center;
	font-size:14px;
	color:black;
	margin-top:15%;
	margin-left:25%;
	background: white;	
	cursor:pointer;
	width:50%;
	height:50%;
	vertical-align:middle;
}

.messageCde {
	-moz-border-radius: 20px;
	border: 2px solid black;				
	text-align: center;
	font-size:14px;
	color:black;
	margin-top:15%;
	margin-left:25%;
	background: white;	
	cursor:pointer;
	width:40%;
	height:30%;
	vertical-align:middle;
}

.pleinePage{
	background-image: url(../images/transparence.png);
	position:absolute;
	width:100%;
	height:100%;
	z-index:5000;
	vertical-align:middle;
}
.messagePleinePageOk {
	border: 2px dashed green;
	text-align: center;
	font-size:25px;
	color:green;
	margin: 20px;
	padding: 15px 5px 15px 5px;
	background: #000000 url(../images/boutons/apply48.png) top left no-repeat;
	
	cursor:pointer;
}
.messagePleinePageNok {
	border: 2px dashed red;
	text-align: center;
	font-size:25px;
	color:red;
	margin: 20px;
	padding: 15px 5px 15px 5px;
	background: #000000 url(../images/boutons/alerte.png) top left no-repeat;
	cursor:pointer;
}

/* -------------------- style statuts OF ---------------------- */
.of_anomalie{
	border: 0px;
	background-color: #F03;
}

.of_encours{
	border: 0px;
	background-color: #FF6;
}		

.of_plan{
	border: 0px;
	background-color: #09F;
}	

.of_pieds{
	border: 0px;
	background-color: #60C6CE;
}

.of_prod{
	border: 0px;
	background-color: #396;
}

.of_solde{
	border: 0px;
	background-color: #999;
}
/* bouton action  */
.BTAction{
	/*background-image: -moz-linear-gradient(top, #BE2239 90% , rgba(11,11,11,0.2) 100%); */
/*	background-color:  -moz-linear-gradient(top, #ccc6c3 20%, #BE2239 100%);  */
	background-color: #0088CE;  
	border: solid 0px  #CCC;
	height:22px;
	font-weight:bold;
	width:80px;
	vertical-align:top;
	text-transform: uppercase ;
	font-size:10px;
	color: #ffffff;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius:3px;	
}

.BTAction:hover {
	/*background-image: -moz-linear-gradient(top, #C0C0C0 70% , rgba(11,11,11,0.2) 50%); */	
	background-color: #C0C0C0; 
	border: solid 0px  #CCC;
	color:#CB0044;
}

.anul {
	background-color: #000000;
	color:#FF0000;
	font-size:16px;
	font-weight:bold;
	text-align: left;
	padding: 0px 0px 0px 20px;
	width:230px;
 }
 
 .banniere{
	display:inline-block;
	width: 100%;
	height: 300px;
	overflow: hidden;
	position: relative;
}

.banniere__titre{
	position: absolute;
	color: #ffffff;
	bottom: 20px;
	font-size: 30px;
	left: 40px;
	max-width: 34%;
}

.banniere__image{
	width:100%;
}