/* logo */
#header #logo{
	background-image: url(../img/logo/recuperer-4-points@250.png);
	background-image: image-set(
		'../img/logo/recuperer-4-points@250.webp' type('image/webp'),
		'../img/logo/recuperer-4-points@250.png' type('image/png')
	);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

/* menu principal */
.nav1 li.shoppingbag a{
	background-image: url(../img/panier-w@80.png);
	background-size: 16px;
	background-repeat: no-repeat;
	background-position: left 15px center;
}

/* menu mobile */
#nav1Mobile li.shoppingbag a{
	background-image: url(../img/panier-w@80.png);
	background-size: 16px;
	background-repeat: no-repeat;
	background-position: center;
	font-size: 0;
}

/* picto menu */
.nav1 li.picto a{
	background-size: 1.5em;
	background-repeat: no-repeat;
	background-position: left 1em center;
}
.nav1 li#stages a{
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M8 2v4"></path><path d="M16 2v4"></path><rect width="18" height="18" x="3" y="4" rx="2"></rect><path d="M3 10h18"></path></svg>');
	//background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 17h2c.6 0 1-.4 1-1v-3c0-.9-.7-1.7-1.5-1.9C18.7 10.6 16 10 16 10s-1.3-1.4-2.2-2.3c-.5-.4-1.1-.7-1.8-.7H5c-.6 0-1.1.4-1.4.9l-1.4 2.9A3.7 3.7 0 0 0 2 12v4c0 .6.4 1 1 1h2"></path><circle cx="7" cy="17" r="2"></circle><path d="M9 17h6"></path><circle cx="17" cy="17" r="2"></circle></svg>');
}
.nav1 li#actus a{
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 22h16a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v16a2 2 0 0 1-2 2Zm0 0a2 2 0 0 1-2-2v-9c0-1.1.9-2 2-2h2"></path><path d="M18 14h-8"></path><path d="M15 18h-5"></path><path d="M10 6h8v4h-8V6Z"></path></svg>');
}
.nav1 li#faq a{
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>');
}

/* pied de page */
#footerWrap{
	display: grid;
	padding: 3em 5%;
	gap: 3em;
	background: linear-gradient( 180deg, #fcfcfc 0%, #fff 100% );
	color: rgb(156, 163, 175);
	font-size: 0.9em;
}
#footerWrap #siteInfo{
	padding: 30px 0 0;
	background-image: url(../img/logo/recuperer-4-points@250.png);
	background-image: image-set(
		'../img/logo/recuperer-4-points@250.webp' type('image/webp'),
		'../img/logo/recuperer-4-points@250.png' type('image/png')
	);
	background-size: 125px;
	background-repeat: no-repeat;
	background-position: top left;
}
#footerWrap .title{
	margin: 0 0 1em 0;
	color: var(--colorText1);
	font-size: 1.1em;
}
#footerWrap ul{
	margin: 0;
	padding: 0;
}
#footerWrap li{
	margin: 0.5em 0;
	list-style: none;
}
#footerWrap ul span{
	display: block;
	padding: 10px 20px;
}
#footerCopyright{
	padding: 2em 0;
	border-top: 1px solid #888;
	text-align: center;
	font-size: 0.8em;
}





@media screen and (min-width: 750px){
#footerWrap{
	grid-template-columns: 2fr 1fr 1fr 1fr;
	padding: 4em 5%;
}
#footerCopyright{
	grid-column: span 4;
}
}





@media screen and (min-width: 1000px){
.nav1 li.picto a{
	background-size: 1em;
}
}





@media screen and (min-width: 1200px){
#footerWrap{
	padding: 4em 10%;
}
#footerWrap #siteInfo{
	padding: 60px 0 0;
	background-size: 250px;
}
}