/* slideshox apge index */ 
 
.slideshow-container .mySlides {display: none;}

/* Slideshow container */
.slideshow-container {
  max-width: 1500px;
  position: relative;
  margin: auto;
}

/* Caption text */
.slideshow-container .text {
	position: absolute;
	max-width:400px;
	top: 20%;
	font-size: small;
	color: rgb(225,225,225);
	background-color: rgba(100,100,100,0.70);
	padding-bottom: 8px;
}

.text_50 {
	background-color: rgba(100,100,100,0.5);
}

.text_80 {
	background-color: rgba(100,100,100,0.8);
}

.text_90 {
	background-color: rgba(100,100,100,0.9);
}

.slideshow-container .text_gauche {
	left: 35px;
}
.slideshow-container .text_droite {
	right: 35px;
}

.slideshow-container .text_titre{
	color: #ffffff;
	border-bottom: 1px solid white;
	width: 100%;
	font-size: xx-large;
}

.slideshow-container .text_lien{
	color: #ffffff;
	background-color: rgba(0,0,0,0.4);
	width: max-content;
	margin-left: 10px;
	margin-right: 5px;
	padding: 3px 10px;	
	border-radius: 5px;
}

.slideshow-container .text_lien a{
	text-decoration: none;
	color:inherit;
}
.slideshow-container .text_lien a:hover{
	color: rgba(255,0,0,0.5);	
}

.slideshow-container .text div {
	padding: 8px 25px 8px 15px;
}


/* The dots/bullets/indicators */
.slideshow-container .dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: var(--color-primary-l2); /*#bbb;*/
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
  position: relative;
}

.slideshow-container .dot.active {
  /*background-color: #717171;*/
  background-color: var(--color-primary-d2); /* #FCDB7E;*/
}

/* Fading animation */
.slideshow-container .fade {
  animation-name: fade;
  animation-duration: 2.5s;
}


@keyframes fade {
  from {opacity: .2} 
  to {opacity: 1}
}
    


/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .text {font-size: 11px}
}


/* Number text (1/3 etc) */
.slideshow-container .numbertext, .navGauche, .navDroit {
	color: #f2f2f2;
	position: absolute;
	background-color: rgba(0,0,0,0.4);
}

.slideshow-container .numbertext {
	font-size: 12px;
	padding: 8px 10px;
	bottom: 19px;
	font-weight: bolder;
	margin-left: 48%;
	text-align: center;
	position: absolute;
}

/* flèches */
.slideshow-container .navGauche, .navDroit{
	width: 100%;
	width: 30px;
	padding-top: 15px;
	padding-bottom: 15px;
	text-align: center;
	top: 40%;
	z-index: 100;
	cursor: pointer;
}
.slideshow-container .navGauche {
	left:0;
}
.slideshow-container .navDroit{
	right: 0;
}