/* --- LES COULEURS 
	ORANGE : #f15a24 - (241, 90, 36)
	ORANGE CLAIR : #fcbf5f  -  (252, 191, 95)
	ORANGE TRES CLAIR : #ffe0b8  -  (255, 224, 184)
	ROUGE : #fe1f01  -  (254, 31, 1)
	GRIS : #493a30 - (73, 58, 48)
	GRIS CLAIR (accueil) : #545140 - (84, 81, 64)
	GRIS TRES CLAIR : #a48c69  -  (164, 140, 105)
	GRIS TRES TRES CLAIR : #e0dfdc  -  (224, 223, 220)
	GRIS BLANC : #e8e7e4  -  (232, 231, 228)
-- */

/* --- FONT FAMILY
	font-family: 'Mukta', sans-serif;
	font-family: 'Architects Daughter', cursive;
-- */

@import url('https://fonts.googleapis.com/css2?family=Mukta:wght@200;300;400;500;600;700;800&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0');	

/* --- GENERAL --- */

*
	{
		box-sizing:border-box;
		margin:0;
		padding:0;
	}

body 
	{
		background-color:#ffffff;
		
		line-height:1.2em;
		width:100%;
		margin:auto;
		
		font-size:100%;
		
		word-wrap: break-word;
		overflow-wrap: break-word;  
		-webkit-hyphens : auto;
		-moz-hyphens : auto;
		-ms-hyphens : auto;
		hyphens : auto;
	}

main#wrapper
	{		
		background-color:#ffffff;
		
		/*max-width: 1200px;*/
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:column;
		flex-wrap:wrap;
		
		justify-content:center;
		/*align-items:stretch;*/
		align-content:center;

	}
	
	
/* --- HEADER --- */

div#logo
	{
		/*border:1px solid blue;*/
		width:15%;
		position:fixed;
		top:0px;
		left:5%;
		z-index:100;
	}

div#logo img
	{  
		max-width:100%;
		height:auto;
	}

header#menu-ok
	{
		/*width:100%;
		border-bottom:3px solid rgb(241, 90, 36);
		background-color:#ffffff;
		height:7vh;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;
		
		justify-content:flex-end;*/

		display:none;		
	}

header#menu650
	{
		width:100%;
		border-bottom:3px solid rgb(241, 90, 36);
		/*background-color:#ffffff;*/
		background-color:rgba(255, 255, 255, 0.6);
		
		/*height:7vh;*/
		height:2.2em;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;
		
		justify-content:flex-end;

		/*border:1px solid blue;*/
		
		/*display:none;*/
	}


/* --- HEADER - NAVIGATION --- */  

header#menu650 nav
	{
		width:100%;
		z-index:90;
		
		/*height:7vh;*/
		height:2.2em;
		position:fixed;
		border-bottom:3px solid rgb(241, 90, 36);	
		
		background-color:rgb(255, 255, 255);

		/*border:1px solid red;*/
	}

header#menu650 nav ul.nav650
	{
		/*height:7vh;*/
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;
		
		justify-content:center/*space-between*/;
		align-items:center;
		
		list-style-type:none;
		text-decoration:none;
		
		position:absolute;
		top:0px;
		right:5%;
		width:60%;
		
		background-color:rgba(255, 255, 255, 0.8);
		
		/*border-bottom:3px solid rgb(241, 90, 36);*/
		
		/*border:1px solid green;*/
	}




header#menu650 nav ul li.deroulant 
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:1.2em;
		
		list-style:none;
		text-decoration:none;
	}

header#menu650 nav ul li.deroulant a
	{
		text-decoration:none;
		list-style:none;
		color:#493a30;
	}
	
header#menu650 nav ul li.deroulant span.material-symbols-outlined 
	{
		font-weight:400;
		font-size:0.8em;
		color:#ffffff;
		
		background-color:rgb(241, 90, 36);
		border:2px solid rgb(241, 90, 36);
		border-radius:4px;
	}

	
