body
{
	background-color:white;
	color:black;
	font-family:Arial;
}
h2
{
	color:black;
	font-size:2.5em;
	
}
h1
{
	font-size:3em;
	color:black;
}
h3
{
	font-size:2.8em;
	color:black;
}

h1, h2, h3, p
{
	text-align:center;
}

p
{
	padding-left:7%;
	padding-right:7%;
	font-size:1.7em;
}
figure
{
    display:inline-block;
}
.img
{
	width:200px;
	height:300px;
}
.img2
{
	width:350px;
	height:300px;
}
.img3
{
	width:200px;
	height:300px;
}
figcaption
{
	color:#625151;
}

.menu
{
text-align:center;
}
.menu span
{
display: inline-block;
border:2px groove #7A7A81;
font-family:Ebrima;
font-size:1em;
padding:15px;
margin:5px;
border-radius:6px;
box-shadow: 1px 1px 12px #555;
}
.menu span:hover
{
background-color:grey;
}
a
{
color:black;
}
nav
{
text-align:center;
padding:15px;
background-color: none; /* couleur du grand cadre */
border-radius: 10px;
}
.colombe
{
	position:absolute;
	top:35px;
	left:35px;
}
.colombe2
{
	position:absolute;
	top:35px;
	right:35px;
}
	
.photo2
{
	padding-right:60px;
}
.photo3
{
	padding-left:60px;
}
.haut
{
	font-family:Chaparral Pro Light;
	background-image:linear-gradient(white, black);
	padding:50px;
	border-radius: 10px;
	text-align:center;
}
.bas
{
	background-color:#93D4DA;
	padding:10px;
}
.photos
{
	background-image:url(gravier.jpg);
	padding:50px;
	
	border-radius: 10px;
	border: 5px grey ridge;
}
.intro
{
	background-image:url(col.png);
	padding-bottom:90px;
	padding-top:90px;
	border-radius: 10px;
	border: 5px grey ridge;
	background-size: 100%;
}

.engagements
{
	background-image:url(ciel.jpg);
	padding-bottom:90px;
	padding-top:90px;
	border-radius: 10px;
	border: 5px grey ridge;
	background-size: 100%;
}
.prestations
{
	background-image:url(ciel.jpg);
	padding-bottom:90px;
	padding-top:90px;
	border-radius: 10px;
	border: 5px grey ridge;
	background-size: 100%;
}
.devis
{
	background-image:url(ciel.jpg);
	padding-bottom:90px;
	padding-top:90px;
	border-radius: 10px;
	border: 5px grey ridge;
	background-size: 100%;
}
.tarifs
{
	background-image:url(ciel.jpg);
	padding-bottom:90px;
	padding-top:90px;
	border-radius: 10px;
	border: 5px grey ridge;
	background-size: 100%;
}

/* FORMULAIRE DE CONTACT */

.formulaire
{
position:relative;
top:50px;
left:100px;
font-size:1.3em;
}
.formcontact{
position:absolute;
top:40%;
left:33%;
font-size:1.1em;
margin: 0 auto;
width: 600px;
/* Pour voir les limites du formulaire */
padding: 1em;
border: 1px solid #CCC;
 border-radius: 1em;
}
form div + div
{
    margin-top: 1em;
}


.formcontact label {
    /* Afin de s'assurer que toutes les étiquettes aient la même dimension et soient alignées correctement */
    display: inline-block;
    width: 90px;
    text-align: right;
}
.formcontact input, textarea {
    /* Afin de s'assurer que tous les champs textuels utilisent la même police
       Par défaut, textarea utilise une police à espacement constant */
    font: 1em sans-serif;

    /* Pour donner la même dimension à tous les champs textuels */
    width: 300px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    /* Pour harmoniser l'apparence des bordures des champs textuels */
    border: 1px solid #999;
}
.formcontact input:focus, .formcontact textarea:focus {
    /* Afin de rehausser les éléments actifs */
    border-color: #000;
}
.formcontact textarea {
    /* Pour aligner correctement les champs multilignes et leurs étiquettes */
    vertical-align: top;

    /* Pour donner assez d'espace pour entrer du texte */
    height: 5em;

    /* Pour permettre aux utilisateurs de redimensionner un champ textuel horizontalement
       Cela ne marche pas avec tous les navigateurs  */
    resize: vertical;
}