@import url('https://fonts.googleapis.com/css2?family=Quantico:ital,wght@0,400;0,700;1,400;1,700&family=Reddit+Sans:ital,wght@0,200..900;1,200..900&display=swap');
/*
@font-face {
  font-family: Prohibition;
  src: url(./fonts/Prohibition-Oblique.otf);
  font-weight: 400;
}
*/

*{
padding:0px;
border:0px;
margin:0px;
}

html{
width:100%;
margin: auto;
scroll-behavior: smooth;
}

.main_width{
width:85vw;
margin:auto;
}


body{
font-family: 'Reddit Sans', sans-serif;
font-weight:400;
width:100%;
}



/* *********************** COMMON *********************** */

p{
color:#16110b;
line-height:24px;
font-size:14px;
letter-spacing: 1px;
}

p+p{
margin-top: 15px;
}

p strong{
font-weight:700;
}

h1{ 
font-family: 'Prohibition', 'Quantico', sans-serif;
text-transform: uppercase;
color: #e0e0e0;
font-size: 51px;
font-weight: 400;
line-height: 52px;
}

h2{
font-family: 'Prohibition', 'Quantico', sans-serif;
text-transform: uppercase;
font-size: 39px;
font-weight: 600;
line-height: 42px;
display: block;
width: fit-content;
background: linear-gradient(66deg, rgba(230, 86, 28, 1) 17%, rgba(25, 25, 25, 1) 85%);
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
padding-left: 2px;
padding-right: 6px;
}

.button{ 
	display: inline-block;
	vertical-align: middle;
	background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
	cursor: pointer;
	color: white;
	position: relative;
	padding: 6px 15px;
	font-size: 18px;
	border: 0;
	border-radius: 0;
}

a.button:hover{
}

a{
color:inherit;
text-decoration: none;
}

p a{
text-decoration: underline;
}

.microdata{
display:none;
}


/* *********************** HEADING MSG*********************** */
#heading{
width: 100%;
text-align: center;
background-color: #fff;
height: auto;
background: #BF1822;
background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
background-size: 400% 400%;
animation: gradient 3s ease infinite;
overflow: hidden;
white-space: nowrap;
position: relative;
height: 31px;
transition: all 0.4s;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

#heading p{
padding: 7px 0;
font-weight: 500;
line-height: 17px;
font-size: 11px;
text-transform: uppercase;
color: #fff;
letter-spacing: 2px;
text-align: center;
display: inline-block;
animation: scrollText 20s linear infinite;
}

@keyframes scrollText {
  0% {
    transform: translateX(70%);
  }
  100% {
    transform: translateX(-70%);
  }
}

/* *********************** BANNER/MENU*********************** */
#banner{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
	padding: 0 0 10px;
	background-color: #fff;
	z-index: 100;
}

#banner .eshop-important{
	background-color: #191919;
	padding: 6px 0;
	margin-bottom: 12px;
}

#banner .eshop-important p{
	line-height: 17px;
    font-size: 11px;
    text-transform: uppercase;
    color: #fff;
    letter-spacing: 2px;
	text-align: center;
	display: grid;
}

/* Les 3 messages sont empilés dans la même cellule de grille : la hauteur du bandeau
   s'ajuste au message le plus long et ils défilent l'un après l'autre. */
#banner .eshop-important p span{
	grid-area: 1 / 1;
	display: block;
	width: 100%;
	margin: 0;
	opacity: 0;
	animation: eshop_important_defilement 15s infinite;
}

#banner .eshop-important p span:nth-of-type(2){
	animation-delay: 5s;
}

#banner .eshop-important p span:nth-of-type(3){
	animation-delay: 10s;
}

@keyframes eshop_important_defilement{
	0%{
		opacity: 0;
		transform: translateY(6px);
	}
	3%{
		opacity: 1;
		transform: translateY(0);
	}
	30%{
		opacity: 1;
		transform: translateY(0);
	}
	33%{
		opacity: 0;
		transform: translateY(-6px);
	}
	100%{
		opacity: 0;
		transform: translateY(-6px);
	}
}

/* Si l'utilisateur a demandé de réduire les animations, on n'affiche que le premier message */
@media (prefers-reduced-motion: reduce){
	#banner .eshop-important p span{
		animation: none;
	}
	#banner .eshop-important p span:first-of-type{
		opacity: 1;
	}
	#banner .eshop-important p span+span{
		display: none;
	}
}


#banner .eshop-important p span:last-of-type:after {
	display: none;
}



#banner>.main_width{
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#banner .logo{
	width: 176px;
	height: auto;
	transition: all 0.4s;
}

#banner .logo img{
	width: 100%;
	height: auto;
}

#banner .content{
	flex: 1;
	margin-left: 40px;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

#banner .content .sub_menu{
position: fixed;
top: 45px;
right: -400px;
width: 350px;
max-width: 100%;
height: auto;
margin: 0;
transition: all 0.6s;
z-index: 101;
}

#banner .content .sub_menu.open{
right: 0;
}

#banner .content .sub_menu ul {
text-align: left;
padding: 16px 0 25px;
list-style: none;
}

#banner .content .sub_menu ul li{
	padding: 10px 20px;
}

#banner .content .sub_menu ul a{
text-decoration: none;
font-size: 14px;
color: #fff;
text-transform: uppercase;
}

#banner .eshop-actions{
	display: inline-block;
	vertical-align: middle;
}

#banner .eshop-actions form{
display: inline-block;
margin-right: 15px;
vertical-align: middle;
}

#banner .eshop-actions input[type="text"]{
border: 1px solid #aaaaaa;
background-color: white;
padding: 10px;
border-right: none;
height: 30px;
box-sizing: border-box;
vertical-align: middle;
width: 105px;
font-size: 14px;
border-radius: 0;
}

#banner .eshop-actions input[type="submit"]{
display: inline-block;
width: 30px;
height: 30px;
vertical-align: middle;
background-color: white;
border: 1px solid #aaaaaa;
border-left: none;
cursor: pointer;
background-image: url(images/icon-search.svg);
background-repeat: no-repeat;
background-position: center;
background-size: 15px;
border-radius: 0;
}

#banner .eshop-actions>a{
display: inline-block;
vertical-align: middle;
text-decoration: none;
height: 17px;
position: relative;
}

#banner .eshop-actions>a+a{
margin-left: 15px;
position: relative;
}

#banner .eshop-actions .cart-count{
color: white;
background-color: #e6561c;
position: absolute;
top: -7px;
right: -7px;
width: 14px;
height: 14px;
text-align: center;
border-radius: 20px;
font-size: 10px;
line-height: 14px;
}

#banner .eshop-actions .infos_cart{
	position: absolute;
	left: 50%;
	top: 35px;
	transform: translateX(-50%);
	width: 300px;
	max-width: 64vw;
	padding: 20px;
	height: auto;
	border: 1px solid #e6561c;
	z-index: 1000;
	background-color: #fff;
	font-size: 13px;
	boc-sizing: border-box;
	animation: infos-cart 7.8s ease-out;
	animation-fill-mode: forwards;
}

@keyframes infos-cart {
  0% { top: -50px; opacity: 0; }
  10% { top: 35px; opacity: 1; }
  95% { top: 35px; opacity: 1; }
  100% { top: -50px; opacity: 0; }
}

#banner .eshop-actions .infos_cart:after {
	bottom: 100%;
	left: 172px;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-top-color: #e6561c;
	border-width: 10px;
	margin-left: -10px;
	transform: rotate(180deg);
}

#banner .eshop-actions .infos_cart:before{
	content:'';
	position: absolute;
	right: 0;
	bottom: 0;
	height: 6px;
	background-color: #16110b;
	animation: infos-cart-duration 7.0s linear;
}

@keyframes infos-cart-duration {
  0% { width: 100%;}
  100% { width: 0%; }
}



@media screen and (max-width: 1500px) {
  #banner .eshop-actions .infos_cart{
	left: unset;
	right: -21px;
	transform: none;
  }
  #banner .eshop-actions .infos_cart:after{
	left: unset;
	right: 22px;
  }
}

#banner .eshop-actions .animated .cart-count{
animation: pop-cart 1.0s ease-out;
}

@keyframes pop-cart {
  0% { transform: scale(1); opacity: 0; }
  25% { transform: scale(1.5); opacity: 1; }
  50% { transform: scale(0.7); opacity: 1; }
  75% { transform: scale(1.5); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}

#banner .eshop-actions>a img{
width: auto;
height: 100%;
}

#banner .eshop-actions>a span.name{
font-size: 13px;
color: #aaaaaa;
font-weight: 500;
display: inline-block;
max-width: 90px;
height: 18px;
line-height: 18px;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}

#banner #eshop_menu{
position: absolute;
left: 0;
bottom: -27px;
background: #BF1822;
background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
text-align: right;
width: 100%;
height: 30px;
}

.menu-links{
cursor: pointer;
}

.menu-links.close{
display: inline-block;
position: absolute;
left: 20px;
top: 20px;
width: 19px;
height: auto;
z-index: 400;
}

.menu-links.close img{
width: 100%;
height: auto;
}

.menu-links.open{
color: #fff;
text-transform: uppercase;
line-height: 30px;
display: block;
width: fit-content;
margin: 0 0 0 auto;
}

.menu-links.open img{
position: relative;
left: 5px;
top: 4px;
}

.burger{
position: fixed;
top: 0;
right: -400px;
width: 350px;
max-width: 100%;
height: 100vh;
padding-top: 25px;
margin: 0;
-webkit-box-shadow: 0px 2px 15px 0px #363636;
box-shadow: 0px 2px 15px 0px #363636;
transition: all 0.6s;
overflow-y: auto;
z-index: 100;
background-color: #191919;
}

.burger.open{
right: 0;
}

.burger ul {
text-align: left;
padding: 255px 0 25px;
list-style: none;
position: relative;
}

.burger ul:after{
	content: '';
	position: absolute;
	left: 20px;
	width: calc(100% - 40px);
	top: 247px;
	height: 1px;
	background-color: #ffffff57;
}

.burger ul li{
	padding: 10px 20px;
}

#banner .burger ul a{
text-decoration: none;
font-size: 14px;
color: #fff;
text-transform: uppercase;
}

#banner .burger .sub-menu{
display: none;
}

#wrapper{
padding-top: 130px;
min-height: 450px;
}

#heading+#banner+#wrapper{
padding-top: 200px;
}


/* ***** BANNER TUNNEL D'ACHAT ***** */

#banner.tunnel .content .sub_menu ul{
	display: none;
}

#banner.tunnel .logo{
	width: 200px;
}

#banner.tunnel .tunnel-menu{
	display: none;
}

#banner.tunnel .tunnel-menu span{
	text-decoration: none;
	color: #ffffff4f;
	font-size: 12px;
	line-height: 17px;
	display: block;	
	position: relative;
	text-transform: uppercase;
}

#banner.tunnel .tunnel-menu span+span{
	margin-top: 10px;
}

#banner.tunnel .tunnel-menu span+span:after{
	content: '';
	position: absolute;
	left: 50%;
	width: 1px;
	height: 7px;
	top: -2px;
	background-color: #ffffff4f;
}

#banner.tunnel .tunnel-menu span.selected{
	color: #fff;
	padding-left: 70px;
	background-image: url(images/icon-check.svg);
	background-size: 17px;
	background-position: left 47px top 11px;
	background-repeat: no-repeat;
}

#banner.tunnel .tunnel-menu span.selected+span:not(.selected){
	color: #fff;
}

#banner.tunnel .tunnel-menu span.selected+span:after{
	background-color: #fff;
}

html:not([data-scroll='0']) #banner{
	padding: 0 0 10px;
}

html:not([data-scroll='0']) #banner #heading{
	height: 0;
}

html:not([data-scroll='0']) #banner .eshop-important{
	z-index: -1;
	height: 0;
    padding: 0;
}


/* ***** HOME ***** */
#home .c1{
background-image: url(images/home-intro-background.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center bottom;
position: relative;
}

#home .c1 .content{
width: 60%;
text-align: left;
padding-top: 55px;
padding-bottom: 114px;
}

#home .c1 h1 span{
display: block;
}

#home .c1 .important{
color: #e0e0e0;
padding-left: 55px;
margin-top: 20px;
font-size: 14px;
line-height: 19px;
position: relative;
max-width: 75%;
}

#home .c1 .important:after{
content: '';
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
height: 100%;
width: 44px;
background-image: url(images/home-intro-arrows.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}

#home .c1 .images{
	position: absolute;
	height: 631px;
	top: 150px;
	width: 1200px;
	right: 0;
	display: none;
}

#home .c1 .image-1{
	width:420px;
	height:450px;
	position: absolute;
	left: 0;
	bottom: 30px;
	background-image: url(images/home-intro-nutrition-sportive-1.png);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

#home .c1 .image-2{
	width:515px;
	height:500px;
	position: absolute;
	left: 400px;
	bottom: 0;
	background-image: url(images/home-intro-nutrition-sportive-2.png);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

#home .c1 .image-3{
	width: 465px;
	height: 490px;
	position: absolute;
	right: 0;
	top: 0;
	background-image: url(images/home-intro-nutrition-sportive-3.png);
	background-size: contain;
	background-position: right center;
	background-repeat: no-repeat;
}


#home .c1 .images{
width: 60vw;
height: 462px;
}
#home .c1 .image-1{    
left: unset;
right: 290px;
width: 269px;
height: 295px;
}
#home .c1 .image-2{
left: unset;
right: 10px;
width: 300px;
height: 292px;
}
#home .c1 .image-3{
width: 260px;
height: 272px;
}

#home .video_intro{
	position: relative;
	width: 100%;
	margin: -75px auto 100px;
	text-align: center;
}
#home .video_intro video{
	width: 85%;
	max-width: 300px;
	height: auto;
	margin: 0 auto;
}

#home .anchor-links{
	position: relative;
	z-index: 1;
	text-align: center;
	background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
	padding: 20px 0 0;
	margin: 100px 0 0px;
}

#home .anchor-links a{
	background: white;
    color: #e6561c;
    margin: 0 10px 20px;
	transition: all 0.4s;
}

#home .anchor-links a:hover{
	transform: scale(1.1);
}



/* *********************** SLIDER *********************** */

#home #slider2, #home #slider6{
	margin: 150px auto 50px;
	width: 100%;
    position: relative;
	aspect-ratio: 680 / 500;
	height: auto;
}
#home #slider2{
	margin: 50px auto 150px;
}

#home #slider2 .item, #home #slider6 .item{
	width: 100%;
	aspect-ratio: 680 / 500;
	height: auto;
}

#home #slider2 .image, #home #slider6 .image{
	width: 100%;
	height: 100%;
	overflow: hidden;
}

#home #slider2 .image img, #home #slider6 .image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#home #slider2 .content, #home #slider6 .content{
	width: 100%;
	max-width: 550px;
	position: absolute;
	z-index: 5;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	box-sizing: border-box;
	padding: 20px 30px;
	text-align: center;
}