header#menu650 nav ul li ul.sousderoulant
	{
		display:none;
	}

header#menu650 nav ul li:hover .sousderoulant
	{
		display:block;
		
		position:relative;
		
		padding-top:0.7em; 
		padding:0.3em;
		
		/*border:1px solid orange;*/
	}

header#menu650 nav ul.sousderoulant li
	{
		font-family: 'Mukta', sans-serif;
		font-weight:600;
		font-size:0.8em;
		/*padding-top:1em;*/
		padding:0.3em;
	
		list-style:none;
		text-decoration:none;
		
		/*border:1px solid violet;*/
	}

header#menu650 nav ul.sousderoulant li.utile
	{
		font-family: 'Mukta', sans-serif;
		font-weight:600;
		font-size:0.8em;
		padding:0.3em;
		
		color:#f15a24;
	
		list-style:none;
		text-decoration:none;
		
		/*border:1px solid violet;*/
	}

header#menu650 nav ul li:hover .sousderoulant a:hover,
header#menu650 nav ul li:hover .sousderoulant a:focus
	{
		list-style:none;
		text-decoration:none;
		color:#000000;
		
	}

header#menu650 nav ul.nav650 li.deroulant 
	{
		list-style:none;
		text-decoration:none;
		color:#493a30;
		
		padding-top:0.3em;
		padding-bottom:0.3em;
		
		/*background-color:rgba(255, 255, 255, 0.8);*/
		
		width:70%;
		text-align:center;
		
		/*border:3px solid orange;*/
	}


/*	
header#menu650 nav ul li a:visited 
	{
		text-decoration:none;
		color:#493a30;
	}	

header#menu650 nav ul li a:hover,
header#menu650 nav ul li a:focus
	{
		color: rgb(84, 81, 64);
		border-top:13px solid rgba(241, 90, 36, 1);
		padding:0.7em; 
		padding-top:0.3em;
		padding-bottom:0.3em;
		
	}
*/
	
	
/* --- ACCUEIL CONTENU DESSUS --- */	

section#contenu1
	{
		width:100%;
		height:44vh;
		z-index:80;
		
		background-image:url(images/Visuel_BG_page-accueil.jpg);
		background-repeat:no-repeat;
		background-position:left-top;
		background-attachment:local;
		background-size: cover/*contain*/;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:space-around;
		align-content:flex-start;
		
		/*border:3px solid violet;*/		
	}

article#soustitre1
	{
		display:none;
		
		/*width:55%;
		height:44vh*/
		
		/*height:34vh;*/
		/*border:1px solid green;	*/	
	}
	
article#illustrations1
	{
		display:none;
		
	
		/*width:45%;
		height:44vh*/
		
		/*height:34vh;*/
		
		/*display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:flex-start;
		align-items:stretch;*/		
	}

article#illustrations1 div
	{
		display:none;
		
		/*width:45%;
		height:44vh;*/
		
		
		/*margin:0.3em;
		margin-bottom:0.5em;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:column;
		flex-wrap:wrap;

		justify-content:flex-end;*/
		
		/*padding-bottom:1.3em;*/
				
		/*border:2px solid orange;*/		
	}
/* --- ANIMATION IMAGES ACCUEIL --- */

/*	@keyframes animeimage {
  from {
    transform: scale(0);
  }
  50% {
    transform: scale(1.03);
  }
  to {
    transform: scale(1);
  }
}*/

article#illustrations1 div img.illu-1
	{
		display:none;
		
		/*width:100%;
		height:auto;*/
		/*padding-bottom:1em;*/
		
		/*border:3px solid #ffffff;

		animation: animeimage 0.7s;	*/	
	}

article#illustrations1 div img.illu-2
	{
		display:none;
		
		/*width:100%;
		height:auto;*/
		/*padding-bottom:1em;*/
		
		/*border:3px solid #ffffff;

		animation: animeimage 1.0s;	*/	
	}

