html{
	margin:0;
	padding:0;
}

.preload{
	background: 
	url('../assets/bouton1.png') no-repeat -9999px -9999px,
	url('../assets/bouton1_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton2.png') no-repeat -9999px -9999px,
	url('../assets/bouton2_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton3.png') no-repeat -9999px -9999px,
	url('../assets/bouton3_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton4.png') no-repeat -9999px -9999px,
	url('../assets/bouton4_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton5.png') no-repeat -9999px -9999px,
	url('../assets/bouton5_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton6.png') no-repeat -9999px -9999px,
	url('../assets/bouton6_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton7.png') no-repeat -9999px -9999px,
	url('../assets/bouton7_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton8.png') no-repeat -9999px -9999px,
	url('../assets/bouton8_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton9.png') no-repeat -9999px -9999px,
	url('../assets/bouton9_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton10.png') no-repeat -9999px -9999px,
	url('../assets/bouton10_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton11.png') no-repeat -9999px -9999px,
	url('../assets/bouton11_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton12.png') no-repeat -9999px -9999px,
	url('../assets/bouton12_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton13.png') no-repeat -9999px -9999px,
	url('../assets/bouton13_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton14.png') no-repeat -9999px -9999px,
	url('../assets/bouton14_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton15.png') no-repeat -9999px -9999px,
	url('../assets/bouton15_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton16.png') no-repeat -9999px -9999px,
	url('../assets/bouton16_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton17.png') no-repeat -9999px -9999px,
	url('../assets/bouton17_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton18.png') no-repeat -9999px -9999px,
	url('../assets/bouton18_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton19.png') no-repeat -9999px -9999px,
	url('../assets/bouton19_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton20.png') no-repeat -9999px -9999px,
	url('../assets/bouton20_hover.png') no-repeat -9999px -9999px,
	url('../assets/bouton21.png') no-repeat -9999px -9999px,
	url('../assets/bouton21_hover.png') no-repeat -9999px -9999px,
	url(../assets/graph.png) no-repeat -9999px -9999px,
	url(../assets/fond.png) no-repeat -9999px -9999px;
}

body{

font-family: 'Open Sans', sans-serif;
	background:#FFF;
	margin:0;
	padding:0;
}

header{
	margin:0;
	padding:1px;
	background:#FFF;
	text-align:center;
}

.logoHeader{
	margin: 10px auto;
}

.accroche {
    color: #0066cc;
    font-weight: 800;
    font-size: 14px;
    line-height: 17px;
    text-transform: uppercase;
    margin: 10px auto;
    border: 1px solid #0066CC;
    padding: 10px 10px 10px 10px;
    max-width: 230px;
}

h1{
	font-family: 'Montserrat', sans-serif;
    color: #0066cc;
    text-transform: uppercase;
    font-size: 35px;
    line-height: 38px;
    font-weight: 900;
    text-align: center;
    max-width: 363px;
    margin: auto;
}

h2{
	font-family: 'Montserrat', sans-serif;
    color: #333;
    font-size: 20px;
    line-height: 24px;
    font-weight: 800;
    text-align: center;
}

h3{
font-family: 'Montserrat', sans-serif;
    color: #0066cc;
    font-size: 20px;
    line-height: 24px;
    font-weight: 800;
    text-align: left;
    max-width: 500px;
    text-indent: -34px;
    margin-left: 20px;
    text-transform: uppercase;
    margin-top: 30px;
}

.flecheJaune{
	color:#ff9900;
	font-size:30px;
	padding-bottom:30px;
}

h4{
	font-family: 'Montserrat', sans-serif;
    display: flex;
    flex-direction: row;
    color: #333;
    font-size: 18px;
    line-height: 20px;
    font-weight: 800;
    text-align: center;
    justify-content: center;
    margin-bottom:0;
}

h5{
	font-family: 'Montserrat', sans-serif;
	font-size: 16px;
	line-height: 20px;
	margin: 10px 0;
}


.flecheBleueBas{
	color: #0066CC;
	font-size: 36px;
	font-weight: 800;
	margin-top: 29px;
	line-height: 0;
}