#home #slider2 .content .title, #home #slider6 .content .title{
	width: fit-content;
	display: block;
	margin: 0 auto;
	font-family: 'Prohibition', 'Quantico', sans-serif;
	font-size: 30px;
	font-weight: 600;
	line-height: 36px;
	text-align: center;
	color: #fff;
	text-shadow: 0px 0px 4px rgb(17 17 17 / 80%);
}

#home #slider2 .content .button, #home #slider6 .content .button{
	margin: 30px auto 0;
}

#home #slider2 .owl-nav button:first-of-type, #home #slider6 .owl-nav button:first-of-type {
position: absolute;
left: 20px;
top: 50%;
transform: translateY(-107px);
font-size: 160px;
opacity: 0.6;
color: #fff;
}

#home #slider2 .owl-nav button:last-of-type, #home #slider6 .owl-nav button:last-of-type {
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-107px);
font-size: 160px;
opacity: 0.6;
color: #fff;
}

#home .c2{
	padding-top: 200px;
	margin-top: -90px;
}

#home .c2 .title{
	width: 85vw;
	margin: 0 auto;
	position: relative;
	margin-bottom: 50px;
}

#home .c2 .title .deco{
	position: absolute;
	font-size: 140px;
	line-height: 120px;
	color: #f8f8f8;
	left: -8vw;
	top: -58px;
	z-index: -1;
	font-family: 'Prohibition', 'Quantico', sans-serif;
}

#home .c2 #slider, #home .c2 #slider3, #home .c2 #slider4{
	position: relative;
	max-width: 85vw;
	margin: auto;
}

#home .c2 .item{
	width:100%;
	padding: 0 20px;
	box-sizing: border-box;
}

#home .c2 .item .image{
	width:100%;
	height: 215px;
	overflow: hidden;
	position: relative;
}

#home .c2 .item .image img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	transition: all 0.3s;
}

#home .c2 .item:hover .image img{
	transform: scale(1.1);
}

#home .c2 .item.new .image:after{
	content:'NEW !';
	position: absolute;
	right: 10px;
	top: 10px;
	font-size: 14px;
	padding: 5px 9px;
	color: #fff;
	background-color: #191919;
}

#home .c2 .item h3{
	color: #16110b;
	line-height: 22px;
	font-size: 15px;
	letter-spacing: 1px;
	margin-top: 11px;
}

#home .c2 .item .infos{
	color: #aaaaaa;
    font-size: 14px;
    line-height: 19px;
	margin-top: 13px;
}

#home .c2 .item .infos .prix_barre{
	text-decoration: line-through;
    font-size: 12px;
}

#home .c2 .item .button{
	display: inline-block;
    vertical-align: middle;
    background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
    cursor: pointer;
    color: white;
    position: relative;
    padding: 5px 6px 5px 25px;
    font-size: 13px;
	margin-top: 10px;
}

#home .c2 .item .button:after{
	content:'';
	width: 15px;
	height: 15px;
	position: absolute;
	left: 5px;
	top: 50%;
	transform: translateY(-50%);
	background-image: url(images/icon-cart-white.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

#home .c2 .owl-prev{
	display: none;
}

#home .c2 .owl-next{
	display: none;
}

#home .c3{
padding-top: 130px;
background-image: url(images/home-about-background.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center bottom;
margin-top: 30px;
position: relative;
}

#home .c3 .no_overflow{
width: 100%;
overflow: hidden;
height: 195px;
transform: translateY(-160px);
position: relative;
margin-bottom: -160px;
z-index: 3;
}

#home .c3 .no_overflow:before{
content: '';
width: 120%;
height: 177px;
background-color: #fff;
z-index: 1;
position: absolute;
left: -10%;
top: -72px;
transform: rotate(356deg);
}

#home .c3 .textes{
width: 120%;
height: 20px;
padding: 10px 0;
text-align: center;
background: #BF1822;
background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
position: relative;
overflow: hidden;
transform: rotate(356deg) translate(-16px, 70px);
z-index: 2;
}

#home .c3 .textes div{
color: white;
text-align: center;
display: block;
position: absolute;
overflow: hidden;
width: 200%;
height: 20px;
animation: marquee 20s linear infinite;
}

#home .c3 .textes p{
float: left;
width: 50%;
line-height: 22px;
font-size: 9px;
text-transform: uppercase;
color: #fff;
letter-spacing: 0px;
text-align: left;
}

#home .c3 .textes p span:nth-of-type(2){
color: #fff;
text-shadow: none;
}

#home .c3 .textes p span+span{
margin-left: 40px;
position: relative;
}

#home .c3 .textes p span+span:after{
content: '';
width: 5px;
height: 5px;
position: absolute;
left: -24px;
top: 50%;
transform: translateY(-50%);
background-color: #fff;
border-radius: 30px;
}

#home .c3 .textes p span:last-of-type{
	display: none;
}

#home .c3 .textes p+p{
display: none;
}


@keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

#home .c3 .image{
	display: block;
	height: 330px;
	position: relative;
	top: -100px;
	width: 100%;
	background-image: url(images/home-about-gc-nutrition.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

#home .c3 .content{
	display: block;
	width: 100%;
    max-width: 550px;
    margin: -58px auto 0;
	padding-bottom: 100px;
}

#home .c3 h2{
background: linear-gradient(66deg, rgba(230, 86, 28, 1) 17%, rgba(255, 255, 255, 1) 85%);
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
margin-bottom: 20px;
}

#home .c3 h2 span{
	display: block;
}

#home .c3 p{
	color: #fff;
	text-align: justify;
}

#home .c3 p.important{
	max-width: 95%;
	font-size: 15px;
	text-transform: uppercase;
	text-align: left;
}

#home .c3 h3{
	margin-top: 25px;
	margin-bottom: 20px;
	text-transform: uppercase;
	padding-bottom: 0;
	background: unset;
	color: #fff;
	-webkit-text-fill-color: unset;
	line-height: 26px;
	font-size: 26px;
	font-family: 'Prohibition', 'Quantico', sans-serif;
	font-weight: 600;
}

#home .c3 ul{
	list-style: none;
}

#home .c3 li{
	color: #fff;
	margin: 0 0 10px;
	padding-left: 40px;
	font-size: 14px;
	text-transform: uppercase;
	background-size: 20px;
	background-repeat: no-repeat;
	background-position: left center;
	line-height: 30px;
}

#home .c3 li:first-of-type{
	background-image: url(images/icon-c3-livraison.svg);
	background-size: 29px;
}

#home .c3 li:nth-of-type(2){
	background-image: url(images/icon-c3-test.svg);
	background-size: 24px;
	background-position: 4px center;
}

#home .c3 li:nth-of-type(3){
	background-image: url(images/icon-c3-paiement.svg);
	background-size: 22px;
	background-position: 7px center;
}

#home .c3 li:nth-of-type(4){
	background-image: url(images/icon-c3-client.svg);
	background-position: 6px center;
}

#home .c4{
	margin-top: 100px;
	text-align: center;
}

#home .c4 .item{
	display: block;
	vertical-align: middle;
	width: 100%;
	max-width: 300px;
	height: 200px;
	margin: 0 auto 25px;
	position: relative;
	overflow: hidden;
}

#home .c4 .image{
	width: 100%;
	height: 100%;
}

#home .c4 .image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.4s;
}

#home .c4 .item:hover .image img{
	transform: scale(1.1);
}

#home .c4 .content{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: auto;
	padding: 15px 20px;
	box-sizing: border-box;
	background-image: url(images/cat-deco.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	text-align: left;
}

#home .c4 .content p{
	color: #fff;
	font-size: 16px;
	line-height: 23px;
	text-transform: uppercase;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
}

#home .home-news{
	text-align: center;
	margin-top: 150px;
}

#home .home-news .title h2{
	margin: 0 auto 50px;
}

#home .home-news .item{
	position: relative;
	display: block;
	width: 100%;
	max-width: 300px;
	margin: 0 auto 35px;
}

#home .home-news .item .photo{
	height: 245px;
	width: 100%;
}

#home .home-news .item img{
	height: 100%;
	width: 100%;
	object-fit: cover;
}

#home .home-news .item .infos{
	text-align: left;
	margin: 10px 10px 0;
	transition: all 0.4s;
}

#home .home-news .item .titre{
	font-size: 19px;
	line-height: 22px;
	text-align: left;
	font-weight: 600;
	margin-top: 15px;
}

#home .home-news .item:hover .infos{
	transform: translateY(-10px);
}

#home .home-news .item h2{
margin-bottom:10px;
}

#home .home-news .item span.date{
font-size:13px;
color:#a4a4a4;
display:block;
margin-bottom:20px;
}


#home .home-news .item span.button{
display:block;
margin-top:30px;
font-weight:700;
text-align:right;
}

#home .home-news .item:hover span.button{
text-decoration:underline;
}

/* ***** SHOP ***** */

#shop{
}

#home #shop{
padding: 0;
}

.shop, .eshop{
position: relative;
}

#shop .microdata{ /* toutes les champs sémantiques schema.org*/
display:none;
}

/* affichage des types + cat + produits */
#shop .c1{
	text-align: center;
}

#shop .c1 .intro{
	background-image: url(images/home-intro-background.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center bottom;
	position: relative;
	margin-bottom: 55px;
}

#shop .c1 .intro h1{
	padding: 65px 0 60px;
	font-size: 38px;
	line-height: 40px;
	max-width: 85vw;
	margin: 0 auto;
}

#shop .c1 .intro h1+.fil_rouge{
	margin-top: -50px;
	padding-bottom: 70px;
	color: #e0e0e0;
	text-transform: uppercase;
	font-size: 11px;
	max-width: 85vw;
	margin: 0 auto;
}

#shop .c1 .item{
	display: block;
	width: 100%;
	max-width: 300px;
	height: 200px;
	margin: 0 auto 25px;
	position: relative;
	overflow: hidden;
}

#shop .c1 .image{
	width: 100%;
	height: 100%;
}

#shop .c1 .image img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.4s;
}

#shop .c1 .item:hover .image img{
	transform: scale(1.1);
}

#shop .c1 .content{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: auto;
	padding: 15px 20px;
	box-sizing: border-box;
	background-image: url(images/cat-deco.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	text-align: left;
}

#shop .c1 .content p{
	color: #fff;
	font-size: 16px;
	line-height: 23px;
	text-transform: uppercase;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
}

/* affichage de la liste des produits */

#shop .c2{
	text-align: center;
}

#shop .c2 .intro{
	background-image: url(images/home-intro-background.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center bottom;
	position: relative;
	margin-bottom: 55px;
}

#shop .c2 .intro .subtitle{
	font-size: 15px;
	color: #e0e0e0;
	padding-top: 50px;
}

#shop .c2 .intro h1{
	padding: 0 0 80px;
	font-size: 38px;
	line-height: 40px;
	max-width: 85vw;
	margin: 0 auto;
}

#shop.wishlist .c2 .intro h1{
	padding: 50px 0 80px;
}

#shop.wishlist .c2 .no-product+.button{
	display: inline-block;
	vertical-align: middle;
	background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
	cursor: pointer;
	color: white;
	position: relative;
	padding: 6px 15px;
	font-size: 18px;
	margin-top: 20px;
}

#shop .c2 .intro h1+.fil_rouge{
	padding-bottom: 70px;
	color: #e0e0e0;
	text-transform: uppercase;
	font-size: 11px;
	max-width: 85vw;
	margin: -50px auto 0;
}

#shop .c2 .sort_list form{
	width: fit-content;
    margin: 0 0 10px auto;
}

#shop .c2 .sort_list form label{
	font-size: 14px;
    text-transform: uppercase;
    margin-right: 20px;
    color: #aaaaaa;
}

#shop .c2 .sort_list form select{
	border: 1px solid #aaaaaa;
    background-color: white;
    padding: 5px 10px;
    box-sizing: border-box;
    vertical-align: middle;
    width: 150px;
    font-size: 14px;
}

#shop .c2 .item{
	display: inline-block;
	width: 250px;
	margin: 20px 20px;
	box-sizing: border-box;
vertical-align: top;
text-align: left;
position: relative;
}

#shop .c2 .item .image{
	width:100%;
	height: 215px;
	overflow: hidden;
	position: relative;
}

#shop .c2 .item .image img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	transition: all 0.3s;
}

#shop .c2 .item:hover .image img{
	transform: scale(1.1);
}

#shop .c2 .item.new .image:after{
	content:'NEW !';
	position: absolute;
	right: 10px;
	top: 10px;
	font-size: 14px;
	padding: 5px 9px;
	color: #fff;
	background-color: #191919;
}

#shop .c2 .item .delete a{
	position: absolute;
	left: 10px;
	top: 13px;
	height: 20px;
	width: 20px;
	z-index: 10;
	background-image: url(images/icon-delete.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

#shop .c2 .item h3{
	color: #16110b;
	line-height: 22px;
	font-size: 15px;
	letter-spacing: 1px;
	margin-top: 11px;
}

#shop .c2 .item .infos{
	color: #aaaaaa;
    font-size: 14px;
    line-height: 19px;
	margin-top: 13px;
}

#shop .c2 .item .button{
	display: inline-block;
    vertical-align: middle;
    background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
    cursor: pointer;
    color: white;
    position: relative;
    padding: 5px 6px 5px 25px;
    font-size: 13px;
	margin-top: 10px;
}

#shop .c2 .item .button:after{
	content:'';
	width: 15px;
	height: 15px;
	position: absolute;
	left: 5px;
	top: 50%;
	transform: translateY(-50%);
	background-image: url(images/icon-cart-white.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

#shop .c2 .item .infos .prix_barre{
	text-decoration: line-through;
    font-size: 12px;
}


/* affichage d'un produit suivant son ID */
#shop .c3{ 
text-align:center;
padding-top: 25px;
}

#shop .c3 .c3_c1{
display: block;
width: 100%;
max-width: 550px;
text-align: left;
margin: 12px auto 0;
}

#shop .c3 .c3_c1 p.fil_rouge{
display:none; /* modif david 19/3/26 - optimisation page produit en resp. */
font-size: 9px;
line-height: 19px;
margin-bottom: 0px;
opacity: 0.45;
}

#shop .c3 .c3_c1 h1{
font-size: 37px;
line-height: 41px;
margin-bottom: 30px;
background: linear-gradient(66deg, rgba(230, 86, 28, 1) 17%, rgba(25, 25, 25, 1) 85%);
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
}

#shop .c3 .c3_c1 p.reference{
width: fit-content;
width: -moz-fit-content;
display: inline-block;
font-size: 13px;
text-transform: uppercase;
margin-top: 20px;
}

#shop .c3 .c3_c1 p.reference+p.reference{
margin-top: -40px;
}

#shop .c3 .c3_c1 .ajouter_au_panier{
border: 1px solid #cfcfcf;
margin-bottom: 10px;
}

#shop .c3 .c3_c1 p.prix{
border-bottom: 1px solid #cfcfcf;
padding: 20px;
color: #261a1a;
font-weight: 600;
font-size: 22px;
margin: 0;
}