/* --- ACCUEIL CONTENU DESSOUS --- */

	
section#contenu2
	{
		width:100%;
		/*height:44vh;*/
		z-index:90;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:space-around;
		align-content:flex-start;
		
		/*border:3px solid olive;*/		
	}

article#soustitre2
	{
		width:90%;
		
		/*width:55%;*/
		/*height:44vh;*/
		text-align:center;		
	}

article#soustitre2 h2
	{
		font-family: 'Architects Daughter', cursive;
		font-size:1.1em;
		line-height:1.6em;
		color:#493a30;
		padding-top:8vh;		
	}
	
article#illustrations2
	{
		display:none;
		
		/*width:45%;
		height:44vh;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:flex-start;
		align-items:stretch;*/	
	}

article#illustrations2 div
	{
		display:none;
		
		/*width:45%;
		margin:0.3em;
		margin-top:0.5em;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:column;
		flex-wrap:wrap;

		justify-content:flex-start;	*/	
	}

article#illustrations2 div img.illu-3
	{
		display:none;
		
		/*width:100%;
		height:auto;
		
		border:3px solid #53503f;

		animation: animeimage 1.3s;*/
	}	

article#illustrations2 div img.illu-4
	{
		display:none;
		
		/*width:100%;
		height:auto;
		
		border:3px solid #53503f;

		animation: animeimage 1.6s;*/
	}
	

/* --- ACCUEIL PIED DE PAGE --- */


footer#pied-accueil
	{
		display:none;
		
		/*width:100%;
		height:10vh;
		z-index:100;
		
		position:fixed;
		bottom:0;
		
		background-color:#545140;

		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;
		
		justify-content:center;
		align-items:center;	*/	
	}
	
footer#pied-accueil-650
	{
		width:100%;
		
		/*height:10vh;*/
		height:3em;
		
		z-index:100;
		
		position:fixed;
		bottom:0;
		
		background-color:#545140;

		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;
		
		justify-content:center;
		align-items:center;		
	}
	
footer#pied-accueil-650 p
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:0.7em;
		color:#ffffff;
	}	
	
footer#pied-accueil-650 p a
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:1.2em;
		text-decoration:none;
		color:#f15a24;
	}	

footer#pied-accueil-650 p a:visited
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:1.2em;
		text-decoration:none;
		color:#f15a24;
	}
	
footer#pied-accueil-650 p a:hover,
footer#pied-accueil-650 p a:focus
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:1.2em;
		text-decoration:none;
		color:#ffffff;
	}
	
	
	
	
	
	
	
	
/* --- PAGE - PRESENTATION -   CONTENU --- */	







section#presentation-top
	{
		width:100%;
		height:10vh;
		/*height:4.7em;*/
		z-index:50;
		
		background-image:url(images/Visuel_BG_page-interieur-1-pt.jpg);
		background-repeat:no-repeat;
		background-position:left-top;
		background-attachment:local;
		background-size: /*cover;*/contain;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:space-around;
		align-content:flex-start;

		/*border:2px solid red;*/
	}

section#presentation1
	{
		width:100%;
		z-index:50;
		
		background-color:#ffffff;
		
		display:-ms-flexbox;
		display:flex;
		/*flex-direction:row;*/
		flex-direction:column;
		flex-wrap:wrap;

		/*justify-content:flex-start;
		align-content:flex-start;*/
		justify-content:center;
		align-content:flex-start;
		
		/*border:3px solid olive;*/		
	}

section article#presentation-texte
	{
		width:100%;
		/*border:1px solid orange;	*/	
	}

article#presentation-texte h1
	{
		font-family: 'Architects Daughter', cursive;
		font-size:1.3em;
		line-height:1.6em;
		color:#493a30;
		padding:1em 2em 0em 1.4em;		
	}

article#presentation-texte h3
	{
		font-family: 'Architects Daughter', cursive;
		font-size:1.1em;
		line-height:1.6em;
		color:#493a30;
		padding:1em 2em 1em 1.6em;		
	}