.CTA{
	font-family: 'Montserrat', sans-serif;
	max-width: 280px;
	background: #ff9900;
	text-transform: uppercase;
	font-size: 17px;
	line-height: 24px;
	font-weight: 700;
	color: #FFF;
	text-align: center;
	margin: 30px auto;
	padding: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	cursor: pointer;
	transition-duration: 0.25s;
	-webkit-box-shadow: 3px 3px 4px 0px rgba(0,0,0,0.25);
	-moz-box-shadow: 3px 3px 4px 0px rgba(0,0,0,0.25);
	box-shadow: 3px 3px 4px 0px rgba(0,0,0,0.25);
}

.CTA:hover{
	transition-duration: 0.25s;
	background-color:#1374c7;
}

#blocIntro{
    text-align: justify;
    padding: 15px;
    margin: 10px auto;
    font-size: 15px;
    line-height: 20px;
    font-weight: 500;
}

.photoMobile{
	width:100%;
	display:block;
	margin:auto;
	max-width:600px;
}

.wrapper{
	max-width:750px;
	margin:auto;
}

.section{
	margin:10px auto 40px auto;
	padding:20px;
}

.imgSection{
	width: 100%;
    max-width: 550px;
    margin: 30px auto;
    display: block;
}

#section1 {
    background: #f5f2ec;
}

#section3{
	background:#f5f2ec;
}

#section5{
	background:#f5f2ec;
}

#section8{
	background:#f5f2ec;
}

.blocSection{
	font-size:15px;
	line-height:20px;
	padding: 0 20px;
	margin-bottom: 20px;
}

.encadre{
	border:1px solid #333;
	
}

.blocCTA{
	//background:#FFF;
	padding:15px;
}

.inlineCTA{
	text-decoration: none;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
	//background: rgba(255,255,255,0.65);
	//padding-bottom: 25px;
}

.bouton{
	width:111px;
	height:111px;
	-webkit-border-radius: 17px;
	-moz-border-radius: 17px;
	border-radius: 17px;
	margin:5px 2px 10px 2px;
	-webkit-box-shadow: 3px 3px 4px 0px rgba(0,0,0,0.25);
	-moz-box-shadow: 3px 3px 4px 0px rgba(0,0,0,0.25);
	box-shadow: 3px 3px 4px 0px rgba(0,0,0,0.25);
	transition-duration: 0.25s;
	text-decoration:none;
	image-rendering: pixelated;
}

.bouton:hover{
	
	-webkit-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.15);
	-moz-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.15);
	box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.15);
	transition-duration: 0.25s;
	image-rendering: pixelated;

}

a{
	text-decoration:none;
}


.legende_bouton {
	font-size: 13px;
	line-height: 16px;
	font-weight: 700;
	color: #555;
	text-align: center;
	margin-top:90px;
	//text-decoration: none;
}




#bouton1{
	background:url(../assets/bouton1.png) no-repeat center;
	background-size:cover;
}

#bouton1:hover{
	background:url(../assets/bouton1_hover.png) no-repeat center;
	background-size:cover;
}

#bouton2{
	background:url(../assets/bouton2.png) no-repeat center;
	background-size:cover;
}

#bouton2:hover{
	background:url(../assets/bouton2_hover.png) no-repeat center;
	background-size:cover;
}

#bouton3{
	background:url(../assets/bouton3.png) no-repeat center;
	background-size:cover;
}

#bouton3:hover{
	background:url(../assets/bouton3_hover.png) no-repeat center;
	background-size:cover;
}

#bouton4{
	background:url(../assets/bouton4.png) no-repeat center;
	background-size:cover;
}

#bouton4:hover{
	background:url(../assets/bouton4_hover.png) no-repeat center;
	background-size:cover;
}

#bouton5{
	background:url(../assets/bouton5.png) no-repeat center;
	background-size:cover;
}

#bouton5:hover{
	background:url(../assets/bouton5_hover.png) no-repeat center;
	background-size:cover;
}

#bouton6{
	background:url(../assets/bouton6.png) no-repeat center;
	background-size:cover;
}

