/* STYLES COMMUN */

body{font-family: inter;
	font-size: 15px;
	line-height: 17px}

header{background: #393939;
		color: #FFFFFF;
		padding: 20px;
		display: flex;
		justify-content: space-between;
		align-items: center;}



	.menu{display: flex;
		flex-direction: row;
		flex-wrap: no-wrap;
		gap:50px;
		justify-content: flex-end;
		align-content: center}


	h2{font-weight: bold;
	font-size: 20px;
	padding: 10px 0px}

	h3{font-weight: bold;
	font-size: 17px;
	padding:5px 0px}

	p{padding:5px 0px}

	a{text-decoration: none}

		a#head{color: #FFFFFF;
				font-weight: bold}

		a#rest1{color: #777777}
		a#rest2{color:#FFFFFF;
				text-decoration: underline;}

		.btn{display: inline-block;
			text-decoration: none;
			background: #A1D5FF;
			color:#FFFFFF;
			text-transform: uppercase;
			padding:10px;
			border-radius: 10px}

		.btn:hover {background: white;
				color: #A1D5FF}

	.articles{margin-top: 17px;
			display: flex;
			gap:30px;
			justify-content: space-between;}

	.articles article {width: 50%;
					border: 1px solid black}

	.articles article img {max-width: 100%}

	.articles article .content {padding : 20px}


	#partie3 iframe {margin: auto;
					height: 100vh;
					width: 100%}

section#partie1{padding: 20px 25px}

section#partie2{padding: 20px 25px;
				background: #131313;
				color: #FFFFFF}

section#partie3{padding: 20px 25px}


footer{background: #5F5F5F;
		color: #FFFFFF;
		padding:20px;
		text-align: center}


/* RESPONSIVE */

@media (max-width: 720px) {
	header nav {display: none}

	header .burger{display: flex;
					flex-direction: column;
					gap:5px}

	header .burger .line{width: 30px;
						height: 3px;
						background-color:white}

	header.burger .line:nth-child(2){transform: scaleX(0,66)}

	header.burger .line:nth-child(3){transform: scaleX(0,66)}