article#presentation-texte p
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:0.9em;
		line-height:1.2em;
		text-align:justify;
		color:#493a30;
		padding:0.5em 3em 0em 4em;		
	}

section article#presentation-images
	{
		width:96%;
		margin:2%;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:space-between;
		align-content:flex-start;
		
			/*border:1px solid blue;*/
	}

section article#presentation-images figure.carre
	{
		width:100%;
		background-color:#e8e7e4;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:column;
		flex-wrap:no-wrap;

		justify-content:space-between;
		align-content:space-between;

		margin-top:1%;
		/*border:1px solid blue;*/
	}

section article#presentation-images figure.carre img
	{  
		max-width:96%;
		height:auto;
		align-self:center;
		padding-top:2%;
	}

section article#presentation-images figure.vertical
	{
		/*width:49.2%;*/
		/*background-color:#ffffff;*/
		
		width:100%;
		background-color:#e8e7e4;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:column;
		flex-wrap:no-wrap;

		justify-content:space-between;
		align-content:space-between;

		margin-bottom:4vh;

		/*border:1px solid orange;*/
	}

section article#presentation-images figure.vertical img
	{  
		max-width:96%;
		height:auto;
		align-self:center;
		padding-top:2%;
	}

section article#presentation-images figure.horizontal
	{
		width:100%;
		/*background-color:#ffffff;*/
		
		background-color:#e0dfdc;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:column;
		flex-wrap:no-wrap;

		justify-content:space-between;
		align-content:space-between;
		
		margin-bottom:4vh;

		/*border:1px solid orange;*/	
	}	

section article#presentation-images figure.horizontal img
	{  
		max-width:98%;
		height:auto;
		align-self:center;
		padding-top:1%;
	}
	
section article#presentation-images figure figcaption
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		/*font-size:0.9em;*/
		font-size:1.1em;
		line-height:1.2em;
		color:#a48c69;
		
		padding:0.5em 1em 0.3em 1em;

		/*border:1px solid #e0dfdc;*/
	}
	
section article#presentation-images figure.horizontal-bas
	{
		width:100%;
		/*background-color:#ffffff;*/
		
		background-color:#e0dfdc;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:column;
		flex-wrap:no-wrap;

		justify-content:space-between;
		align-content:space-between;

		margin-bottom:10vh;
		
		/*border:1px solid blue;*/
	}	

section article#presentation-images figure.horizontal-bas img
	{  
		max-width:98%;
		height:auto;
		align-self:center;
		padding-top:1%;
	}
	
section article#presentation-images figure.vertical-bas
	{
		width:49.2%;
		/*background-color:#ffffff;*/
		
		background-color:#e8e7e4;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:column;
		flex-wrap:no-wrap;

		justify-content:space-between;
		align-content:space-between;

		margin-bottom:10vh;	
	}

section article#presentation-images figure.vertical-bas img
	{  
		max-width:96%;
		height:auto;
		align-self:center;
		padding-top:2%;
	}	
	
	
/* --- PAGE - EN SAVOIR PLUS -   CONTENU --- */	







section#savoir-top
	{
		width:100%;
		height:10vh;
		/*height:4.7em;*/
		z-index:50;
		
		background-image:url(images/Visuel_BG_page-interieur-2-pt.jpg);
		background-repeat:no-repeat;
		background-position:left-top;
		background-attachment:local;
		background-size: /*cover;*/contain;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:space-around;
		align-content:flex-start;

		/*border:2px solid red;*/
	}
	
section#savoir1
	{
		width:100%;
		z-index:50;
		
		background-color:#ffffff;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:center;
		align-content:flex-start;
		
		/*border:3px solid olive;*/		
	}	
	
section article#savoir-chapeau
	{
		width:90%;
		border-right:none;
		border/*-bottom*/:2px dashed #f15a24;
		margin-top:1.5em;
		margin-bottom:1.5em;

		/*border:2px solid blue;*/		
	}

