/*
Exemple pour récupérer le chemin vers une images du modèle (geniecommerce/c/sx/images) :
background-image: url(/c/sx/images/mon-image.gif);

gc > geniecommerce
gcgd > ? semble être utilisé sur les groupes, mais aussi les inc_panier et la page article (page_article.jsp et page_article_img_a_droite.jsp)

*/


/* RESET */
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

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, font, 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 {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	/*background: transparent; commenté pour ie7*/
}
body {
	/*line-height: 1;*/
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* Modification du reset */
td {
	vertical-align: top;	
}

/* Include géniecube */
.geniecubecontenu {
	margin-bottom: 15px;	
}

.geniecubecontenu a {
	color: inherit;
	text-decoration: underline;	
}

/*******************************************************/
/* FORMULAIRE */
#gcecommerce select,
#gcecommerce input {
	border: 1px solid #b2babf;
	font-size: 11px; /* TODO: faire mieux, il ne faudrait pas redéfinir */
	color: #000000; /* TODO: demander confirmation */
	/*margin: 0 5px; TODO : nettoyer après suppression */
	vertical-align: baseline; /* TODO : pas sûr, rempalcer pas baseline, à supprimer */
}

#gcecommerce input[type="checkbox"],
#gcecommerce input[type="radio"] {
	margin-top: 1px;
	border: 0 none;
}

#gcecommerce select {
	-moz-box-sizing: content-box; /* TODO : les autres navigateurs ? */	
}

#gcecommerce textarea {
	border: 1px solid #b2babf;
	margin: 1px 5px 0;
}


/*******************************************************/
/* GROUPES */
/* TODO: est-ce que la class 'gcgdbloccontourd' permet d'identifier de façon certaine une groupe ? */
.gcgdbloccontourd {
	margin-bottom: 20px;
}

.gcgdbloccontourd .gcgdbloccontenu {
	background-color: #eef0f1;
	border-left: 1px solid #b2babf;
	border-right: 1px solid #b2babf;
	border-top: 2px solid #76828a;
	padding: 12px 0;
	overflow: auto;
}

.gcgdbloccontourd .gcgdblochead h1 {
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	background-color: #ffa93a;
	text-transform: uppercase;
	line-height: 22px;
	
	margin: 0; /* clear */
	padding: 0; /* clear */
	
	margin-bottom: 1px;
	padding-left: 9px;
}

.gcbttousproduits {
	clear: both;
	margin: 13px 0 0 6px;
	float: left;
	/width: 50%; /* ie7 */
}

.gcbttousproduits a {
	text-decoration: none;
}

.gcbttousproduits b {
	color: #434f58;
	font-size: 11px;
	text-decoration: underline;
	font-weight: normal;
	background: url(/c/sx/images/puce_1.gif) no-repeat 0 4px;
	padding-left: 10px;
}

/*******************************************************/
/* MINIE FICHE */
.gcproduitpetit {
	border-left: 2px solid #b2babf;
	border-right: 2px solid #b2babf;
	border-top: 1px solid #dadfe1;
	border-bottom: 1px solid #76828a;
	background-color: #fff;
	float: left;
	text-align: center;
	margin: 0 0 6px 6px;
	width: 186px; /* DOC */
}

.gcproduitpetit .gcbtnonenvente {
	float: right;
	width: 50%;
	margin: 4px 0 0 0;
}

/* icones de mise en avant sur les minies fiches et la fiche produit : les groupes 1 et 3 sont cachés par défaut */
.gcgroupe1,
.gcgroupe3 {
	display: none;	
}

/* pourcentage de réduction sur les minies fiches caché */
.gcproduitpetit #gcfichepourcentage,
.gcproduitpetit #gcfichepourcentagesolde {
	display: none;	
}

#gcfichepourcentage,
#gcfichepourcentagesolde {
	color: #ff3c00;
	font-size: 16px;
	font-weight: bold;
	font-style: italic;
	float: left;
	line-height: 41px;
	width: 65px;
	text-align: center;
	margin-left: 5px;
}

.gcproduitpetit .gcbloccontenu {
	padding: 4px;
	overflow: auto;
	/overflow: visible;	
}

