nav {
	z-index:3;
	position:sticky;
	width:100vw;
	top:0;
	left:0;
	display:flex;
	justify-content:space-between;
	background:url("/assets/images/logos/N4BGLogo.svg"), var(--gris-fonce2);
	background-repeat:no-repeat, no-repeat;
	background-size:180vw, 100vw;
	background-position-y:-30vw, 0;
	background-position-x:-15vw, 0;
	background-clip:content-box;
	height:112px;
	border-bottom:none;
}

.logo-N4 {
	width:175px;
	height:63px;
	margin-top:30px;
	margin-left:69px;
}

/* *********		navbar2		 ********** */

.navbar2 #menuburger,
.burger_input { display:none; }

.navbar2 {
	position:relative;
	z-index:2;
	width:fit-content;
	height:112px;
	display:flex;
	justify-content:space-between;
	gap:25px;
	align-items:end;
	padding-right:170px;
}

.navbar2 menu {
	height:47px;
	display:flex;
	justify-content:center;
	align-items:center;
}

.navbar2 menu li { position:relative; }

.navbar2 menu li>button,
.navbar2__liens {
	background-color:transparent;
	font-size:14px;
	font-weight:700;
	letter-spacing:4px;
	color:var(--nvbar2textcolor);
	border:none;
	padding:0 18px;
	line-height:2.8;
}

.navbar2 .separator_nb2 {
	color:var(--nvbar2textcolor);
	font-weight:700;
	font-size:15px;
	margin:0 -2px;
}

.navbar2 menu li>button:hover { filter:brightness(.85); }

.navbar2 menu li.languages {
	display:flex;
	justify-content:space-between;
	gap:5px;
}

.navbar2 menu li.languages a:first-of-type { margin-left:15px; }

.dd-conteneur {
	position:absolute;
	top:41px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	width:186px;
	z-index:5;
	background-color:var(--gris-clair);
}

.dd-conteneur a {
	font-size:14px;
	font-weight:700;
	text-transform:uppercase;
	color:var(--gris-fonce);
	padding:18px 20px 15px 20px;
}

.dd-conteneur a:not(:last-of-type) { border-bottom:1px solid var(--gris-fonce); }
.dd-conteneur a:hover { color:var(--nvbar2droptextcolor1); }

#nav-compte.dd-conteneur a {
	padding: 10px;
	text-align: center;
}

.dd_vehicules form {
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:20px;
}

.dd_vehicules {
	left:-10px;
	width:200px;
	font-size:14px;
	z-index:4;
	padding:20px 15px 35px 12px;
	animation:reveal-in 0.1s ease-out 1 normal;
}

.dd_vehicules select:active {
	height:25px;
	line-height:2;
	background-color:#e2e2e2;
}

.dd_vehicules select option {
	padding:0;
	background-color:white;
	height:15px;
}

