@charset "utf-8";
/* CSS Document */

/* Général */
body {
	margin:0;
	padding:0;
	width:100%;
	height:100%;
	background-color:#FFF;	
	font-family:Arial, Helvetica, sans-serif;
	font-size:100%;
}

/*éléments ecrans larges*/
#contenu_XL {
	display:block;
	text-align:center;
	padding-top:180px;
	font-size:100%
}
#bandeau1, #bandeau2 {
	position:fixed;
	left:0; top:0;
	width:100%;
	z-index:10;
	box-shadow: 0px 2px 10px 5px rgba(0, 0, 0, 0.7);
	background: linear-gradient(rgba(16, 102, 177, 1), rgba(0, 80, 106, 1) ,rgba(16, 102, 177, 1));
}

#bandeau_menus2, #bandeau_menus1 {
	width:750px; max-width:1450px; margin-left:auto; margin-right:auto; display:flex; justify-content:space-evenly; align-items: center;
}
.insecable {
	white-space:nowrap;
}
/*conteneur avec dégradé vertical bleu*/
.flex_bleu {
	display:flex;
	justify-content:center;
	align-items: center;
	background: linear-gradient(rgba(255, 255, 255, 1), rgba(166, 198, 226, 0.7),rgba(255, 255, 255, 1));
}
/*conteneur photos avec dégradé vertical bleu*/
.photos_gallery {

	min-width:670px;
	min-height:430px;
	margin-left:auto;
	margin-right:auto;

}

.photo {
	border:#a6c6e2 solid 10px;
	border-radius:20px;
	margin:0px;
	position:absolute;
	width:140px;
	top:150px;
	left:250px;
	opacity:0;

}

.photo {
	transition:all 0.5s;
}
.photo:hover {
	transform: scale(1.05, 1.05);
	filter:drop-shadow(0px 0px 3px black) sepia(50%);
	transition:all 0.5s;
}

.loupe {
	transition:all 0.5s;
}
.loupe:hover {
	transform: scale(1.05, 1.05);
	filter:drop-shadow(0px 0px 3px black) sepia(50%);
	transition:all 0.5s;
}


.flex_vert {
	display:flex;
	justify-content: center;
	align-items: center;
	background: linear-gradient(rgba(255, 255, 255, 1), rgba(174, 230, 175, 0.7),rgba(255, 255, 255, 1));
	margin-top:80px; 
}
/*conteneur dans flex hauteur 500px*/
.haut_500 {
	height:500px; display:flex; justify-content: center; align-items: center;
}
.rond_bleu {
	border:#a6c6e2 solid 20px; border-radius:50%;display: flex; align-items: center; justify-content: center; overflow:hidden;
}
.rond_vert {
	border:#aee6af solid 20px; border-radius:50%;display: flex; align-items: center; justify-content: center; overflow:hidden;
}
.incline {
	font-size:150%;
	background:rgba(255, 0, 0, 1);
	color:#FFF;
	padding:10px;
	transform: rotate(-5deg);
	font-weight:bold;
	display:inline-block;
	box-shadow:3px 3px 10px 0px rgba(0, 0, 0, 0.7);
}
#logo_large {
	width:130px; height:130px; margin:10px;
}
a.menus {
	text-decoration:none;
	background:rgba(142, 198, 63, 1);
	text-align:center;
	text-shadow:black 1px 1px;
	padding:10px;
	border: 1px solid #fff;
	color:#FFF;
	font-size:110%;
	transition: all 0.5s;
	border-radius: 0 5px 0 5px;
}
.click {
	background:rgba(142, 198, 63, 0.5);
	text-align:center;
	padding:10px;
	font-size:110%;
	border: 1px solid #fff;
	text-shadow:black 1px 1px;
	color:#FFF;
	border-radius: 0 5px 0 5px;
}
a.menus:hover {
	background:rgba(142, 198, 63, 0.5);
	transition: all 0.5s;
}
#bandeau {
	position:fixed; left:0; top:0; box-shadow: 0px 2px 10px 5px rgba(0, 0, 0, 0.7); background: linear-gradient(rgba(16, 102, 177, 1), rgba(0, 80, 106, 1) ,rgba(16, 102, 177, 1)); width:100%; z-index:10;
}
#bandeau_menus {
	width:100%; max-width:1200px; margin-left:auto; margin-right:auto; display:flex; justify-content:space-evenly; align-items: center;
	
}
/*flèche pour scroll haut de page*/
#fleche {
	position:fixed;	
	right:0;
	bottom:0;
	display:none; /*caché au chargement de la page, apparition/disparition géré par js*/
	z-index:300;
}

/*Container global contenu écrans larges*/
#contenu_large  {
	text-align:center; padding-top:180px; padding-bottom:20px; display:block;
}