#shop .c3 .c3_c1 span{
display: block;
}

#shop .c3 .contact-infos span:not(.prix){
display: block;
color: #969892;
font-size: 18px;
}


#shop .c3 .c3_c1 span.info_prix{
background: orange;
  font-size: 12px;
  color: white;
  padding: 0px 13px;
  display: inline-block;
  margin-bottom: 11px;
  margin-top: 5px;
  text-transform: uppercase;	
}

#shop .c3 .c3_c1 span.info_tva{
font-size: 12px;
line-height: 20px;
font-weight: 500;
display: inline-block;
}

#shop .c3 .c3_c1 span.prix_barre{
text-decoration: line-through;
display: inline-block;
}

#shop .c3 .c3_c1 span.prix_commentaire{
display: inline-block;
}

#shop .c3 .devis_button{
margin: 0 0 20px 20px;
}

#shop .c3 .c3_c1 form{
padding: 20px 0 14px;
display: block;
margin: 0 20px;
position: relative;
}

#shop .c3 .c3_c1 form+form{
	margin: 0 20px;
	padding: 0 0 20px;
	width: fit-content;
}

#shop .c3 .c3_c1 label{
opacity: 0.45;
display: block;
font-size: 12px;
margin: 0 0 6px;
}

#shop .c3_c1 input[type="number"]{
border: 1px solid #aaaaaa;
background-color: white;
padding: 10px;
height: 36px;
box-sizing: border-box;
vertical-align: middle;
width: 60px;
font-size: 17px;
-moz-appearance: textfield;
}

#shop .c3_c1 input[type="number"]::-webkit-inner-spin-button,
#shop .c3_c1 input[type="number"]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}

.custom-number-input {
  display: inline-block;
	margin-right: 4px;
}

.custom-number-input button {
	background-color: #aaaaaa;
	color: white;
	border: none;
	padding: 8px 6px;
	font-size: 17px;
	cursor: pointer;
	display: inline-block;
	vertical-align: middle;
}

.custom-number-input button.btn-decrement{
	margin-right: -4px;
}

.custom-number-input button.btn-increment{
	margin-left: -4px;
}

.custom-number-input button:hover {
  background-color: #191919;
}

#shop .c3_c1 input[type="submit"]{
display: inline-block;
height: 36px;
vertical-align: middle;
background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
cursor: pointer;
color: white;
position: relative;
padding: 0 15px;
font-size: 15px;
width: fit-content;
margin-top: -1px;
}

@media screen and (max-width: 350px){
	#shop .c3_c1 input[type="submit"]{
		display: block;
		margin: 20px 0 -4px;
		font-size: 17px;
		height: 40px;
	}
	#shop .c3 .c3_c1 form+form{
		margin-top: -15px !important;
	}
}

#shop .c3_c1 input[type="submit"].second{
	font-size: 16px;
	background: none;
	color: #aaaaaa;
	padding: 0 0 0 30px;
	background-image: url(images/icon-coeur.svg);
	background-size: 20px;
	background-repeat: no-repeat;
	background-position: left 3px center;
	position: relative;
}

#shop .c3_c1 input[type="submit"].second:hover{
	text-decoration: underline;
}

#shop .c3 .c3_c1 form+form:hover:after {
	content: '';
	position: absolute;
	opacity: 0;
	animation: heartUp 1.2s infinite ease-in;
	left: 3px;
	bottom: 25px;
	background-image: url(images/icon-coeur.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	width: 20px;
	height: 20px;
}


@keyframes heartUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0) rotate(10deg);
    transform: translate3d(0, 0, 0) rotate(10deg);
  }

  50% {
    opacity: 0.4;
  }

  65% {
    opacity: 0.4;
  }

  90% {
    opacity: 0;
    -webkit-transform: translate3d(0, -35px, 0) scale(1.2) rotate(-10deg);
    transform: translate3d(0, -35px, 0) scale(1.2) rotate(-10deg);
  }

  100% {
    opacity: 0;
  }
}

#shop .c3 .c3_c1 form+form:hover:before {
	content: '';
	position: absolute;
	opacity: 0;
	animation: heartUp2 1s infinite ease-in;
	left: 3px;
	bottom: 25px;
	background-image: url(images/icon-coeur.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	width: 20px;
	height: 20px;
}


@keyframes heartUp2 {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 0, 0) rotate(-10deg);
    transform: translate3d(0, 0, 0) rotate(-10deg);
  }

  50% {
    opacity: 0.4;
  }

  65% {
    opacity: 0.4;
  }

  90% {
    opacity: 0;
    -webkit-transform: translate3d(10px, -35px, 0) scale(1.2) rotate(10deg);
    transform: translate3d(10px, -35px, 0) scale(1.2) rotate(10deg);
  }

  100% {
    opacity: 0;
  }
}

#shop .c3_c1 .out-of-stock{
padding: 20px 20px 0;
margin: 0;
margin-bottom: -5px;
font-size: 14px;
line-height: 19px;
color: #969892;
}

#shop .c3_c1 form .emballage{
margin: 20px 0 0;
font-size: 14px;
line-height: 19px;
color: #969892;
}

#shop .c3_c1 .variantes{
	margin-top: 30px;
}

#shop .c3_c1 .variantes a{
	display: inline-block;
	width: 82px;
	margin: 0px 5px 20px;
	vertical-align: top;
}

#shop .c3_c1 .variantes a .image{
	width: 100%;
	height: 95px;
}

#shop .c3_c1 .variantes a img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
	transition: all 0.4s;
}

#shop .c3_c1 .variantes a:hover img{
	transform: scale(1.1);
}

#shop .c3_c1 .variantes a .content{
	display: block;
    color: #969892;
    font-size: 14px;
    margin-top: 5px;
}

#shop .c3_c1 .content+.more-infos .description{
margin-top: 50px;
}

#shop .c3 .beefup-head{
margin-top: 46px;
margin-bottom: 10px;
text-transform: uppercase;
padding-bottom: 0;
background: unset;
color: #16110b;
-webkit-text-fill-color: unset;
line-height: 26px;
font-size: 24px;
}

#shop .c3 .beefup-body .description{
font-size: 15px;
line-height: 20px;
}

#shop .c3 .beefup-body .description h2{
font-size: 35px !important;
line-height: 60px !important;
}

#shop .c3 .description p{
font-size: 14px;
line-height: 20px;
text-align: justify;
}

#shop .c3  .beefup-body .description ul{
margin: 15px 0;
padding-left: 20px;	
}

#shop .c3 .beefup-body .description table{
	max-width: 100%!important;
	width: 100%!important;
	overflow: auto!important;
}

#shop .c3 .contact-infos{
text-align: left;
}

#shop .c3 .contact-infos a{
	margin-top: 10px;
	display: block;
	width: fit-content;
}

#shop .c3 .contact-infos div.reference{
	margin-top: 10px;
	display: block;
	width: fit-content;
}
#shop .c3 .contact-infos a:hover span{
	text-decoration: underline;
}

#shop .c3 .contact-infos img{
width: 31px;
margin-right: 4px;
display: inline-block;
vertical-align: middle;
}

#shop .c3 .contact-infos span{
display: inline!important;
font-size: 16px!important;
vertical-align: middle!important;
}

#shop .c3 .c3_c2{
display: block;
width: 100%;
max-width: 400px;
margin: 0 auto;
}

#shop .c3 .video{
display:block;
width:100%;	
}

#shop .c3 .video iframe{
width:100%;	
}

#shop .c3 .demo-gallery a.item.main_pic{ /*principale*/
width: 100%;
height: 26vh; /* modif : hauteur relative a l'ecran pour garder titre et prix au-dessus de la ligne de flottaison */
min-height: 180px;
max-height: 300px;
display:block;
position:relative;
overflow: hidden;
}

#shop .c3 .demo-gallery a.item.main_pic img{
width:100%;
height:100%;
object-fit:contain;
transition: all 0.4s;
}

#shop .c3 .demo-gallery a.item.main_pic:hover img{
transform: scale(1.1);
}

#shop .c3 .demo-gallery a.item.other_pics{ /*miniatures*/
width: 18%;
height:60px;
display:inline-block;
position:relative;
border:0.25px solid white;
overflow: hidden;
}

#shop .c3 .demo-gallery a.item.other_pics img{
width:100%;
height:100%;
object-fit:cover;
transition: all 0.4s;
}

#shop .c3 .demo-gallery a.item.other_pics:hover img{
transform: scale(1.1);
}

#shop .c3 .demo-gallery a.item.other_pics.last{
background-color:#261a1a;
background-image:url('images/voir_plus.svg');
background-repeat:no-repeat;
background-size:85%;
background-position:center;
transition:all 0.15s;
}

#shop .c3 .demo-gallery a.item.other_pics.last img,
#shop .c3 .demo-gallery a.item.other_pics.last .arrow{
display:none;
}

#shop .c3 .demo-gallery a.item.other_pics.last:hover{
background-size:90%;	
}

#shop .c3 .demo-gallery a.item.hidden{
display:none;	
}

#shop .c3 .related{
position: relative;
}

#shop .c3 .related h2{
position: relative;
margin: 120px 0 30px;
text-transform: uppercase;
padding-bottom: 0;
background: unset;
color: #16110b;
-webkit-text-fill-color: unset;
line-height: 26px;
font-size: 24px;
text-align: center;
width: 100%;
}

#shop .c3 .related .item{
display: inline-block;
width: 250px;
max-width: 85vw;
margin: 20px 20px;
box-sizing: border-box;
vertical-align: top;
text-align: left;
}

#shop .c3 .related .item .image{
	width:100%;
	height: 215px;
	overflow: hidden;
	position: relative;
}

#shop .c3 .related .item .image img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	transition: all 0.3s;
}

#shop .c3 .related .item:hover .image img{
	transform: scale(1.1);
}

#shop .c3 .related .item.new .image:after{
	content:'NEW !';
	position: absolute;
	right: 10px;
	top: 10px;
	font-size: 14px;
	padding: 5px 9px;
	color: #fff;
	background-color: #191919;
}

#shop .c3 .related .item h3{
	color: #16110b;
	line-height: 22px;
	font-size: 15px;
	letter-spacing: 1px;
	margin-top: 13px;
}

#shop .c3 .related .item .infos{
	color: #aaaaaa;
    font-size: 14px;
    line-height: 19px;
	margin-top: 11px;
}

#shop .c3 .related .item .infos .prix_barre{
	text-decoration: line-through;
    font-size: 12px;
}

#shop .c3 .related .item .button{
	display: inline-block;
    vertical-align: middle;
    background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
    cursor: pointer;
    color: white;
    position: relative;
    padding: 5px 6px 5px 25px;
    font-size: 13px;
	margin-top: 10px;
}

#shop .c3 .related .item .button:after{
	content:'';
	width: 15px;
	height: 15px;
	position: absolute;
	left: 5px;
	top: 50%;
	transform: translateY(-50%);
	background-image: url(images/icon-cart-white.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}


/* ***** Mentions légales ***** */


#legal{
text-align:center;
padding:90px 50px 100px; /* a recopier pour toutes les pages SAUF home */

}

#legal .main_width{
padding-top:85px;
padding-bottom:30px;
}


#legal h1{
font-size: 30px;
line-height: 35px;
font-weight: 400;
padding-bottom: 30px;
margin: 0 0 50px;
text-align: center;
position: relative;
}

#legal h2{
background-position: 0px 7px;
position: relative;
bottom: 0px;
margin-top: 14px;
margin-bottom: 14px;
font-size:28px;
line-height:30px;
background-position: bottom left;
padding-bottom: 7px;
}

#legal h3{
line-height:23px!important;
padding-bottom: 6px!important;
}

#legal p{
margin-bottom:5px;
}

#legal p span{
display:inline-block;
vertical-align:top;
width:166px;
text-decoration:underline;
}

#legal .c0{
width:600px;
text-align:left;
display:inline-block;
vertical-align:top;
border:1px solid #c0c0c0;
text-align:left;
padding:1%;
margin-bottom:30px;
background-color:white;
border-radius:13px;
}

#legal .c1{
display:inline-block;
vertical-align:top;
width:36%;
margin-right:6%;
padding:1%;
border:1px solid #c0c0c0;
text-align:left;
margin-bottom:30px;
min-height:262px;
background-color:white;
border-radius:13px;
}

#legal .c1.last{
margin-right:0px;
}

#legal .c1 p{
margin-bottom:8px;
font-size:13px;
line-height:22px;
}

#legal .c2{
width:36%;
padding:1%;
margin-right:4%;
text-align:left;
display:inline-block;
vertical-align:top;
border:1px solid #c0c0c0;
margin-bottom:30px;
height:600px;
overflow:auto;
padding-bottom:30px;
background-color:white;
border-radius:13px;
}

#legal .c2 h3{

}

#legal .c2 h4{

}

#legal .c2 p{
margin-bottom:8px;
font-size:13px;
line-height:22px;
}

#legal .c2 ul li{
margin-bottom:5px;
font-size:13px;
line-height:22px;
padding-left:15px;
list-style-type:none;
}

#legal .c2 ul ul li{
padding-left:30px;
}

#legal .c2.last{
margin-right:0px;
}


/* ***** 404 ***** */

#e404{
text-align:center;
padding:90px 50px 100px; /* a recopier pour toutes les pages SAUF home */
}

#e404 .main_width{
padding-top:85px;
padding-bottom:30px;
box-sizing: border-box;
}

#e404 h1{
font-size: 30px;
line-height: 35px;
font-weight: 400;
padding-bottom: 30px;
margin: 0 0 50px;
position: relative;
text-align: center;
}


/* *********************** FOOTER *********************** */


#footer{
	background-color: #191919;
	margin-top: 80px;
	padding-top: 55px;
	text-align: center;
}

#footer .footer_c1{
	display: block;
    width: 100%;
    max-width: 300px;
    margin: 0 auto 30px;
}

#footer .logo{
	display: block;
	width: 90%;
	max-width: 280px;
	height: auto;
	margin-bottom: 10px;
	margin-left: 5%;
}

#footer .logo img{
	width: 100%;
	height: auto;
}

#footer .footer_c1 p{
	color: #e0e0e0;
	font-size: 12px;
	line-height: 19px;
}

#footer .content .title{
	color:#fff;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 16px;
	line-height: 18px;
	margin-bottom: 5px;
	letter-spacing: 2px;
}

#footer .content .footer_c2 a, #footer .content .footer_c3 a{
	display: block;
	width: fit-conent;
	font-size: 14px;
	color: #e0e0e0;
	line-height: 18px;
	padding: 6px 0;
}

#footer .footer_c2{
	display: inline-block;
	vertical-align: top;
	width: 28%;
	text-align: left;
	margin-right: 5%;
	margin-top: 8px;
}

#footer .footer_c3{
	display: inline-block;
	vertical-align: top;
	width: 23%;
	text-align: left;
	margin-right: 5%;
	margin-top: 8px;
}

#footer .footer_c4{
	display: inline-block;
	vertical-align: top;
	width: 23%;
	text-align: left;
	margin-top: 8px;
}