.dd_vehicules select option :focus { background-color:#656871; }

.dd_vehicules select {
	width:100%;
	height:25px;
	line-height:2.2;
	padding-left:5px;
	font-size:14px;
	outline:1px solid #e2e2e2;
}

.dd_vehicules form div {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	gap: 15px;
	align-items: center;
	justify-content: space-between;
}

.dd_vehicules button {
	text-transform: uppercase;
	font-size: 14px;
	font-weight:700;
	padding: 5px 10px 3px 10px;
	color: white;
	background-color: var(--gris-fonce3);
}

.dd_vehicules a { padding:0; }

.dd_vehicules .veh_favoris p {
	display:flex;
	justify-content:space-between;
	padding-top:10px;
	width:100%;
	margin:0;
}

.dd_vehicules .veh_favoris p {
	text-transform:uppercase;
	font-size:14px;
	font-weight:700;
	cursor:pointer;
}

/*	unlogged box */

/*
.container-login {
	width:250px;
	padding:20px;
	flex-direction:column;
	align-items:center;
	gap:20px;
	background-color:var(--gris-clair);
}

.container-login form {
	display:flex;
	flex-direction:column;
	gap:15px;
	width:100%;
	font-size:14px;
	font-weight:600;
}

.container-login input:not(:last-of-type) {
	border:1px solid var(--color10);
	padding-left:3px;
	width:100%;
	font-weight:400;
}

.container-login input::placeholder { color:var(--gris-fonce3); }

.container-login button {
	font-size:14px;
	padding: 5px 10px 3px 10px;
	color:white;
	background-color:var(--gris-fonce3);
	margin:auto;
}

.container-login button:active {
	filter:brightness(.9);
	padding:6px 15px 4px 17px;

}

.container-login button:hover { filter:brightness(1.1); }

.container-login a button { background-color:var(--gris-fonce3); }

.container-login .check-vert>label {
	display:flex;
	align-items:center;
	gap:5px;
}

.resterConnecte__msg {
	font-size:12px;
	line-height:1;
}
*/


/*	*/
.navbar2 .navbar_basket {
	/* padding-bottom:16px; */
	/* margin-right:25px; */
	position:absolute;
	right:75px;
	bottom:16px;
}

.navbar2 .navbar_basket>button {
	display:flex;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	background-color:transparent;
	position:relative;
}

.navbar2 .navbar_basket>button img { height:46px; }

.navbar2 .navbar_basket_nb {
	position:absolute;
	left:95%;
	font-size:9px;
	font-weight:700;
	color:white;
	background-color:#9B202F;
	height:24px;
	width:24px;
	display:flex;
	justify-content:center;
	align-items:center;
	border-radius:50%;
	line-height:1;
}

.dd_panier {
	position: absolute;
	top: 62px;
	right: -120px;
	background-color:#c9c9c9;
	flex-direction: column;
	justify-content: center;
	width: 450px;
	font-size: 14px;
	z-index: 4;
	padding: 15px 30px 18px 20px;
	animation: reveal-in 0.1s ease-out 1 normal;
}

.dd_panier .articles {
	display:flex;
	flex-direction:column;
	gap:6px;
	line-height:1.9;
	overflow-y:scroll;
	max-height:180px;
}

.dd_panier .articles li {
	display:inline-flex;
	gap:1px;
	justify-content:space-between;
	margin:0;
}

.dd_panier .title {
	margin:9px 0;
	font-weight:700;
	text-transform:uppercase;
}

.dd_panier .articles .nomArticle {
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
	width:130px;
}

.dd_panier .vehArticle {
	width:73px;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
}

.dd_panier .quantiteArticle {
	display:flex;
	justify-content:center;
	align-items:center;
	border:1px solid var(--blackborders);
	padding:3px 14px;
	text-align:center;
	width:36px;
	height:28px;
	overflow:hidden;
}

.dd_panier .warningArticle {
	opacity:0;
	width:25px;
	height:32px;
	display:flex;
	align-items:center;
	padding-bottom:5px;
}

.dd_panier .soustotArticle {
	width:86px;
	text-align:end;
}

.dd_panier .totalArticle {
	display:flex;
	justify-content:space-between;
	margin-top:12px;
	text-transform:uppercase;
	font-weight:700;
}

.dd_panier button {
	align-self:flex-end;
	font-weight:600;
	background-color:#fff;
	color:#000;
	padding:6px 12px;
	margin-top:16px;
	text-transform:uppercase;
	float:right;
}

.dd_panier button:disabled {
	background-color:#bdb7a7;
}

.dd_panier span.warningArticle.active { opacity:1; }
.dd-conteneur, .dd_panier { display:none; }


/* *********************************************** effets clic****************************** */

.navbar2 menu>li>button:active { margin:2px -2px -2px 2px; }

.navbar2 li>div { animation:reveal-in 0.1s ease-out 1 normal; }

@media screen and (max-width:1550px) {
	.navbar2 menu li>button {
		letter-spacing:3px;
		padding:0 15px;
	}
}

@media screen and (min-width:1300px) {
	.navbar2 menu li:hover	.dropdown-content.hover {
		display:flex !important;
	}

	.navbar2 .navbar_basket {
		margin-right:25px;
	}
}

@media screen and (max-width:1300px) {
	nav {
		position:relative;
		z-index:unset;
		top:unset;
		left:unset;
		background-position-x:calc((-9vw + 250px) - 20vw), 0
	}

	.courbe-haut { position:absolute; }

	#menuburger img {
		width:60px;
		height:60px;
	}

	.navbar2 #menuburger,
	.burger_input {
		display:block;
		background-color:transparent;
	}

	.navbar2 #burgercheck { display:none; }

	.navbar2 .burger {
		background-color:var(--nvbar2bgcolor);
		z-index:1;
		height:fit-content;
	}

	.navbar2 .navbar_basket {
		position:relative;
		right:10px;
	}

	.navbar2 { padding-right:25px; flex-direction: row-reverse; }

	.navbar2 menu {
		position:absolute;
		right:0px;
		top:112px;
		padding:10px 15px;
		flex-direction:column;
		gap:5px;
		display:none;
		width:291px;
		margin-right:0;
	}

	.navbar2 .separator_nb2 { display:none; }

	.navbar2 menu li.languages a:first-of-type { margin-left:0; }
}

@media screen and (max-width:768px) {
	nav {
		background-position-x:-5vw, 0;
		background-position-y:-20vw, 0;
		background-size:200vw 100vw;
		width: 100%;
	}
}

@media screen and (max-width:548px) {
	.logo-N4 { margin-left:35px; }
}

@media screen and (max-width:448px) {
	.logo-N4 { margin-left:30px; }

	.dd_panier {
		top: 59px;
		width: 100vw;
		min-width: 300px;
	}
}

@media screen and (max-width:374px) {
	 .logo-N4 {
		width: 110px;
		height: 63px;
		margin-top: 25px;
		margin-left: 20px;
	}

	.logo-N4 img { width: 110px; height: auto; }
	nav { height:85px; }
	.navbar2 {height:82px; gap:20px; }
	.navbar2 menu { top:85px; }
	.navbar2 .navbar_basket > button img { height:40px; }
}

@media screen and (max-width:300px) {
	.logo-N4 { margin-left:10px; margin-right:10px; }
}

@keyframes reveal-in {
	0% {
		transform:rotateX(90deg);
		transform-origin:top;
	}

	100% {
		transform-origin:top;
		transform:rotateX(0);
	}
}