/*----------------ENTÊTE----------------*/

header {
	width: 100%; /*largeur*/
    height: 60px; /*hauteur*/
}


/*----------------MENU DE NAVIGATION----------------*/

nav {
	width: 100%; /*largeur*/
	height: inherit; /*hauteur*/
	margin: auto; /*marge extérieur*/
	position : fixed; /*type de positionnement*/
	display: flex; /*apparition des balises*/
	top: 0;
	left: 0;
	justify-content: center; /*centre horizontalement le contenu*/
	align-items: center; /*centre verticalement le contenu*/
	background-color: var(--menu); /*couleur du fond*/
	z-index: 2; /*position au dessus ou au dessous*/
}

nav > ul {
	margin: auto; /*marge extérieur*/
	display: flex; /*apparition des balises*/
	justify-content: center; /*centre horizontalement le contenu*/
	align-items: center; /*centre verticalement le contenu*/
	gap: 25px; /*espace entre les éléments*/
}

nav .separation {
	width: 3px; /*largeur*/
	height: 30px; /*hauteur*/
	background-color: var(--blanc); /*couleur du fond*/
}

nav a {
	font-family: var(--sous-titre); /*police type*/
	font-size: var(--20); /*police taille*/
	text-transform: uppercase; /*texte transformer*/
	letter-spacing: 1.2pt; /*espace entre lettre*/
	transition: all 0.5s ease; /* Ajoutez une transition*/
	color: var(--blanc); /*police couleur*/
}

nav a:hover {
	color: var(--survol); /*police couleur*/
}

nav button, nav button:hover {
	background-color: transparent; /*couleur*/
}

/*----------------MENU BURGER----------------*/

.menu-burger {
	--menu-dimension: 19px; /*variable*/
	width: var(--menu-dimension); /*largeur*/
	height: var(--menu-dimension); /*hauteur*/
	padding: 0; /*marge intérieur*/
	display: none; /*apparition des balises*/
	position : absolute; /*type de positionnement*/
	top: 50%; /*position en partant du haut*/
	right: 20px; /*position en partant de la droite*/
	transform: translate(-50%, -50%); /*transforme*/
	border-radius: 0px; /*bordure arrondi*/
	z-index: 0; /*position au dessus ou au dessous*/
	background-color: transparent; /*couleur*/

}