.gcproduitpetit .gcblocimgpromo {
	background-color: #dadfe1;
	line-height: 17px;
	height: 17px;
	margin: -3px -4px 5px;
}

.gcproduitpetit .gcblocimgpromo .gcgroupe2, .gcproduitpetit .gcblocimgpromo .gcgroupe1, .gcproduitpetit .gcblocimgpromo .gcgroupe3  {
	margin: 0 3px;
}

.gcproduitpetit .gcblocimgpromo .gcgroupe4 {
	margin: 0 3px;
}

.gcproduitpetit .gclibelle {
	font-size: 12px;
	font-weight: bold;
	color: #000000;
	height: 14px; /* DOC */
}

.gcproduitpetit .gcreference {
	font-size: 10px;
	color: #76828a;
}
.gcproduitpetit .imgproduitg {
	margin: 5px auto;
	display: table;
}

.gcproduitpetit .gcimage {
	display: block;
	vertical-align: middle;
	height: 146px; /* DOC */
	width: 146px; /* DOC */
	overflow: hidden; /* TODO: normalement inutile, supprimer */
}

.gcproduitpetit .gcdescriptif {
	color: #76828a;
	padding: 6px 0;
	display: block;
	overflow: hidden;
	height: 22px; /* DOC */
}

/* [br] */
.gcproduitpetit .gcdescriptif > strong:first-child,
.gcproduitpetit .gcdescriptif > br { /* DOC */
	display: none;	
}

.gcproduitpetit .gc_dispo,
.gcproduitpetit .gcbtindisponible { /* TODO: fusionner avec le dessus ? */
	display: none;
}

.gcproduitpetit .gcblocportgratuit {
	height: 17px;	
}

.gcproduitpetit .gcblocportgratuit > span {
	width: 100%;
}

.gcproduitpetit .gcblocportgratuit .gcportgratuit {
	display: block;		
}

.gcproduitpetit .gcbtsavoirplus {
	float: left;
	background-color: #dadfe1;
	line-height: 23px;
	width: 50%;
}

.gcproduitpetit .gcbtsavoirplus a {
	color: #434f58;
	text-decoration: none;
	border-right: 3px solid #fff;
	display: block;
}

.gcproduitpetit .gcbtsavoirplus:hover {
	background-color: #b2babf;
}

.gcproduitpetit .gcbtcommander {
	background-color: #b2babf;
	line-height: 23px;
	text-align: center;
}

.gcproduitpetit .gcbtcommander a {
	color: #000000;
	text-decoration: none;
	display: block;
}

.gcproduitpetit .gcbtcommander:hover {
	background-color: #76828a;
}

.gcproduitpetit .gcbtsavoirplus b,
.gcbtcommander b {
	font-weight: normal;
}

.gcproduitpetit .gcbtcommander {
	float: right;
	width: 50%;
}

.gcproduitpetit .gcprixbarre {
	font-size: 12px;
	color: #434f58;
}

.gcproduitpetit .gcprix,
.gcproduitpetit .gcprixseul {
	font-size: 15px;
	font-weight: bold;
	color: #000000;
}






/* COMMUN */
#gcecommerce {
	color: #000000;
	margin-bottom: 15px;
}

#gcecommerce .obligatoire {
	color: #f00;	
}

.gcproduitpetit .gcblocimgpromo .gcgroupe4,
.gcproduitpetit .gcblocimgpromo .gcsolde,
#gcficheblocimgpromo .gcfichepromo,
#gcficheblocimgpromo .gcfichesolde {
	color: #ff3c00; /* TODO: cette couleur doit s'appliquer à tous les libellés */
	font-style: italic;
}

.gcproduitpetit .gcblocimgpromo .gcgroupe2,.gcproduitpetit .gcblocimgpromo .gcgroupe1, .gcproduitpetit .gcblocimgpromo .gcgroupe3,
#gcficheblocimgpromo .gcfichegroupe2, #gcficheblocimgpromo .gcfichegroupe1, #gcficheblocimgpromo .gcfichegroupe3  {
	color: #529200; /* TODO: cette couleur doit s'appliquer à tous les libellés */
	font-style: italic;
}
.gcproduitpetit .gcblocimgpromo .gcgroupe1,.gcproduitpetit .gcblocimgpromo .gcgroupe3,.gcproduitpetit .gcblocimgpromo .gcgroupepos2 {
	display: none;
}

