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


#points-intro {
	margin-left: 20px;
	margin-right: 20px;
	
	background-color: #999;
	border: 5px;
	border-color: #333;
	
	text-align: justify;
	
	margin-bottom: 40px;
	
}

#points-intro h3 {
	font-size: 18px;
	line-height: 100%;
	font-weight: 800;
	
	padding-top: 20px;
	padding-left: 20px;
	
	
	text-align: justify;
	
}


#points-intro p {
	font-size: 16px;
	line-height: 10%;
	
	text-align: justify;
	
}


#points-intro li {
	font-size: 16px;
	line-height: 120%;
	padding-left: 20px;
	padding-right: 20px;
	
}






/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
 
  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 1;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
}



dfn {
	font-style:normal;
	border-bottom: 2px dotted black;
}






navst{
	display: flex;
  margin-top:15px;
  background:#DAF7A6;
  
  width:250px;
  box-shadow:4px 4px 4px #3C3F35;
  border-radius:5px;
  margin-left:1%;

  position:sticky;
  position:-webkit-sticky;
  top:20px;
  height: 200px;
}

/******************************************************************************/

::selection {
  background: #B9FAF8;
/*  background: #e34114;*/
}

body, html {
	margin: 0;
	padding:0;
	background-color: #fff; /* #eee F9F9F9 */
	
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	
	font-smooth: auto;	

}

#pagecell {
	width: 70%;
	margin-left: auto;
	margin-right: auto;
	
	min-height: 200px;
	background-color: none;
	
	z-index: 1;
	

}

#container-topnav {
	
	left:0;
	top:0;
	height: 120px;
	background-color: none;
	
	  position: relative;

}


#container-story {
	/*    position: relative;
    display: flex;*/
}

#breadcrumb {
	height: 30px;
	padding-left: 0px;
}

#breadcrumb p{
	padding-top: 0px;
	
	font-size: 20px;
		font-style:italic;
}

#breadcrumb a{
	/*font-size: 18px;
	font-family: Arial, Helvetica, sans-serif;
	font-style:italic;
	color: #555;*/
	
	/*	font-family: 'EB Garamond', Times, serif;*/
	font: "Times New Roman", Times, serif;
	font-size: 18px; /* WAS 16*/
	color: #555;
	text-align:left;
	line-height: 190%; /* WAS  180*/
	/*margin-top: 10px;*/
	/*padding-left:20px;
	padding-right:20px;
	padding-bottom: 20px;*/
	
	text-decoration: none;
}
#breadcrumb a:hover{
	text-decoration: underline;
	
}



#breadcrumb em{
	font-size: 18px;
	text-decoration: underline;
	font-weight: 700;
	font-style:italic;
	color: #222;
}


/*#story-content {
	width: 100%;
	
	background-color: none;
	height:auto;
}
*/
#story-content a:link{
	color: #F94665;
	text-decoration:none;
	font-style: italic;

}

#story-content ref a:hover{
	text-decoration:underline;
}


#story-content ref a:visited {
	color: #F94665;

}

#topnav-logo {
	float: left;


	min-width: 100px;
	height: 10px;
	margin-top: 25px;
	margin-left: 120px;
}

#topnav-logo img{
	
	width: 200px;
}

#story-header {
	min-height: 100px;
	width: 95%;
/*	background-color:#F36;*/
	padding-left: 20px;
	padding-top: 20px;
}

#story-header h1{
	font-size: 40px;
/*	font-family: 'Playfair Display', serif;*/
font-family: Helvetica, sans-serif;
	font-weight: 900;
	font-style: italic;
	margin-bottom: 0px;
	color: black;
}

#story-header h2 {
	font-size: 22px;
/*	font-family: 'Playfair Display', serif;*/
font-family: Helvetica, sans-serif;
	color: #101010;
	line-height: 100%;
	font-weight: 400;
	font-style: italic;
	margin-top: 5px;
	padding-bottom: 30px;
}

#story-hero{
	margin-bottom: 40px;
}

#story-hero img{
	width: 100%;
}

#story-hero p{
	text-align:right;
	padding-right: 10px;
	margin-top: 10px;	
	margin-bottom: 15px;
	color: black;
}