#footer .footer_c4 img{
	width: 100%;
	height: auto;
	margin-top: 7px;
	margin-bottom: 30px;
}

#footer .footer_c4 .facebook{
	display: inline-block;
	width: 30px;
	height: 30px;
	background-image: url(images/icon-facebook.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	margin-right: 8px;
	margin-top: 5px;
}

#footer .footer_c4 .instagram{
	display: inline-block;
	width: 30px;
	height: 30px;
	background-image: url(images/icon-instagram.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	margin-right: 8px;
	margin-top: 5px;
}

#footer .footer_c4 .youtube{
	display: inline-block;
	width: 30px;
	height: 30px;
	background-image: url(images/icon-youtube.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	margin-top: 5px;
}

#footer p.copyright{
color:#e0e0e0;
text-align:center;
font-size:13px;
margin-top:60px;
padding-top: 20px;
padding-bottom:10px;
border-top: 1px solid #aaaaaa;
}

#footer p.copyright a{
color:#e0e0e0;
text-decoration:underline;
}

#footer p.copyright+a{
width: 90px;
display: block;
margin: 0 auto;
padding-bottom: 12px;
}

#footer p.copyright+a img{
width: 100%;
height: auto;
opacity: 0.4;
}

/* ***** CAPTCHA ***** */

.grecaptcha-badge { 
	visibility: hidden; 
}


/* ***** AOS ***** */

.fade_container {
    overflow-x: hidden;
}


/* *************************** ESHOP *** ESHOP *** ESHOP *************************** */


/* ***** CART ***** */
#cart{
text-align:center;
margin-top: 70px;
}

#cart h1{
font-family: 'Prohibition', 'Quantico', sans-serif;
text-transform: uppercase;
font-size: 40px;
font-weight: 600;
line-height: 51px;
display: block;
width: fit-content;
background: linear-gradient(66deg, rgba(230, 86, 28, 1) 17%, rgba(25, 25, 25, 1) 85%);
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
padding-left: 2px;
margin: 0 auto 50px;
padding-right: 6px;
}

#cart .c1{
width:100%;
text-align: right;
}

#cart .c1 .center{
text-align: center;
}

#cart .c1 p.no_product+.button{
margin-top: 30px;
}

#cart table.panier{
width:100%;
border-collapse: collapse;
table-layout: auto;
margin-bottom:30px;
text-align: left;
}

#cart table.panier tr{
border-bottom:1px solid #e1e1e1;
height:60px;
}

#cart table.panier tr:last-child{
border:none;
}

#cart table.panier td a:hover{
text-decoration: underline;
}

#cart table.panier td.image{
width: 50px;
height: 50px;
display: inline-block;
margin-top: 5px;
}

#cart table.panier td.image>div{
width: 100%;
height: 100%;
overflow: hidden;
}

#cart table.panier td.image img{
width: 100%;
height: 100%;
object-fit: cover;
}

#cart table.panier td.titre{
padding:20px;	
vertical-align: middle;
overflow: hidden;
}

#cart table.panier td.titre a{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
line-clamp: 1;
-webkit-box-orient: vertical;
font-size: 16px;
}

#cart table.panier td.prix_unitaire{
padding:0px 20px;
width: 85px;
vertical-align: middle;
font-size: 15px;
line-height: 16px;
}


#cart table.panier td.changer_quantite{
width:22px;
text-align:center;
table-layout: auto;
vertical-align: middle;
}

#cart table.panier td.changer_quantite input[type="submit"]{
display:inline-block;
line-height:0px;
color:#7b7a7a;
width:17px;
height:17px;
border:1px solid #e1e1e1;
text-align:center;
background-color:white;
color:#404040;
padding:0px;
margin:0px;
cursor: pointer;
}

#cart table.panier td.changer_quantite input[type="submit"]:hover{
padding:0px;
margin:0px;
}

#cart table.panier td.quantite{
text-align:center;
vertical-align: middle;
}

#cart table.panier td.erreur p{
font-size: 10px;
line-height: 12px;
margin: 0px;
color: #e10613;
}

#cart table.panier td.supprimer{
display: none;
}

#cart table.panier td.supprimer input[type="submit"]{
display:inline-block;
line-height:15px;
color:#7b7a7a;
border:1px solid #e1e1e1;
text-align:center;
background-color:white;
color:#404040;
padding:2px 4px;
margin:0px;
cursor: pointer;
}

#cart table.panier td.supprimer input[type="submit"]:hover{
}

#cart table.panier td.prix{
width:100px;
text-align:right;	
padding-right:13px;
vertical-align: middle;
}

#cart table.panier td.prix p{
display: inline-block;
font-size: 15px;
}

#cart .cart_buttons{
	margin-top: 30px;
}

#cart .cart_buttons a.button:first-child{
	font-size: 13px;
	border: 1px solid #aaaaaa;
	background: #fff;
	color: #aaaaaa;
	transition: all 0.4s;
	margin: 0 auto 10px;
	display: block;
	width: fit-content;
}

#cart .cart_buttons a.button+a.button {
	display: block;
	width: fit-content;
	margin: 0 auto;
	font-size: 16px;
}

#cart .recapitulatif{
text-align:right;
margin-top:30px;
}

div#cart p.livraison{
display: inline-block;
}

div#cart p.livraison+div.title_alert{
margin-right: 7px;
margin-left: 5px;
}

div#cart p.livraison span{
width: 97px;
}

#cart p.total,
#cart p.livraison,
#cart p.total_a_payer,
#cart p.livraison_gratuite,
#cart p.livraison_supplementaire{
font-size:15px;
margin:0px;
padding: 7px 0px;
}

#cart p.total span,
#cart p.livraison span,
#cart p.total_a_payer span,
#cart p.livraison_gratuite span,
#cart p.livraison_supplementaire span{
display:inline-block;
vertical-align:top;
width:120px;
font-weight:900;
}

#cart p.info_livraison_gratuite span{
display: inline-block;
vertical-align: top;
padding-left: 30px;
background-image: url(images/common/arrow-right-black.svg);
background-size: 15px;
background-repeat: no-repeat;
background-position: 3px 6px;
font-size: 12px;
color: #261a1a;
}

#cart p.info_livraison_gratuite{
margin-bottom: 7px;
}

#cart p.total_a_payer{
display:inline-block;
vertical-align:top;
border-top:1px solid #e1e1e1;	
min-width:350px;
}

#cart p.livraison_gratuite{
vertical-align:top;
min-width:300px;
}

#cart p.livraison_supplementaire{
vertical-align:top;
min-width:300px;
}


#cart .tunnel{
border-left:3px solid #e1e1e1;
}

#cart .tunnel p{
padding-left: 45px;
opacity: 0.45;
font-size: 15px;
line-height: 21px;
}

#cart .tunnel p a{
text-decoration: underline;
}

#cart .tunnel .space{
margin-bottom:31px;	
}
/* Produits complémentaires suggérés sous le panier */
#cart .suggestions{
	margin-top: 70px;
	padding-top: 35px;
	border-top: 1px solid #e1e1e1;
}

#cart .suggestions h2{
	font-size: 22px;
	letter-spacing: 1px;
	color: #16110b;
	margin-bottom: 5px;
	text-align: left;
	line-height: 32px;
}

#cart .suggestions .product_list{
	display: flex;
	flex-wrap: wrap;
	gap: 25px;
	margin-top: 25px;
}

#cart .suggestions .item{
	width: calc(50% - 13px);
	box-sizing: border-box;
	position: relative;
	text-align: left;
}

#cart .suggestions .item .image{
	width: 100%;
	height: 165px;
	overflow: hidden;
	position: relative;
}

#cart .suggestions .item .image img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	transition: all 0.3s;
}

#cart .suggestions .item:hover .image img{
	transform: scale(1.1);
}

#cart .suggestions .item .infos{
	color: #aaaaaa;
	font-size: 14px;
	line-height: 19px;
	margin-top: 13px;
}

#cart .suggestions .item .infos .prix_barre{
	text-decoration: line-through;
	font-size: 12px;
}

#cart .suggestions .item .button{
	display: inline-block;
	vertical-align: middle;
	background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
	cursor: pointer;
	color: white;
	position: relative;
	padding: 5px 6px 5px 25px;
	font-size: 13px;
	margin-top: 10px;
}

#cart .suggestions .item .button:after{
	content: '';
	width: 15px;
	height: 15px;
	position: absolute;
	left: 5px;
	top: 50%;
	transform: translateY(-50%);
	background-image: url(images/icon-cart-white.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

#cart .suggestions .item h3{
	color: #16110b;
	line-height: 22px;
	font-size: 15px;
	letter-spacing: 1px;
	margin-top: 11px;
}


.alert_message{
	position: absolute;
    visibility: hidden;
    width: 0;
    height: 0;
    overflow: hidden;
}

.title_alert{
	display: inline-block;
	position: relative;
	margin-left: 10px;
}

.title_alert img{
	width: 15px;
	margin-right: 5px;
}

.title_alert:hover .alert_message{
	visibility: visible;
	height: 63px;
	overflow: visible;
	position: absolute;
	background-color: #e7e7e7;
	padding: 10px;
	z-index: 10;
	width: 300px;
	left: -152px;
	top: -96px;
	box-shadow: 5px 5px 15px -8px #b0b0b0;
	text-transform: none;
	line-height: 1.2;
	text-align: center;
}

.title_alert:hover .alert_message:after {
	top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-top-color: #e7e7e7;
    border-width: 10px;
    margin-left: -10px;
}

#cart .title_alert:hover .alert_message p{
	font-size: 16px;
    line-height: 22px;
}



@media screen and (max-width: 1600px) {
  .title_alert:hover .alert_message{
	left: unset;
	right: -17px;
  }
  .title_alert:hover .alert_message:after{
	  left: unset;
	  right: 20px;
  }
}


/* ***** LOGIN ***** */
#login{
text-align:center;
margin-top: 70px;
}

#login h1{
font-family: 'Prohibition', 'Quantico', sans-serif;
text-transform: uppercase;
font-size: 38px;
line-height: 40px;
font-weight: 600;
display: block;
width: fit-content;
background: linear-gradient(66deg, rgba(230, 86, 28, 1) 17%, rgba(25, 25, 25, 1) 85%);
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
padding-left: 2px;
margin: 0 auto 20px;
padding-right: 6px;
}

#login .c1{
display: block;
width: 100%;
max-width: 550px;
margin: 0 auto;
padding: 0;
text-align:left;
}

#login .c1 label{
color: #aaaaaa;
font-size: 15px;
display: block;
margin-bottom: 10px;
}

#login .c1 input+label{
margin-top: 20px;
}

#login .c1 input[type="email"], #login .c1 input[type="password"]{
border: 1px solid #aaaaaa;
background-color: white;
padding: 10px;
height: 40px;
box-sizing: border-box;
vertical-align: middle;
width: 100%;
font-size: 17px;
margin-right: 5px;
}

#login .c1 input[type="submit"]{
width: fit-content;
margin: 20px auto 0;
border: none;
border-radius: 0;
}

#login .c2{    
display: block;
width: 100%;
max-width: 550px;
margin: 0 auto;
text-align: center;
}

#login .c2 h2{
	margin: 46px auto 10px;
}

#login .c2 a{
margin-top: 20px;
}

#login h2{
margin-top: 46px;
margin-bottom: 10px;
text-transform: uppercase;
padding-bottom: 0;
background: unset;
color: #16110b;
-webkit-text-fill-color: unset;
line-height: 26px;
font-size: 24px;
}



#login p.new_pass a{
font-size:13px;
color: #aaaaaa;
transition:all 0.3s;
}

@keyframes error {
	0% {
		opacity: 0;
		transform: translate(-30px, 0);
		height: 0;
		margin-bottom:0;
	}
	3% {
		opacity: 0;
		transform: translate(-30px, 0);
		height: auto;
		margin-bottom:76px;
	}
	10%{
		opacity: 1;
		transform: translate(0, 0);
		height: auto;
		margin-bottom:76px;
	}
	100% {
		opacity: 1;
		transform: translate(0, 0);
		height: auto;
		margin-bottom:76px;	
	}
}

#login .message{
display: block;
opacity: 0;
transform: translate(-30px, 30px);
animation-name: error;
animation-duration: 15s;
animation-delay: 0.3s;
height: 0;
}

#login .message p{
display:inline-block;
vertical-align:top;
background-color: #e10613;
margin-bottom:5px;
font-size:20px;
line-height:55px;
color:white;
padding:0px 30px;
}

#login .message.success p{
background-color: #261a1a;
}

#login p.error{
display: block;
font-size: 15px;
color: red;
font-weight: 900;
margin-top: 10px;
margin-bottom: 0px !important;
opacity: 0;
transform: translate(-30px, 30px);
animation-name: error;
animation-duration: 15s;
animation-delay: 0.3s;
height: 0;
}

#login label{
display: block;
}


/* ***** SIGN IN ***** */
#signin{
text-align: center;
margin-top: 70px;
position: relative;
}

#signin h1{
font-family: 'Prohibition', 'Quantico', sans-serif;
text-transform: uppercase;
font-size: 40px;
font-weight: 600;
line-height: 51px;
display: block;
width: fit-content;
background: linear-gradient(66deg, rgba(230, 86, 28, 1) 17%, rgba(25, 25, 25, 1) 85%);
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
padding-left: 2px;
margin: 0 auto 66px;
padding-right: 6px;
}

#signin .c1{
display: block;
width: 100%;
max-width: 550px;
padding: 0;
margin: 0 auto 30px;
text-align:center;
}

#signin .c2{
display: block;
width: 100%;
max-width: 550px;
padding: 0;
margin: 0 auto;
}

#signin h2{
margin-top: 35px;
margin-bottom: 10px;
text-transform: uppercase;
padding-bottom: 0;
background: unset;
color: #16110b;
-webkit-text-fill-color: unset;
line-height: 26px;
font-size: 24px;
}

#signin .opt_in_label{
display:inline-block;	
}

#signin .submit{
}

#signin .c2 p{
font-size: 13px;
opacity: 0.45;
line-height: 19px;
}

#signin .c2 p.connexion_btn, #recuperation_pass p.connexion_btn{
font-size: 14px;
color: #16110b;
transition: all 0.3s;
margin-top: 30px;
}

#signin .c2 p.connexion_btn a:hover, #recuperation_pass p.connexion_btn a:hover{
opacity: 1;
}

#signin .form_errors p{
display: block;
font-size: 15px;
color: red;
font-weight: 900;
margin-top: 10px;
margin-bottom: 20px !important;
opacity: 0;
transform: translate(-30px, 30px);
animation-name: error;
animation-duration: 15s;
animation-delay: 0.3s;
height: 0;
}

#signin.eshop label, #signin.eshop .label_input{
display:block;
margin-bottom:4px;
font-size: 17px;
}

#signin.eshop .radio label{
display:inline-block;
}

div#signin input[type="email"]{
border: 1px solid #aaaaaa;
background-color: white;
padding: 10px;
height: 40px;
box-sizing: border-box;
vertical-align: middle;
width: 100%;
margin-bottom: 20px;
font-size: 17px;
margin-right: 5px;
}

