body{
	background-color : #045FB4;
}
#conteneur1{
	position : absolute;
	left : 0px;
	top : 0px;
	display : flex;
	flex-direction : column;
}
#conteneur2{
	display : flex;
	flex-direction : column;
}
#navigation{
	list-style : none;
	margin : 0;
	padding : 0;

}
#navigation li{
	width : 298px;
	border : 1px outset;
	color : #2E2E2E;
	background : #2E2E2E;
	text-align : center;
	padding-top : 20px;
	padding-bottom : 20px;
}
#navigation li a{
	display : block;
	color : #FE642E;
	font-family: Verdana,, Arial, Impact, sans-serif; 
	font-size : 20px;
	text-decoration : none;
}
#navigation li:hover{
	*/color : #FFF;
	background-color : #848484;
}
#navigation li:hover a{
	color : #FFF;
}

#imagedefond img{
	position : absolute;
	left : 400px;
	top : 100px;
	height : 600px;
	width : 1000px;
	border-width : 5px;
	border-color : #FFF;
	border-style : solid;
}
#entete1{
	height : 190px;
	width : 300px;
	color : #FFF;
	background : #585858;
	text-align : center;
	vertical-align : middle;
	font-family : "Comic sans MS", Arial, Impact, sans-serif; 
	font-size : 30px;
	font-style : italic;
	font-weight : bold;
}
#entete2{
	height : 500px;
	width : 300px;
	color : #FFF;
	background : #585858;
	text-align : center;
	vertical-align : middle;
	font : Verdana ;
	font-size : 25px;
	font-style : italic;
	font-weight : bold;
} 
#texte {
	position : absolute;
	left : 400px;
	top : 550px;
	height : 300px;
	width : 1000px;
	font-family : Verdana, Arial, Impact, sans-serif;
	font-size : 16px;
	color : #FFF;
}
h1 {
	position : absolute;
	left : 400px;
	top : 40px;
	height : 300px;
	width : 1500px;
	font-family : Verdana, Arial, Impact, sans-serif;
	font-size : 24px;
	color : #FFF;
}
#formulaire {
	position : absolute;
	left : 400px;
	top : 100px;
	font-size : 20px;
	color : #FFF;
}#nom {
	width : 400px;
}
#mail {
	width : 400px;
}
#tel {
	width : 400px;
}
#message {
	width : 400px;
	height : 200px;
}
@media all and (max-width: 1024px){
	#navigation li{
		width : 198px;
		border : 1px outset;
		color : #2E2E2E;
		background : #2E2E2E;
		text-align : center;
		padding-top : 15px;
		padding-bottom : 15px;
	}
	#navigation li a{
		display : block;
		color : #FE642E;
		font-family: Verdana,, Arial, Impact, sans-serif; 
		font-size : 15px;
		text-decoration : none;
	}
	#imagedefond img{
		position : absolute;
		left : 200px;
		top : 000px;
		height : 200px;
		width : 600px;
	}	
	#entete1{
		height : 120px;
		width : 200px;
		color : #FFF;
		background : #585858;
		text-align : center;
		vertical-align : middle;
		font-family : "Comic sans MS", Arial, Impact, sans-serif; 
		font-size : 20px;
		font-style : italic;
		font-weight : bold;
	}
	#entete2{
		height : 300px;
		width : 200px;
		color : #FFF;
		background : #585858;
		text-align : center;
		vertical-align : middle;
		font : Verdana ;
		font-size : 25px;
		font-style : italic;
		font-weight : bold;
	}
	#image1>img{
		position : absolute;
		left : 200px;
		top : 175px;
		width : 200px;
		height : 150px;
		border-width : 5px;
		border-color : #FFF;
		border-style : solid;
	}
	#image2>img{
		position : absolute;
		left : 390px;
		top : 160px;
		width : 200px;
		height : 150px;
		border-width : 5px;
		border-color : #FFF;
		border-style : solid;
	}
	#image3>img{
		position : absolute;
		left : 590px;
		top : 170px;
		width : 200px;
		height : 150px;
		border-width : 5px;
		border-color : #FFF;
		border-style : solid;
	}	
	#texte {
		position : absolute;
		left : 220px;
		top : 450px;
		height : 300px;
		width : 500px;
		font-family : Verdana, Arial, Impact, sans-serif;
		font-size : 12px;
		color : #FFF;
	}
	#legendePhoto {
		position : absolute;
		left : 220px;
		top : 70px;
		height : 50px;
		width : 800px;
		color : #0404B4; 
		font-family : "Comic sans MS", Arial, Impact, sans-serif; 
		font-style : italic;
		font-weight : bold;
		font-size : 20px;
	}
	h1 {
		position : absolute;
		left : 220px;
		top : 20px;
		height : 300px;
		width : 1500px;
		font-family : Verdana, Arial, Impact, sans-serif;
		font-size : 24px;
		color : #FFF;
	}
	#formulaire {
		position : absolute;
		left : 220px;
		top : 70px;
		font-size : 16px;
		color : #FFF;
	}
	#nom {
		width : 300px;
	}
	#mail {
		width : 300px;
	}
	#tel {
		width : 300px;
	}
	#message {
		width : 300px;
		height : 200px;
	}
}	
@media all and (max-device-width: 480px){
	#navigation li{
		width : 300px;
		border : 1px outset;
		color : #2E2E2E;
		background : #2E2E2E;
		text-align : center;
		padding-top : 40px;
		padding-bottom : 40px;
	}
	#navigation li a{
		display : block;
		color : #FE642E;
		font-family: Verdana,, Arial, Impact, sans-serif; 
		font-size : 28px;
		text-decoration : none;
	}
	#imagedefond img{
		position : absolute;
		left : 400px;
		top : 000px;
		height : 400px;
		width : 600px;
	}	
	#entete1{
		height : 200px;
		width : 300px;
		color : #FFF;
		background : #585858;
		text-align : center;
		vertical-align : middle;
		font-family : "Comic sans MS", Arial, Impact, sans-serif; 
		font-size : 36px;
		font-style : italic;
		font-weight : bold;
	}
	#entete2{
		height : 500px;
		width : 300px;
		color : #FFF;
		background : #585858;
		text-align : center;
		vertical-align : middle;
		font : Verdana ;
		font-size : 25px;
		font-style : italic;
		font-weight : bold;
	}
	#image1>img{
		position : absolute;
		left : 400px;
		top : 400px;
		width : 600px;
		height : 400px;
		border-width : 5px;
		border-color : #FFF;
		border-style : solid;
	}
	#image2>img{
		position : absolute;
		left : 400px;
		top : 800px;
		width : 600px;
		height : 400px;
		border-width : 5px;
		border-color : #FFF;
		border-style : solid;
	}
	#image3>img{
		position : absolute;
		left : 400px;
		top : 1200px;
		width : 600px;
		height : 400px;
		border-width : 5px;
		border-color : #FFF;
		border-style : solid;
	}	
	#image4>img{
		position : absolute;
		left : 400px;
		top : 1600px;
		width : 600px;
		height : 400px;
		border-width : 5px;
		border-color : #FFF;
		border-style : solid;
	}
	#image5>img{
		position : absolute;
		left : 400px;
		top : 2000px;
		width : 600px;
		height : 400px;
		border-width : 5px;
		border-color : #FFF;
		border-style : solid;
	}
	#image6>img{
		position : absolute;
		left : 400px;
		top : 2400px;
		width : 600px;
		height : 400px;
		border-width : 5px;
		border-color : #FFF;
		border-style : solid;
	}	
	#texte {
		position : absolute;
		left : 320px;
		top : 1000px;
		height : 300px;
		width : 950px;
		font-family : Verdana, Arial, Impact, sans-serif;
		font-size : 35px;
		color : #FFF;
	}
	#legendePhoto {
		position : absolute;
		left : 450px;
		top : 50px;
		height : 50px;
		width : 800px;
		color : #0404B4; 
		font-family : "Comic sans MS", Arial, Impact, sans-serif; 
		font-style : italic;
		font-weight : bold;
		font-size : 26px;
	}
	h1 {
		position : absolute;
		left : 320px;
		top : 20px;
		height : 300px;
		width : 1500px;
		font-family : Verdana, Arial, Impact, sans-serif;
		font-size : 24px;
		color : #FFF;
	}
	#formulaire {
		position : absolute;
		left : 320px;
		top : 50px;
		font-size : 35px;
		color : #FFF;
	}
	#nom {
		width : 800px;
		height : 50px;
		font-size : 35px;
	}
	#mail {
		width : 800px;
		height : 50px;
		font-size : 35px;
	}
	#tel {
		width : 800px;
		height : 50px;
		font-size : 35px;
	}
	#message {
		width : 800px;
		height : 600px;
		font-size : 35px;
	}
	#valider {
		width : 200px;
		height : 100px;
		font-size : 35px;
	}
}