.gcproduitpetit .gcblocportgratuit > span,
#gcficheportgratuit {
	color: #fe9500; /* TODO: cette couleur doit s'appliquer à tous les libellés de ce type */
	font-weight: bold; /* TODO: doit s'appliquer à tous les libellés de ce type */
}

#gcecommerce .gcbouton1 a,
#com_login_valider {
	line-height: 23px;
	padding: 4px 12px 4px 28px;
	height: 23px;
	margin-top: 10px;
	background: #b2babf url(/c/sx/images/puce_1.gif) no-repeat 11px 8px;
	color: #000000;
	text-decoration: none;
}

#gcecommerce .gcbouton1 a span {
	font-weight: bold;	
}

a[class^="apicto"] {
	display: none;
}

/* boutons d'action dans les étapes de commande */
div[id^="gcbtfincommande"] {
	float: left;
	width: 49%; /* TODO : 50% à tester... */
	overflow: auto;
	padding: 30px 0 15px 0;
	border-top: 5px solid #dadfe1;
}

div[id^="gcbtfincommande"] a {
	font-size: 14px;
	line-height: 27px;
	color: #000000;
	background-color: #dadfe1;
	padding: 0 10px;
	text-decoration: none;
	float: left;
	margin-left: 25%;
}

div[id^="gcbtfincommande"] a > b {
	font-weight: normal;
}

.gcblochead1 { /* TODO : pourrait être commun sauf que sur l'écran de login on n'a pas le même style */
	font-weight: normal;
	padding-left: 10px;
	display: block;
	line-height: 23px;
	background-color: #ffa93a;	
	color: #fff;
	margin-bottom: 1px;
}

.gcbloccontenu1 { /* TODO : je le sens pas, risque d'apparition du fond de couleur sur des écrans qui n'en ont pas besoin (compte connexion, compte création, panier 2 livraison */
	background-color: #eef0f1;
	padding: 15px 10px;
	font-size: 12px;
}

/* fiche produit, panier_1 et panier_3 */
#gcecotaxe {
	color: #76828a;
	text-align: right;
	font-size: 10px;
	position: relative;
	margin: -13px 9px 0 0;
}







/* TABLEAU */
#recapitulatifcommande {
	width: 100%;
	font-size: 12px;
	line-height: 16px;
	border-collapse: separate;
	color: #000000;
}

#recapitulatifcommande input[type="checkbox"] {
	margin: 0;
	vertical-align: middle;
}

#recapitulatifcommande .first {
	padding-left: 10px;	
}

#recapitulatifcommande .last {
	padding-right: 10px;	
}

#recapitulatifcommande .even td {
	background-color: #eef0f1;
}

#recapitulatifcommande th {
	background-color: #ffa93a;
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	line-height: 23px;
}

#recapitulatifcommande tbody .gcArticle td {
	border-top: 2px solid #fff;
	border-bottom: 1px solid #dadfe1;
	background-color: #f0f0f0;
}

#recapitulatifcommande .gcArticle td {
	vertical-align: top;
	padding-top: 5px;
	padding-bottom: 5px;
}

#recapitulatifcommande .gcArticleLibelle {
	float: left;
	clear: both;
	margin-bottom: 5px;
	font-size: 12px;
	color: #000000;
}

#recapitulatifcommande .gcArticleRef {
	float: left;
	clear: both;
}

#gcbtfincommandepanier a {
	float: right;
	margin-left: 0;
	margin-right: 25%;
	background-color: #b2babf;
}

.prixunitht,
.totalht,
.gcCodePromotionnel,
.gcArticleRef,
.gcUtiliserAvoir {
	color: #434f58;
}

#recapitulatifcommande .gcArticleCadeau {
	float: left;
	clear: both;
}

#recapitulatifcommande .gcTotalDesArticlesHT td {
	display: none;
	visibility: hidden;
}

