p{
	font-family: calibri;
}
a{
	color: yellow;
	font-size: 20px;
	text-decoration: none;
}

footer{
	background: black ; 
	height:150px ;
	color: white;
	margin-top: 0;
	text-align: center;
}


@media screen and ( min-width: 1024px) and (max-width: 2000px){



h1{
	text-align: center;
	background: silver;
	height: 70px;
	padding-top: 0px;
	font-size: 40px;
}

header{
	display: flex;
	width: 100%;
	margin-top: -27px;
}

.photo1, .photo3{
	width: 30%;
	height: 250px;
}

.photo2{
	width: 40%;
	height: 250px;
}

main{
	display: flex;
	width: 100%;
}

section{
	width: 33%;
	padding: 20px;
}


}

/*-----------Ecran moyen---------------*/
@media screen and (min-width: 800px) and (max-width: 1023px){
body{
	width: 100%;
}

h1{
	text-align: center;
	height: 70px;
	background: silver;
	width: 100%;
	padding-top: -2px;
	font-size: 38px;
}


header{
	display: flex;
	width: 100%;
	margin-top: -25px;
}

.photo1, .photo3{
	width: 30%;
	height: 200px;
}

.photo2{
	width: 40%;
	height: 200px;
}

section{
	width: 45%;
	padding: 20px;
}
main{
	display: flex;
	flex-wrap: wrap;
}

.partie3{
	margin-top: -1100px;
}

}

/*-------Petit Ecran---------------*/

@media screen and (max-width: 799px){
body{
	width: 100%;
}

h1{
	text-align: center;
	height: 50px;
	background: silver;
	padding-top: 0px;
}

header{
	width: 100%;
	display: flex;
	margin-top: -22px;
}
 
.photo3{
	display: none;
}

.photo1{
	width: 40%;
	height: 120px;
}

.photo2{
	width: 60%;
	height: 120px;
}

h2{
	text-align: center;
}

section{
	padding: 20px;
}












}