/*------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*                                                                   Gallery-specific Styles                 ok                                         */
/*------------------------------------------------------------------------------------------------------------------------------------------------------*/
 * {
	margin: 0;
	padding: 0;
	list-style: none;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#gallery-container {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	color: #808080;
	width: 100%;
	height: 92vh;
	font-size: clamp(0.8rem, 1.2vw, 1.8rem);
	position: relative;
/*	background-color: #778855*/
}
figure { 
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: space-around;
	overflow: hidden;
	margin: auto;
}
/*------------------------------------------------------------------------------------------------------------------------------------------------------*/
.items--big {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	position: absolute;
	width: 100%;
	pointer-events: none;
	overflow: hidden;
}
/*------------------------------------------------------------------------------------------------------------------------------------------------------*/
.item--big {
	position: absolute;
	width: 100%;
	opacity: 0;
	color: white;
	font-size: clamp(0.6rem, 1vw, 1.5rem);
	overflow: hidden;
}
/*------------------------------------------------------------------------------------------------------------------------------------------------------*/
.item--bigv {
	position: absolute;
	width: 44%;
	opacity: 0;
	/*background-color: #808080;*/
	color:white;
	font-size: clamp(0.6rem, 1vw, 1.5rem);
}
.controls {
	text-align: center;
	font-size: clamp(0.6rem, 1vw, 2.5rem);
	opacity: 0;
	pointer-events: none;
	-webkit-transition: opacity .3s ease;
	transition: opacity .3s ease;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}
.controls_left {
	text-align: center;
	font-size: clamp(0.6rem, 1vw, 2.5rem);
	opacity: 0;
	pointer-events: none;
	-webkit-transition: opacity .3s ease;
	transition: opacity .3s ease;
	position: absolute;
	bottom: 0;
	left: 30%;
}
.controls_right {
	text-align: center;
	font-size: clamp(0.6rem, 1vw, 2.5rem);
	opacity: 0;
	pointer-events: none;
	-webkit-transition: opacity .3s ease;
	transition: opacity .3s ease;
	position: absolute;
	bottom: 0;
	left: 70%;
}
.controls_grid {
	text-align: center;
	font-size: clamp(0.6rem, 1.1vw, 2.5rem);
	opacity: 0;
	pointer-events: none;
	-webkit-transition: opacity .3s ease;
	transition: opacity .3s ease;
	position: absolute;
	bottom: 0;
	left: 50%;
}
.control,
.grid,
.fs-toggle {
	width: .66em;
	height: .66em;
	text-align: center;
	line-height: .5em;
	cursor: pointer;
	display: inline-block;
/*	margin-right: 10px;*/
}
.showControls,
.showControls_left,
.showControls_right,
.showControls_grid {
	opacity: 1;
	pointer-events: auto;
	-webkit-transition: opacity .6s 1s ease;
	transition: opacity .6s 1s ease
}
.hideControls,
.hideControls_left,
.hideControls_right,
.hideControls_grid {
	opacity: 0;
	pointer-events: none;
}
.icon-grid,
.icon-arrow-left,
.icon-arrow-right {
	display:inline-block;
	width: 20%;
	height: 10%;
	color: rgb(250,250,250);
	background-repeat: no-repeat;
}
.icon-grid {
	color: rgb(250,250,250);
}
.icon-arrow-left {
	color: rgb(250,250,250);
}
.icon-arrow-right {
	color: rgb(250,250,250);
}
.fs-toggle {
	display: none;
}
/* affichage image suite clic vignette */
.fadeInScaleUp {
	-webkit-animation: fadeInScaleUp .5s ease-out .6s forwards;
	animation: fadeInScaleUp .5s ease-out .6s forwards;
	z-index: 25
}
/* affichage image */
@keyframes fadeInScaleUp {
	from	{
		opacity: 0;
		-webkit-transform: scale(1);
		transform: scale(1) 
	}
	to	{
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1) 
	}
}
@-webkit-keyframes fadeInScaleUp {
	from	{
		opacity: 0;
		-webkit-transform: scale(1);
		transform: scale(1) 
	}
	to	{
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}
/* ne pas supprimer code ci-dessous */
.scaleDownFadeOut {
	-webkit-animation: scaleDownFadeOut .4s ease-in forwards;
	animation: scaleDownFadeOut .4s ease-in forwards;
	pointer-events: none
}
@keyframes scaleDownFadeOut {
	0%	{
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
	99%	{
		opacity: 0;
		-webkit-transform: scale(1);
		transform: scale(1) 
	}
	100%	{
		opacity: 0;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}
@-webkit-keyframes scaleDownFadeOut {
	0%	{
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
	99%	{
		opacity: 0;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
	100%	{
		opacity: 0;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}
@keyframes scaleUpFadeIn {
	0%	{
		opacity: 0;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
	1%	{
		opacity: 0;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
	100%	{
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}
@-webkit-keyframes scaleUpFadeIn {
	0%	{
		-webkit-transform: scale(1);
		transform: scale(1)
	}

	1%	{
		opacity: 0;
		-webkit-transform: scale(1);
		transform: scale(1)
	}

	100%	{
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1)
	}
}