section article#savoir-chapeau p.chapeau
	{
		font-family: 'Mukta', sans-serif;
		font-weight:600;
		font-size:1em;
		line-height:1.4em;
		color:#493a30;
		text-align:justify;
		padding:1.5em 2em 1.5em 2em;
			

		word-wrap: break-word;
		overflow: break-word;		
			/* en cas de mot très très long (comme un lien hypertext) le mot sera coupé même s'il n'y a pas d'espace entre les lettres */
			/* TOUJOURS METTRE LES DEUX */
			
		hyphens: auto;
			/* Active la césure intelligente */		
	}


section article#savoir-chapeau p.textesavoir
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:1em;
		line-height:1.4em;
		color:#493a30;
		text-align:justify;
		padding:1.5em 2em 1.5em 2em;
			

		word-wrap: break-word;
		overflow: break-word;		
			/* en cas de mot très très long (comme un lien hypertext) le mot sera coupé même s'il n'y a pas d'espace entre les lettres */
			/* TOUJOURS METTRE LES DEUX */
			
		hyphens: auto;
			/* Active la césure intelligente */		
	}



section article#savoir-images
	{
		width:96%;
		margin-left:2%;
		margin-right:2%;
		margin-top:1.5em;
		margin-bottom:1.5em;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:space-between;
		align-content:flex-start;

		/*border:2px solid blue;*/
	}	


	
section article#savoir-images div.savoir-textes
	{
		width:75%;		
	}

div.savoir-textes h4
	{
		font-family: 'Mukta', sans-serif;
		font-weight:600;
		font-size:1em;
		line-height:1.3em;
		color:#493a30;
		padding:1.3em 0em 1em 0em;		
	}
	
div.savoir-textes p
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:0.9em;
		line-height:1.2em;
		color:#493a30;
		padding:0.5em 0em 0em 2em;
		margin-bottom:1em;		
	}
	
section article#savoir-images div.savoir-illu
	{
		width:100%;	
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:space-between;
		align-content:flex-start;
		
		/*border:1px solid #a48c69;	*/	
	}
	

section article#savoir-images div.savoir-illu figure.exemple-illu-carre2
	{
		width:31%;
		background-color:#ffffff;
		margin:0,5em;

		/*border:1px solid blue;*/
	}

section article#savoir-images div.savoir-illu figure.exemple-illu-horiz
	{
		width:100%;
		background-color:#ffffff;
		margin-top:0.5em;
		margin-bottom:0.5em;

		/*border:1px solid red;	*/	
	}	
	
section article#savoir-images div.savoir-illu figure.exemple-illu-carre
	{
		width:48%;
		background-color:#ffffff;
		margin-top:0.5em;
		margin-bottom:0.5em;

		/*border:1px solid violet;*/		
	}

section article#savoir-images div.savoir-illu figure.exemple-illu-2-horiz
	{
		width:100%;
		background-color:#ffffff;
		margin-top:0.5em;
		margin-bottom:0.5em;

		/*border:1px solid blue;*/
	}

section article#savoir-images div.savoir-illu figure.exemple-illu-2-carre
	{
		width:48%;
		background-color:#ffffff;
		margin-top:0.5em;
		margin-bottom:0.5em;	

		/*border:1px solid orange;*/
	}
	
section article#savoir-images div.savoir-illu figure img
	{
		width:100%;
		height:auto;
	}
	
section article#savoir-images div.savoir-bas
	{
		width:100%;
		height:5vh;
	}	
	
	
	
	
	
	
	
/* --- PAGE - GALERIES -   CONTENU --- */	







section#galerie-top
	{
		width:100%;
		height:10vh;
		/*height:4.7em;*/
		z-index:50;
		
		background-image:url(images/Visuel_BG_page-interieur-3-pt.jpg);
		background-repeat:no-repeat;
		background-position:left-top;
		background-attachment:local;
		background-size: /*cover;*/contain;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:space-around;
		align-content:flex-start;

		/*border:2px solid red;*/
	}	
	
