/* CSS propre à l'application
Auteur : Sébastien Hélan
*/

body {
	background-color : #fff;
	font-family: arial;
}

#titleApp {
	margin:0 0 0 20px;
	font-size: 1.4em;
	line-height: 1.3em;
}

#phrasetitre {
	font-size: 0.7em;	
}
#lelogo{
	width:100px;
}

#titleApp {
	color: #546b6b;
}

#map {
	width:100%;
	max-width:1000px;
}
#bloctitre2 {
	margin: 20px 0px 30px;
	font-size: 1.4em;
	line-height: 2rem;
	font-weight: 700;
	color: #00504e;
}
#titre3 {
	width: 100%;
	text-align: center;
	font-size: 1.3em;
	line-height: 2.2rem;
	font-weight: 700;
}
#span1 {
	margin: 0 0 0 2%;
}
#span2 {
	margin: 0 0 0 4%;
}
#span3 {
	margin: 0 0 0 6%;
}
#span4 {
	margin: 0 0 0 8%;
}
#btdownload {
	text-align: center;
	margin: 20px 0 0 0;
}
.blocpresentation2x {
	width:30%;
	align-self: center;
	text-align: center;
	margin: auto;
}
#blocpresentation2, .blocpresentation3x {
	flex-wrap: wrap;
	justify-content: space-between;
}
#blocpresentation4 {
	justify-content: space-between;
	margin: 30px 0 0 0;
}
.blocpresentation3xa {
	width:49%;
	align-self: center;
	text-align: center;
	margin: auto;
}
.img3xi {
	width:99%;
}
.blocpresentation4x {
	align-self: center;
	text-align: center;
	margin: auto;
}
#sebseb {
	width:300px;
}
#wrapper {
	max-width: 1100px;
}
.blocpresentation6xa, .blocpresentation6xb {
	align-self: center;
	margin: auto;
}
#blocpresentation3 {
	margin: 20px 0 0 0;
}
.bloc2xx {
	margin: 10px 0 0 0;
}
@media all and (max-width:68em) {
	.blocpresentation2x, .blocpresentation3xa {
		width:90%;
		margin: 0 5%;
	}
	.blocpresentation3x {
		margin: 20px 0;
	}
	.blocpresentation6x {
		text-align: center;
		width:90%;
		margin: 0 5%;
	}
	.blocpresentation6x {
		display: block;
	}
	#blocpresentation2x1, .img3x {
		order: -1;
	}
	.img3xi {
		width:85%;
	}
	#sebseb {
		width:40%;
		order: -1;
		margin: auto;
	}
	#blocpresentation4 {
		flex-wrap: wrap;
	}
	#titleApp {
		font-size: 1em;
	}
	.margintop20, #blocpresentation5 {
		margin: 0 0 0 0;
	}
	.bloc2xx, #bloc7 {
	    margin: 20px 0;
	}
	#bloc8 {
		margin: 0;
	}
}

@media all and (min-width:80em) {
	#blocpresentation3 {
		display: flex;
		flex-wrap: wrap;	
	}
	.blocpresentation3x {
		width: 49%;
	}
}