@import url(global.css);
@import url(header2.css);

/*panier vide*/

#panier-vide{
padding-bottom: 30px;
}

.mess-p-vide{
font-size: 130%;
}

/* table */
.bloc-panier table{
width: 100%;
margin-bottom: 25px;
border-collapse: collapse;
}

.bloc-panier th{
text-align: left;
padding: 0px 5px 0px 5px;

}

.bloc-panier td{
border-bottom: thin #ccc solid;
padding: 5px 0px 25px 0px;
}

.bloc-panier td:nth-child(2){
padding: 0px 10px 0px 10px;
width: 27%;
}

.bloc-panier thead{
background-color: #f8f8f8;
max-height: 50px;
}

/*Table img*/
.bloc-panier img{
display:block;
margin: auto;
}

/*Champ produit*/

.produit a{
font-size: 100%;
font-family: "Helvetica Neue", helvetica, arial, sans-serif;
color: #222;
}

.produit p{
margin-top: 5px;
font-size: 80%;
font-family: "Helvetica Neue", helvetica, arial, sans-serif;
color: #555;
font-style: italic;
text-transform: lowercase;
}

.pourcent, .prixOri, .economie{
display: inline;
font-size: 85%;
margin: 0px;
}

.pourcent{
opacity: 0.8;
padding: 1px;
background-color: #ffcc33;
color: #333;
border-radius: 5px;
border: thin #777 solid;
font-weight: 600;
text-shadow: 0.5px 0.5px #fff;
}

.prixOri{
text-decoration: line-through;
margin-left: 10px;
}

/*Champ produit livraison*/

.livSelected{
font-family: "Helvetica Neue", helvetica, arial, sans-serif;
font-size: 80%;
color: #777;
font-style: italic;
}

.livSelected a{
color: #336699;
}

.livSelected p{
margin-bottom: 0px;
}

.livSelected .marg{
margin-top: 0px;
}

.livSelected .marg2{
margin-top: -15px;
}

.imgIcone{
color: #333;
}

.imgIcone img{
margin: 0px;
}

.choix {
padding-top: 20px;
color: #336699;
}

.choix a{
color: #336699;
}

/*Quantité*/
.quantite input{
max-width : 50px;
line-height: 30px;
text-align: center;
border: thin #ccc solid;;
}

/* Total Panier */

#bloc-total{
width: 30%;
float: right;
margin-right: 8%;
font-family: "Helvetica Neue", helvetica, arial, sans-serif;
font-size: 85%;
padding-bottom: 100px;
}

#bloc-total h3{
font-size: 170%;
letter-spacing: 1px;
font-weight: 400;
}

#bloc-total table{
width: 100%;
border-collapse: collapse;
}

#bloc-total tr{
height: 20px;
}

#bloc-total tr:nth-child(1){
font-weight: 600;
}

#bloc-total tr:nth-child(4){
font-size: 120%;
height: 50px;
}

#bloc-total td:first-child{
width: 30%;
background-color: #f8f8f8;
color: #222;
}

#bloc-total td:nth-child(2){
text-align: right;
padding-right: 40px;;
}

#bloc-total input{
width: 100%;
margin-top: 30px;
padding: 5px 0px 5px 0px;
background-color: #333;
color: #fff;
transform: scaleY(1.5);
letter-spacing: 1px;
}

#bloc-total input:hover{
cursor: pointer;
}

/* Livraison */

#livraison table{
width: 100%;
}

/* Message */

.message{
margin-top: 100px;
display: flex;
height: 50px;
justify-content: center;
align-items: center;
}

a.bt-retour {
padding: 5px 20px 5px 20px;
margin-left: 20px;
color: #fff;
background-color: #336699;
position: relative;
top: 15px;
}

.message img{
position: relative;
top: 15px;
}

a.bt-retour:hover {
background-color: #337799;
}

/* RESPONSIVE */

@media screen and (max-width:959px){

/* Block */
.bloc-panier td, .bloc-panier tr { 
display: block; 
}

/*En tête cachée */
.bloc-panier thead tr { 
display: none;
}
	
	.bloc-panier tr { border: none; }
	
	.bloc-panier td { 
		border: none;
		position: relative;
		text-align: right;
		padding: 5px 0px 5px 0px;		
	}

/* Image produit*/
.bloc-panier td:nth-child(1){
width: 30%;
float: left;
margin: -20px 20px 10px 0px;
}

.imgProduit img{
width: 100%;
}

/* Nom produit */

.bloc-panier td:nth-child(2){
width: auto;
margin-left: 30%;
margin-top: 25px;
text-align: left;
font-size: 150%;
}

.choix a{
padding-top: 0px;
font-weight: 600;
}

.bloc-panier td:nth-child(3){
text-align: left;
margin-left: 35%;
font-size: 120%;
}

.bloc-panier td:last-child{
padding-bottom: 25px;
border-bottom: thin orange solid;
}

.bloc-panier img {
display: inline;
margin: 10px;
}

	.bloc-panier td:before { 
		position: absolute;
		left: 35%;
		content: attr(data);
		font-weight: 600;
	}
	
#bloc-total{
width: 50%;
float: none;
margin-right: 0%;
margin-left: 45%;
}
	
	
}

@media screen and (max-width: 600px){
	
	.bloc-panier td { 
		border: none;
		position: relative;
		text-align: right;
		padding: 5px 0px 5px 0px;		
	}

/* Image produit*/
.bloc-panier td:nth-child(1){
width: 150px;
float: none;
margin: 0px;
margin: auto;

}

/* Nom produit */

.bloc-panier td:nth-child(2){
width: auto;
margin-left: 0%;
margin-top: 0px;
padding-left: 0px;
}

.bloc-panier td:nth-child(3){
margin-left: 0%;
}

	.bloc-panier td:before { 
		position: absolute;
		left: 0%;
	}
	
#bloc-total{
width: 100%;
margin-left: 0%;
}
	
	
}