#story {
	position:relative;
	float: left;
	width: 73%;
	/*background-color: blue;*/
	padding-left: 0;
	display: flex;
	
	
		margin-left: 2%;
	

}

#story-content {
	
	
	width: 100%;	
	
	

}

#story-al {
	position:relative;
	float: left;
	width: 70%;
	
	padding-left: 0;
	display: flex;
	

}


#story h2{
	/*font-family: 'EB Garamond', serif;*/
	font-family: Helvetica, sans-serif;
	font-size: 22px;
	color: black;
	margin-top: 50px;
	padding-left:20px;
	padding-right:20px;
	margin-bottom: 0;
	font-weight: 800;
}

#story p {
/*	font-family: 'EB Garamond', Times, serif;*/
	font: "Times New Roman", Times, serif;
	font-size: 18px; /* WAS 16*/
	color: #202020;
	text-align:left;
	line-height: 190%; /* WAS  180*/
	/*margin-top: 10px;*/
	padding-left:20px;
	padding-right:20px;
	padding-bottom: 20px;
	
	
	
	/*text-align: justify;*/
		
}

#story p strong {
	font-weight: 600;
		font-size: 18px; /* WAS 16*/
	color: #202020;
	text-decoration:underline;
	text-decoration-color: #f17b5b;
	text-decoration-thickness: 2px;
	text-underline-offset: 2px;
	font-style:italic;
}

 #story-content ul {
	margin-top: 0;
	margin-bottom: 0;
	margin-right: 50px;
	padding-top: 0;
	padding-bottom: 30px;
 }

 #story-content ul li{
	 	margin-left: 2%;
	 	font: "Times New Roman", Times, serif;
	font-size: 18px; /* WAS 16*/
	color: #202020;
	 
	 

 	list-style-type: square;
	
	list-style-position: inside;
	line-height: 200%;
	font-style: italic;
	
	margin-left: 40px;
	text-indent: -25px;
	
	padding-bottom: 12px;
	 
 }
 
  #story-content ul li strong{
		font-weight: 900;
  }

#story img {
	width: 100%;
}

#story-fig {
	width: 80%;
	
	height: auto;
	margin-top: 60px;
	margin-bottom: 60px;
	margin-left:auto;
	margin-right: auto;
	background-color:none;	
	
}

#projets-fig img{
	width: 100%;
	
	/*height: auto;*/
	margin-top: 60px;
	margin-bottom: 10px;
	margin-left:auto;
	margin-right: auto;
	background-color:none;	
	
}



#story-fig img, #projets-fig img {
	border-style: solid;
	border-color: #CCC;
	border-width: 1px;	
}

#story-fig-caption p{
	text-align: right;
	font-size: 10pt;
		 font-family: 'EB Garamond', serif;
	line-height: 100%;
		color: #444;
		padding-right: 0;
		font-style:normal;
		font-weight: 200;
}


#story-fig-caption it{
	text-align: right;
	font-size: 12pt;
		 font-family: 'EB Garamond', serif;
	line-height: 100%;
	font-style: italic;
	color: #222;
}

.story-encadre {
	min-height: 200px;
	
	overflow: auto;
	margin-left: 5%;
	margin-right: 12%;
	background-color: #FAF9F9;
	padding-top: 0px;
	
	
	margin-bottom: 40px;
	
	
	border-style: solid;
	border-width: 1px;
	border-color: #222;
	
	box-shadow: 20px 16px #f5a18a;
}


.story-encadre h2 {
	margin-top: 20px !important;
}


.story-encadre p {
	font-size: 14px !important;
	line-height: 180% !important;
	/*text-align: justify !important;*/
}


.story-encadre-pic-float {
	width: 30%;
	
	
	    float: right;


		margin-right: 30px;
		margin-left: 15px;
		margin-bottom: 30px;
		
		border-style: solid;
	border-width: 1px;
	border-color: #999;
}

.story-encadre-pic-float img{
	width: 100%;
	height: auto;
	
	margin: 0;
	pagging: 0;
	
	
}

#story-biblio {
width: 80%;
float: left;
margin-top: 40px;
	
}