section#galerie1
	{
		width:100%;
		z-index:50;
		
		background-color:#ffffff;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:column;
		flex-wrap:wrap;

		justify-content:flex-start;
		align-content:center/*flex-start*/;
		
		/*border:3px solid olive;*/		
	}
	
section ul#galerie-contenu
	{
		width:100%;
		z-index:50;
		
		background-color:#ffffff;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:space-around;
		align-content:flex-start;
		
		margin-top:1em;
		
		/*border:3px solid olive;*/		
	}
	
	

	/* 1 - GALERIE 3 PARTIES !!!!!!!!!!!!!!!! */
	
	

section ul#galerie-contenu li.galerie-3
	{
		width:31%;

		list-style-type:none;
		/*border-bottom: 1px solid #f15a24;*/
		
		background-color:#ffffff;
		
	}

section ul#galerie-contenu li.galerie-3 figure
	{
		width:100%;
		
		display:flex;
		flex-direction:column;
		flex-wrap:wrap;		
		align-self:stretch;
		
		justify-content:center;
		align-content:center;
	}
/*
section ul#galerie-contenu figcaption
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:0.9em;
		line-height:1.2em;
		color:#493a30;
		padding:0.5em 2.5em 1em 2.5em;
		margin-bottom:1em;
		
		text-align:center;

		width:100%;
	}
*/
	

section ul#galerie-contenu li.galerie-3 figure img
	{
		max-width:100%;
		height:auto;
		
		z-index:10;
		
		margin-left:auto;
		margin-right:auto;
	}


	/* 1 - GALERIE 4 PARTIES !!!!!!!!!!!!!!!! */
	
	

section ul#galerie-contenu li.galerie-4
	{
		width:48%;

		list-style-type:none;
		/*border-bottom: 1px solid #f15a24;*/
		
		background-color:#ffffff;		
	}

section ul#galerie-contenu li.galerie-4-cachedroite
	{
		display:none;
	}

section ul#galerie-contenu li.galerie-4-cachegauche
	{
		display:none;
	}

section ul#galerie-contenu li.galerie-4 figure
	{
		width:100%;
		
		display:flex;
		flex-direction:column;
		flex-wrap:wrap;		
		align-self:stretch;
		
		justify-content:center;
		align-content:center;
	}

section ul#galerie-contenu li.galerie-4 figure.invisibledroite
	{
		display:none;
	}
	
section ul#galerie-contenu li.galerie-4 figure.invisiblegauche
	{
		display:none;
	}

section ul#galerie-contenu /*li.galerie-4*/ figcaption
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:0.9em;
		line-height:1.2em;
		color:#493a30;
		padding:0.5em 2.5em 1em 2.5em;
		margin-bottom:1em;
		
		text-align:center;

		width:100%;
		
		/*border:2px solid green;*/
	}

span.numero-illu
	{
		font-weight:800;
		font-size:1.1em;
		color:#f15a24;
	}

span.textegris
	{
		/*font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:0.9em;
		line-height:1.2em;*/
		color:#a48c69;
	}	

section ul#galerie-contenu li.galerie-4 figure img
	{
		max-width:100%;
		height:auto;
		
		z-index:10;
		
		margin-left:auto;
		margin-right:auto;
	}




	
section ul#galerie-contenu li.galerie-4-bas
	{
		width:24%;
		height:6vh;

		list-style-type:none;
		
		background-color:#ffffff;	
	}	
	
	
/* --- GALERIE - GESTION POPUP CONTACT --- */

/**/
div.modal 
	{
        display: none;
        position: fixed;
        z-index: 90;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: auto;
        background-color: rgb(73, 58, 48);
        background-color: rgba(73, 58, 48, 0.7);
    }
	
div.modal-content 
	{
        margin: 5em auto;
        /*width: 40%;*/width: 80%;/*55*/
    }

div.contact-form h4.formulaire 
	{
        margin: 0 0 1em;
        font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:1.1em;
		line-height:1.2em;
		color: #545140;
    }
 
