@charset "utf-8";
/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	/*font-size: 100%;*/
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body, html {
	line-height: 1;
	height: 100%;
	max-height: 100%;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

input, select {
	zoom: 1;
	height: auto;
}
/*
 * Fin du reset CSS
 */

/* Document */
body { font-family: Arial, Verdana; color:#404040; }

h1 { clear:both; font-size: 22px; font-family: Tahoma, Verdana; font-weight: 400; color:#3fb34f; margin: 10px 0 10px 0; }
h2 { clear:both; font-size: 20px; font-family: Tahoma, Verdana; font-weight: 400; color:#3fb34f; margin: 10px 0 10px 0; }

strong { font-weight: 600; }

p { margin: 10px 0 10px 0; font-size: 13px; line-height: 15px; }
p.petitCar { margin: 10px 0 10px 0; font-size: 10px; line-height: 12px; }

div.LienRetour { margin: 10px 0 10px 0; }
div.LienRetour a { color: #8a9c32; }

#Header {
	width:100%;
	height:135px;
	background-repeat: no-repeat;
	background-position: left top;
	background-image: url('../img/ban_top.jpg');
	/*clear:both;
	margin:0px auto 0px auto;*/
	padding:0px;
	position:relative;
}
#logout{
	color: rgb(63, 179, 79);
	font-size: 12px;
	font-weight: bold;
	padding: 10px;
	position: relative;
	top: -15px;
}
#Menu {
	position:absolute;
	bottom:0px;
	right:280px;
	width:auto;
	height:26px;
	overflow:hidden;
	padding: 0;
	margin-top:2px;
	background: #2f3490;
}
#Menu img {
	vertical-align:middle;
	float:left;
}
#Menu ul {
	height:100%;
	margin-right:10px;
}
#Menu li {
	float:right;
	padding: 4px 10px 6px 10px;
}
#Menu a {
	color: #fff;
	text-transform:uppercase;
	text-decoration:underline;
	font-size: 13px;
	font-weight:700;
}
#Menu span{
	color: #fff;
	text-transform:uppercase;
	font-size: 12px;
	font-weight:700;
}

#Menu .btnChangerMode.liste{
	background: url(../img/mode-liste.png) no-repeat left center;
	padding-left: 22px;
	margin-right: 10px;
}
#Menu .btnChangerMode.grille{
	background: url(../img/mode-grille.png) no-repeat left center;
	padding-left: 22px;
}
#Menu .maison {
	background: url(../img/home-icon.png) no-repeat left center;
	padding-left: 22px;
}

#ContentArea {
	position: fixed;
	top: 138px;
	left: 5px;
	bottom: 5px;
	right: 267px;
	padding: 10px 10px 0 10px;
	background-color: #fff;
	overflow-x: auto;

	/*margin: 0 auto 0 auto;*/
}
#zOvChargement { display: none; width: 100%; height: 100%; margin: -10px 0 0 -10px; position: fixed; background: rgba(255,255,255, 0.8) url(../img/ajax-loader.gif) no-repeat center 250px; z-index: 10; right: 267px; }

.boiteContenu {
	border: 1px solid #ccc;
}
#Footer {
	display: none;
	width:725px;
	overflow:hidden;
	padding: 3px 10px 3px 10px;
	background: #adc051;
	border-bottom: 1px solid #ffffff;
	border-top: 2px solid #ffffff;
	height:auto;
}
#Footer a, #Footer a:link, #Footer a:visited { color:#ffffff; text-decoration:none; }
#Footer a:hover { color:#374019; text-decoration:underline; }

/*
 * Boîte de détail de la commande
 */
#detailCommande_Wrap {
	float: right;
	width: 265px;
	height: 98%;
	margin-top: -135px;
}
#detailCommande {
	position:relative;
	top: 0px;
	left: 0;
	width: 255px;
	background-color: #fff;
	padding: 5px 5px 0 5px;
}