#story-biblio p {
	font-size: 14px;
	line-height: 120%;
	
	padding-left: 30px;
	text-indent: -30px;
	
	margin-bottom: 10px;
	margin-top: 0;
	
	padding-bottom: 20px;
	
	
	
}
	
	
#story-biblio span {
	padding-right: 15px;	
}

#story-biblio p it {
	font-style: italic
	
}

#story-biblio a {
text-decoration:underline ;
	text-decoration-color: #904936;
	text-decoration-thickness: 2px;
	text-underline-offset: 1px;
}

#story-biblio a:hover {
	
	text-decoration:underline !important;
	text-decoration-color: #f17b5b!important;;
	text-decoration-thickness: 2px!important;;
	text-underline-offset: 2px!important;;

	
}

#story-biblio a:visited {
	color: #904936;
}

.desc p {
	font-size: 10px !important;
	padding: 10px 10px 15px 10px !important;
	
	
	margin: 0;
	pagging: 0;
}

/*

.story-encadre p{
	text-align: center !important;
	width: 30%;
}

.story-encadre em{
	font-weight: 800;	
}
*/





#container-story-nav {
	width: 25%;	

}

#story-nav {
	
	
	    position: relative;
    display: flex;
	
	padding-left: 1%;

	
 	width: 100%;
	/*background-color: yellow;*/
	margin-left: 1%;
	
	padding-left: 0px;
	
	
	 
	 
 position:sticky;
  position:-webkit-sticky;
  top:50px;
}

/*#story-nav {
	padding-left: 1%;


	width: 23%;
	background-color: yellow;
	margin-left: 1%;
	padding-left: 0px;
	
	 font-family: 'EB Garamond', serif;

  position:sticky;
  position:-webkit-sticky;
  top:20px;
}
*/

#story-nav-pdf {
	width: 100%;
	/*background-color:#69C;*/
	height: 40px;
}

#story-nav-pdf-langue {
	height: 40px;
	width: auto;
	/*background-color:#06C;*/
	float:left;
	top:0;
	padding-left: 10px;
	padding-right: 10px;
}

#story-nav-pdf-langue p{
	 font-family: 'EB Garamond', serif;
	font-size: 13px;
	color: #CCC;
	font-style: italic;
	
}

#story-nav-pdf-logo {
	width: auto;
	/*background-color:#05f;*/
	float: left;
}

#story-nav-pdf-logo img{
	width:23px;
	height: 29px;
	margin-top: 9px;
	
}

/*#story-nav-pdf-english p{
	float:left;
	min-width: 20px;
	text-align: left;
	position:relative;
	background-color:green;
}*/

/*#story-nav-pdf-english img{
	top:0;
	left:0;
	position:relative;
	width:26px;
	height: 25px;
	float: left;
}*/

#story-nav-items {
	margin-top: 100px;		/*un peu crad*/
	min-width: 70%;
	
}

#story-nav-item {
	border-style: solid none none none;
	border-width: 1px 0 0 0; 	
	border-color: black;
}

#story-nav-item-last {
	border-style: solid none solid none;
	border-width: 1px 0 1px 0; 	
	border-color: black;
}

#story-nav-items p{
	
	margin: 0px;
	padding:14px 0 11px 10px;
	
	
	
	  	
	color: #333;
	
	/*font: "Times New Roman", Times, serif;*/
	font-family: Helvetica, sans-serif;
	font-weight:700;
	
	
	font-size: 14px; /* WAS 16*/
	line-height: 140%;
	
	
}

#story-nav-items a:link{
	text-decoration: none;
}

#story-nav-items a:visited{
	text-decoration: none;
}

#story-nav-items p:hover{
	background-color:#f17b5b;
/*	background-color: #30b283;*/
	text-decoration: underline;
}
/*
#story-nav-item a:visited {
	text-decoration: none;
}

*/

#story-nav ul {
	padding-top: 0px;
	padding-left: 0px;

}

	
#story-nav li {
	position:relative;
	min-height: 40px; /* 40px*/
	
  list-style-type: none;
	
	border-top: 1px solid #CCC;
}
	

#story-nav last li{
	border-bottom: 1px solid #CCC;
}

		
#container-footer {
	
	margin: 0;
	
	width: 100%;
	height: 120px;
	/*background-color: red;*/	
	
	font-family: 'EB Garamond', serif;
	
	
	margin-bottom: 120px;
	
}