div#signin input[type="password"]{
border: 1px solid #aaaaaa;
background-color: white;
padding: 10px;
height: 40px;
box-sizing: border-box;
vertical-align: middle;
width: 100%;
margin-bottom: 20px;
font-size: 17px;
margin-right: 5px;
}

div#signin .password-wrapper{
position: relative;
}

div#signin .toggle-password{
position: absolute;
right: 20px;
top: 13px;
background-color: transparent;
cursor: pointer;
width: 18px;
height: 15px;
background-image: url(images/icon-voir.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}

div#signin .toggle-password.active{
background-image: url(images/icon-voir-no.svg);
height: 17px;
top: 12px;
}

div#signin input[type="text"]{
border: 1px solid #aaaaaa;
background-color: white;
padding: 10px;
height: 40px;
box-sizing: border-box;
vertical-align: middle;
width: 100%;
margin-bottom: 20px;
font-size: 17px;
margin-right: 5px;
}

div#signin input[type="number"]{
border: 1px solid #aaaaaa;
background-color: white;
padding: 10px;
height: 40px;
box-sizing: border-box;
vertical-align: middle;
width: 100%;
margin-bottom: 20px;
font-size: 17px;
margin-right: 5px;
}


div#signin input[type="tel"]{
border: 1px solid #aaaaaa;
background-color: white;
padding: 10px;
height: 40px;
box-sizing: border-box;
vertical-align: middle;
width: 100%;
margin-bottom: 20px;
font-size: 17px;
margin-right: 5px;
}

div#signin.eshop .radio{
margin-bottom: 20px;
}

div#signin.eshop input[type="checkbox"]{
display: inline;
margin-top: 2px;
vertical-align: top;
}

div#signin.eshop .opt_in_container{
margin-top: 20px;
}

div#signin.eshop input[type="checkbox"]+label{
display: inline-block;
width: 90%;
vertical-align: top;
}

div#signin.eshop .space{
display: inline-block;
width: 13px;
}

div#signin.eshop label, div#signin.eshop .label_input{
opacity: 0.45;
font-size: 15px;
line-height: 18px;
margin-bottom: 10px;
}

#signin .c2+.small{
max-width: 780px;
margin: 50px auto 0;
text-align: left;
}

#signin .c2+.small p{
font-size: 12px;
line-height: 14px;
text-align: justify;
color: #aaaaaa;
}

/* ***** MON COMPTE ***** */
#compte{
text-align: center;
margin-top: 70px;
}

#compte h1{
	font-family: 'Prohibition', 'Quantico', sans-serif;
	font-size: 40px;
	font-weight: 600;
	line-height: 51px;
	display: block;
	width: fit-content;
	background: linear-gradient(66deg, rgba(230, 86, 28, 1) 17%, rgba(25, 25, 25, 1) 85%);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	padding-left: 2px;
	margin: 0 auto 50px;
	padding-right: 6px;
}

#compte h2{
margin-top: 46px;
margin-bottom: 40px;
text-transform: uppercase;
padding-bottom: 0;
background: unset;
color: #16110b;
-webkit-text-fill-color: unset;
line-height: 26px;
font-size: 24px;
}


#compte .c1{
width:100%;
margin-bottom:60px;
}

#compte .c1 h2{
	margin: 46px auto 40px;
}

#compte .c1a{
display: block;
width: 100%;
margin: 0 auto;
max-width: 550px;
text-align: center;
padding: 0;
}

#compte .c1b{
display:block;
width:100%;
max-width: 550px;
padding-top:30px;
text-align:center;
border-top: 1px solid #aaaaaa;
margin: 30px auto 0;
}

#compte .c1b a{
	font-size: 14px;
}

#compte .c1 p{
font-size:16px;
margin-bottom:8px;
}

#compte .c1 p span{
display:block;
vertical-align:top;
font-weight:900;
}

#compte .c1 a.button{
margin-bottom:16px;	
}

#compte .c1 .changer_password{
background-image: url('images/common/password.png');
background-repeat: no-repeat;
background-position: 0px 3px;
padding-left: 61px;
padding-top: 5px;
padding-bottom: 5px;
display: inline-block;
margin-bottom:16px;
}

#compte .c1 .modifier_info_personnelles{
background-image: url('images/common/update-arrow.png');
background-size:21px;
background-repeat: no-repeat;
background-position: 0px 3px;
padding-left: 32px;
padding-top: 5px;
padding-bottom: 5px;
display: inline-block;
margin-bottom:16px;
}

#compte .c1 .mes-adresses{
background-image: url('images/common/adresses.svg');
background-size:21px;
background-repeat: no-repeat;
background-position: 0px 3px;
padding-left: 32px;
padding-top: 5px;
padding-bottom: 5px;
display: inline-block;
margin-bottom:16px;
}

#compte .c1 .logout{
background-image: url('images/common/logout.png');
background-size:21px;
background-repeat: no-repeat;
background-position: 0px 3px;
padding-left: 28px;
padding-top: 5px;
padding-bottom: 5px;
display: inline-block;
margin-bottom:16px;
}

#compte .c2 h2{
	margin: 46px auto 40px;
}

#compte .commande{
border: 1px solid #aaaaaa;
padding: 70px 10px;
text-align: left;
max-width: 1200px;
margin: 0 auto 30px;
position: relative;
overflow: auto;
}

#compte .commande .torestore{
	margin-bottom: 11px;
}

#compte .commande .torestore input[type="submit"]{
	display: block;
    margin: 0 auto 5px 0;
    font-size: 11px;
    text-transform: uppercase;
    padding: 5px 10px;
    background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
    cursor: pointer;
    color: white;
}

#compte .commande .help-links{
position: absolute;
left: 10px;
top: 6px;
text-align: left;
}

#compte .commande .help-links a{
display: block;
margin: 0 0 5px auto;
font-size: 11px;
text-transform: uppercase;
padding: 5px 10px;
background-color: #d3d3d3;
cursor: pointer;
}

#compte .commande .help-links form{
	display: inline-block;
}

#compte .commande .help-links form input{
display: inline-block;
background-color: #d3d3d3;
font-size: 11px;
text-transform: uppercase;
padding: 5px 10px;
cursor: pointer;
}

#compte .commande p{
font-size: 16px;
margin-bottom: 8px;
}

#compte .commande span{
display: block;
vertical-align: top;
font-weight: 900;
}

#compte .commande span.etat_content{
display: inline-block;
vertical-align: top;
min-width: 0;
font-weight: normal;
}

#compte .commande span.etat_content.bg_purple{
background-color: #34209E;
color: white;
padding: 0 10px;
border-radius: 5px;
}

#compte .commande span.etat_content.bg_green{
background-color: #70b580;
color: white;
padding: 0 10px;
border-radius: 5px;
}

#compte .commande span.etat_content.bg_red{
background-color: #E74C3C;
color: white;
padding: 0 10px;
border-radius: 5px;
}

#compte .commande span.etat_content.bg_orange{
background-color: #d89e34;
color: white;
padding: 0 10px;
border-radius: 5px;
}

#compte .commande .infos_paiement{
border: 2px solid #34209E;
border-radius: 5px;
padding: 15px;
margin: 20px 2%;
}

#compte .commande .infos_paiement p:first-of-type{
font-weight: 900;
margin-bottom: 15px;
}

#compte .commande .infos_paiement p:nth-of-type(n+1) span:first-of-type{
font-weight: 900;
min-width: 170px;
}

#compte .commande .infos_paiement p:nth-of-type(n+1) span+span{
font-weight: normal;
}

#compte table{
width: 100%;
margin-top: 30px;
min-width: 800px;
}

#compte table thead{
background-color: #d3d3d3;
}

#compte table th, #compte table td{
padding: 10px;
}

#compte table tr td.important{
	font-weight: bold;
	text-align: right;
}

#compte table tr:last-child td+td{
	font-weight: bold;
}

/* ***** MES ADRESSES ***** */

#signin.mes-adresses h2{
	margin: 35px auto 20px;
}

#signin.mes-adresses .c1, #signin.mes-adresses .c2{
	vertical-align: top;
}

#signin.mes-adresses form .c1{
	width: 100%;
}

#signin.mes-adresses input[name="rue"]{
	width: calc(100% - 95px);
    display: inline-block;
    vertical-align: top;
}

#signin.mes-adresses input[name="numero"]{
	width: 75px;
    margin-right: 0;
    margin-left: 10px;
    display: inline-block;
    vertical-align: top;
}

#signin.mes-adresses select{
	border: 1px solid #aaaaaa;
    background-color: white;
    padding: 0 10px;
    border-radius: 0px;
    height: 40px;
    box-sizing: border-box;
    vertical-align: middle;
    width: 100%;
    margin-bottom: 20px;
    font-size: 17px;
    margin-right: 5px;
}

#signin.mes-adresses .c1 input[type="submit"]{
	margin: 15px auto 0;
}

#signin.mes-adresses .adresse{
	width: 100%;
    background-color: white;
    border: 1px solid #aaaaaa;
    text-align: left;
    display: inline-block;
    vertical-align: top;
    border-radius: 0px;
    padding: 20px;
    box-sizing: border-box;
    position: relative;
    margin-bottom: 30px;
	width: 100%;
}

#signin.mes-adresses .adresse p{
	font-size: 14px;
    opacity: 1;
    line-height: 22px;
    margin: 0;
}

#signin.mes-adresses .adresse span{
	display: block;
}

#signin.mes-adresses .c2{
	width: 100%;
	margin: 50px auto 0;
	max-width: 550px;
}

#signin.mes-adresses .c2 form{
	position: absolute;
	top: 0;
	right: 0;
}

#signin.mes-adresses .c2 input[type="submit"]{
	background-color: transparent;
    color: #231f20;
    text-decoration: underline;
    margin: 5px 10px 0 0;
	cursor: pointer;
}


/* ***** RÉCUPÉRATION MOT DE PASSE ***** */
#recuperation_pass{
text-align: center;
margin-top: 70px;
position: relative;
}

#recuperation_pass h1{
	font-family: 'Prohibition', 'Quantico', sans-serif;
	font-size: 40px;
	font-weight: 600;
	line-height: 51px;
	display: block;
	width: fit-content;
	background: linear-gradient(66deg, rgba(230, 86, 28, 1) 17%, rgba(25, 25, 25, 1) 85%);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	padding-left: 2px;
	margin: 0 auto 50px;
	padding-right: 6px;
}

#recuperation_pass p.error{
display: block;
font-size: 15px;
color: red;
font-weight: 900;
margin-top: 10px;
margin-bottom: 0px !important;
opacity: 0;
transform: translate(-30px, 30px);
animation-name: error;
animation-duration: 15s;
animation-delay: 0.3s;
animation-fill-mode: forwards;
height: 0;
}

#recuperation_pass form p{
margin-bottom: 40px;
}

.eshop a.btn_back{
display: none;
}

#recuperation_pass form {
width: 100%;
max-width: 500px;
margin: 0 auto;
text-align: center;
}

#recuperation_pass label {
opacity: 0.45;
font-size: 15px;
display: block;
margin-bottom: 10px;
}

#recuperation_pass input[type="text"], #recuperation_pass input[type="password"], #recuperation_pass input[type="email"] {
border: 1px solid #aaaaaa;
background-color: white;
padding: 10px;
height: 40px;
box-sizing: border-box;
vertical-align: middle;
width: 100%;
font-size: 17px;
margin-bottom: 10px;
}

#recuperation_pass input[type="submit"] {
margin-top: 20px;
border: none;
max-width: 100%;
font-size: 13px;
}

/* ***** CHECKOUT ***** */

#checkout{
margin-top: 70px;
text-align:center;
position: relative;
}

/*
	Bouton Retour du tunnel en mobile (23/09/2026).
	Il n'est plus affiche dans la page : il est rendu par fr/menu.php dans la barre
	d'etapes du banner (.btn_back_tunnel, regle juste en dessous). Pourquoi : en
	position fixed il etait cale sur des hauteurs de banner ecrites en dur (197px,
	puis 93px une fois defile) et se retrouvait en blanc sur fond blanc, puis a
	cheval sur la barre orange. Dans le flux, il poussait tout le contenu vers le bas.
	Dans la barre, il ne coute aucune hauteur et suit le banner tout seul.
*/
#checkout a.btn_back{
	display: none;
}

#banner #eshop_menu .btn_back_tunnel{
	float: left;
	display: block;
	color: #fff;
	font-size: 12px;
	line-height: 30px;
	text-transform: uppercase;
	letter-spacing: 1px;
	text-decoration: none;
	opacity: 0.85;
}

#banner #eshop_menu .btn_back_tunnel:hover{
	opacity: 1;
}

/* (supprime le 23/09/2026 : le bouton Retour n'est plus en position fixed) */

#checkout .content{
vertical-align: top;
width: 100%;
display: block;
text-align: left;
max-width: 550px;
margin: 0 auto;
}

#checkout h1{
font-family: 'Prohibition', 'Quantico', sans-serif;
text-transform: uppercase;
font-size: 40px;
font-weight: 600;
line-height: 51px;
display: block;
width: fit-content;
background: linear-gradient(66deg, rgba(230, 86, 28, 1) 17%, rgba(25, 25, 25, 1) 85%);
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
padding-left: 2px;
margin: 0 auto 50px;
padding-right: 6px;
}

#checkout .facturation_form{
position: absolute;
display: inline-block;
height: 0;
opacity: 0;
overflow: hidden;
}

@keyframes opacity {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

#checkout .facturation_form.visible{
position: relative;
display: inline-block;
animation-name: opacity;
animation-duration: 0.6s;
overflow: hidden;
height: auto;
opacity: 1;
width: 100%;
margin-top: 40px;
}

#checkout .resume{
vertical-align: top;
width: 100%;
display: block;
text-align: left;
max-width: 550px;
margin: 30px auto 0;
padding-top: 30px;
border-top: 2px solid #cccccc;
text-align: center;
}

#checkout .resume p{
max-width: 285px;
margin: 0 auto 20px;
display: flex;
justify-content: space-between;
font-size: 16px;
text-align: center;
}

#checkout .resume .cart{
margin-bottom: 30px;
}

#checkout .resume .cart p:last-of-type{
border-bottom: 1px solid #cccccc;
padding-bottom: 20px;
}

#checkout .resume .adresses{
margin-top: 50px;
margin-bottom: 50px;
}

div#checkout .resume p.produit span{
font-weight: bold;
max-height: 3em;
overflow: hidden;
max-width: 75%;
font-size: 15px;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
line-clamp: 1;
-webkit-box-orient: vertical;
}

div#checkout .resume p.produit span+span{
font-weight: normal;
}

#checkout .resume p.produit{
text-align: left;
font-size: 16px;
line-height: 22px;
}

#checkout .resume p.adresse_livraison{
display: block;
}

#checkout .resume p.adresse_livraison span+span{
font-size: 14px;
line-height: 18px;
margin-bottom: 0;
}

