@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat&family=Playfair+Display:wght@600&display=swap');

body{
	margin:0;
	padding: 0;
	font-family: 'Montserrat',sans-serif;
}
nav{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	border-bottom: 5px solid #6f6f6f;
}

nav .onglets{
	margin-top: 3px;
	margin-left: 300px;
}
nav .onglets a{
	text-decoration: none;
	color: #000;
	margin-right: 10px;
	border-bottom: 1px solid #000;
	padding-bottom: 5px
}

header{
	display: flex;
	flex-direction: column;
	align-items: center;
	background: url(https://th.bing.com/th/id/R.e267febcc421165c46266b015aa85fcd?rik=tor4AaeYm8kA2w&pid=ImgRaw&r=0);
	background-size: cover;
	color: #fff;
	padding: 40px;
}
header h1{
	font-family: 'Playfair Display', sans-serif;
	font-size: 50px;
}
header h4{
	margin-top: -20px;
	font-size: 20px;
	text-align: center;
	border-bottom: 1px solid #fff;
}
header button{
	padding: 10px 20px;
	background-color: #fff;
	color: #000;
	border: none;
	font-size: 20px;
	font-family: 'Playfair Display',sans-serif;
	outline: none;
	cursor: pointer;
}
.main{
	margin-top: 40px;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.main .content .card{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 20px;
}
.main .content .card .left{
	flex: 0 0 30%;
	padding: 20px;
	background-color: black;
	color: #fff;
}
.main .content .card.right{
	flex: 0 0 70%;
}
footer{
	margin-top: 40px;
	border-top: 5px solid #6f6f6f;
	background-color: rgb(0, 0, 0);
	color: #fff;
	padding: 30px 100px ;
}
footer h1{
	font-family: 'Playfair Display', serif;
	border-bottom: 1px solid white;
	width: 20%;
	padding-bottom: 5px;
}
footer .information{
	margin-top: -10px;
	display: flex;
	flex-wrap: wrap;

}

footer .information .information{
	margin-right: 30px;
	padding: 10px;
}
footer .information .information p{
	max-width: 300px;
	margin-right: 70px;
	margin-left: 20px;
	display: flex;

}
div h5{
	width: 12000px;
	height: 30px;
}


footer .information .information h5{
	font-size: 20px;
}

footer #Contact{
	color: rgb(181,181,181);
}
 @media screen and (max-width: 680px){
 	nav .onglets{
 		margin-left: 0px;
 		margin-bottom: 20px; 
 	}
 	.main .card{
 		margin: 10px;
 	}
 	.main .content .card .right-img{
 		height: 200px;
 		width: 100%;
 		margin-top: 0px;
 	}
 	.main .content .card{
 		display: block;
 	}
 	footer {
 		padding: 30px;
 	}
 	p{
 		width: 900px;
 		height: 800px;
 	}
 	
}