/*-------------------------------------------------------------------------------------------------*/
/*                                           Gallery-specific Styles		                       */
/*-------------------------------------------------------------------------------------------------*/
 * {
	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: #224466;*/
}
figure {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: space-around;
	overflow: hidden;
	margin: auto;
	/*background-color: #ff0000;*/
}
.items--big {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	align-content: center;
	position: absolute;
	width: 100%;
	pointer-events: none;
	overflow: hidden;
	/*background-color: #ff0000;*/
}
	/*------------------------------------------------------------------------------------------------------------------------------------------------------*/
.item--big {
	position: absolute;
	width: 100%;
	opacity: 0;
	color: white;
	font-size: clamp(0.6rem, 1vw, 1.5rem);
	overflow: hidden;
	aspect-ratio: 3 / 2;
	/*background-color: #000000;*/
}
.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: 32%;
}
.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;
	left: 64%;
}
.controls_grid {
	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;
	left: 48%;
}

.control,
.grid,
.fs-toggle {
	width: .66em;
	height: .66em;
	text-align: center;
	line-height: .5em;
	cursor: pointer;
	display: inline-block;
}

/*.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)
	}
}