div.contact-form h5.formulairetxt 
	{
        margin: 0 0 1em;
        font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:0.9em;
		line-height:1.2em;
		color: #545140;
    }
 
div.contact-form p.formessage 
	{
        font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:0.9em;
		line-height:1.2em;
		color:#493a30;
        display: block;
        padding: 0 0 5px;
    }

div.contact-form form.formulaire-galerie 
	{
        padding: 1.5em;
        margin: 1.5em;
        box-shadow: 4px 4px 8px #545140;
		border-radius:10px;
        background: #e0dfdc;
    }
      
div.contact-form input
	{
        width: 100%;
        padding: /*0.8*/0.6em;
        margin-bottom: 1.2em;
        border: 1px solid #f15a24;
        outline: none;
    }

textarea.forgaltxt
	{
        width: 100%;
        padding: 0.8em;
        margin-bottom: 1.6em;
        border: 1px solid #f15a24;
        outline: none;
    }

div.contact-form button 
	{
        width: 100%;
        padding: 0.3em;
        border: none;
        background: #f15a24;
        font-size: 1em;
        font-weight: 400;
        color: #fff;
		border-radius:0 0 5px 5px;
    }
      
	  
div.contact-form button:hover 
	{
        background: #fcbf5f;
		color:#493a30;
    }
      
div.contact-form .close 
	{
        color: #f15a24;
        float: right;
        font-size: 2.2em;
        font-weight: 800;
    }
      
div.contact-form .close:hover,
div.contact-form .close:focus 
	{
        color: #fff;
        text-decoration: none;
        cursor: pointer;
    }
      
button.button 
	{
        background: #e0dfdc;
		border-radius: 4px;
        border:1px solid #f15a24;
        padding: 0.2em;
		padding-left: 0.5em;
		padding-right: 0.5em;
        font-size: 0.9em;
        cursor: pointer;
    }
      
button.button:hover 
	{
        color: #ffffff;
		background-color: #f15a24;
    }
/* --- FIN DU FORMULAIRE GALERIE ---*/












/* --- PAGE - CONTACT -   CONTENU --- */	







section#contact-top
	{
		width:100%;
		height:10vh;
		/*height:4.7em;*/
		z-index:50;
		
		background-image:url(images/Visuel_BG_page-interieur-4-pt.jpg);
		background-repeat:no-repeat;
		background-position:left-top;
		background-attachment:local;
		background-size: /*cover;*/contain;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;

		justify-content:space-around;
		align-content:flex-start;

		/*border:2px solid red;*/
	}	/*border:3px solid olive;*/		
	}
	
section#contact1
	{
		width:100%;
		z-index:50;
		
		background-color:#ffffff;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:column;
		flex-wrap:wrap;

		justify-content:center /*flex-start*/;
		align-content:center/*flex-start*/;
		
		/*border:3px solid olive;*/		
	}

article#contact-texte
	{
		width:70%;
		margin-right:auto;
		margin-left:auto;
		z-index:50;
		
		background-color:#ffffff;
		
		border-bottom:2px solid #f15a24;
				
	}
	
article#contact-texte h5
	{
		font-family: 'Architects Daughter', cursive;
		font-size:1.1em;
		line-height:1.6em;
		text-align:center;
		color:#545140;
		padding:1em 0em 1em 0em;		
	}

article#contact-texte h4
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:0.9em;
		line-height:1.2em;
		text-align:center;
		color:#493a30;
		padding:1em 0em 0em 0em;		
	}
	
article#contact-formulaire
	{
		width:100%;
		z-index:50;
		
		background-color:#ffffff;
		
		display:-ms-flexbox;
		display:flex;
		flex-direction:column;
		flex-wrap:wrap;

		justify-content:flex-start;
		align-content:center/*flex-start*/;
		
		/*border:3px solid blue;*/		
	}