#checkout .resume p.adresse_livraison .name,#checkout, .resume p.adresse_livraison .address{
display: block;
text-align: left;
}

#checkout .resume p.adresse_facturation{
display: block;
}

#checkout .resume p.adresse_facturation .name, #checkout .resume p.adresse_facturation .address{
display: block;
text-align: left;
margin-bottom: 5px;
}

#checkout .resume p.adresse_facturation .title, #checkout .resume p.adresse_livraison .title{
display: inline-block;
}

#checkout .resume p.adresse_facturation, #checkout .resume p.adresse_livraison{
text-align: left;
margin-bottom: 20px;
}

#checkout .resume p.adresse_facturation span:nth-child(n+2){
font-size: 14px;
line-height: 18px;
margin-bottom: 0;
}

#checkout .resume p.total{
border-top: 1px solid #cccccc;
padding-top: 15px;
margin-bottom: 35px;
}

#checkout .resume p.tva{
display: block;
text-align: left;
}

#checkout .resume p.tva span{
display: block;
}

#checkout .resume p.tva span+span{
font-size: 14px;
line-height: 18px;
margin-bottom: 0;
}

#checkout .resume p.tva span+span a{
text-decoration: underline;
}

#checkout input[type="submit"]{
margin-top: 5px;
}

#checkout .resume p.total span, #checkout .resume p.livraison span+span, #checkout .resume p.total_articles span+span{
font-weight: 900;
}

#checkout .resume .adresses .title{
font-weight: 900;
}

div#checkout .resume.checkout-resume span{
	font-weight: normal;
}

div#checkout .resume.checkout-resume span+span{
	font-weight: 900;
}

div#checkout .resume.checkout-resume p.total span{
	font-weight: 900;
}

#checkout h1{
margin-bottom: 60px;
text-align: center;
}

#checkout p.label_input{
font-size: 16px;
margin-bottom: 30px;
}

#checkout p.livraison_camion{
font-size: 15px;
line-height: 18px;
color: #e10613;
margin-bottom: 30px;
}

#checkout .choice{
width: 100%;
background-color: white;
box-sizing: border-box;
border: 1px solid #cccccc;
text-align: left;
margin: 0 0 25px 0;
display: inline-block;
vertical-align: top;
cursor: pointer;
border-radius: 0px;
}

#checkout .paiement .choice{
width: 100%;
display: block;
min-height: auto;
margin: 0 0 20px;
}

#paiement_reception{
        text-align: center;
		max-width: 85vw;
		margin: 70px auto 0;
}

#paiement_reception>div{
max-width: 1200px;
margin: auto;
}

#paiement_reception>div.align-left{
text-align: left;
}

#paiement_reception h1{
        font-family: 'Prohibition', 'Quantico', sans-serif;
		font-size: 40px;
		font-weight: 600;
		line-height: 51px;
        display: block;
        width: fit-content;
        background: linear-gradient(66deg, rgba(230, 86, 28, 1) 17%, rgba(25, 25, 25, 1) 85%);
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        -webkit-text-fill-color: transparent;
        padding-left: 2px;
        margin: 0 auto 50px;
        padding-right: 6px;
}

#paiement_reception>div p.intro{
text-align: center;
}

#paiement_reception div.content p.inline{
display: inline;
}

#paiement_reception div.content p:not(.inline){
margin: 10px 0;
}

#paiement_reception div.content p:not(.inline) span:first-of-type{
font-weight: bold;
}

#paiement_reception .infos_paiement{
padding: 10px 20px;
margin: 30px 0;
box-sizing: border-box;
border: 2px solid #261a1a;
border-radius: 20px;
}

#paiement_reception .content>img{
margin: 30px auto;
width: 200px;
height: auto;
display: block;
}

#paiement_reception .button{
	margin-top: 30px;
}

#checkout .choice.selected{
border: 2px solid #261a1a;
font-weight: 500;
background-color: #efefef;
position: relative;
}

#checkout .choice.selected:after{
content:"";
position: absolute;
display: block;
right: 10px;
top: 10px;
width: 20px;
height: 20px;
background-image: url(images/icon-selected.svg);
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
}

#checkout .choice label{
display: inline-block;
width: 100%;
padding: 20px;
box-sizing: border-box;
cursor: pointer;
min-height: 106px;
}

#checkout .paiement+.paiement{
	margin: 20px 0;
}

#checkout .paiement+.paiement .label_input{
	margin-bottom: 10px;
}

#checkout .paiement input[type="text"]{
	border: 1px solid #aaaaaa;
	background-color: white;
	padding: 17px 10px;
	height: 30px;
	box-sizing: border-box;
	vertical-align: middle;
	width: 180px;
	font-size: 14px;
}

#checkout .paiement .button{
	background: #aaaaaa;
    padding: 8px 15px 9px;
    font-size: 15px;
    margin-left: -3px;
}

#checkout .paiement #reduction_message, #checkout .paiement #promo_message{
	display: inline-block;
	vertical-align: middle;
	font-size: 13px;
    text-transform: uppercase;
    color: #aaaaaa;
    margin-top: 8px;
}

#checkout .paiement .reduction_alert .alert_message{
	top: -100px;
	height: 70px;
}

#checkout .paiement .reduction_alert .alert_message p{
	font-size: 13px;
    text-align: left;
    line-height: 18px;
}



#checkout .paiement .title_alert{
	display: none;
}

#checkout .paiement #reduction_message.active+.title_alert, #checkout .paiement #promo_message.active+.title_alert{
	display: inline-block;
	vertical-align: middle;
	margin: 8px 0 0 5px;
}

#checkout .paiement .choice label{
min-height: auto;
}

#checkout .paiement .choice label img{
width: 30px;
height: 30px;
padding: 0 5px;
vertical-align: middle;
}

#checkout .paiement .choice label span{
display: block;
margin-top: 12px;
}

#checkout .choice span{
display: block;
}

#checkout .form_opener{
margin-top: 20px;
cursor: pointer;
}

#checkout .form_opener input, #checkout .form_opener label{
cursor: pointer;
}

#checkout .facturation_form>label{
display: inline-block;
font-weight: 900;
width: 295px;
vertical-align: top;
margin: 10px 30px 10px 0;
}

#checkout .facturation_form .tva-infos{
display: block;
font-size: 12px;
margin-top: 10px;
font-weight: 400;
line-height: 17px;
color: #aaaaaa;
margin-bottom: 40px;
}

#checkout .facturation_form>input[type="text"]{
border: 1px solid #bdc3c7;
padding: 10px;
font-size: 16px;
color: #2c3e50;
transition: all 0.2s ease-in-out;
margin-bottom: 20px;
width: 350px;
max-width: 100%;
vertical-align: top;
margin: 0;
box-sizing: border-box;
border-radius: 0;
}

#checkout input[type="radio"] {
visibility: hidden;
position: absolute;
}

#checkout .new_address{
width: 100%;
background-color: white;
box-sizing: border-box;
border: 1px solid #cccccc;
text-align: center;
margin: 0 0 25px 0;
display: inline-block;
vertical-align: top;
cursor: pointer;
border-radius: 0px;
padding-bottom: 25px;
}

#checkout .new_address .button{
width: 100%;
padding: 0;
height: 100%;
border-radius: 0;
background: transparent;
color: #14190b;
font-size: 18px;
padding-top: 60px;
box-sizing: border-box;
position: relative;
}

#checkout .new_address .button:before{
content: "";
position: absolute;
top: 25px;
left: 50%;
transform: translateX(-50%);
width: 25px;
height: 25px;
display: block;
background-image: url(images/icon-more.svg);
background-size: 25px;
background-position: center;
background-repeat: no-repeat;
}

#checkout .new_address_form{
	position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    background-color: rgb(158 158 158 / 42%);
	z-index: 101;
	display: none;
}

#checkout .new_address_form.visible{
	display: block;
}

#checkout .new_address_form .pop-up{
	width: 700px;
    height: fit-content;
    padding: 50px;
    background-color: white;
    opacity: 1;
    margin: 0 auto;
    margin-top: 60px;
	text-align: left;
}

#checkout .new_address_form .pop-up-title{
	text-align: center;
}

#checkout .new_address_form label{
	max-width: 350px;
    margin: 0 auto 4px;
	display: block;
}

#checkout .new_address_form input[type="text"]{
	border: 1px solid #bdc3c7;
    padding: 10px;
    font-size: 16px;
    color: #2c3e50;
    transition: all 0.2s ease-in-out;
    width: 350px;
    border-radius: 4px;
    background-repeat: no-repeat;
    background-position: 10px center;
	display: block;
	margin: 0 auto 20px;
    box-sizing: border-box;
}

#checkout .new_address_form .pop-up_submit{
	text-align: center;
    margin-top: 50px;
}

#checkout .new_address_form .pop-up_close{
	text-align: center;
    margin-top: 35px;
}

#checkout .new_address_form .pop-up_close a{
    background-color: white;
}

#checkout .loader{
  text-align: center;
} 

#checkout .loader p, #checkout .loader div, #checkout .loader input{
  opacity: 0;
  transition : none;
} 

#checkout .loader:before{
content: "";
border: 3px solid #f3f3f3;
border-top: 3px solid #876161;
border-radius: 50%;
width: 35px;
height: 35px;
animation: spin 2s linear infinite;
opacity: 1;
position: absolute;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(550deg); }
}


/* ***** CATALOGUES ***** */

#catalogues{
padding: 90px 50px 100px;
text-align: center;
}

#catalogues h1{
font-size: 30px;
line-height: 35px;
font-weight: 400;
padding-bottom: 30px;
margin: 0 0 50px;
position: relative;
}

#catalogues p.important{
color: #261a1a;
font-weight: 600;
margin-bottom: 40px;
}

#catalogues a.item{
display: inline-block;
vertical-align: top;
width: 45%;
margin: 25px 2%;
box-sizing: border-box;
text-align: left;
padding: 13px 43px;
text-align: center;
text-decoration: none;
transition: all 0.3s;
border: 1px solid #cfcfcf;
border-radius: 20px;
}

#catalogues a.item:hover{
background-color: #f1f1f1;
}

#catalogues .item h2{
text-align: left;
margin-bottom: 20px;
text-transform: uppercase;
border-bottom: 1px solid #261a1a;
font-weight: 600;
}

#catalogues .item h2 span{
display: block;
color: #969892;
font-size: 18px;
}

#catalogues .item p.texte{
text-align: left;
}


#catalogues .item img{
display:block;
width: 168px;
margin: 20px auto;
padding:13px;
}


#catalogues .item span.button{
background: rgb(171,199,62);
background: linear-gradient(90deg, rgba(171,199,62,1) 25%, rgba(104,188,69,1) 100%);
display: inline-block;
border-radius: 30px;
background-color: #14190b;
color: white;
padding: 8px 23px;
margin: 0;
transition: all 0.5s ease-in-out;
font-size: 15px;
text-decoration: none;
transition: all 0.3s;
padding-right: 65px;
position: relative;
margin-bottom: 20px;
}

#catalogues .item span.button:after {
content: "";
width: 30px;
height: 10px;
position: absolute;
top: 50%;
right: 0;
transform: translate(calc( 100% - 55px ),-50%);
background-image: url(images/button-after.svg);
background-size: 40px;
background-position: center right;
background-repeat: no-repeat;
transition: all 0.6s;
}

#catalogues .item:hover span.button:after {
width: 40px;
}

/* ***** LIVRAISON ET RETOURS ***** */

#livraison{
	text-align: center;
}

#livraison .intro{
	background-image: url(images/home-intro-background.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center bottom;
	position: relative;
	margin-bottom: 55px;
}

#livraison .intro .subtitle{
	font-size: 15px;
	color: #e0e0e0;
	padding-top: 50px;
}

#livraison .intro h1{
	padding: 60px 0 50px;
	font-size: 38px;
	line-height: 40px;
	max-width: 85vw;
	margin: 0 auto;
}

#livraison .c2{
	margin-top: 100px;
}

#livraison h2{
	margin-bottom: 30px;
}

#livraison h3{
	font-family: 'Prohibition', 'Quantico', sans-serif;
	padding-left: 2px;
	padding-right: 6px;
	display: block;
	width: fit-content;
	margin: 20px 0 10px;
	position: relative;
	text-transform: uppercase;
	padding-bottom: 0;
	background: unset;
	color: #16110b;
	-webkit-text-fill-color: unset;
	line-height: 26px;
	font-size: 24px;
}

#livraison .c1_c1, #livraison .c2_c1{
	display: block;
    width: 100%;
    max-width: 550px;
    margin: 0 auto 50px;
	text-align: left;
}

#livraison .c2{
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
}

#livraison .c1_c2, #livraison .c2_c2{
	display: inline-block;
	width: 100%;
	max-width: 400px;
	height: auto;
	vertical-align: top;
}

#livraison .image{
	width: 100%;
	height: 300px;
	overflow: hidden;
}

#livraison .image img{
	width: 100%;
	height: 100%;
	object-fit: contain;
}

#livraison .table-scroll{
	width: 100%;
	height: auto;
	overflow: auto;
}

#livraison table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    font-family: Arial, sans-serif;
    font-size: 14px;
    background: #fff;
	min-width: 500px;
}

#livraison thead {
    background: #f2f2f2;
}

#livraison thead th {
    padding: 12px 10px;
    text-align: left;
    font-weight: 600;
    border-bottom: 2px solid #ddd;
}

#livraison tbody td {
    padding: 10px;
    border-bottom: 1px solid #e0e0e0;
	font-size: 12px;
}

#livraison tbody tr:nth-child(even) {
    background: #fafafa;
}

#livraison tbody tr:hover {
    background: #feece1;
    transition: 0.2s;
}

#livraison td, #livraison th {
    vertical-align: middle;
}

#livraison th {
	font-size: 12px;
    font-weight: 600;
    color: #e6561c;
	text-transform: uppercase;
	padding: 10px;
}


/* ***** NEWS ***** */

#news .intro{
	margin-top: 60px;
}

#news h1 {
	font-family: 'Prohibition', 'Quantico', sans-serif;
	text-transform: uppercase;
	font-size: 32px;
	font-weight: 600;
	line-height: 44px;
	display: block;
	width: fit-content;
	background: linear-gradient(66deg, rgba(230, 86, 28, 1) 17%, rgba(25, 25, 25, 1) 85%);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	padding-left: 2px;
	margin: 0 auto 50px;
	padding-right: 6px;
}

#news .c1{
position: relative;
z-index: 2;
margin-bottom: 150px;
text-align: center;
}

#news .c1 .item{
	position: relative;
	display: block;
	width: 100%;
	max-width: 400px;
	margin: 0 auto 35px;
}

#news .c1 .item .photo{
	height: 257px;
	width: 100%;
}

#news .c1 .item img{
	height: 100%;
	width: 100%;
	object-fit: cover;
}

#news .c1 .item .infos{
	text-align: left;
	margin: 20px 26px 0;
	transition: all 0.4s;
}