/*titre de la page (commun aux 2)*/
#titre {
	font-size:160%; line-height:150%;
}
.deco_titre {
	background: linear-gradient(to bottom, white 0%, white 70%, #8ec63f 70%, #8ec63f 100%); padding-left:5px; padding-right:5px;
}

#conteneur_large_1 {
	background:rgba(16, 102, 177, 0.3); padding:20px;  display:inline-block;  border-radius: 10px; margin-top:40px; text-align:center; margin-bottom:55px;
}
#conteneur_large_2 {
	margin-top: 30px; background-color:#AEE6AF; padding:15px; padding-bottom:15px; display:inline-block; border-radius: 10px; text-align:center; width:670px; margin-bottom:30px;
}
#conteneur_large_3 {
	background:rgba(16, 102, 177, 0.3); padding:20px;  display:inline-block;  border-radius: 10px; margin-top:40px; text-align:center; margin-bottom:55px; width:670px;
}
.text_incline {
	font-size:150%; background:rgba(255, 0, 0, 1); color:#FFF; padding:10px; transform: rotate(-5deg); font-weight:bold; display:inline-block;
	box-shadow:3px 3px 10px 0px rgba(0, 0, 0, 0.7);
}
.contenu_large_sous {
	font-size:130%; margin-top:15px; margin-bottom:15px;
}
.iframe {
	border:none;
	width:600px;
	height:450px;
}

/*éléments smartphone masqués*/
#menus_plus {
	display:none;
}	
#cache_contenu {
	height:0vh;
}
#logo {
	display:none;
}
#hamburger {
	display:none;
}
#contenu_smart {
	display:none;
}
.petit {
	display:none;
}
.large {
	display:none;
}
.text_incline_petit {
	display:none;
}
.text_incline_large {
	display:none;
}


@media screen and (max-width:767px){	

#contenu_XL {
	display:none;
}
	
#bandeau {
	display:none;
}
#contenu_large {
	display:none;
}
#titre_smart {
	font-size:160%; line-height:150%; margin-top:20px;
}
#contenu_smart {
	text-align:center; padding-bottom:15px;
}
.text_incline {
	font-size:140%;
	background:rgba(255, 0, 0, 1);
	color:#FFF; padding:10px;
	transform: rotate(-5deg);
	font-weight:bold;
	display:inline-block;
	box-shadow:3px 3px 10px 0px rgba(0, 0, 0, 0.7);
}
#conteneur_smart_1 {
	margin-top: 40px; background-color:#B0CDFD; display:inline-block; padding:15px; padding-bottom:20px; display:inline-block; font-size:110%; border-radius: 10px;
}
#conteneur_smart_2 {
	margin-top: 30px; background-color:#AEE6AF; display:inline-block; padding:15px; padding-bottom:20px; display:inline-block; font-size:110%; border-radius: 10px; text-align:center;
}
#conteneur_smart_3 {
	margin-top: 30px; background-color:#B0CDFD; display:inline-block; padding:15px; padding-bottom:20px; display:inline-block; font-size:110%; border-radius: 10px; text-align:center;
}
.contenu_smart_sous {
	font-size:120%; margin-top:15px;
}
#logo {
	width:180px;
}
#hamburger {
	width:75px; position:absolute; right: 10px; top:10px;
}

#cache_contenu {
	background-color:#000;
	position:absolute;
	left: 0px;
	top: 0px;
	width:100%;
	height:100vh;
	z-index:5;
	display:none;
	opacity:0.8;	
}
#menus_plus {
	position:fixed;
	width:70%;
	right:15%;
	top:90px;
	text-align:center;
	display:none;
	z-index:20;
}
#menus_plus a{
	font-size:30px;
	letter-spacing:0.1em;
	color:#000;
	line-height:30px;
	text-decoration:none;
	padding-right:20px;
	padding-top:15px;
	padding-bottom:15px;
	padding-left:20px;
	display:block;
	background:rgba(142, 198, 63, 1);	
	margin:10px;
	margin-bottom:12px;
	border-radius: 0px 10px 0 10px;
}
#contenu_smart {
	display:block; font-size:110%;
}
.iframe {
	border:none;
	width:100%;
	height:450px;
}
.petit {
	display:none;
}
.large {
	display:block;
}
.text_incline_petit {
	display:none;
}
.text_incline_large {
	display:inline-block;
}
#contenu_large {
	display:none;
}
#logo {
	display:block;
}
#hamburger {
	display:block;
}


}

@media screen and (max-width:500px){
.petit {
	display:block;
}
.large {
	display:none;
}
.text_incline_petit {
	display:inline-block;
}
.text_incline_large {
	display:none;
}
.iframe {
	width:100%;
	height:450px;
}
	
}

@media screen and (max-width: 380px){


.iframe {
	width:100%;
	height:450px;
}
.petit {
	display:block;
}
.large {
	display:none;
}
.text_incline_petit {
	display:inline-block;
}
.text_incline_large {
	display:none;
}


}
