p,h2, h3, h1, span, a, li {
  font-family: "Epilogue", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
body {
	font-size:14px;
}
h2 {
	margin-bottom:40px;
}
.conteneur {
	width:400px;
	margin:30px auto;
}
a {
	text-decoration:none;
	color:#000;
}
a:hover {
	text-decoration:underline;
}
p,li, span {
	font-size:1.2rem;
	line-height:1.8rem;
}
.titre a,
.titre {
	font-size:5rem;
	font-weight:900;
}
.titre02 {
	font-size:3rem;
	font-weight:600;
	font-style:italic;
}
h2 a,
.contact a {
	font-size:3rem;
	transition: font-size 8s;
	cursor:pointer;
}
h2:hover a{
	font-size:5rem;
	font-weight:bold;
}
/* menu burger */

header {
	display: flex;
	justify-content: center;
	position: fixed;
	bottom: 0px;
	background-color: #fff;
	width: 100%;
	left: 0;
	padding:10px;
	z-index:10;
}

.menu-btn {
	width: 160px;
	height: 30px;
	position: relative;
	z-index:2;
	overflow: hidden;
}
.menu-btn .bar {
	width: 30px;
	height: 4px;
	position: absolute;
	top: 50%;
	left: 130px;
	border-radius: 4px;
	transform: translate(-50%, -50%);
	background-color: #000;
	transition: all 0.3s ease-in-out;
}
.menu-btn .bar:nth-of-type(3) {
	top: calc(50% - 9px);
}
.menu-btn .bar:nth-of-type(4) {
	top: calc(50% + 9px);
}

.menu-btn.active .bar:nth-of-type(2) {
  display: none;
}
.menu-btn.active .bar:nth-of-type(3) {
  top: 50%;
  transform: translate(-50%, 0%) rotate(45deg);  
}
.menu-btn.active .bar:nth-of-type(4) {
  top: 50%;
  transform: translate(-50%, 0%) rotate(-45deg); 
}
.nav {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 15px;
    background: #fff;
	transform: translateX(100%);
	transition: transform 0.5s; 
	overflow-y:scroll;
}
.nav.active {
	transform: translateX(0);
}
.nav__list {
	margin-bottom:40px;
}
.nav .nav__list_item {
	list-style-type: none;
}
/*media queries */

@media(max-width:480px){
	.conteneur {
		width:100%;
	}
	.nav {
		width:auto;
	}
}