body {
	background-color: #FFF;
	margin: 0px 0px;
	font-family: 'Encode Sans Semi Expanded', Arial, Helvetica, sans-serif;
	font-weight: 400;
	font-size: 14px;
	line-height: 28px;
	color: #000;
	/*
	background-image: url("images/background.jpg");
	background-repeat: no-repeat;
	background-position:center top;
	background-attachment:fixed;
	background-size: cover;	
	*/
}


#header {
	max-width: 900px;
	width: 90%;
	margin: 0 auto;
	margin-top: 40px;
}


.logo-header {
	width: 100%;
	max-width: 900px;
	text-align: center;
}

#page-OFF {
	min-width: 900px;
	width: 47vw;
	margin: 0 auto;
	margin-top: 40px;
	
	
	
	border-style: solid;
	border-width: 0;
	border-color: #000;
	border-radius: 16px;
		-webkit-border-radius: 16px;
		-moz-border-radius: 16px;
	/* overflow: hidden; */
	box-shadow: 2px 2px 10px 1px rgba(0, 0, 0, 0.7);
	background-color: rgba(255, 255, 255, 0.5);
	backdrop-filter: blur(40px);
}


#page {
	max-width: 900px;
	width: 90%;
	margin: 0 auto;
	margin-top: 40px;
	
	background-image: url("images/fade-background.png");
	background-repeat: repeat-x;
	background-position: center top;
	/* background-color: rgba(255, 255, 255, 0.5); */
}



#video {
	padding-top: 40px;
	margin: 0 auto;
	margin-bottom: 60px;
	max-width: 900px;
	width: 80%;
	text-align: center;
}


.no-display {
	display: none;
}




p {
	padding: 0 20px;
}


/* ancienne méthode... sans déclarer h1 à h3
.titres-site {
	top: -100px;
	visibility: hidden;
	font-size: 0px;
}
*/

.titres-site {
	/* text-indent: -10000px; */
}


.keywords {
	text-indent: -20000px;
}



h1.titres-site {
	margin: 0;
	margin-top: 30px;
	margin-bottom: 20px;
	font-size: 80px;
	line-height: 80px;
	white-space: nowrap;  /* empeche le retour ligne */
}

.highlight-white {
  text-shadow: 0px 0px 16px #fff;
}

.highlight-color {
  text-shadow: 0px 0px 20px #904de7;
}

h2.titres-site {
	margin: 0;
	margin-top: 0px;
	margin-bottom: 20px;
	font-size: 40px;
	line-height: 40px;
	white-space: nowrap;  /* empeche le retour ligne */
}

h3.titres-site {
	margin: 0;
	margin-top: 0px;
	font-size: 26px;
	line-height: 34px;
	/* white-space: nowrap; */  /* empeche le retour ligne */
	font-weight: 400;
}


#photos {
	text-align: center;
	max-width: 860px;
	width: 90%;
	height: auto;
	margin: 0 auto;
	margin-top: 40px;
	border-style: solid;
	border-width: 0;
}

.photo {
	max-width: 680px;
	width: 90%;
	height: auto;
	margin: 10px;
	border-style: solid;
	border-width: 2px;
	border-color: #000;
	border-radius: 16px;
		-webkit-border-radius: 16px;
		-moz-border-radius: 16px;
	overflow: hidden;
}

#image-container {
	width: 500px;
	height: auto;
	margin: 0 auto;
	margin-top: 40px;
	border-style: solid;
	border-width: 2px;
	border-color: #FFF;
	border-radius: 16px;
		-webkit-border-radius: 16px;
		-moz-border-radius: 16px;
	overflow: hidden;
	text-align: center;
}

#image-container img{
	width: 700px;
	height: auto;
}


a {
	color: #000;
	text-decoration: none;
}
a:link, a:visited {
	color: #000;
	text-decoration: none;
}
a:hover, a:active {
	color: #888;
}

a:focus { 
outline:0; 
}



#texte-presentation {



}

.titre {
	font-family: 'Encode Sans Semi Expanded', Arial, Helvetica, sans-serif;
	font-weight: 600;
	font-size: 48px;
	line-height: 56px;
	text-align: center;
	margin: 0;
	margin-bottom: 25px;
	/* font-variant: small-caps; */
}

.sous-titre {
	font-family: 'Encode Sans Semi Expanded', Arial, Helvetica, sans-serif;
	font-size: 40px;
	line-height: 44px;
	text-align: center;
	margin-bottom: 30px;
}

