@import url('https://fonts.googleapis.com/css2? family= Raleway & display=swap');

img.alignleft {
float: left;
}

p.alignleft {
text-align: left;	
}

p.alignright {
text-align: right;	
}

body {
	margin: 100;
	padding: 100;
	font-family: 'Raleway', sans-serif;
	font-size: 100%;
	color: #666;
      }
	  
header {
	background: url("");
	background-position: center;
	color: #666;
	text-align: center;
}

header header {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 20px;
color: #666:
text-decoration: none;	
}

header nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 20px;
	font-size: 120%;
}

header nav a {
	color: #666;
	text-decoration: none;
	margin-right: 10px;
}

header nav a:hover {
	color: #060;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #FF0000;
}

header .logo {
	font-family: 'Raleway', sans-serif;
	font-size: 200%;
}

header .principal {
	margin-top: 40px;
	}
	
header .principal h4 {
	margin-top: -20px;
	padding: 20px;
	text-align: left;
}

.espaces-verts {
	background-color: #009900;
	color: #ffffff;
	padding: 5px;
	display: flex;
	flex-wrap: wrap;
}

.espaces-verts .gauche {
	width: 70%;
	margin-right: 10px;
	text-align: justify;
}

section{
color: #666;	
}

@media screen and (max-width: 810px)
.premieres-presentations .gauche {
width: 100%;
}

.espaces-verts .droite {
display: block;
margin-left: auto;
margin-right: auto;	
}


.maison {
	color: #666;
	padding: 5px;
	display: flex;
	flex-wrap: wrap;
}

.maison .gauche {
display: block;
margin-left: auto;
margin-right: auto;	
padding: 15px;
}

@media screen and (max-width: 810px)
.maison .gauche {
width: 100%;
}

.maison .droite {
	width: 70%;
	margin-right: 10px;
	text-align: justify;
}


.piscine {
	background-color: #2C75FF;
	color: #ffffff;
	padding: 5px;
	display: flex;
	flex-wrap: wrap;
}

.piscine .gauche {
	width: 70%;
	margin-right: 10px;
	text-align: justify;
}

@media screen and (max-width: 810px)
.piscine .gauche {
width: 100%;
}

.piscine .droite {
display: block;
margin-left: auto;
margin-right: auto;	
}


.travaux {
	background-color: #999999;
	color: #ffffff;
	padding: 5px;
	display: flex;
	flex-wrap: wrap;
}

.travaux .gauche {
	display: block;
	margin-left: auto;
	margin-right: auto;	
	padding: 40px;
}

@media screen and (max-width: 810px)
.travaux .gauche {
width: 100%;
}

.travaux .droite {
	width: 70%;
	margin-right: 10px;
	text-align: justify;
}

.offres {
padding: 30px;
background: url('https://cutt.ly/TeaKKYJ');
background-position: center;
color: #666;
}

.offres h1,
.offres p {
text-align: center;	
}

.offres .offres-cartes{
margin-top: 30px;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
}

.offres .offres-cartes .carte {
	background-color: #fff;
	color: #666;
	padding: 20px;
	margin-bottom: 20px;
	margin-right: 20px;
}

.offres .offres-cartes .carte img {
height: 60px;
}

.partenaires {
padding-top: 20px;
background-color: #222f3e;
padding-bottom: 30px;
color: #fff;
}

.partenaires h1 {
text-align: center;
}

.partenaires .partenaires-images {
display: flex;
overflow-x: auto;
padding: 20px;
margin-top: -30px;
}

.partenaires .partenaires-images p {
margin-right: 30px;

}

.partenaires .partenaires-images p img{
height: 40px;	
}

footer {
	background-color: #FFFFFF;
	padding: 30px;
	color: #666;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

footer .social-media {
display: flex;	
}

footer footer {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 20px;
color: #666:
text-decoration: none;	
}

footer nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 20px;
	font-size: 120%;
}

footer nav a {
	color: #666;
	text-decoration: none;
	margin-right: 10px;
}

footer nav a:hover {
	color: #060;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: #FF0000;
}