#recapitulatifcommande .gcTotalDesArticlesTVA td {
	display: none;
	visibility: hidden;
}

#recapitulatifcommande .gcTotalDesArticlesTTC td {
	background-color: #dadfe1;
	line-height: 50px;
	border-top: 2px solid #fff;
	border-bottom: 1px solid #b2babf;
}

#recapitulatifcommande .gcCodePromotionnel td {
	background-color: #eef0f1;
	padding-top: 20px;
	padding-bottom: 20px;
	border-top: 2px solid #fff;
}

#com_codepromo_edit {
	vertical-align: middle;
}

#com_codepromo_valider {
	background-color: #b2babf;
	color: #434f58;	
	font-size: 11px;
	text-decoration: none;
	border: 0 none;
	height: 17px;
	line-height: 17px;
	vertical-align: bottom;
	margin-left: -3px;
	padding: 0;
	cursor: pointer;
}

.gcCodePromotionnelErreur,
.gcAvoirSolde {
	color: #f00;
}

.alignright.prix {
	padding-right: 70px;	
}

#recapitulatifcommande .gcPanierTableauSeparation {
	margin: 0 20px;
	border: 0 none;
	border-top: 1px dotted #76828a;
}

#recapitulatifcommande tfoot .gcPanierTableauSeparation {
	margin: 0;
	border-top: 1px solid #fff;
	border-bottom: 2px solid #ffa93a;
}

#recapitulatifcommande .gcPanierTotalHT td {
	display: none;
	visibility: hidden;
}

#recapitulatifcommande .gcPanierTotalTVA td {
	display: none;
	visibility: hidden;
}

#recapitulatifcommande .gcPanierTotalTTC td {
	line-height: 50px;
	border-top: 2px solid #fff;
	border-bottom: 1px solid #b2babf;
	background-color: #dadfe1;
}

#recapitulatifcommande .gcUtiliserAvoir td {
	background-color: #eef0f1;
	padding-top: 20px;
	padding-bottom: 20px;
}

.gcAvoirMontant {
	display: block;	
	font-weight: bold;
	color: #000000;
}

#recapitulatifcommande .gcPanierTotalNetFinal td {
	line-height: 50px;
	border-top: 2px solid #fff;
	border-bottom: 1px solid #b2babf;
	background-color: #dadfe1;
}

#recapitulatifcommande .gcPanierTotalNetFinal .prix {
	font-weight: bold;
	font-size: 14px;	
}

#recapitulatifcommande .alignleft {
	text-align: left;
}

#recapitulatifcommande .gcCoutEmballageCadeauHT td {
	display: none;
	visibility: hidden;
}

#recapitulatifcommande .gcCoutEmballageCadeauTVA td {
	display: none;
	visibility: hidden;
}

#recapitulatifcommande .gcCoutEmballageCadeauTTC td {
	background-color: #eef0f1;
	padding-top: 20px;
	padding-bottom: 20px;
}

#recapitulatifcommande .gcPanierFraisdePortHT td {
	display: none;
	visibility: hidden;
}
#recapitulatifcommande .gcPanierFraisdePortTTC td {
	background-color: #eef0f1;
	padding-top: 20px;
	padding-bottom: 20px;
}

#recapitulatifcommande .ligneTotalHT td {
	display: none;
	visibility: hidden;
}
#recapitulatifcommande .ligneTotalTVA td {
	display: none;
	visibility: hidden;
}
#recapitulatifcommande .ligneTotalTTC td {
}

#recapitulatifcommande .alignright {
	text-align: right;
}

.gcheadprixunit {
	width: 70px;	
}

.gcheadprixtotal {
	width: 80px	
}

.gcheadsup {
	width: 60px;	
}

.gcheadquant {
	width: 50px;	
}

/* redéfinition #gcecotaxe (panier_1 et panier_3) */
.gcEcopart {
	display: block !important;
	margin: 0 !important;	
	text-align: left !important;
	float: left;
	clear: both;
}

#gcpaniervide {
	margin-bottom: 15px;
}



/* DISPONIBILITE */
.gc_dispo {
	right: 0;
	background-color: #eef0f1;
	width: 100%;
}

