html {
	  scroll-behavior: smooth;
	}
	
	@import url('https://fonts.googleapis.com/css?family=Open+Sans');
	@import url('https://fonts.googleapis.com/css?family=Montserrat');
	body {
	  margin: 80px;
	  font-family: 'Montserrat', sans-serif;
	  background-color: #F0FFF0;
	  
	}

		
	* {
	  color: #1c1c1c;
	}
	
    .thumbnails {
        display: flex;
        flex-wrap: wrap;
        justify-content: left;
    }

	.thumbnail {
	  display: block;
	  margin: 10px;
	  position: relative;
	  overflow: hidden;
	  box-shadow: 0px 0px 12px 1px rgba(0, 42, 0, 0.3);
	  transition: height 0s 0s;
	  border: 2px solid transparent;
	}

	.thumbnail:hover {
	  border-color: lime;
		  transition-delay: 0.2s;
	  height: 105%;
	}

	.thumbnail:hover {
	  border-color: darkgreen;
	  transition-delay: 0.2s;
		  box-shadow: 0px 0px 1px 1px rgba(0, 42, 0, 0.3);
	}
   
 
	a#lien-important {
	  font-size: 1.2em;
	}
	.tooltip {
		z-index:100;
	  position: relative;
	  border-bottom: 1px dotted #000;
	}

	.tooltip img {
	  display: none;
	  position: absolute;
	  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
	  top: 22px;
	  left: 0;
	  width: 250px !important;
	  height: 247px;
	}

	.tooltip:hover img {
	  display: block;
	}
	h1 {
	  text-align: center;
	}
	
	
#texte a {
  text-decoration: none;
  background-color:#e0ffe0;
  font-weight: bold;
}

 #texte a:hover {
    background-color:#c1ffc1;
    color: #000;
	font-weight: bold;
	
	}
	
#autre	a {
	    background-color: #f8f8f8;
	    border: 1px solid #ccc;
	    padding: 5px 10px;
	    text-decoration: none;
	}
#autre	a:hover {
	    background-color: #ccc;
	    color: #fff;
	}
	
	.rien {
	
	font-style: italic; 
	opacity: 0.8; 
	margin: 0 150px;
	
	}
	

	.citation {
	  border: 2px solid #0f0f0f;

	  background-color: #454653;
	  padding: 20px;
	  font-family: Söhne,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif,Helvetica Neue,Arial,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
	  
		
		text-opacity: 1;
		 color: #fff !important;
	}
	.citation p {
	  color: #fff;
	  padding-left: 80px;
	  padding-top: -80px;
	}
	.citation strong {
	    color: #fff;
		font-weight: bold;
	}
	.citation svg {
		filter: invert(100%);
		background-color: #9E617C;
		padding:4px;
	  top: 0;
	  left: 0;
	}
	
	.signature {
	 text-align: right;
font-weight: bold;
	  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
	  font-style: italic;
	}
	
	
	.language-switcher {
	  display: flex;
	  justify-content: right;
	  margin-bottom: 20px;

	}

	.language-link {
	 /*  display: inline-block;*/
	  display: flex;
	   align-items: center; 
	  margin: 0 10px;
	  text-decoration: none;
	   font-weight: bold;
		transition: font-size 0.2s ease-in-out;
	   transition: text-shadow 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
	}

	.language-link img {
	  width: 46px;
	  height: 32px;
	  border: none;
	  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
	  transition: box-shadow 0.2s ease-in-out;
	}
	.language-link img:hover {
	  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
	}
	
	

	
	.language-link span {
	  line-height: 32px; /* ajustez en fonction de la hauteur de votre drapeau */
	  transition: text-shadow 0.2s ease-in-out;
		transition: font-size 0.2s ease-in-out;
	  
	}
	.language-link span:hover{
	  line-height: 32px; /* ajustez en fonction de la hauteur de votre drapeau */
	  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
  	-webkit-text-stroke: 1px silver;
  	-webkit-text-fill-color: white;
		font-size: 1.3em;
	  color: white; 
	  
	}
	.language-link:hover img {
	  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
	}

	.language-link:hover span {
	  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
  	-webkit-text-stroke: 1px silver;
  	-webkit-text-fill-color: white;
		font-size: 1.3em;
	  color:white;
	}
	
	
	
	@media screen and (max-width: 600px) {
	
  	body {
  	  margin: 30px;
  	  font-family: 'Montserrat', sans-serif;
  	  background-color: #F0FFF0;
	  	}
		

		  .thumbnail {
		  display: block;
		  margin: 5px;
		  height: 100px!important;
		  width: 100px;
overflow: hidden;
			
	  }

		.thumbnail img {
    max-width: 100%;
		
			  object-fit: cover;
  object-position: center center;
  }
		
		.citation {
		  border: 1px solid #0f0f0f;

		  background-color: #454653;
		  padding: 5px;
		  font-family: Söhne,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif,Helvetica Neue,Arial,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
	  
		
			text-opacity: 1;
			 color: #fff !important;
		}
		.citation p {
		  color: #fff;
		  padding-left: 54px;
		   padding-right: 5px;
		  top: -80px;
		}
		.citation strong {
		    color: #fff;
			font-weight: bold;
		}
		.citation svg {
			filter: invert(100%);
			background-color: #9E617C;
			padding:2px;
		  top: 0;
		  left: 0;
		}
		
		
		.tooltip img {

	
		  height: 74px;
		}
	}