#bouton6:hover{
	background:url(../assets/bouton6_hover.png) no-repeat center;
	background-size:cover;
}

#bouton7{
	background:url(../assets/bouton7.png) no-repeat center;
	background-size:cover;
}

#bouton7:hover{
	background:url(../assets/bouton7_hover.png) no-repeat center;
	background-size:cover;
}

#bouton8{
	background:url(../assets/bouton8.png) no-repeat center;
	background-size:cover;
}

#bouton8:hover{
	background:url(../assets/bouton8_hover.png) no-repeat center;
	background-size:cover;
}

#bouton9{
	background:url(../assets/bouton9.png) no-repeat center;
	background-size:cover;
}

#bouton9:hover{
	background:url(../assets/bouton9_hover.png) no-repeat center;
	background-size:cover;
}

#bouton10{
	background:url(../assets/bouton10.png) no-repeat center;
	background-size:cover;
}

#bouton10:hover{
	background:url(../assets/bouton10_hover.png) no-repeat center;
	background-size:cover;
}

#bouton11{
	background:url(../assets/bouton11.png) no-repeat center;
	background-size:cover;
}

#bouton11:hover{
	background:url(../assets/bouton11_hover.png) no-repeat center;
	background-size:cover;
}

#bouton12{
	background:url(../assets/bouton12.png) no-repeat center;
	background-size:cover;
}

#bouton12:hover{
	background:url(../assets/bouton12_hover.png) no-repeat center;
	background-size:cover;
}

#bouton13{
	background:url(../assets/bouton13.png) no-repeat center;
	background-size:cover;
}

#bouton13:hover{
	background:url(../assets/bouton13_hover.png) no-repeat center;
	background-size:cover;
}

#bouton14{
	background:url(../assets/bouton14.png) no-repeat center;
	background-size:cover;
}

#bouton14:hover{
	background:url(../assets/bouton14_hover.png) no-repeat center;
	background-size:cover;
}

#bouton15{
	background:url(../assets/bouton15.png) no-repeat center;
	background-size:cover;
}

#bouton15:hover{
	background:url(../assets/bouton15_hover.png) no-repeat center;
	background-size:cover;
}

#bouton16{
	background:url(../assets/bouton16.png) no-repeat center;
	background-size:cover;
}

#bouton16:hover{
	background:url(../assets/bouton16_hover.png) no-repeat center;
	background-size:cover;
}

#bouton17{
	background:url(../assets/bouton17.png) no-repeat center;
	background-size:cover;
}

#bouton17:hover{
	background:url(../assets/bouton17_hover.png) no-repeat center;
	background-size:cover;
}

#bouton18{
	background:url(../assets/bouton18.png) no-repeat center;
	background-size:cover;
}

#bouton18:hover{
	background:url(../assets/bouton18_hover.png) no-repeat center;
	background-size:cover;
}

#bouton19{
	background:url(../assets/bouton19.png) no-repeat center;
	background-size:cover;
}

#bouton19:hover{
	background:url(../assets/bouton19_hover.png) no-repeat center;
	background-size:cover;
}

#bouton20{
	background:url(../assets/bouton20.png) no-repeat center;
	background-size:cover;
}

#bouton20:hover{
	background:url(../assets/bouton20_hover.png) no-repeat center;
	background-size:cover;
}

#bouton21{
	background:url(../assets/bouton21.png) no-repeat center;
	background-size:cover;
}

#bouton21:hover{
	background:url(../assets/bouton21_hover.png) no-repeat center;
	background-size:cover;
}

#bouton22{
	background:url(../assets/bouton22.png) no-repeat center;
	background-size:cover;
}

#bouton22:hover{
	background:url(../assets/bouton22_hover.png) no-repeat center;
	background-size:cover;
}

#bouton23{
	background:url(../assets/bouton23.png) no-repeat center;
	background-size:cover;
}

#bouton23:hover{
	background:url(../assets/bouton23_hover.png) no-repeat center;
	background-size:cover;
}

#bouton24{
	background:url(../assets/bouton24.png) no-repeat center;
	background-size:cover;
}