.paragraphe {
	font-size: 20px;
	line-height: 28px;
	text-align: justify;
	margin-bottom: 20px;
}

.texte {
	font-size: 20px;
	line-height: 28px;
}

.texte-big {
	font-size: 28px;
	line-height: 38px;
}

.texte-big-2 {
	font-size: 28px;
	line-height: 30px;
}

.texte-big-3 {
	font-size: 28px;
	line-height: 38px;
	margin: 40px;
}

.texte-small {
	font-size: 16px;
	line-height: 26px;
}

.texte-hashtags {
	font-size: 20px;
	line-height: 26px;
}

.commentaire {
	font-size: 16px;
	text-align: center;
	margin-bottom: 70px;
}

.legende {
	font-size: 18px;
	text-align: center;
	margin-top: 10px;
}

.mentions-paragraphe {
	font-size: 18px;
	line-height: 26px;
	text-align: justify;
	margin-bottom: 60px;
}


.spacer-10 {
	display : inline-block;
	width: 100%;
	height: 10px;
}

.spacer-20 {
	display : inline-block;
	width: 100%;
	height: 20px;
}

.spacer-30 {
	display : inline-block;
	width: 100%;
	height: 30px;
}

.spacer-40 {
	display : inline-block;
	width: 100%;
	height: 40px;
}

.spacer-50 {
	display : inline-block;
	width: 100%;
	height: 50px;
}

.spacer-60 {
	display : inline-block;
	width: 100%;
	height: 60px;
}

.spacer-70 {
	display : inline-block;
	width: 100%;
	height: 70px;
}

.spacer-80 {
	display : inline-block;
	width: 100%;
	height: 80px;
}

.spacer-events-top {
	display : inline-block;
	width: 100%;
	height: 80px;
}

.spacer-footer {
	display : inline-block;
	width: 100%;
	height: 105px;
}




#input-container {
	text-align: center;
}



.champ-coord {
	display: inline-block;
	max-width: 680px;
	width: 90%;
	height: 65px;
	margin-top: 6px;
	margin-bottom: 20px;
	background-color: #FFF;
	/* color: #904de7;
	border: 4px solid #904de7; */
	color: #3975B6;
	border: 4px solid #3975B6;
		border-radius: 20px;
		-webkit-border-radius: 20px;
		-moz-border-radius: 20px;
	font-size: 30px;
	white-space: nowrap;  /* empeche le retour ligne */
	text-align: center;
	/* padding: 36px 10px 0px 10px; */
	box-shadow: 0px 0px 6px 6px rgba(255, 255, 255, 0.5);
}


.bouton-valider {
	display: inline-block;
	max-width: 200px;
	width: 80%;
	height: 65px;
	margin-top: 20px;
	margin-bottom: 60px;
	color: #FFF;
	/* background-color: #904de7;
	border: 4px solid #904de7; */
	background-color: #3975B6;
	border: 4px solid #3975B6;
		border-radius: 20px;
		-webkit-border-radius: 20px;
		-moz-border-radius: 20px;
	font-size: 26px;
	white-space: nowrap;  /* empeche le retour ligne */
	text-align: center;
	/* padding: 36px 10px 0px 10px; */
	box-shadow: 0px 0px 6px 6px rgba(255, 255, 255, 0.5);
}

input.bouton-valider:hover {
	box-shadow: 0px 0px 6px 6px rgba(57, 117, 182, 0.5);
	color: #7FA9D7;
	cursor: pointer;
}



#button-container {
	text-align: center;
}

div#visit-site-button {
	display: inline-block;
	width: 560px;
	height: 65px;
	margin-top: 20px;
	margin-bottom: 20px;
	color: #FFF;
	/* background-color: #904de7;
	border: 4px solid #904de7; */
	background-color: #3975B6;
	border: 4px solid #3975B6;
		border-radius: 20px;
		-webkit-border-radius: 20px;
		-moz-border-radius: 20px;
	font-size: 30px;
	white-space: nowrap;  /* empeche le retour ligne */
	text-align: center;
	/* padding: 36px 10px 0px 10px; */
	box-shadow: 0px 0px 6px 6px rgba(255, 255, 255, 0.5);
}

div#visit-site-button a {
	display: block;
	width: auto;
	height: 100%;
	color: #FFF;
	padding-top: 18px;
}

div#visit-site-button:hover {
	box-shadow: 0px 0px 6px 6px rgba(57, 117, 182, 0.5);
	color: #7FA9D7;
}