article form.formulaire-contact
	{
		font-family: 'Mukta', sans-serif;
		font-weight:400;
		font-size:0.9em;
		line-height:1.2em;
		padding-top:1.5em;
		padding-bottom:1.5em;
		width:70%;
		margin-right:auto;
		margin-left:auto;
		
		/*border:2px solid violet;*/
	}	

article form.formulaire-contact p.info
	{
		text-align:center;
	}

form.formulaire-contact fieldset 
	{
		padding:10px;
		margin-bottom:5px;
		border:1px solid #a48c69;
		border-radius: 10px;
	 }
	 
form.formulaire-contact legend 
	{
		color:#a48c69;
		font-size:1.1em;
		font-weight:bold;
		padding-left:0.4em;
		padding-right:0.4em;
	 }	 
	 
form.formulaire-contact input, select, textarea
	{
		border:1px solid #545140;
		background-color:#e8e7e4;
		color:#545140;
		/*width:45%;*/
	}

form.formulaire-contact label
	{
		display:inline-block;
		width:50%; 
		text-align:right;
		padding: 0 0.8em 0.5em 0;
		
		/*border:2px solid violet;*/

	} 

form.formulaire-contact label:hover 
	{
		cursor: pointer; 
	}

form.formulaire-contact input:hover,
form.formulaire-contact input:focus,
form.formulaire-contact select:hover 
	{
		outline: 1px dotted #fe1f01;
			/* La propriété outline css ne réagissent pas comme les bordures, ces contours viennent au dessus de l'élément et n'interviennent pas dans la taille de l'élément. */
	}

/*-----------Gestion des champs obligatoires --------------- */

form.formulaire-contact input:required
	{
		/*font-weight:bolder;*/	
		border: 1px solid /*dotted*/#f15a24;

	}
	
form.formulaire-contact input:invalid
	{
		background-color: rgba(252, 191, 95, 0.5);
		border: 2px dotted #f15a24;
	}
/*	
input:valid 
	{
    background-color: #a48c69;
	}
*/
form.formulaire-contact input[type="submit"]
	{
		border:2px solid #f15a24;
		background-color:#e8e7e4;
		color:#545140;
		padding:0.5em;
		border-radius: 5px;
		font-weight:600;
		font-size:0.9em;
	}


form.formulaire-contact input[type="checkbox"] 
	{
		-webkit-appearance: none;
		-moz-appearance: none;
		-ms-appearance: none;
	}	

	
form.formulaire-contact input[type="checkbox"] 
	{
		border-radius: 4px;
		height: 1.2em;
		width: 1.2em;
		background: #e8e7e4;
		border: 2px solid #a48c69;
		vertical-align : -0.2em;
	}
	
form.formulaire-contact input[type="checkbox"]:checked 
	{
		background: #f15a24;
		border: 2px solid #545140;
		margin:0px;
		position: relative;
  /*&:before 
		{
		font-family: FontAwesome;
		content: '\f00c';
		display: block;
		color: grey;
		font-size: 13px;
		position: absolute;
		}*/
	}	

form.formulaire-contact input[type="submit"]
	{
		margin-bottom:6vh;
	}

form.formulaire-contact textarea
	{
		display:block;
		margin:auto;
		padding:auto;
		/*height: 10em;
		width:45%;*/
		/*border-radius: 8px 0 0 0;*/
		/*text-align:top;*/
		/*wrap:hard;*/
		/*display:block;*/
		overflow:auto;
		/*text-wrap:anywhere;*/
		/*overflow-wrap: anywhere;*/
	}

form.formulaire-contact textarea:hover,
form.formulaire-contact textarea:focus
	{
		outline: 1px dotted #fe1f01;
	}	
	
form.formulaire-contact textarea:required
	{
		/*font-weight:bolder;*/	
		border: 1px solid /*dotted*/#f15a24;

	}
	
form.formulaire-contact textarea:invalid
	{
		background-color: /*#fcbf5f*/rgba(252, 191, 95, 0.5);
		border: 2px dotted #f15a24;
	}