#bouton24:hover{
	background:url(../assets/bouton24_hover.png) no-repeat center;
	background-size:cover;
}

#bouton25{
	background:url(../assets/bouton25.png) no-repeat center;
	background-size:cover;
}

#bouton25:hover{
	background:url(../assets/bouton25_hover.png) no-repeat center;
	background-size:cover;
}

#bouton26{
	background:url(../assets/bouton26.png) no-repeat center;
	background-size:cover;
}

#bouton26:hover{
	background:url(../assets/bouton26_hover.png) no-repeat center;
	background-size:cover;
}

#bouton27{
	background:url(../assets/bouton27.png) no-repeat center;
	background-size:cover;
}

#bouton27:hover{
	background:url(../assets/bouton27_hover.png) no-repeat center;
	background-size:cover;
}

#bouton28{
	background:url(../assets/bouton28.png) no-repeat center;
	background-size:cover;
}

#bouton28:hover{
	background:url(../assets/bouton28_hover.png) no-repeat center;
	background-size:cover;
}

ul{
	margin:0;
	font-size:15px;
	line-height:20px;
}

.liste li{
	list-style: url(../assets/fleche.png) no-repeat;
	margin:20px 0;
}


.carte {
	width: 100%!important;
	margin: auto!important;
}

.illustr{
	text-align:center;
}

.illustr img{
	width:100%;
	margin:auto; 
}

.map{
	margin:auto!important;
}

area{
	cursor:pointer;
	border:none;
}

area:hover{
	cursor:pointer;
	border:none;
}













footer{
	font-size:9px;
	line-height:12px;
	font-weight:400;
	color:#333;
	background : #dbdbdb;
	padding:40px;
	text-align:justify;
}

.footer_barre{
	position: fixed;
	bottom:0;
	left: 0;
	z-index: 1;
	width: 100%;
	background: #fff;
	border-top:10px #fff solid;
	border-bottom: 1px solid #ccc;
}

.scroll-line{
	height: 6px;
	margin-bottom: -2px;
	background: #0066CC;
	width: 0%;
	transition-duration: 0.5s;
}

#signature{
	margin:auto;
	text-align:center;
	font-size:12px;
}

#signature a{
	text-decoration:none;
	color:#2272ca;
	transition-duration: 0.5s;
	font-weight:600;
	cursor:pointer;
}

#signature a:hover{
	text-decoration:none;
	color:#fff;
	transition-duration: 0.5s;
}

#formulaire{
	max-width:550px;
	margin:auto;
	-webkit-box-shadow: 3px 3px 5px 2px rgba(158,158,158,1);
-moz-box-shadow: 3px 3px 5px 2px rgba(158,158,158,1);
box-shadow: 3px 3px 5px 2px rgba(158,158,158,1);
}



@media (min-width: 400px) {
.accroche {
  
    max-width: fit-content;
}



@media (min-width: 768px) {
	.carte{
		width:80%!important;
	}
	

#fondPhoto {
 background: url(../assets/fond2.png) no-repeat;
    background-size: 150%;
    background-position-x: 35%;
    max-width: 2000px;
    margin: auto;
}

	.photoMobile{
		display:none;	
	}

	h1{
			font-size:30px;
	line-height:37px;
		text-align:left;
		margin: 20px 0 20px 0;
	}


		h2{
		text-align:left;
	}

	.section{
		padding:20px;
	}

	.ctaSection1{
		//margin-left:0;
	}

	#section1{
		max-width: 450px;
		margin-left: 45%;
		margin-right: 1%;
		background: rgba(255,255,255,0.75);
}

	

		#section2{
background:#FFF;
		}

}



@media (min-width: 992px) {

header{
	display:flex;
	flex-direction:row;
}

.accroche {
    margin: 30px auto 13px auto;
    line-height: 35px;
}

	.carte{
		width:75%!important;
	}


#fondPhoto {
    background: url(../assets/fond.png) no-repeat;
   // background-size:100%;
    //background-position-y: 20%;
    background-position-x: center;
}

#section1 {
  max-width: 450px;
    margin-left: 50%;
    margin-right: 0;
    margin-top: 40px;
    margin-bottom: 40px;
}
}