#container-footer-short {
	position: fixed;
	bottom: 0;
	margin: 0;
	
	width: 100%;
	height: 120px;
	/*background-color: red;	*/
	
	font-family: 'EB Garamond', serif;
	
}

#container-footer h1, #container-footer-short h1{
	font-size: 16px;
	margin-bottom: 0;
	color: #444;
}

#container-footer h2, #container-footer-short h2{
	font-size: 14px;
	margin-top: 0px;
	color: #777;
}

#container-footer a, #container-footer-short a{
	font-size: 17px;
	margin-bottom: 0;
	color: #09C;
	font-weight: 800;
	text-decoration:none;
}

#footer-left {
	float: left;
	width: 200px;
	/*background-color:#9F0;*/
	padding-left: 5%;
}

#footer-middle {
	float: left;
	min-width: 45%;
	/*background-color: #360;*/
}

#footer-right {
	float: right;
	width: 30%;
/*	background-color: #699;*/
}



.intro-section {
		padding-bottom: 80px;
}

.intro-section p{
	f/*ont-family: 'EB Garamond', serif;*/
	font: "Times New Roman", Times, serif;
	font-size: 18px;
	color: #101010;
	text-align:left;
	line-height: 180%;
	margin-top: 20px;
	padding-left:20px;
	padding-right:20px;
	
	text-align: justify;
	
}

.intro-section li{
	f/*ont-family: 'EB Garamond', serif;*/
	font: "Times New Roman", Times, serif;
	font-size: 18px;
	color: #101010;
	text-align:left;
	line-height: 100%;
	margin-top: 20px;
	padding-left:0px;
	padding-right:60px;
	margin-left: 40px;
	
}

.intro-section ul p{
	 list-style-type: circle;
}


#auteurs {
	height: 120px;
	margin-top: 0px;
	padding-top: 0;	
	padding-bottom: 0;
}

#auteurs p {
	font-style: italic;
	text-align: right;
	line-height: 100%;
}


#container-list-wide {
	width: 100%;	
}

#list-wide {
	width: 100%;	
}

#list-wide img{
	width: 100%;
	
	height: 130px;
	
	
}



#list-wide h2{
		
	/*
	font-family: Helvetica, sans-serif;
	font-size: 18px;
	color: black;
	padding-top: 5px;
	padding-bottom: 0px;
	padding-left: 15px;
	
	
	margin-bottom: 0;
	font-weight: 800;*/
}


#list-wide p{
	/*font: "Times New Roman", Times, serif;
	font-size: 16px;
	color: #101010;
	text-align:left;
	line-height: 140%;
	*/
	
	
	/*
	padding-top: 0;
	
	margin-top: 2px;
	
	padding-left:20px;
	padding-right:20px;
	*/
	

	

	
	}

/*#list-wide*/

 .list-element hr {
	display: block;
			width:99%;
	
	border-color: #333;	
	color:#333;
	
	margin: 0;
	
	 border-style:ridge;
	
	  border-width: 1px;
}

#list-wide hr {
	margin: 0;
	padding: 0;
}


.list-element-equipe hr {
	display: block;
			width:99%;
	
	border-color: #999;	
	color:#999;
	
	margin: 0;
	 border-style:ridge;
	
	  border-width: 1px;
}

#hr hr {
	position: relative;
	float: left;

	display: block;
			width:95%;
	
	border-color: #D7D7D7;	
	
	
	margin: 0;
	 border-style:ridge;
	
	  border-width: 1px;
}





.list-element {
	
	display: block;
	width: 100%;
	height: 130px;
	background-color: none;
	
	border-style: solid;
	border-color: #D7D7D7;
	border-width: 2px 0px 2px 0px;
	border-bottom: thick;
	
	
}

.list-element:hover{
	
	/*background-color: #B9FAF8;	*/
	background-color: #CCC;	
	
}

.list-element h2, .list-element h2 a{
font-family: Helvetica, sans-serif;
	font-size: 18px;
	color: black;
	padding-top: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
	
	
	margin-top: 0;
	margin-bottom: 0px;
	font-weight: 800;*/

}
.list-element a {	
	text-decoration: none;
}