#news .c1 .item .titre{
	font-size: 18px;
    line-height: 26px;
	text-align: left;
	font-weight: 600;
	margin-top: 15px;
}

#news .c1 .item:hover .infos{
	transform: translateY(-10px);
}

#news .c1 .item h2{
margin-bottom:10px;
}

#news .c1 .item span.date{
font-size:13px;
color:#a4a4a4;
display:block;
margin-bottom:20px;
}


#news .c1 .item span.button{
display:block;
margin-top:30px;
font-weight:700;
text-align:right;
}

#news .c1 .item:hover span.button{
text-decoration:underline;
}

#news .microdata{
	display: none;
}

#news .c2{ /* affichage d'un article */
display: inline-block;
vertical-align: top;
text-align:center;
width: 100%;
margin-top: 60px;
}

#news .c2 .photo{
display: inline-block;
vertical-align: top;
position: relative;
width: 50%;
margin-left: 9%;
}

#news .c2 .photo .date{
background-color: white;
padding: 5px 20px;
display: inline-block;
color: #1d001a;
font-size: 14px;
position: absolute;
bottom: 65px;
right: 15px;
}

#news .c2 .photo img{
width: 100%;
height: auto;
}

#news .c2 p.date{
font-size:13px;
color:#a4a4a4;
display:block;
margin-bottom:20px;
}

#news .c2 .pdfs{
margin-top: 50px;
text-align: center;	
}

#news .c2 .pdfs a{
display: inline-block;
width: 200px;
max-width: 100%;
margin: 0 15px 30px;
height: 150px;
overflow: hidden;
position: relative;
background-color: #fff;
}

#news .c2 .pdfs a .image{
width: 100%;
height: 100%;
}

#news .c2 .pdfs a img{
	width: 100%;
    height: 100%;
	object-fit: cover;
	object-position: center;
	transition: all 0.6s;
}

#news .c2 .pdfs a:hover img{
	transform: scale(1.1);
}

#news .c2 .pdfs a .description{
	position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    background-color: #000;
    color: white;
    padding: 10px;
    box-sizing: border-box;
    line-height: 20px;
}


#news .c2 .content .container{
display: block;
text-align: left;
width: 100%;
max-width: 900px;
margin: 50px auto 50px;
}

#news .c2 .content .container iframe{
margin: 0 auto 100px;
display: block;
max-width: 100%;
}

#news .c2 #slider{
	position: relative;
	width: 85vw;
	max-width: 550px;
	margin: auto;
}

#news .c2 #slider .item{
	width:100%;
	padding: 0 20px;
	box-sizing: border-box;
	text-align: left;
}

#news .c2 .item .image{
	width:100%;
	height: 215px;
	overflow: hidden;
	position: relative;
}

#news .c2 #slider .item .image img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	transition: all 0.3s;
}

#news .c2 #slider .item:hover .image img{
	transform: scale(1.1);
}

#news .c2 #slider .item.new .image:after{
	content:'NEW !';
	position: absolute;
	right: 10px;
	top: 10px;
	font-size: 14px;
	padding: 5px 9px;
	color: #fff;
	background-color: #191919;
}

#news .c2 #slider .item h3{
	color: #16110b;
	line-height: 22px;
	font-size: 15px;
	letter-spacing: 1px;
	margin-top: 11px;
}

#news .c2 #slider .item .infos{
	color: #aaaaaa;
    font-size: 14px;
    line-height: 19px;
	margin-top: 13px;
}

#news .c2 #slider .item .infos .prix_barre{
	text-decoration: line-through;
    font-size: 12px;
}

#news .c2 #slider .item .button{
	display: inline-block;
    vertical-align: middle;
    background: linear-gradient(90deg, rgba(191, 24, 34, 1) 0%, rgba(230, 86, 28, 1) 28%, rgba(191, 21, 34, 1) 100%);
    cursor: pointer;
    color: white;
    position: relative;
    padding: 5px 6px 5px 25px;
    font-size: 13px;
	margin-top: 10px;
}

#news .c2 #slider .item .button:after{
	content:'';
	width: 15px;
	height: 15px;
	position: absolute;
	left: 5px;
	top: 50%;
	transform: translateY(-50%);
	background-image: url(images/icon-cart-white.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

#news .c2 #slider .owl-prev{
	display: none;
}

#news .c2 #slider .owl-next{
	display: none;
}


#news .c2 .photos_secondaires{
margin: 50px auto 0;
text-align: center;
}

#news .c2 .photos_secondaires .demo-gallery{
text-align: center;
}

#news .c2 .photos_secondaires a.item{
width: 300px;
max-width: 100%;
height: 200px;
margin: 0 auto 20px;
display: block;
}

#news .c2 .photos_secondaires a.item img{
width: 100%;
height: 100%;
object-fit: cover;
transition: all 0.4s;
}


#news .c2 .photos_secondaires a.item:hover img{
opacity: 0.8;
}


#news .c2 .related{
margin-top:30px;
padding-top:30px;
border-top:1px solid #c0c0c0;
}

#news .c2 .related .item{
display:block;
line-height:40px;
color:black;
padding-left:35px;
transition:all 0.3s;
background-image:url('images/common/arrow-right-black-small.png');
background-repeat:no-repeat;
background-position:left -25px center;
}

#news .c2 .related .item:hover{
background-position:left 5px center;
}

#news .c2 .related .item:nth-child(odd){
background-color:#ececec;
}

#news .c2 .related .item:nth-child(even){
background-color:#f9f9f9;
}

#news .items_nav{
padding-top: 60px;
text-align: center;
}

#news .items_nav a{
	padding: 5px 10px;
	text-decoration: none;
	border: 1px solid lightgray;
}

#news .items_nav a.next{
	background-position: right 9px center;
	padding: 5px 25px 5px 10px;
	margin: 0;
	background-image: url(images/common/next.png);
	background-repeat: no-repeat;
}

#news .items_nav a.prev{
	padding: 5px 10px 5px 25px;
	margin: 0;
	background-image: url(images/common/prev.png);
	background-repeat: no-repeat;
	background-position: 9px center;
}

/* ***** CONTACT ***** */

#contact{
text-align: center;
margin-top: 40px;
}

#contact h1{
font-family: 'Prohibition', 'Quantico', sans-serif;
text-transform: uppercase;
font-size: 62px;
font-weight: 600;
line-height: 72px;
display: block;
width: fit-content;
background: linear-gradient(66deg, rgba(230, 86, 28, 1) 17%, rgba(25, 25, 25, 1) 85%);
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-fill-color: transparent;
padding-left: 2px;
margin: 0 auto 50px;
padding-right: 6px;
}


#contact .c1{
display:inline-block;
width:100%;
margin:0 auto;
text-align:center;
max-width: 500px;
vertical-align: middle;
}

#contact .c1 p span.head{
display: block;
width: 100%;
font-size: 12px;
line-height: 18px;
text-transform: uppercase;
color: #261a1a;
}

#contact .c1 a{
	text-decoration: underline;
}

#contact .c1 h2{
margin-top: 8px;
margin-bottom: 18px;
text-transform: uppercase;
padding-bottom: 0;
background: unset;
color: #16110b;
-webkit-text-fill-color: unset;
line-height: 26px;
font-size: 24px;
text-align: center;
width: 100%;
padding: 0;
}

#contact .c1 p.logo img{
display:none;
}

#contact .microdata{
display: none;
}

#contact .c2{
display:block;
width:100%;
max-width: 550px;
text-align:center;
background-image: url(images/home-about-background.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center bottom;
padding: 30px 20px 60px;
box-sizing: border-box;
margin: 50px auto 0;
}

#contact .c2 h2{
margin-top: 8px;
margin-bottom: 30px;
text-transform: uppercase;
padding-bottom: 0;
background: unset;
color: #fff;
-webkit-text-fill-color: unset;
line-height: 26px;
font-size: 24px;
text-align: center;
width: 100%;
padding: 0;
}

#contact .c2 .form_part{
margin-bottom: 25px;
text-align: left;
position: relative;
}

#contact .c2 label{
display: block;
width: 100%;
color: #fff;
font-size: 13px;
margin-bottom: 5px;
text-transform: uppercase;
}

#contact .c2 input{
width: 100%;
font-size: 15px;
padding: 6px 8px;
box-sizing: border-box;
font-weight: 400;
color: #161519;
border: 1px solid #161519;
border-radius: 0 !important;
}

#contact .c2 .g-recaptcha{
	max-width: 100%;
    overflow: auto;
}

#contact .c2 .button{
	cursor: pointer;
	border: none;
	width: fit-content;
	color: #fff;
	margin: 0 auto;
	padding: 6px 20px;
	border-radius: none;
}

.form_response{
	position: fixed;
	bottom: 50px;
	right: -700px;
	background-color: #74b643;
	padding: 20px 50px;
	-webkit-box-shadow: 0px 0px 4px 2px #c0c0c0;
	box-shadow: 0px 0px 4px 2px #c0c0c0;
	animation-name: response;
	animation-duration: 6s;
	animation-delay: 1s;
	z-index: 100;
}

.form_response p{
	color: #fff;
}

.form_response.error{
	background-color: #a34040;
}

@keyframes response {
0% {right: -700px;}
10% {right: 0;}
90% {right: 0;}
100% {right: -700px;}
}

/* ***** NEWSLETTER ***** */
#newsletter_form{
	position: fixed;
    right: -600px;
    bottom: 20px;
    z-index: 100;
    width: 600px;
    height: auto;
    max-width: calc(100vw - 40px);
    padding: 20px;
    box-sizing: border-box;
    max-height: 85vh;
    overflow: auto;
    background: #BF1822;
    background: linear-gradient(90deg, rgb(191 24 34) 0%, rgb(230 86 28) 28%, rgb(191 21 34) 100%);
	transition: all 0.6s;
}

#newsletter_form.active{
	right: 14px;
}

#newsletter_form .close{
	position: absolute;
	right: 15px;
	top: 15px;
	height: 20px;
	width: 20px;
	z-index: 10;
	background-image: url(images/icon-delete-white.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	cursor: pointer;
}

#newsletter_form p{
	color: #fff;
	margin: 0;
	font-size: 13px;
	line-height: 17px;
}

#newsletter_form p.title{
	color: #fff;
    font-size: 20px;
    line-height: 26px;
    text-transform: uppercase;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-family: 'Prohibition', 'Quantico', sans-serif;
    margin-bottom: 12px;
}

#newsletter_form form{
	margin-top: 20px;
}

#newsletter_form input[type="text"]{
	border: 1px solid #fff;
	background-color: transparent;
	padding: 8px 10px;
	box-sizing: border-box;
	vertical-align: middle;
	width: 250px;
	max-width: calc(100% - 135px);
	font-size: 14px;
	color: #fff;
	border-radius: 0;
}

#newsletter_form input[type="text"]::placeholder{
	color: #fff;
}

#newsletter_form input[type="submit"]{
	margin-left: 10px;
	background-color: #fff;
	border: 1px solid #fff;
	color: #e6561c;
	font-size: 14px;
	padding: 8px 10px 8px 35px;
	font-weight: 600;
	text-transform: uppercase;
	background-image: url(images/icon-send.svg);
	background-size: 18px;
	background-repeat: no-repeat;
	background-position: left 9px center;
	border-radius: 0;
	cursor: pointer;
}

/* ***** COOKIE CONSENT ***** */

#cookieChoiceInfo{
	box-sizing: border-box;
}

/* Version compacte : petite barre collée tout en bas de l'écran */
body .termsfeed-com---nb-simple{
	right: 0;
	top: unset;
	bottom: 0;
	left: 0;
	width: 100%;
	max-width: 100%;
	position: fixed;
	animation: cookie 0.5s linear;
	animation-delay: 2s;
	animation-fill-mode: forwards;
	opacity: 0;
}

@keyframes cookie {
  0% { transform: translateY(100%); opacity: 0; }
  100% { transform: translateY(0); opacity: 1; }
}

body .termsfeed-com---palette-light.termsfeed-com---nb{
	background-color: #f3f3f3;
	border-radius: 0;
	overflow: hidden;
	border: 0;
	border-top: 1px solid #dcdcdc;
}

/* On masque l'icône décorative et le titre : dans une barre aussi courte,
   seuls le texte d'information et les boutons sont utiles. */
body .termsfeed-com---palette-light.termsfeed-com---nb:after{
	display: none;
}

body .cc-nb-title-container{
	display: none;
}

body .termsfeed-com---nb .cc-nb-title{
	margin-bottom: 0;
	font-size: 12px;
	padding: 10px 12px 0;
}

body .cc-nb-text-container{
	padding: 8px 12px 7px;
}

body .termsfeed-com---nb .cc-nb-text{
	font-size: 10px;
	line-height: 14px;
	margin: 0;
}

body .termsfeed-com---nb .cc-nb-main-container{
	padding: 0;
}

body .termsfeed-com---reset button{
	background-color: #f3f3f3;
	border-top: 1px solid #dcdcdc;
}

body .termsfeed-com---reset button+button+button{
	border-left: 1px solid #dcdcdc;
}

body .termsfeed-com---nb .cc-nb-okagree, body .termsfeed-com---nb .cc-nb-reject, body .termsfeed-com---nb .cc-nb-changep{
	margin: 0!important;
	padding: 7px 6px!important;
	font-size: 10px !important;
	line-height: 13px !important;
}

.cc-nb-buttons-container{
	display: flex!important;
}

body .termsfeed-com---nb .cc-nb-okagree, body .termsfeed-com---nb .cc-nb-reject{
	flex: 1;
}


@media screen and (max-width: 600px) {
	#banner{
		padding: 0 0 14px;
	}
	#heading{
	}
	#wrapper{
	padding-top: 130px;
	}
	#heading+#banner+#wrapper{
	padding-top: 160px;
	}
	#home .c1 .content{
		width: 100%;
	}
	#home .c1 .images{
		width: 100%;
        height: 389px;
	}
	#home .c1 .image-1 {
        left: unset;
        right: 40%;
        width: 42%;
        height: 295px;
    }
	#home .c1 .image-2 {
        left: unset;
        right: 10px;
        width: 42%;
        height: 292px;
    }
	#home .c1 .image-3{
		display: none;
	}
	#banner .eshop-actions{
		text-align: right;
	}
	#banner .eshop-actions form{
		display: block;
		margin: 0 0 11px;
	}
	#home .c2 .title .deco{
		display: none;
	}
	#banner .eshop-important p{
		line-height: 17px;
        font-size: 9px;
        text-transform: uppercase;
        color: #fff;
        letter-spacing: 0px;
        text-align: center;
	}
	#footer .footer_c2, #footer .footer_c3, #footer .footer_c4{
		display: block;
		width: 100%;
		margin: 30px auto 0;
		max-width: 200px;
		text-align: center;
	}
	#cart table.panier td.titre a{
		font-size: 12px;
	}
	#cart table.panier td.prix_unitaire, #cart table.panier td.quantite{
		font-size: 11px;
	}
	#cart table.panier td.prix{
		display: none;
	}
	#cart table.panier td.image{
		width: 25px;
        height: 50px;
        display: inline-block;
        margin-top: 5px;
	}
	#cart .cart_buttons{
		margin-top: 30px;
	}

	#cart .cart_buttons a.button:first-child{
		font-size: 13px;
        border: 1px solid #aaaaaa;
        background: #fff;
        color: #aaaaaa;
        transition: all 0.4s;
        margin: 0 auto 10px;
        display: block;
        width: fit-content;
	}

	#cart .cart_buttons a.button+a.button{
        display: block;
        width: fit-content;
        margin: 0 auto;
        font-size: 16px;
	}

	#cart .recapitulatif{
		text-align: right;
        width: 100%;
        margin: 30px auto 0;
	}
	#cart p.total, #cart p.livraison, #cart p.total_a_payer, #cart p.livraison_gratuite, #cart p.livraison_supplementaire{
		font-size: 11px;
	}
	#cart p.total_a_payer{
		min-width: unset;
	}
	#cart p.total span, #cart p.livraison span, #cart p.total_a_payer span, #cart p.livraison_gratuite span, #cart p.livraison_supplementaire span{
		width: 89px;
	}
	div#cart p.livraison span{
		width: 66px;
	}
	/* (supprime le 23/09/2026 : le bouton Retour n'est plus en position fixed) */
	#banner .logo{
		max-width: 35%;
	}
}

