/*
<!-- 
   But :    ex 1
   Auteur : Luca Gambera, Xavier Rey
   Date :   18.05.2022 / V1.0 
   -->
*/
* {
	font-family: sans-serif;
	padding: 0%;
	margin: 0%;
	background-color: #333637;
	color: white;
}

a {
	text-decoration: none;

}

/*
menu de navigation
*/
nav>a {
	font-weight: bold;
}

header {
	text-align: center;
	margin-bottom: 0%;
}

/*java script Scroll Header*/
.sticky {
	position: fixed;
	top: 0;
	width: 100%;
}

.sticky+.content {
	padding-top: 102px;
}

.navigation {
	padding: 1%;
	display: flex;
	justify-content: space-around;
	text-align: center;
}

.titre {
	background-color: #282a2b;
	font-family: SansSerif;
	color: #C00000;
	font-size: 2.5em;
	padding: 1%;
	text-align: left;
}

.titreHome {
	background-color: #282a2b;
	font-family: SansSerif;
	color: #C00000;
	font-size: 3em;
	padding: 1%;
	text-align: center;
}

.titrePage {

	background-color: #282a2b;
	padding: 1%;
}


/*
Article
*/
/*
	contact
	*/
.contactArticle {

	display: flex;
	justify-content: space-around;
}


/*
article
*/
.textArticle, .contactArticle, .container {
	text-align: justify;
	margin-top: 2%;
	margin-left: 10%;
	margin-right: 10%;
}

article>article {
	display: flex;
}

article article>h1 {
	margin-bottom: 2%;
	margin-top: 2%;
	font-size: 2em;
}

article>p {
	margin-bottom: 2%;
}

article>div>p, article>h2 {
	margin-bottom: 1%;
}

article>h2, article>p, article>div>p, article>div>div>p {
	margin-left: 1%;
}

/* 
maps
*/

iframe {
	width: 100%;
	height: 700px;
	border: 0;
}



/*
Pied de page
*/
footer {
	background-color: #282a2b;
	margin-top: 5%;
	display: flex;
	justify-content: space-evenly;
	padding: 2%;
}



footer>div>p, footer>div, footer>div>p>a {
	background-color: #282a2b;
	text-align: center;
}

/*
realisation
*/
.realisation {
	text-align: center;
	margin-top: 4%;
}

.block {
	margin-top: 4%;
}

.imageRealisation {
	width: 40%;
	height: 25%;
}

/*
téléphone
*/

@media screen and (max-width:1050px) {
	nav {
		flex-direction: column;
	}

	nav>a {
		margin-top: 2%;
	}
	
}