

.tab-nav > li > a {font-weight: normal; color: #8c8c8c;}
.tab-nav > li.active > a {box-shadow: 0 1px 0 0 #ffffff; color: #3c3c3c;}

.table.resumePanier thead {height: 30px; line-height: 30px; background-color: transparent; border-top: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0; color: #3c3c3c; font-weight: normal;}
.table.resumePanier div {padding: 5px;}

.achat header h1 {font-size: 1.714rem; font-size: 24px; margin-bottom: 30px; margin-top: 10px; border-bottom: 1px solid #e8e8e8;}

.nouveauClient > div.twelve, .monCompte > div.twelve {background: #ffffff url("../images/decorations/tex-swirl_pattern.png") repeat scroll 16px 43px ; padding: 1.3%;}

@media only screen and (max-width: 768px) {
	.nouveauClient > div.twelve, .monCompte > div.twelve {padding: 0;}
	}
.nouveauClient > div.twelve > div, .monCompte > div.twelve > div {background-color: #ffffff;  padding: 1%;}

#mdpOublie {font-size: 0.8571rem; font-size: 12px;}

/*FILARIANE*/
.breadcrumb ul {margin-bottom: 80px; margin-left: 0 !important;}
.breadcrumb li {min-height: 40px; line-height: 40px; position: relative; overflow: visible; background-color: #e8e8e8; z-index: 2; }
.breadcrumb li:first-child {margin-left: 0 !important; }
.breadcrumb li.active {background-color: #e70808; color: #ffffff;}
@media only screen and (min-width: 768px) {
	.breadcrumb li {padding-left: 15px;}
	.breadcrumb li:after {content: ""; width: 0; height: 0; border-style: solid; border-width: 21px 0 21px 21px; border-color: transparent transparent transparent #e8e8e8; position: absolute; right: -20px; top: 0; background-color: #e8e8e8; z-index: 1;}
	.breadcrumb li:nth-last-child(1):after {background-color: #fff;}
	.breadcrumb li.active:after {border-color: transparent transparent transparent #e70808;}
	.breadcrumb.livraison li.active:after {border-color: transparent transparent transparent #e70808; background-color: #e70808;}
	.breadcrumb.livraison li:nth-last-child(2):after {background-color: #e8e8e8;}
	.breadcrumb.paiement li.active:after {border-color: transparent transparent transparent #e70808; background-color: #e70808;}
}


/*BTN PRECEDENT SUIVANT*/
.prev-next_btn li {height: 40px; line-height: 40px; -webkit-transition: border .3s ease-in-out; -moz-transition: border .3s ease-in-out; -ms-transition: border .3s ease-in-out; -o-transition: border .3s ease-in-out; transition: border .3s ease-in-out; -webkit-transition: background-color .7s ease-in-out;
-moz-transition: background-color .7s ease-in-out;
-ms-transition: background-color .7s ease-in-out;
-o-transition: background-color .7s ease-in-out;
-webkit-transition: box-shadow .35s ease-in-out;
-moz-transition: box-shadow .35s ease-in-out;
-ms-transition: box-shadow .35s ease-in-out;
-o-transition: box-shadow .35s ease-in-out;
transition: box-shadow .35s ease-in-out;
}
.prev-next_btn li:hover {border: 1px solid  #e70808; background-color: #e70808; box-shadow: 0 0 0 3px #ffffff inset;}
.prev-next_btn li:hover a, .prev-next_btn li:first-child:hover a {color: #ffffff;}
.prev-next_btn li a{display: block; -webkit-transition: all .6s ease-in-out;
-moz-transition: all .6s ease-in-out;
-ms-transition: all .6s ease-in-out;
-o-transition: all .6s ease-in-out;
transition: all .6s ease-in-out;}
.prev-next_btn li:first-child a {color: #3c3c3c; }

/*PANIER*/
.product > div {margin-bottom: 20px;}
.product label {display: inline-block; width: auto; margin-right: 10px; font-weight: normal;}
.product input[type="text"] {display: inline-block; width: 30%;}
.product .secondary.btn, .product .secondary.btn a{color: #8c8c8c;}
.product span {display: inline-block; width: auto; min-width: 80px; margin-right: 10px; text-align: right; color: #8c8c8c; font-weight: normal;}
.product a.border {display: inline-block; color: #8c8c8c; padding: 5px 10px; border-radius: 2px; font-weight: normal; -webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;}
.product a.border:hover {color: #e70808; border: 1px solid #e70808; box-shadow: 0 0 1px 0 #e70808;}
@media only screen and (max-width: 768px) {
	.product .designation {margin:10px 0px 20px;}
	.product a.border {margin: 20px 0;}
	}


.pub-livraison li {margin-bottom: 16px; font-weight: normal;}
.pub-livraison li > div:first-child {width: 110px; vertical-align: middle;}
.pub-livraison li > div+div {width: calc(99% - 110px);}
.pub-livraison li > div:first-child .rich input[type="radio"] ~ label:before{top: -3px;}
.pub-livraison li > div:first-child img{width: 46px !important; vertical-align: middle;}


/*LIVRAISON*/
.drawer, .drawer.active {background-color: #ffffff !important; box-shadow: none !important;}

/*PAIEMENT*/
#etapeFinalepaiement .centered a {display: block; text-align: center; font-size: 0.8571rem; font-size: 12px;}



#modal-cheque > .content, .modal-chequeCadhoc > .content{min-height: 453px;}
/*#CloseModalCheque, #CloseModalCodhoc {height: 32px; display: none;}*/
div[id^="CloseModal"]{height: 32px; display: none;}
/*#PaiementModalCheque, #RetourModalCheque, #PaiementModalCadhoc, #RetourModalCadhoc {height: 32px;}*/
div[id^="PaiementModal"], div[id^="RetourModal"]{height: 32px;}
#RetourModalAchat, #CloseModalAchat, #PaiementModalAchat {display: none;}

.relayBox {float: left; width: 33.3%; min-height: 100px; margin-bottom: 30px;}
.relay h2 {font-size: 1.143rem; font-size: 16px;}
.relay h3 {font-size: 1rem; font-size: 14px; font-weight: bold; color: #B70158;}
.relay select {height: 30px !important;}
.relay .btn.primary {height: 31px; line-height: 31px; margin-top: 35px;}
.relay .btn.primary.m0 {height: 21px; line-height: 21px; background-color: #ffffff; border: 1px solid #B70158;}
.relay .btn.primary.m0 a{color: #B70158; font-size: 0.8571rem; font-size: 12px;}
.relay button {vertical-align: middle; background-color: transparent; border: none; padding: 0; margin: 0; cursor: pointer;}
.relay button img {width: 49px; height: 38px;}
.relay p {line-height: 1.2;}


.choixMagasin .card {float: left; width:calc(33.3% - 16px); min-height: 168px; margin-right: 16px; margin-bottom: 50px;}
.choixMagasin h2 {font-size: 1rem; font-size: 14px; font-weight: bold; color: #DD0101; line-height: 1.2;}
.choixMagasin .btn.primary.m0 {height: 21px; line-height: 21px; background-color: #ffffff; border: 1px solid #DD0101;}
.choixMagasin .btn.primary.m0 a{color: #DD0101; font-size: 0.8571rem; font-size: 12px;}



/*SUIVI COMMANDE*/
.survolTR {cursor: pointer;}
#modal-retour-content {max-height: 89%; top: 6%;}
#modal-retour-content label {font-weight: bold;}
#modal-retour-content .picker {width: 100%; margin-left: 0;}
#modal-retour-content .picker:after {content: "";}
#modal-retour-content select {width: 100%;}



@media only screen and (max-width: 768px) {
	.breadcrumb {display: none;}
	#modal-cheque > .content, .modal-chequeCadhoc > .content { min-height: 10%; height: auto; max-height: 90%; }
	div[id^="RetourModal"] {float: none; margin-bottom: 10px;}
	div[id^="PaiementModal"] {float: none;}
	.relayBox {float: left; width: 100%; margin-bottom: 30px;}
	.relayBox > div.two.columns {float: left; width: 25%;}
	.relayBox > div.ten.columns {float: left; width: calc(100% - 25%) !important;}
	.relayBox .primary.primaryAlterna {float: right;}
	}