@charset "utf-8";
/* CSS Document */

body{
margin: 0px;
padding: 0px;
width: 100%;
background:white;	
display: block;
color: green;
}
#bloc-site{
display:flex;
flex-direction: column;
width: 1400px;
height: auto;
margin-left: 9%;
}
.titre a{
font-size: 20px;
font-family: fantasy;
color: orange;
margin-left: 5%;
}
.banniere img{
border: 2px solid yellow;
}
.menu{
	margin-left: 7%;
}
.menu button{
background: orange;
border: 1px solid mediumvioletred;
color: white;
width: 200px;
height: 30px;
cursor: pointer;
}
.menu button a{
text-decoration: none;
font-family: komika title;
font-size: 20px;
color: white;
font-weight: ;
}
.menu button:hover{
background-color: black;
}
.menu button a:hover{
color: green;
}
.text-intro a{
	font-size: 25px;
	margin-left:8%;
}
.text-liste a{
font-size: 18px;
margin-left:7%;
text-decoration: none;
color:green;
}
.text-liste a:hover{
	color: white;
	background: orange;
	padding: 3px;
}
#blocs-arts{
display: inline-flex;
width: 1600px;
height: auto;
border-bottom:1px solid white;
}
.blocs{
width: auto;
height: auto;
background-color: transparent;
border: 2px solid transparent;
margin-left:2%;
}
.blocs img{
height: 350px;
width: auto;
border: 1px solid yellow;
}
.blocs img:hover{
opacity: 0.6;
border: 1px solid blue;
}
.biographie{
width: 800px;
height: auto;
border: 1px solid black;
margin-left:4%;
padding: 10px;
padding-left:50px;
padding-right: 50px;
}
.biographie a{
font-size: 18px;
}
.titres-blocs {
background: #53bc8c;
width: 600px;
height: 30px;
border: 1px solid green;
border-left:20px solid yellow;
border-bottom: 4px solid green;
padding-left: 15px;
padding-top: 4px;
font-size: 20px;
font-weight: bolder;
font-family: courrier news;
}
.annonce-1{
width: 700px;
height: 30px;
}
.paragraphes img:hover{
opacity: 0.7;
}
.paragraphes {
	display: inline-flex;
}
.paragraphes p{
	margin-left:15px;
}
#liste-2{
	display: flex;
	flex-direction: column;
}
.liste-2 {
	width: 400px;
	height: auto;
	border-left: 5px solid blue;
	padding-left: 5px;
	font-size: 16px;
	font-weight: bolder;
	font-family: time new roman;
}
.liste-2 button{
background: black;
width: 400px;
height: 60px;
color: white;
border: 4px solid lightgreen;
font-size: 16px;
font-weight: bold;
cursor: pointer;
}
.liste-2 button:hover{
	background-color: darkgreen;
}
#bloc-all{
	display: inline-flex;
	flex-direction: row;
}
#bloc-gauche section{
display: flex;
flex-direction: column;
}
#annonce-2{
	width: 700px;
	height:auto;
	border: 2px solid blue;
	margin-bottom:4px;
}
#annonce-2 button{
	width: 400px;
	height: 60px;
	background-color: black;
	color: white;
	font-size: 16px;
	font-weight: bold;
	border: 4px solid lightgreen;
	margin-left:220px;
	margin-top:145px;
	position: absolute;
	cursor: pointer;
	text-decoration: none;
}
#annonce-2 button:hover{
	background-color: darkgreen;
}
#bloc-droite{
	width: 1000px;
	height:auto;
	border: 1px solid black;
	margin-left:3%;
	margin-bottom: 20px;
}
#bloc-droite section{
	display: flex;
	flex-direction: column;
}
#footer-page{
	width: 1600px;
	height: 50px;
	border: 1px solid black;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top:40px;
}
#footer-page p{
	justify-content: center;
	align-items: center;
}
.titre-fabri{
	width: 650px;
	height: 60px;
	background-color: green;
	color: white;
	border-left:10px solid blue;
}
.titre-fabri a{
	font-size: 22px;
	font-weight: bold;
}
.titre-fabri p{
	padding-left:40px;
	padding-top:15px;
}
#bloc-fabri{
	width:1600px ;
	min-height:500px ;
	border: 1px solid black;
	display: flex;
	flex-direction: row;
	overflow: scroll;
	margin-top:10px;
	margin-bottom:10px;
}
.fabri-cadre{
	width: auto;
	height: 450px;
	background-color: transparent;
	border: 2px solid green;
	margin-left: 2%;
	padding: 10px;
	display: flex;
	flex-direction: column;
}
.fabri-cadre a{
	font-size: 20px;
	font-family: time new roman;
	font-weight: bold;
	padding-left:15px;
}
#bloc-fabri2{
	display: inline-flex;
	width: 1600px;
	height: auto;
	border-left: 1px solid black;
}
.fabri-cadre2{
	width: auto;
	height: 400px;
	border: 2px solid green;
	padding: 15px;
	display: inline-flex;
	flex-direction: column;
	margin-left: 3%;
}
.fabri-cadre2 a{
font-size: 16px;
font-weight: bold;
text-align: center;
}
#bloc-cartes1{
	width: 1600px;
	height: auto;
	background-color: white;
	border-left: 1px solid black;
	display: flex;
	flex-direction: column;
	padding: 40px;
}
#bloc-cartes1 section{
	
}
#bloc-cartes1 p{
	border: 1px solid green;
	margin-left: 20px;
	display: inline-flex;
	float: left;
	width: 340px;
	height: 480px;
	text-align: center;
}
#bloc-cartes1 img{
width: 300px;
margin-left:3%;
}
.annonce-cartes{
	display: flex;
	flex-direction: column;
}
.annonce-cartes a{
	font-size: 20px;
	font-weight: bold;
}
.titre-cartes{
	background-color: green;
	width: 750px;
	height:auto;
	border-left:10px solid blue;
	color: white;
	padding: 10px;
}
.titre-cartes a{
	padding-left:80px;
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: 22px;
	font-weight: bold;
	justify-content: center;
	align-items: center;
}
#annonce-3{
	width: 700px;
	height: auto;
	background-color: transparent;
	border:1px solid blue;
}
#annonce-3 button{
width: 400px;
height: 60px;
background-color: black;
color: white;
font-size: 16px;
font-weight: bold;
border: 4px solid lightgreen;
margin-left:220px;
margin-top:145px;
position: absolute;
cursor: pointer;
text-decoration: none;
}
#annonce-3 button:hover{
background-color: darkgreen;
}
.titre-illustrations{
background-color: green;
width: 750px;
height:auto;
border-left:10px solid blue;
color: white;
padding: 10px;
}
.titre-illustrations a{
padding-left:80px;
padding-top: 5px;
padding-bottom: 5px;
font-size: 22px;
font-weight: bold;
justify-content: center;
align-items: center;
}
#bloc-illustrations{
width: 1600px;
height: auto;
background-color: white;
border-left: 1px solid black;
display: flex;
flex-direction: column;
padding: 40px;
}
#bloc-illustrations p{
border: 1px solid green;
margin-left: 20px;
display: inline-flex;
float: left;
width: 340px;
height: 480px;
text-align: center;
}
#bloc-illustrations img{
width: 300px;
margin-left:3%;
}
.annonce-illustrations{
display: flex;
flex-direction: column;
}
.annonce-illustrations a{
font-size: 20px;
font-weight: bold;
}