div.clear { clear: both; }
div.alDroite { text-align: right; position: relative; }
input.btnImage { width: 120px; background: #2f3490; text-align: center; color: #fff; border: #2f3490 1px solid; font-size: 11px; font-weight: bold; text-transform:uppercase; }
input[type="text"] { border: 1px solid #888894;	border-radius: 1px;	}
select { border: 1px solid #55555f; border-radius: 1px; background-color: #888894; }

#detailCommande div.titreCommande {  width: 248px; padding: 10px 0 10px 8px; margin: 0 0 2px 0; font-size: 16px; font-family: Arial; font-weight: bold; color:#fff; display:block; background:#404040; }
#detailCommande div + div.titreCommande { margin-top: 8px; }

/* Formulaire de recherche */
#detailCommande input#txtRecherche { width: 100%; }

#detailCommande input#btnRechercherStr { position: absolute; width: 16px; height: 16px; top: 2px; right: 6px; background: transparent url('../img/loupe.png'); border: none; }
#detailCommande input#btnReinit { margin: 8px 0 10px 0; }
#detailCommande select#selCategories { width: 100%; margin:15px 0 0 0; }
#detailCommande select#selCategories option.Type { font-weight: bold; color:#FFF; background-color: #3FB34F; }
#detailCommande select#selCategories option.Tuile { margin-left: 10px; }

#detailCommande #wrap_listeItems { padding: 0; height: 270px; overflow: auto; overflow-y: auto;position:relative; }
#detailCommande #listeItems { padding: 4px; }
#detailCommande #listeItems li {  position:relative; margin-top: 4px;}
#detailCommande #listeItems li span.Supprimer {  position: absolute; top: -1px; right: 0px; width:16px; height: 16px; background:url(../img/x_rouge.png); }
/* États d'une commande */
#detailCommande #listeItems li.Ok div.DetailLigne { background-color:#0A0; color: #fff; }
#detailCommande #listeItems li.Partiel div.DetailLigne { background-color:#FF3; color: #000; }
#detailCommande #listeItems li.NonOk div.DetailLigne { background-color:#A00; color: #000; }
/* Items de la liste de commande */
#detailCommande #listeItems div.Desc { font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; clear: both; color: #2f3490; padding: 2px; text-align: left; margin:0 16px 0 0; font-weight:bold; }
#detailCommande #listeItems div.DetailLigne { padding: 4px; margin:0; font-size:11px; }
#detailCommande #listeItems div.Qte { font-size: 11px; width: 42%; }
#detailCommande #listeItems div.Um { font-size: 11px; float:right; width: 28%; text-align: left; }
#detailCommande #listeItems div.PrixUni { font-size: 11px; float:right; width: 20%; text-align: right; }
#detailCommande #listeItems div.Prix { font-size: 11px; float:right; width: 20%; text-align: right; }

/* Zone du total de la commande */
#detailCommande div.totalCommande { border-top: 1px dotted #3fb34f; border-bottom: 1px dotted #3fb34f; color: #2f3490; font-size: 11px; font-weight: bold; padding: 4px; margin: 0 4px 0 4px; }
#detailCommande div.totalCommande div.Montant { float: right; width: 40%; text-align: right; }
/* Zone de chargement */
#detailCommande div.chargement { display: none; }
#detailCommande div.BlocOptions {  width: auto; color:#fff; padding: 5px; margin-top:0; }
#detailCommande div.BlocOptions .lienActionCommande { display:block; width:180px; padding: 5px 0 5px 0; text-align: center; margin: 0 auto 4px auto; color: #fff; background-color: #2f3490; font-weight: bold; font-size: 11px; text-decoration:none; border: none; text-transform: uppercase;}
#detailCommande #zPlacerCommande { display: none; }
#zPlacerCommande span{
	margin-top: 10px;
	font-size: 12px;
	color: #444;
	font-weight: bold;
}

#detailCommande div.BlocOptions .ui-datepicker table { font-size: 0.8em; }
#detailCommande div.BlocOptions #zDateLivraison { margin: 5px auto 5px auto; width: 215px; }
#detailCommande div.BlocOptions #zDateLivraison .ui-datepicker { width: 215px; }
div.msgBienvenu { margin: 10px 0 10px 0; }

/*
 * Entete avant la liste de prix
 */
div.enteteListe { padding: 0 0 10px 0; margin: 0 0 10px 0; }
div.enteteListe h2 { font-size: 17px; font-weight: bold; text-transform: uppercase;}
div.enteteListe .sousMenu { float: right; width: 250px; text-align:right; background-color: #ADC051; padding: 4px; }
div.enteteListe .sousMenu a { color: #fff; }

/*
 * Entete de liste de prix.
 */
#tblmHeader { margin-top: 15px; width: 683px; background-color: #D8F3DB}
#tblmHeader td { font-size: 1.7; text-align: justify; vertical-align:middle;  background-color: transparent; font-face: verdana; font-weight: bold;}
/*
 * Liste des produits - mode liste
 */
#tblListe { margin-top: 15px; }
#tblListe td { font-size: 0.7em; text-align: left; vertical-align:middle;  background-color: transparent; }
#tblListe th { font-size: 0.65em; font-family: Tahoma, Verdana; font-weight: bold; padding: 2px; }
#tblListe th.TitreCol { color: #888894; font-size: 11px; font-weight: normal; padding: 2px; }
#tblListe th.TitreType { text-align:left; font-size: 16px; font-family: Tahoma, Verdana; font-weight: bold; padding: 5px; border-bottom:1px dotted #3fb34f; color:#3fb34f; }
#tblListe th.TitreTuile { font-size: 14px; font-weight:bold; color:#3fb34f; }
#tblListe tr.SeperateurSTuile th { height: 2px; background-color:#fff; padding: 0; margin-bottom: 4px; }

#tblListe tr td { color:#404040; font-size:12px; height:26px; vertical-align:middle;  }
#tblListe tr.actif td { background-color: #c5e8ca;  }

#tblListe tr .Code { display: none; overflow: hidden; }
#tblListe tr .Desc { width: 325px; overflow: hidden; height: 20px; font-size: 0.9em;  }
#tblListe tr.produitFav .Desc { background: url(../img/etoile.png) left center no-repeat; padding-left: 18px; width: 282px; font-weight:bold; }
#tblListe tr.produitRecent .Desc { font-weight:bold; }
#tblListe tr .PhotoIcon { width: 20px; font-size: .85em; }
#tblListe tr .STuile { width: 95px; font-size: .85em; }
#tblListe tr .Prix { width: 50px; text-align: right; }
#tblListe tr .NbDispo { width: 55px; text-align: right; padding-right: 10px; }
#tblListe tr .UniteMesure { width: 65px; text-align: left; padding-right: 10px; }

/*
 * Liste des produits - mode tuiles
 */
#contenuListe div.trTitreType { clear: both; margin: 12px 0 5px 0; padding: 10px 0 0 0; }
#contenuListe div.trTitreType h3 { color: #3fb34f;border-bottom: 2px dotted #3fb34f; font-size: 16px; font-weight: bold; }
#contenuListe div.trTitreTuile { clear: both;  padding: 15px 0 5px 10px; }
#contenuListe div.trTitreTuile h4 { color: #888894; font-weight: bold; font-size: 14px; border-bottom: 2px solid #aaa; margin: 0 0 8px 0; }

#contenuListe div.zProduit { float: left; width: 250px; margin: 2px; border: 1px solid #999; padding: 5px; position: relative; }
#contenuListe div.zProduit.actif { background-color: #c5e8ca; border: 2px dotted #3fb34f; padding: 4px; }

div.zProduit div { font-size:12px; vertical-align: middle; height: 14px; }
div.zProduit  div.Desc { font-weight: bold; margin: 0 0 2px 0; height: 28px; vertical-align: bottom; font-size: 13px; line-height: 14px; }
div.zProduit  div.Code { display: none; }
div.zProduit  div.STuile { float: right; height: 14px; padding-top: 14px; }
div.zProduit  div.Photo { width: 175px; height: 175px; clear: both; margin: 4px auto 4px auto; overflow: hidden; position: relative; }
div.zProduit  div.Photo img { height: 100%; }
div.zProduit  div.Prix { height: 25px; line-height: 25px; }
div.zProduit  div.wrap_txtQte { float: right; height: 25px; line-height: 25px; }
div.zProduit  div.NbDispo { float: right; }

div.zProduit div.Prix div{
	float: right;
	width: 101px;
	position: relative;
	top: -1px;
}
div.zProduit div.Prix div .qte{
	font-size: 11px;
	line-height: 11px;
	color: red;
	margin: 0;
	vertical-align: baseline;
}


div.Instructions{
	width: 750px;
	padding:10px;
}
/*
 * Liste de prix disponibles
 */
.lesListeDePrix{
	position: relative;
	padding-right: 5%;
	width: 330px;
	float: left;
}
.ListeDePrix{
	float: left;
	width: 330px;
	padding: 5px;
	border: 1px solid #2c7d37;
	border-radius: 5px;
	margin: 0 20px 0 0;
	cursor: pointer;

	background:#a9e2b1;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#d4f0d8), to(#a9e2b1));
	background-image: -webkit-linear-gradient(top, #d4f0d8, #a9e2b1);
	background-image: -moz-linear-gradient(top, #d4f0d8, #a9e2b1);
	-moz-box-shadow:    4px 4px 4px 0px #ccc;
	-webkit-box-shadow: 4px 4px 4px 0px #ccc;
	box-shadow:         4px 4px 4px 0px #ccc;
}
.ListeDePrix+.ListeDePrix{
	margin-top: 20px;
}
.ListeDePrix:hover{
	background:#dcf3df;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#e0f4e3), to(#dcf3df));
	background-image: -webkit-linear-gradient(top, #e0f4e3, #dcf3df);
	background-image: -moz-linear-gradient(top, #e0f4e3, #dcf3df);
	-moz-box-shadow:    2px 2px 3px 0px #ccc;
	-webkit-box-shadow: 2px 2px 3px 0px #ccc;
	box-shadow:         2px 2px 3px 0px #ccc;
}
.ListeDePrix.deactivated{
	background: #dcdbda;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f1f0f0), to(#dcdbda));
	background-image: -webkit-linear-gradient(top, #f1f0f0, #dcdbda);
	background-image: -moz-linear-gradient(top, #f1f0f0, #dcdbda);
	border-color: #565655;
}
.ListeDePrix h2{
	margin: 0;
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: none;
	padding: 5px;
	border-bottom:1px dotted #196e24;
	color:#196e24;
	line-height: 18px;
	margin-bottom: 5px;
}
.ListeDePrix .DateLivraison{
	padding: 2px;
	font-size: 12px;
	color: #2f3490;
	line-height: 16px;
}
.ListeDePrix .DateLimite{
	color: #e1001a;
}
.ListeDePrix.selected{
	border: 1px solid #2c7d37;
}
.ListeDePrix.deactivated{
	cursor: default;
}
.ListeDePrix.deactivated h2{
	color: gray;
	border-bottom: 1px dotted gray;
}
.ListeDePrix.deactivated .DateLivraison,
.ListeDePrix.deactivated .DateLimite{
	color: gray;
}

/*
 * Page d'erreur
 */
div.Erreur div.Titre { font-size: 1.3em; color: #B00 }
div.Erreur div.Corps { font-size: 1em; }
table.tblIcones { margin: 20px 0 20px 0 }
table.tblIcones  td { text-align: center; }
table.tblTitre { margin: 20px 0 20px 0; }

/*
 * POP-UP des images de fleurs
 */
#blanket {
	background-color:#111;
	opacity: 0.65;
	filter:alpha(opacity=65);
	position:fixed;
	z-index: 9001;
	top:0px;
	left:0px;
	width:100%;
	height: 100%;
}

#popUpDiv {
	position:fixed;
	background-color:#eeeeee;
	left: 50%;
	top: 50%;
	/*width:300px;*/
	/*margin: -150px 0 0 -150px;*/
	/*height:300px;*/
	z-index: 9002;
}

/*
 * Style Généraux
 */
 span.Vendu {
	font-weight: bolder;
	color: #000;
 }

/*
 * Pour les différentes tailles d'écrans
 */
@media (max-width: 1270px) {
	#Header { height:50px; }
	#ContentArea { top: 54px; }
	#detailCommande_Wrap { margin-top: -50px; }
	div.zProduit  div.Photo { width: 100px; height: 100px; }
}
@media (min-width: 1271px) {
	#Header {height:135px;}
}

#zConnexion {
	float: right; width: 400px;
	font-size: 11px;
	color: #404040;
}
#zConnexion input.Texte {
	width: 80px;
	font-size: 11px;
	margin: 0 6px 0 0;
}

#tblListe tr.qte td{
	height: 16px;
}
#tblListe tr.qte .UniteMesure,
#tblListe tr.qte .Prix{
	color: red;
}


.align-left{
	text-align: left;
}
.align-right{
	text-align: right;
}
.align-center{
	text-align: center;
}

.Desc a{
	cursor: pointer;
}
.Desc a img{
	width: 15px;
	margin-right: 5px;
	height: auto;
	position: relative;
	top: 2px;
}

#zDateLivraison{
	width: 50%;
	float: left;
}
#zDateLivraison+h1{
	display: none;
}
#zDateLivraison .ui-datepicker-inline{
	min-width: 32em !important;
	width: 95% !important;
}
#zDateLivraison .ui-datepicker-group{
	float: left;
	width: 50%;
	height: 250px;
}
@media all and (max-width: 1190px) {
	#zDateLivraison .ui-datepicker-inline{
		min-width: inherit !important;
	}
	#zDateLivraison .ui-datepicker-group{
		float: left;
		width: 100%;
		height: 250px;
	}
}
#zDateLivraison .ui-state-default{
	background: yellow;
}
#zDateLivraison .ui-state-disabled span{
	background: none;
}
#timer{
	color: black;
}
#timer .time{
	font-weight: bold;
	color: black;
}


.termes-et-conditions{
	display: none;
	background: #ececec;
	padding: 10px 10px;

}
#cboxLoadedContent, #cboxContent{
	background: none !important;
}
.termes-et-conditions .texte{
	width: 100%;
	height: 200px;
	overflow-y: scroll;
	background-color: #dedbdb;
	border: 10px solid #dedbdb;
    color: #555555;
    margin-bottom: 15px;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
.termes-et-conditions .texte ul{
	font-size: 13px;
	line-height: 15px;
	list-style: square inside;
	padding-left: 10px;
}
.termes-et-conditions .buttons{
	clear: both;
}
.termes-et-conditions button{
	float: left;
	margin-right: 15px;
}
#cboxContent .termes-et-conditions{
	display: block;
}
.notes{
	font-size: small;
	margin-bottom: 10px;
}