.gc_dispo > div {
	float: right;
	margin: 0 10px;
	background: url(/c/sx/images/stock_1.gif) no-repeat 0 3px;
	font-size: 12px;
	font-weight: bold;
	color: #4a9500;
	padding-left: 15px;
	position: relative;
	z-index: 999;
}

.gc_dispo > .gc_dispo_stock_limite {
	background-image: url(/c/sx/images/stock_2.gif);
	color: #ff5a00;
}

.gc_dispo > .gc_dispo_stock_vide {
	background-image: url(/c/sx/images/stock_3.gif);
	color: #d40000;
}
/*************************/

/* Popup des Conditions Générales de Vente */
.popupCdv {
	background: 0 none;
	padding: 10px; 	
}

/******************************/
/* CARROUSEL DE MINIES FICHES */
/* Onglets */
#gcScrollable ul {
	border-bottom: 4px solid #ffa93a;
	margin: 0 0 1px 0;
	overflow: auto;
}

#gcScrollable li {
	float: left;
	background: #dadfe1;
	cursor: pointer;
	margin: 0 2px 0 0;
}

#gcScrollable li:hover {
	background: #b2babf;	
}

#gcScrollable li.current {
	background-color: #ffa93a;
}

#gcScrollable .gcbloctitre {
	float: left;
	color: #fff; /* SX */
	text-transform: uppercase;
	border: 2px solid #fff;
	border-width: 2px 0 2px 0;
	padding: 4px 24px 2px;
}

#gcScrollable li.current .gcbloctitre {
	border-color: #ffa93a;
}

#gcScrollable.unique li {
	display: block;
	margin: 0;
}

#gcScrollable.unique .gcbloctitre {
	float: none;
}

#gcScrollable .gcgdbloccontenu {
	position: relative;
	overflow: hidden;	
}

/* jQueryTools Scrollable root */
#gcScrollable .root {
	position:relative;
	overflow:hidden;
	margin: 0 37px;
	height: 365px; /* SX */
}

/* jQueryTools Scrollable items */
#gcScrollable .items {
	width:20000em;
	position:absolute;
	padding: 12px 0 21px 0;
}

/* jQueryTools Scrollable pages (ajoutées en javascript) */
#gcScrollable .items > div {
	float:left;
	/*margin: 0 37px;*/
}

/* Boutons suivants et précédent */
#gcScrollable .next,
#gcScrollable .prev {
	position: absolute;
	top: 2px;
	left: 0;
	display: block;
	width: 40px;
	height: 100%;
	cursor: pointer;
	background: #eef0f1 url(/c/sx/images/scrollable_prev.gif) no-repeat 50% 50%;
}

#gcScrollable .next {
	left: auto;
	right: 0;
	background-image: url(/c/sx/images/scrollable_next.gif);
}

/* La largeur des minies fiches change du fait de la présence de flèches de défilement (next et prev) */
#gcScrollable .gcproduitpetit {
	width: 204px;
}

#gcScrollable .gcproduitpetit.invisible {
	visibility: hidden;	
}

/* Bouton pour voir tous les articles d'un groupe (déplacé en javascript) */
#gcScrollable .gcbouton {
	position: relative;
	margin: -28px 0 0 46px;
}

#gcScrollable .gcbouton:hover b {
	text-decoration: none;
}

/* Spécifique page d'accueil */
#pageaccueil #gcScrollable .root {
	height: 279px; /* SX */
}
 
#pageaccueil #gcScrollable .gcbtsavoirplus,
#pageaccueil #gcScrollable .gcbtcommander {
	background: none;	
}

#pageaccueil #gcScrollable .gcbtsavoirplus a,
#pageaccueil #gcScrollable .gcbtcommander a {
	color: #434f58;
	text-decoration: underline;
}

#pageaccueil #gcScrollable .gcbtsavoirplus a:hover,
#pageaccueil #gcScrollable .gcbtcommander a:hover {
	text-decoration: none;
}

#pageaccueil #gcScrollable .gcreference,
#pageaccueil #gcScrollable .gcblocimgpromo,
#pageaccueil #gcScrollable .gcdescriptif {
	display: none;
}
/******************************/