.list-element p{
	font: "Times New Roman", Times, serif;
	font-size: 16px;
	color: #101010;
	text-align:left;
	line-height: 180%;
	
	margin-top:0;
	
		padding-left: 40px;
	/*padding-right: 40px;*/
	padding-bottom: 5px;
	
	padding-right: 60px;
	
	
	
	
	 text-align: justify;
  text-justify: inter-word;

	
}











.list-element-equipe {
	
}




.list-image {
	
	float: right;
	left: 0;
	top:0;
	
	width: 20%;
}


.list-description {
	position: relative;
	float: left;
	right: 0;
	
	width: 80%;
	background-color: none;	
	height: 120px;
	
	
}

.list-description h2 {
	padding-left: 30px;
}


#list-description-equipe {
	position: relative;
	float: right;
	right: 0;
	
	width: 100%;
	background-color: none;	
	
	
}





.list-description-equipe {
	font: "Times New Roman", Times, serif;
	font-size: 16px;
	color: #101010;
	text-align:left;
	line-height: 180%;
	
	
}

.list-equipe-separateur {
		background-color: #f17b5b;
}

.list-equipe-separateur h2 {
	color: black; 
}


#list-equipe{
	width: 90%;
}



#list-equipe h2 {
font-family: Helvetica, sans-serif;
	font-size: 20px;
	color: black;
	padding-top: 30px;
	padding-bottom: 0px;
	padding-left: 40px;
	
	
	margin-top: 0;
	margin-bottom: 10px;
	font-weight: 800;
}

#list-equipe span {
font-family: Helvetica, sans-serif;
	font-size: 18px;
	color: #555;
	padding-top: 5px;
	padding-bottom: 0px;
	padding-left: 0;
	font-style:none;
	
	
	margin-bottom: 0;
	font-weight: 800;
}

#list-equipe p{
	font: "Times New Roman", Times, serif;
	font-size: 18px;
	color: #101010;
	text-align:left;
	line-height: 190%;
	
	padding-left: 40px;
	/*padding-right: 40px;*/
	padding-bottom: 5px;
	
	padding-right: 60px;
	
	
	
	
	 text-align: left;
/*  text-justify: inter-word;*/

	
}

#social {
	width: 100%;
	margin-top: 40px;
	margin-bottom: 60px;	
	

}

#social a{
	font-size: 18px;
	color: #09C !important;
	text-align:left;
	line-height: 100%;
	font-style: normal !important;
	
	padding:0;
	padding-left: 50px;
	
	
}

#social a:hover {
	text-decoration: underline;
	color: #09C;	
}


#equipe-tags {
	top:0;
	min-height: 40px;
	overflow: visible;
	width: 80%;
	background-color: /*blue*/;
	padding-left: 40px;
	padding-bottom: 0;
	margin-bottom: 30px;
}

#equipe-tags p {
	
	font-family: Helvetica, sans-serif;
	font-size: 16px;
	color:#1DB2A8;
	color: #f17b5b;
	text-align:left;
	line-height: 120%;
	font-style:italic;
	margin: 0;
	padding: 0 10px 0 0;
	float: left;
	
	/*text-decoration: none;*/
}
	
	
	
	
	
/*@media screen and (max-width: 1025px) {
#pagecell {
	position: relative;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	background-color: red;
}

#container-story {
	width: 90%;
	}
	
	
#story-al  {
	width: 100%;
	background: blue;
}

#story {
	position:relative;
	float: left;
	width: 100%;
}
#story-fig {
	width: 95%;
	
	height: auto;
	margin-top: 50px;
	margin-left:auto;
	margin-right: auto;
	background-color:black;	
	padding-left: 0;
}
	#story-nav {
	    display: none;
	}
}


@media (-webkit-min-device-pixel-ration: 1.1) {
#pagecell {
	position: relative;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: green;
}

#story {
	position:relative;
	float: left;
	width: 100%;
}
#story-fig {
	width: 95%;
	
	height: auto;
	margin-top: 50px;
	margin-left:auto;
	margin-right: auto;
	background-color:black;	
	padding-left: 0;
}
	#story-nav {
	    display: none;
	}
}*/