/*CSS LANDING PAGE*/

body{
	width:100%;
	margin:0;
	paddding:0;
	font-family: 'Open Sans', sans-serif;
}
*, ::after, ::before{box-sizing: border-box;}
section{
	width: 100%;
	float:left;
	clear:both;
	padding: 10px 0 0 ;
	margin:10px 0 0;
}

h1, h2{
	text-transform: uppercase;
	font-size: 2em;
	font-weight: 300;
}
p{
	padding: 10px 5px;
	margin:0;
	font-size: 0.8em;
}
ul{
	list-style: none;
}
header{
	width: 100%;
	padding: 0 50px;
}
header img{
	width: 140px;
	float: left;
	margin: 0 50px 0 0;
}
.section_1, .section_2, .section_4,.section_7{
	background-color: #F2B220;
}
.section_0, .section_5,.section_3{
	background-color: #E5E1E2
}
.bloc-section_0{
	position: relative;
}
.inscrire{
	width:100%;
	padding:10px 0;
	background: white;
	display: flex;
  	justify-content: center;
  	align-items: center;
}
.inscrire a{
	background-color: #F46041;
	font-size:0.8em;
	text-align: center;
	color:white;
	width: 200px;
	margin:0 auto;
	padding:10px;
	border-radius: 20px;
	text-decoration:none ;	
}
/*********************************/
/*            MOBILE             */
/*********************************/
@media only screen 
and (min-device-width : 200px) 
and (max-device-width : 667px)
{
    *, ::after, ::before{box-sizing: border-box;}
    body{
    width:100%;
    height:100%;
    position:relative;
}
.section_0 img{
	width: 100%;
}
.logo-google{
	width: 100px!important;
	position: absolute;
	bottom : 30%;
	left: 10%;
}

.section_1{
	padding: 0 0 10px 0;
}

h2{
	text-align: center;
	margin: 0 10px;
}
.chiffres{
	width: 100%;
	float: left;
	text-align: center;
	padding: 0 0 5px;
	border-bottom: 1px solid #000;
}
.chiffres span{
	font-weight: bolder;
	font-size: 2.5em;
}
.bloc-texte{
	padding: 0 20px;
}
.images{
	width: 60%!important;
	margin:  0 auto;
}
.images img{
	width: 100%;
}
ul, li{margin0; padding: 0}
li{text-align: center;}
li img{
	width: 60px!important;
}
#formulaire p{
	font-size: 1.5em;
}
.formulaire{
	background-color: #F0825D;
	width:100%;
	float:left;
	padding: 50px 0;
	text-align: center;
}
.section_7 .formulaire input, 
.section_7 .formulaire select,
.section_7 .formulaire textarea{
	width:90%; 
	height: 60px;
	background-color: #F36041;
	font-weight: 300;
	padding: 0 0 0 20px;
	margin:5px auto;
	color:white;
	border: none;
	border-radius:30px ;
	vertical-align:middle!important ;
}
.consentement{
	width: 15px!important;
	height: 25px!important;
}
.bloc-rgpd p{
	margin: 0;
}
.envoyer{
	width: 50%;
	background-color: white!important;
	color:#F36041!important;
	font-weight: bold!important;
	text-transform: uppercase!important;
	text-align: center!important;
}
}
/***********************************/
/*            DESKTOP            */
/**********************************/

@media screen and (min-width: 760px)
{
body{
    width:100%;
    height:100%;
    position:relative;
    z-index: 1;
}

.logo-google{
	width: 100px!important;
	position: absolute;
	top : 20%;
	right: 10%;
}
.chiffres{

	width: 20%;
	float: left;
	text-align: center;
}
.chiffres span{
	font-size: 3em;
	font-weight: bold;
}


.images{
	width:35%;
	float:left;
}
.bloc-texte{
	width: 65%;
	float:left;
	padding:0 80px 20px;
}
img{
	width:70%;
	float:right;
	height:auto;
}
#formulaire{
	background-color: #F36041;
	width:30%;
	float:left;
}
.formulaire{
	background-color: #F0825D;
	width:70%;
	float:left;
	padding: 50px 0;
}
/*************************************************/
.bloc-section_0{
	width:100%;
	background-color: #22959E;
	overflow: hidden;
}
.bloc-section_0 h2{
	width:30%;
	float: left;
	color:white;
	padding:0 50px;
}
.bloc-section_0 span{
	font-weight: bold!important;
}
.bloc-section_0 img{
	width:60%;
	height:auto;
	float: left;
}
/*************************************************/
.section_1{
	background-color: #F2B220;
	float:left;
	clear: both;
	padding: 0 20px 20px;
}
.section_1 h2{
	margin-left: 50px;
}
/*************************************************/
.section_2{
	background-color: #F2B220;
}
.section_2 .images{
	background-color: #F2B220;	
}
.section_2 .bloc-texte{
	background-color: #F2B220;
}
.section_2 .bloc-texte h2{

}
/**************************************************/
.section_3{
	background-color: #E5E1E2; 
}
.section_3 .images{
	background-color: #E5E1E2;
}
.section_3 .bloc-texte{
	background-color:#E5E1E2
}
.section_3 .bloc-texte h2{

}
/***************************************************/
.section_4{
	background-color: #F2B220;
}
.section_4 .images{
	background-color: #F2B220;
}
.section_4 .bloc-texte{
	background-color: #F2B220;
}
.section_4 .bloc-texte h2{
}
.section_4 ul li img{
	float: left;
}
/***************************************************/
.section_5 .images{
	background-color: #E5E1E2
}
.section_5 .bloc-texte{
}
.section_5 .bloc-texte h2{

}
/***************************************************/
.section_6{
	background-color: #FFF;
}
.section_6 .images{
	background-color: #FFF;
}
.section_6 .bloc-texte{
	background-color:#FFF;
}
.section_6 .bloc-texte h2{

}
/***************************************************/
.section_7 .formulaire{
	text-align: center;
}
.section_7 .formulaire input, 
.section_7 .formulaire select,
.section_7 .formulaire textarea{
	width:80%; 
	height: 60px;
	background-color: #F36041;
	font-weight: 300;
	padding: 0 0 0 20px;
	margin:5px auto;
	/*float:left;
	clear:both;*/
	color:white;
	border: none;
	border-radius:30px ;
	vertical-align:middle!important ;
}
.bloc-rgpd{
	
	width:80%;
	text-align: center;
}
.consentement{
	clear:both;
	width:20px!important;
}
.consentement input{
	float: left!important;
}
.section_7 .formulaire p{
	width: 80%;
	float:left;
	margin:0 0 0 50px;
}
.envoyer{
	background-color: white!important;
	width:40%!important;
	color:#F36041!important;
	font-weight: bold!important;
	text-transform: uppercase!important;
	text-align: center!important;
	float:left!important;
	margin:0 0 0 80px!important;
}
#formulaire h2{
	color:white;
	padding:0 30px;
}
li img{
	width:50px;
}
}