/* ***** POP-UP DU SITE ***** */
/* Panneau retractable ancre au bord droit de l'ecran, aligne en bas.

   Sequence : ouverture automatique (une fois par jour et par visiteur, cookie
   `popup_promo`), retrait au bout de 3 secondes, puis l'onglet reste accroche
   au bord. L'onglet ouvre au clic ; la croix, un clic a cote du panneau ou la
   touche Echap referment. Aucun survol n'intervient : le comportement est
   identique a la souris et au doigt.

   L'onglet fait 48 px et c'est exactement ce qui reste visible une fois
   le panneau retire -- d'ou le translateX(calc(100% - 48px)) : si la
   largeur du panneau change, il n'y a rien a recalculer.

   Les couleurs de fond et de texte viennent de l'admin (table `popup`) et sont
   posees en style inline sur .popup_boite ET sur .popup_onglet : tout le reste
   utilise `inherit` ou `currentColor` pour les suivre. */

/* Tant que les cookies ne sont pas acceptes, rien ne s'affiche : le bandeau
   de consentement occupe toute la largeur en bas sur mobile. Le JS ajoute
   la classe `pret` des que le consentement est la. */
#popup_promo{
	position: fixed;
	right: 0;
	bottom: 16px;
	z-index: 200;
	display: none;
	align-items: flex-end;
	transform: translateX(calc(100% - 48px));
	transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
}

#popup_promo.pret{
	display: flex;
}

#popup_promo.ouvert{
	transform: translateX(0);
}

/* L'excroissance : seul element encore visible une fois le panneau retire */
#popup_promo .popup_onglet{
        flex: 0 0 52px;
        width: 52px;
        height: 52px;
        margin: 0;
        padding: 0;
        border: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        font-family: 'Prohibition', 'Quantico', sans-serif;
        font-size: 38px;
        padding-right: 6px;
        padding-bottom: 3px;
        font-weight: 600;
        line-height: 1;
        cursor: pointer;
        opacity: 0.78;
        transition: opacity 0.35s;
        box-shadow: -6px 4px 18px -8px rgba(0, 0, 0, 0.5);
}

/* Respiration lente : l'onglet accroche l'oeil sans clignoter */
@keyframes onglet_respire{
	0%, 100%{ opacity: 0.72; }
	50%{ opacity: 1; }
}

#popup_promo:not(.ouvert) .popup_onglet{
	animation: onglet_respire 4.5s ease-in-out infinite;
}

#popup_promo.ouvert .popup_onglet{
	animation: none;
	opacity: 1;
}

#popup_promo .popup_onglet:hover{
	animation: none;
	opacity: 1;
}

#popup_promo .popup_onglet:focus-visible{
	outline: 2px solid currentColor;
	outline-offset: -6px;
}

/* Une fois retire, le panneau sort de l'ordre de tabulation : sans cela, la
   navigation au clavier passerait par un bouton et un lien hors de l'ecran.
   Le delai laisse l'animation se terminer avant de le masquer. */
#popup_promo:not(.ouvert) .popup_boite{
	visibility: hidden;
	transition: visibility 0s linear 0.5s;
}

#popup_promo.ouvert .popup_boite{
	visibility: visible;
	transition: visibility 0s;
}

#popup_promo .popup_boite{
	position: relative;
	width: 320px;
	max-width: calc(100vw - 48px);
	box-sizing: border-box;
	padding: 21px 22px 23px;
	box-shadow: -10px 10px 34px -14px rgba(0, 0, 0, 0.55);
}

#popup_promo .close{
	position: absolute;
	right: 12px;
	top: 12px;
	width: 20px;
	height: 20px;
	opacity: 0.55;
	cursor: pointer;
	transition: opacity 0.25s;
}

#popup_promo .close:before,
#popup_promo .close:after{
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 11px;
	height: 1px;
	background-color: currentColor;
}

#popup_promo .close:before{ transform: translate(-50%, -50%) rotate(45deg); }
#popup_promo .close:after{ transform: translate(-50%, -50%) rotate(-45deg); }
#popup_promo .close:hover{ opacity: 1; }
#popup_promo .close:focus-visible{ outline: 2px solid currentColor; outline-offset: 3px; }

/* Le titre et le texte sont le cas courant : le pop-up doit tenir debout
   sans compte a rebours ni bouton, qui restent l'exception. */
#popup_promo p.title{
	color: inherit;
	font-family: 'Prohibition', 'Quantico', sans-serif;
	font-size: 18px;
	line-height: 1.15;
	text-transform: uppercase;
	font-weight: 600;
	letter-spacing: 1px;
	margin: 0 0 9px;
	padding-right: 18px;
}

#popup_promo p.texte{
	color: inherit;
	font-size: 13.5px;
	line-height: 1.45;
	margin: 0;
	opacity: 0.88;
}

#popup_promo .compte_a_rebours{
	display: flex;
	gap: 14px;
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px solid currentColor;
}

#popup_promo .compte_a_rebours span{
	display: flex;
	flex-direction: column;
	font-size: 9px;
	letter-spacing: 1px;
	text-transform: uppercase;
	opacity: 0.75;
}

#popup_promo .compte_a_rebours b{
	font-size: 18px;
	font-weight: 600;
	line-height: 1.1;
	font-variant-numeric: tabular-nums;
	opacity: 1;
}

#popup_promo .popup_bouton{
	display: block;
	margin-top: 18px;
	padding: 11px 18px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
	text-align: center;
	text-decoration: none;
	transition: opacity 0.3s;
}

#popup_promo .popup_bouton:hover{
	opacity: 0.85;
}

/* Sous 600px, le panneau prend toute la largeur disponible moins l'onglet */
@media screen and (max-width: 600px){
	#popup_promo{
		bottom: 14px;
	}

	#popup_promo .popup_boite{
		width: calc(100vw - 48px - 12px);
		padding: 20px 20px 22px;
	}

	#popup_promo p.title{
		font-size: 17px;
	}

	#popup_promo .compte_a_rebours{
		gap: 11px;
		margin-top: 14px;
		padding-top: 12px;
	}

	#popup_promo .compte_a_rebours b{
		font-size: 17px;
	}
}

@media (prefers-reduced-motion: reduce){
	#popup_promo{ transition: none; }
	#popup_promo:not(.ouvert) .popup_onglet{ animation: none; opacity: 0.85; }
}

/* ***** POP-UP : VIGNETTE PRODUIT (17/09/2026) *****
   Photo facultative envoyee depuis l'admin, affichee en petit a gauche du
   titre et du texte. Le fichier fait au plus 300 px (ecrans haute densite) :
   c'est ici que la taille d'affichage est fixee.
   Le cadre blanc detache la photo du fond colore, quelle que soit la couleur
   choisie dans l'admin. Le panneau s'elargit un peu pour laisser de la place
   au texte. */
#popup_promo .popup_boite.avec_vignette{
	width: 380px;
}

#popup_promo .popup_entete{
	display: flex;
	align-items: flex-start;
	gap: 16px;
}

#popup_promo .popup_vignette{
	flex: 0 0 100px;
	width: 100px;
	height: 100px;
	box-sizing: border-box;
	padding: 6px;
	background-color: #ffffff;
	overflow: hidden;
}

#popup_promo .popup_vignette img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

#popup_promo .popup_textes{
	flex: 1 1 auto;
	min-width: 0;
}

@media screen and (max-width: 600px){
	#popup_promo .popup_boite.avec_vignette{
		width: calc(100vw - 48px - 12px);
	}

	#popup_promo .popup_entete{
		gap: 12px;
	}

	#popup_promo .popup_vignette{
		flex-basis: 80px;
		width: 80px;
		height: 80px;
		padding: 5px;
	}
}


#shop .c3 .c3_c1 .ajouter_au_panier .achat_rapide_lien{
	display: block;
	width: fit-content;
	margin: 14px 0 0;
	background: none;
	border: 1px solid #bf1822;
	color: #bf1822;
	padding: 8px 15px;
	font-size: 15px;
	transition: all 0.3s;
	margin-top: 25px;
}

#checkout.achat_rapide p.intro{
	font-size: 16px;
	line-height: 22px;
	margin-bottom: 30px;
	opacity: 0.8;
}

/* Champs du formulaire : memes reglages que les autres formulaires du site */
#checkout.achat_rapide h1{
	margin-bottom: 30px;
}
#checkout.achat_rapide .content input[type="text"],
#checkout.achat_rapide .content input[type="email"],
#checkout.achat_rapide .content input[type="tel"],
#checkout.achat_rapide .content select{
	border: 1px solid #aaaaaa;
	background-color: white;
	padding: 5px 10px;
	height: 35px;
	box-sizing: border-box;
	vertical-align: middle;
	width: 100%;
	margin-bottom: 0px;
	font-size: 16px;
}

#checkout.achat_rapide p.label_input{
	font-size: 16px;
	margin: 20px 0 8px;
}

/* Une ligne par champ : libelle a gauche, saisie a droite. Le formulaire
   tient dans un ecran, ce qui evite l'impression de questionnaire sans fin. */
#checkout.achat_rapide .champ{
	display: flex;
	align-items: center;
	gap: 18px;
	margin-bottom: 14px;
}

#checkout.achat_rapide .champ label{
	flex: 0 0 170px;
	font-size: 15px;
	line-height: 20px;
	cursor: pointer;
}

#checkout.achat_rapide .champ input,
#checkout.achat_rapide .champ select{
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	margin-bottom: 0;
}

#checkout.achat_rapide .champ input[name="bon_reduction"]{
	margin-bottom: 0;
}

/* Deux saisies sur la meme ligne (rue + numero, code postal + ville) */
#checkout.achat_rapide .champ_groupe{
	flex: 1 1 auto;
	display: flex;
	gap: 10px;
	min-width: 0;
}

#checkout.achat_rapide .champ_groupe input#ar_numero{
	flex: 0 0 90px;
}

#checkout.achat_rapide .champ_groupe input#ar_code_postal{
	flex: 0 0 110px;
}

#checkout.achat_rapide .code_reduction .champ{
	margin-bottom: 0;
}

#checkout.achat_rapide .code_reduction .champ_groupe .button{
	flex: 0 0 auto;
}

/* Champ piege anti-robot : jamais visible, jamais lu par un lecteur d'ecran */
#checkout.achat_rapide .champ_piege{
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

#checkout.achat_rapide .code_reduction{
	margin-top: 35px;
	border-top: 1px solid #cccccc;
	padding-top: 25px;
}

#checkout.achat_rapide .code_reduction .button{
	font-size: 16px;
}

#checkout.achat_rapide #reduction_message{
	display: block;
	font-size: 14px;
	line-height: 20px;
	margin-top: 12px;
	color: #bf1822;
}

#checkout.achat_rapide #reduction_message.active{
	color: #1c8a3b;
}

#checkout.achat_rapide .form_errors{
	max-width: 640px;
	margin: 0 auto 30px;
	padding: 15px 20px;
	background-color: #fdecea;
	border-left: 3px solid #bf1822;
	text-align: left;
}

#checkout.achat_rapide .form_errors p{
	font-size: 15px;
	line-height: 21px;
	color: #8c1119;
	margin: 0;
}

/* L'article commande, rappele en haut du resume */
#checkout.achat_rapide .resume .article{
	border-bottom: 1px solid #cccccc;
	padding-bottom: 20px;
	margin-bottom: 25px;
}

#checkout.achat_rapide .resume .article .vignette{
	width: 120px;
	height: 120px;
	margin: 0 auto 12px;
	background-color: #ffffff;
	box-sizing: border-box;
	padding: 5px;
}

#checkout.achat_rapide .resume .article .vignette img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

#checkout.achat_rapide .resume .article p.titre{
	display: block;
	font-size: 16px;
	line-height: 21px;
	font-weight: 600;
	margin-bottom: 0;
}

#checkout.achat_rapide .resume p.label_input{
	text-align: center;
	width: 100%;
	max-width: unset;
	margin-top: 0;
	display: block;
}

#checkout.achat_rapide .resume .custom-number-input{
	margin: 0 0 30px;
}

#checkout.achat_rapide .resume .custom-number-input input[type="number"]{
	border: 1px solid #aaaaaa;
	background-color: white;
	padding: 4px;
	height: 36px;
	width: 70px;
	box-sizing: border-box;
	vertical-align: middle;
	text-align: center;
	font-size: 17px;
}

#checkout.achat_rapide .resume input[type="submit"]{
	width: 100%;
	max-width: 285px;
	height: 45px;
}

#checkout.achat_rapide .resume p.rassurance{
	display: block;
	font-size: 13px;
	line-height: 18px;
	opacity: 0.7;
	margin-top: 15px;
}


/* Correctif du 23/09/2026 : fleches natives du champ quantite.
   Les regles qui les masquent etaient limitees a #shop : sur la page achat
   rapide, les fleches du navigateur s'affichaient en plus des boutons − et +. */
#checkout.achat_rapide input[type="number"]{
	-moz-appearance: textfield;
	appearance: textfield;
}

#checkout.achat_rapide input[type="number"]::-webkit-inner-spin-button,
#checkout.achat_rapide input[type="number"]::-webkit-outer-spin-button{
	-webkit-appearance: none;
	margin: 0;
}


/* Sous 800px, la colonne est trop etroite pour un libelle a gauche :
   on repasse le libelle au-dessus de la saisie. */
#checkout.achat_rapide .champ{
	display: block;
	margin-bottom: 16px;
}

#checkout.achat_rapide .champ label{
	display: block;
	margin-bottom: 6px;
}

#checkout.achat_rapide .champ input,
#checkout.achat_rapide .champ select{
	width: 100%;
}

#checkout.achat_rapide .champ_groupe input#ar_numero{
	flex: 0 0 80px;
}