div#visit-site-button a:hover {
	color: #7FA9D7;
}




#contact {
	margin-bottom: 80px;
}

.coordonnees {
	text-align: center;
	font-size: 26px;
	line-height: 30px;
	white-space: nowrap;  /* empeche le retour ligne */
}

.logo-whatsapp {
	width: 130px;
	height: 106px;
	vertical-align: middle;
	margin-left: 12px;
	margin-right: 30px;
}


div#social {
	text-align: center;
}

.icon {
	padding: 15px;
	width: 52px;
	height: auto;	
}


div#footer {
	width: 100%;
	height: 40px;
	/* background-color: #000; */
	/* border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
	*/
	text-align:center;
}


.texte-footer {
	color: #000;
	text-align: center;
	font-family: 'Encode Sans Semi Expanded', Arial, Helvetica, sans-serif;
	font-size: 16px;
	
	padding-top: 6px;
	
	white-space: nowrap;  /* empeche le retour ligne */

}

.texte-footer a {
	color: #000;
}

.texte-footer a:hover {
	color: #AAA;
}



#mentions {
	margin-top: 30px;
	margin-bottom: 60px;
	width: 100%;
	text-align: center;
}


.color {
	/* color: #aa65ff; */
	/* color: #4952DE; */
	color: #3975B6;
}

.white {
	color: #FFF;
}


.center {
	text-align: center;
}

.small-caps {
	font-variant: small-caps;	
}


.mic {
	display: inline-block;
	vertical-align: top;
	width: 32px;
	height: auto;
}









@media screen and (max-device-width: 900px) {
  /* define mobile specific styles come here */



div#debug { display: none; }


/*
h1.titres-site {
	margin: 0;
	margin-top: 50px;
	font-size: 20px;
	line-height: 20px;
}

h2.titres-site {
	margin: 0;
	margin-top: 10px;
	font-size: 15px;
	line-height: 15px;
}

h3.titres-site {
	margin: 0;
	margin-top: 5px;
	font-size: 10px;
	line-height: 10px;
}
*/


.titre {
	font-family: 'Encode Sans Semi Expanded', Arial, Helvetica, sans-serif;
	font-weight: 600;
	font-size: 56px;
	line-height: 68px;
	text-align: center;

}

.sous-titre {
	font-family: 'Encode Sans Semi Expanded', Arial, Helvetica, sans-serif;
	font-size: 40px;
	line-height: 44px;
	text-align: center;
	margin-bottom: 30px;
}

.paragraphe {
	font-size: 24px;
	line-height: 32px;
	text-align: justify;
	margin-bottom: 60px;
}


.texte-big {
	font-size: 38px;
	line-height: 52px;
}

.texte-hashtags {
	font-size: 10px;
	line-height: 20px;
}

.commentaire {
	font-size: 12px;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 70px;
}

.legende {
	font-size: 22px;
	text-align: center;
	margin-top: 10px;
}


.mentions-paragraphe {
	font-size: 24px;
	line-height: 30px;
	text-align: justify;
	margin-bottom: 60px;
}



.coordonnees {
	text-align: center;
	font-size: 32px;
	line-height: 36px;
	white-space: nowrap;  /* empeche le retour ligne */
}

.logo-whatsapp {
	width: 169px;
	height: 138px;
	vertical-align: middle;
	margin-left: 12px;
	margin-right: 30px;
}


div#footer {
	width: 100%;
	height: 70px;
	/* background-color: #000;
	border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px; */

	text-align: center;
}


p.texte-footer {
	display: inline-block;
	width: 800px;
	height: 40px;
	color: #000;
	text-align: center;
	font-family: 'Encode Sans Semi Expanded', Arial, Helvetica, sans-serif;
	font-size: 26px;

	margin-top: 18px;
	
	white-space: nowrap;  /* empeche le retour ligne */

}


#mentions {
	margin-top: 40px;
	margin-bottom: 20px;
	width: 900px;
	text-align: center;
}


.center {
	text-align: center;
}


.mic {
	display: inline-block;
	vertical-align: text-top;
	width: 48px;
	height: auto;
}



.champ-coord {
	font-size: 36px;
}

.bouton-valider {
	max-width: 240px;
	width: 80%;
	height: 65px;
	margin-top: 20px;
	margin-bottom: 60px;

	font-size: 32px;

}


}   /* fin déclaration CSS mobile */