body, html,div,p,h1,h2,h3,h4,h5,h6  {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body, html  {
	color:#ddd;
	 font-size:1.1em;
	width:100%;
	background-color:#000;
 font-family: Arial, sans-serif;
 font-family:Georgia, "Times New Roman", Times, serif;
/*
	 font-family: 'Playfair Display', serif; 
	 font-family:"Baskerville Old Face";
 */
}
html {
  height: 100%;
 scroll-behavior: smooth;}
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;

}
h1{
	font-family: 'Playfair Display', Georgia, serif; 
	 font-size:3em;
}
h2{
	font-family: 'Playfair Display', Georgia, serif;
    font-size:1.5em;
}
#titre{
	float:right;
	height:40px;
/*	border:1px solid red;
*/}

/*********************************************************
          Header
*******************************************************/
#header{
	height:80px;
	width:100%;
  	border-bottom:2px #333  solid;
    top:0;
	position:sticky;
	z-index:9999;
	background-color:#000;
}
#header h1,h2{
	margin:0 10px;
	text-align:center;
}
#header img{
	z-index:10;
}
/*********************************************
  bloc left & right
  *******************************************/
#bloc_left, #bloc_right{
	position:absolute;
	width:10%;
/*	heigh:70px;
	max-height:70px;
*/	max-height:50%;

	font-size: 12px;
	line-height: 18px;
	text-align:justify;
	margin:2px;
	z-index:0;
	overflow:hidden;
	padding:5px;
}

#bloc_right{
	right:0;
	background-color: #036;
/*	display:none;
*/}
#bloc_left{
justify-contener:center;
	background-color: #663300;
	text-align:center;
	left:0;
/*	height:auto;
	margin:0 auto;
	z-index:0;
	border:1px yellow solid;
	overflow:hidden; *//* redimensionement */
	}
#bloc_left img{
/*position:relative;
top:10px;
*/	width:50px;
	height:50px;
	padding:0 0 10px 0 ;
	}
/*********************************************************
          Corp
*******************************************************/
#corp
{ flex: 1;
/*	overflow:hidden;
	height:100%;
*/ }

.titre{
	margin:10px;
	padding:0;
	text-align:left;
	color:white;
	font-size:20px;
	cursor:pointer;
}

#text_presentation{
/*	min-height:100px;
*/	border:1px dotted #444;
	margin:15px 0;
	line-height:25px;
	font-size:.9em;
	text-align:justify;
}
#titre_presentation{
/*	min-height:100px;
*/	border:1px dotted #444;
	text-align:center;
	margin:15px 0;
	line-height:25px;
	font-size:1.2em;
	color: #fff;
	font-variant:small-caps;/* majuscules */
}
#bt_switch, #langPage{/*Bt On/Off Menu*/
 	position: absolute; 
    font-size:1.1em;
	cursor:pointer;
	line-height:80px;
	text-align:center;
	padding-left:15px;
	font-family:Arial, Helvetica, sans-serif;
} 	 
#langPage{
	left:100px;
}

/***********************************************/
/*  Corp                                         */
/***********************************************/
.cadre_diapo{
	position: relative;
	width:80%;
/*	width:100%;	height:auto;
*/	margin:0 auto;
	padding-bottom:20px;
	overflow:hidden; /* redimensionement */
	z-index:0;
/*	border:1px yellow solid;
*/	}
.cadre_diapo img{
	width:100%;
	max-height:30%;
	overflow:hidden;
	z-index:10;
/*	border:1px red solid;
	margin:2px;
padding:2px 1px ;*/
	}

/***********************************************/
/* liste horizontale des images              */
/***********************************************/
#centerImag{
	width:100%;
}
.navigation_diapo{
	width:100%;
	margin:auto;
/*	margin-top:3px;
	border:1px green solid;
*/}
.navigation_diapo img{
	width:70px;
	margin:0 1px auto;
	border: 1px solid #999;
/*	box-shadow:0 0 5px hsla(0,0%,0%,.4);
*/	}
.description{position:relative;}

.description span{
	position:absolute;
	left:0;
	justify-content: center;
	top:1%; 
	font-size:75%;
	display:flex;
	padding:.5rem;
	color:#eee;
	background:hsla(0,0%,0%,.35)
	}

/************************************************
         Zones occurence menu principal 
************************************************* ****/
.ancre{
	position:relative;
	top:0;
	border-bottom:1px dashed #666;
	font-size:14px;
	min-height: 20px;
  	display: block;        /* par défaut pour div, mais explicitement */
  	width: 100%;           /* prend toute la largeur du parent */
 	margin-bottom: 10px;   /*  espace entre les sections */
 	box-sizing: border-box; /* inclut padding dans la largeur */
	border:2px red dotted;
}

/* =========================
   FOOTER
========================= */
#footer {
  height: 80px;
  line-height: 80px;
  border-top: 1px solid #666;
  font-size: 0.8em;
  text-align: center;
  color: #eee;
}

#footer a img {
  height: 25px;
	float:right;
	width:auto;
}