/* Styles Commun */

body {
	font-size: 16px;
	line-height: 24px;
	font-family: 'Roboto', sans-serif;
}

header, footer {
	background: #3a3a3a;
	padding: 30px;
	color:  white;
}

section {
	padding: 50px;
}

h1 {
	font-size: 24px;
	margin-bottom:  20px;
	font-weight: bold;
}

h2 {
	font-size: 20px;
	margin-bottom:  10px;
	font-weight: bold;
}

p a {
	color: #4b4b4b;
}


.btn {
	padding: 10px;
	background: skyblue;
	border-radius: 5px;
	color:  white;
	text-transform: uppercase;
	display: inline-block;
	margin-top:  10px;
	text-decoration: none;
	border:  1px solid skyblue;
}

.btn:hover {
	background: white;
	color: skyblue;
}


/* Header */

header {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

header nav ul{
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap:  30px;
}

header nav ul a {
	color:  white;
	text-decoration: none;
}

header .burger span{
	background: white;
	width: 30px;
	height:  3px;
	display:  block;
}

header .burger span:not(:last-child) {
	margin-bottom:  5px;
}

header .burger {
	display: none;
}

/* Partie 1 */

.articles {
	margin-top: 30px;
}

.articles {
	display:  flex;
	gap:  30px;
}

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

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

.articles article .content {
	padding:  20px;
}

/* Partie 2 */

#partie2 {
	background: black;
	color:  white;
}

#partie2 a {
	color: #e4e3e3;
}

/* Partie 3 */

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

/* Footer */

footer {
	text-align: center;
}

/* Responsive */

/* VOTRE CODE ICI ! */