/* Image galleries */
.gallery {
	--thumbs-default-height: 3em;
	--thumbs-full-height: 220px;
	padding-top: 0.5em;
}

.gallery .per-media > * {
	display: none;
}

.gallery #main {
	margin-bottom: calc(var(--thumbs-default-height) + 1em);
}

.gallery #main article img {
	display: block;
	margin: 0 auto;
	max-width: 100%;
}

.gallery #thumbs {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	height: var(--thumbs-full-height);
	max-height: var(--thumbs-default-height);
	max-width: 100%;
	background-color: rgba(0, 0, 0);
	opacity: 0.8;
	transition: max-height 1s ease 1s, opacity 0.3s ease 1s;
	padding: 0 0.5em;
	overflow: hidden;
}

.gallery #thumbs > ol {
	display: flex;
	justify-content: safe center;
}

.gallery #thumbs:hover {
	max-height: var(--thumbs-full-height);
	opacity: 1;
	transition: max-height 1s, opacity 0.3s;
	overflow: auto hidden;
}

.gallery #thumbs:hover h1 {
	display: none;
}

.gallery #thumbs:hover #back {
	display: block;
}

.gallery #thumbs img {
	margin-top: 0.5em;
	max-width: 150px;
	max-height: calc(var(--thumbs-full-height) - 1em);
}

.gallery #thumbs li figcaption {
	position: absolute;
	display: block;
	right: 0;
	bottom: 0;
	left: 0;
	height: 1.8em;
	min-width: 100%;
	text-align: center;
	background-color: rgba(0, 0, 0, 0.5);
	color: white;
	padding: 0.2em 0 1em 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.gallery #thumbs li figcaption:hover {
	overflow: visible;
	right: auto;
	z-index: 1;
}

.gallery #thumbs li {
	position: relative;
}
.gallery #thumbs li + li {
	margin-left: 0.5em;
}

.gallery > #m1:target ~ .per-media > :nth-child(1),
.gallery > #m2:target ~ .per-media > :nth-child(2),
.gallery > #m3:target ~ .per-media > :nth-child(3),
.gallery > #m4:target ~ .per-media > :nth-child(4),
.gallery > #m5:target ~ .per-media > :nth-child(5),
.gallery > #m6:target ~ .per-media > :nth-child(6),
.gallery > #m7:target ~ .per-media > :nth-child(7),
.gallery > #m8:target ~ .per-media > :nth-child(8),
.gallery > #m9:target ~ .per-media > :nth-child(9),
.gallery > #m10:target ~ .per-media > :nth-child(10),
.gallery > #m11:target ~ .per-media > :nth-child(11),
.gallery > #m12:target ~ .per-media > :nth-child(12),
.gallery > #m13:target ~ .per-media > :nth-child(13),
.gallery > #m14:target ~ .per-media > :nth-child(14),
.gallery > #m15:target ~ .per-media > :nth-child(15),
.gallery > #m16:target ~ .per-media > :nth-child(16),
.gallery > #m17:target ~ .per-media > :nth-child(17),
.gallery > #m18:target ~ .per-media > :nth-child(18),
.gallery > #m19:target ~ .per-media > :nth-child(19),
.gallery > #m20:target ~ .per-media > :nth-child(20),
.gallery > #m21:target ~ .per-media > :nth-child(21),
.gallery > #m22:target ~ .per-media > :nth-child(22),
.gallery > #m23:target ~ .per-media > :nth-child(23),
.gallery > #m24:target ~ .per-media > :nth-child(24),
.gallery > #m25:target ~ .per-media > :nth-child(25),
.gallery > #m26:target ~ .per-media > :nth-child(26),
.gallery > #m27:target ~ .per-media > :nth-child(27),
.gallery > #m28:target ~ .per-media > :nth-child(28),
.gallery > #m29:target ~ .per-media > :nth-child(29),
.gallery > #m30:target ~ .per-media > :nth-child(30),
.gallery > #m31:target ~ .per-media > :nth-child(31),
.gallery > #m32:target ~ .per-media > :nth-child(32),
.gallery > #m33:target ~ .per-media > :nth-child(33),
.gallery > #m34:target ~ .per-media > :nth-child(34),
.gallery > #m35:target ~ .per-media > :nth-child(35),
.gallery > #m36:target ~ .per-media > :nth-child(36),
.gallery > #m37:target ~ .per-media > :nth-child(37),
.gallery > #m38:target ~ .per-media > :nth-child(38),
.gallery > #m39:target ~ .per-media > :nth-child(39),
.gallery > #m40:target ~ .per-media > :nth-child(40),
.gallery > #m41:target ~ .per-media > :nth-child(41),
.gallery > #m42:target ~ .per-media > :nth-child(42),
.gallery > #m43:target ~ .per-media > :nth-child(43),
.gallery > #m44:target ~ .per-media > :nth-child(44),
.gallery > #m45:target ~ .per-media > :nth-child(45),
.gallery > #m46:target ~ .per-media > :nth-child(46),
.gallery > #m47:target ~ .per-media > :nth-child(47),
.gallery > #m48:target ~ .per-media > :nth-child(48),
.gallery > #m49:target ~ .per-media > :nth-child(49),
.gallery > #m50:target ~ .per-media > :nth-child(50),
.gallery > #m51:target ~ .per-media > :nth-child(51),
.gallery > #m52:target ~ .per-media > :nth-child(52),
.gallery > #m53:target ~ .per-media > :nth-child(53),
.gallery > #m54:target ~ .per-media > :nth-child(54),
.gallery > #m55:target ~ .per-media > :nth-child(55),
.gallery > #m56:target ~ .per-media > :nth-child(56),
.gallery > #m57:target ~ .per-media > :nth-child(57),
.gallery > #m58:target ~ .per-media > :nth-child(58),
.gallery > #m59:target ~ .per-media > :nth-child(59),
.gallery > #m60:target ~ .per-media > :nth-child(60),
.gallery > #m61:target ~ .per-media > :nth-child(61),
.gallery > #m62:target ~ .per-media > :nth-child(62),
.gallery > #m63:target ~ .per-media > :nth-child(63),
.gallery > #m64:target ~ .per-media > :nth-child(64),
.gallery > #m65:target ~ .per-media > :nth-child(65),
.gallery > #m66:target ~ .per-media > :nth-child(66),
.gallery > #m67:target ~ .per-media > :nth-child(67),
.gallery > #m68:target ~ .per-media > :nth-child(68),
.gallery > #m69:target ~ .per-media > :nth-child(69),
.gallery > #m70:target ~ .per-media > :nth-child(70),
.gallery > #m71:target ~ .per-media > :nth-child(71),
.gallery > #m72:target ~ .per-media > :nth-child(72),
.gallery > #m73:target ~ .per-media > :nth-child(73),
.gallery > #m74:target ~ .per-media > :nth-child(74),
.gallery > #m75:target ~ .per-media > :nth-child(75),
.gallery > #m76:target ~ .per-media > :nth-child(76),
.gallery > #m77:target ~ .per-media > :nth-child(77),
.gallery > #m78:target ~ .per-media > :nth-child(78),
.gallery > #m79:target ~ .per-media > :nth-child(79),
.gallery > #m80:target ~ .per-media > :nth-child(80),
.gallery > #m81:target ~ .per-media > :nth-child(81),
.gallery > #m82:target ~ .per-media > :nth-child(82),
.gallery > #m83:target ~ .per-media > :nth-child(83),
.gallery > #m84:target ~ .per-media > :nth-child(84),
.gallery > #m85:target ~ .per-media > :nth-child(85),
.gallery > #m86:target ~ .per-media > :nth-child(86),
.gallery > #m87:target ~ .per-media > :nth-child(87),
.gallery > #m88:target ~ .per-media > :nth-child(88),
.gallery > #m89:target ~ .per-media > :nth-child(89),
.gallery > #m90:target ~ .per-media > :nth-child(90),
.gallery > #m91:target ~ .per-media > :nth-child(91),
.gallery > #m92:target ~ .per-media > :nth-child(92),
.gallery > #m93:target ~ .per-media > :nth-child(93),
.gallery > #m94:target ~ .per-media > :nth-child(94),
.gallery > #m95:target ~ .per-media > :nth-child(95),
.gallery > #m96:target ~ .per-media > :nth-child(96),
.gallery > #m97:target ~ .per-media > :nth-child(97),
.gallery > #m98:target ~ .per-media > :nth-child(98),
.gallery > #m99:target ~ .per-media > :nth-child(99),
.gallery > #m100:target ~ .per-media > :nth-child(100) {
	display: block;
}

.gallery > #m1:target ~ #thumbs > ol li:nth-child(1) img,
.gallery > #m2:target ~ #thumbs > ol li:nth-child(2) img,
.gallery > #m3:target ~ #thumbs > ol li:nth-child(3) img,
.gallery > #m4:target ~ #thumbs > ol li:nth-child(4) img,
.gallery > #m5:target ~ #thumbs > ol li:nth-child(5) img,
.gallery > #m6:target ~ #thumbs > ol li:nth-child(6) img,
.gallery > #m7:target ~ #thumbs > ol li:nth-child(7) img,
.gallery > #m8:target ~ #thumbs > ol li:nth-child(8) img,
.gallery > #m9:target ~ #thumbs > ol li:nth-child(9) img,
.gallery > #m10:target ~ #thumbs > ol > li:nth-child(10) img,
.gallery > #m11:target ~ #thumbs > ol > li:nth-child(11) img,
.gallery > #m12:target ~ #thumbs > ol > li:nth-child(12) img,
.gallery > #m13:target ~ #thumbs > ol > li:nth-child(13) img,
.gallery > #m14:target ~ #thumbs > ol > li:nth-child(14) img,
.gallery > #m15:target ~ #thumbs > ol > li:nth-child(15) img,
.gallery > #m16:target ~ #thumbs > ol > li:nth-child(16) img,
.gallery > #m17:target ~ #thumbs > ol > li:nth-child(17) img,
.gallery > #m18:target ~ #thumbs > ol > li:nth-child(18) img,
.gallery > #m19:target ~ #thumbs > ol > li:nth-child(19) img,
.gallery > #m20:target ~ #thumbs > ol > li:nth-child(20) img,
.gallery > #m21:target ~ #thumbs > ol > li:nth-child(21) img,
.gallery > #m22:target ~ #thumbs > ol > li:nth-child(22) img,
.gallery > #m23:target ~ #thumbs > ol > li:nth-child(23) img,
.gallery > #m24:target ~ #thumbs > ol > li:nth-child(24) img,
.gallery > #m25:target ~ #thumbs > ol > li:nth-child(25) img,
.gallery > #m26:target ~ #thumbs > ol > li:nth-child(26) img,
.gallery > #m27:target ~ #thumbs > ol > li:nth-child(27) img,
.gallery > #m28:target ~ #thumbs > ol > li:nth-child(28) img,
.gallery > #m29:target ~ #thumbs > ol > li:nth-child(29) img,
.gallery > #m30:target ~ #thumbs > ol > li:nth-child(30) img,
.gallery > #m31:target ~ #thumbs > ol > li:nth-child(31) img,
.gallery > #m32:target ~ #thumbs > ol > li:nth-child(32) img,
.gallery > #m33:target ~ #thumbs > ol > li:nth-child(33) img,
.gallery > #m34:target ~ #thumbs > ol > li:nth-child(34) img,
.gallery > #m35:target ~ #thumbs > ol > li:nth-child(35) img,
.gallery > #m36:target ~ #thumbs > ol > li:nth-child(36) img,
.gallery > #m37:target ~ #thumbs > ol > li:nth-child(37) img,
.gallery > #m38:target ~ #thumbs > ol > li:nth-child(38) img,
.gallery > #m39:target ~ #thumbs > ol > li:nth-child(39) img,
.gallery > #m40:target ~ #thumbs > ol > li:nth-child(40) img,
.gallery > #m41:target ~ #thumbs > ol > li:nth-child(41) img,
.gallery > #m42:target ~ #thumbs > ol > li:nth-child(42) img,
.gallery > #m43:target ~ #thumbs > ol > li:nth-child(43) img,
.gallery > #m44:target ~ #thumbs > ol > li:nth-child(44) img,
.gallery > #m45:target ~ #thumbs > ol > li:nth-child(45) img,
.gallery > #m46:target ~ #thumbs > ol > li:nth-child(46) img,
.gallery > #m47:target ~ #thumbs > ol > li:nth-child(47) img,
.gallery > #m48:target ~ #thumbs > ol > li:nth-child(48) img,
.gallery > #m49:target ~ #thumbs > ol > li:nth-child(49) img,
.gallery > #m50:target ~ #thumbs > ol > li:nth-child(50) img,
.gallery > #m51:target ~ #thumbs > ol > li:nth-child(51) img,
.gallery > #m52:target ~ #thumbs > ol > li:nth-child(52) img,
.gallery > #m53:target ~ #thumbs > ol > li:nth-child(53) img,
.gallery > #m54:target ~ #thumbs > ol > li:nth-child(54) img,
.gallery > #m55:target ~ #thumbs > ol > li:nth-child(55) img,
.gallery > #m56:target ~ #thumbs > ol > li:nth-child(56) img,
.gallery > #m57:target ~ #thumbs > ol > li:nth-child(57) img,
.gallery > #m58:target ~ #thumbs > ol > li:nth-child(58) img,
.gallery > #m59:target ~ #thumbs > ol > li:nth-child(59) img,
.gallery > #m60:target ~ #thumbs > ol > li:nth-child(60) img,
.gallery > #m61:target ~ #thumbs > ol > li:nth-child(61) img,
.gallery > #m62:target ~ #thumbs > ol > li:nth-child(62) img,
.gallery > #m63:target ~ #thumbs > ol > li:nth-child(63) img,
.gallery > #m64:target ~ #thumbs > ol > li:nth-child(64) img,
.gallery > #m65:target ~ #thumbs > ol > li:nth-child(65) img,
.gallery > #m66:target ~ #thumbs > ol > li:nth-child(66) img,
.gallery > #m67:target ~ #thumbs > ol > li:nth-child(67) img,
.gallery > #m68:target ~ #thumbs > ol > li:nth-child(68) img,
.gallery > #m69:target ~ #thumbs > ol > li:nth-child(69) img,
.gallery > #m70:target ~ #thumbs > ol > li:nth-child(70) img,
.gallery > #m71:target ~ #thumbs > ol > li:nth-child(71) img,
.gallery > #m72:target ~ #thumbs > ol > li:nth-child(72) img,
.gallery > #m73:target ~ #thumbs > ol > li:nth-child(73) img,
.gallery > #m74:target ~ #thumbs > ol > li:nth-child(74) img,
.gallery > #m75:target ~ #thumbs > ol > li:nth-child(75) img,
.gallery > #m76:target ~ #thumbs > ol > li:nth-child(76) img,
.gallery > #m77:target ~ #thumbs > ol > li:nth-child(77) img,
.gallery > #m78:target ~ #thumbs > ol > li:nth-child(78) img,
.gallery > #m79:target ~ #thumbs > ol > li:nth-child(79) img,
.gallery > #m80:target ~ #thumbs > ol > li:nth-child(80) img,
.gallery > #m81:target ~ #thumbs > ol > li:nth-child(81) img,
.gallery > #m82:target ~ #thumbs > ol > li:nth-child(82) img,
.gallery > #m83:target ~ #thumbs > ol > li:nth-child(83) img,
.gallery > #m84:target ~ #thumbs > ol > li:nth-child(84) img,
.gallery > #m85:target ~ #thumbs > ol > li:nth-child(85) img,
.gallery > #m86:target ~ #thumbs > ol > li:nth-child(86) img,
.gallery > #m87:target ~ #thumbs > ol > li:nth-child(87) img,
.gallery > #m88:target ~ #thumbs > ol > li:nth-child(88) img,
.gallery > #m89:target ~ #thumbs > ol > li:nth-child(89) img,
.gallery > #m90:target ~ #thumbs > ol > li:nth-child(90) img,
.gallery > #m91:target ~ #thumbs > ol > li:nth-child(91) img,
.gallery > #m92:target ~ #thumbs > ol > li:nth-child(92) img,
.gallery > #m93:target ~ #thumbs > ol > li:nth-child(93) img,
.gallery > #m94:target ~ #thumbs > ol > li:nth-child(94) img,
.gallery > #m95:target ~ #thumbs > ol > li:nth-child(95) img,
.gallery > #m96:target ~ #thumbs > ol > li:nth-child(96) img,
.gallery > #m97:target ~ #thumbs > ol > li:nth-child(97) img,
.gallery > #m98:target ~ #thumbs > ol > li:nth-child(98) img,
.gallery > #m99:target ~ #thumbs > ol > li:nth-child(99) img,
.gallery > #m100:target ~ .per-media > ol > li:nth-child(100) img {
	filter: brightness(50%) grayscale(100%);
	transition: filter 0.5s, grayscale 0.5s;
}

.gallery #thumbs h1 {
	display: block;
	background-color: black;
	color: white;
	position: fixed;
	padding: 0.5em 1em;
	opacity: 0.8;
	margin-left: 50%;
	transform: translateX(-50%);
	z-index: 1;
	pointer-events: none;
}

.gallery #thumbs #back {
	display: none;
	background-color: black;
	position: fixed;
	padding: 0.5em 1em;
	opacity: 0.8;
	left: 0;
	z-index: 1;
}

.gallery #thumbs #back a {
	color: white;
	text-decoration: none;
}

.gallery #arrows a {
	position: fixed;
	font-size: 2em;
	font-weight: bold;
	top: calc(50% - 1em);
	width: 2em;
	height: 2em;
	text-align:center;
	text-decoration: none;
	color: black;
	padding-top: 0.35em;
	opacity: 0.1;
	background: rgba(255, 255, 255, 0.8);
	border: 1px solid lightgrey;
	border-radius: 100%;
}
.gallery #arrows a:hover {
	opacity: 0.8;
}

.gallery #left-arrow-zone,
.gallery #right-arrow-zone {
	position: fixed;
	top: 0%;
	bottom: 0%;
	width: 20em;
	max-width: 10%;
	opacity: 0;
	transition: opacity 0.8s;
}
.gallery > #m1:not(:target) ~ #left-arrow-zone:hover,
.gallery > span:last-of-type:not(:target) ~ #right-arrow-zone:hover {
	opacity: 1;
	transition: opacity 0.8s;
}
.gallery #left-arrow-zone {
	left: 0%;
	background: linear-gradient(90deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 100%);
}

.gallery #right-arrow-zone {
	right: 0%;
	background: linear-gradient(270deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 100%);
}

.gallery #left-arrow-zone:hover ~ #arrows a:first-child {
	opacity: 0.8;
	transition: opacity 0.5s;
}

.gallery #right-arrow-zone:hover ~ #arrows a:last-child {
	opacity: 0.8;
	transition: opacity 0.5s;
}

.gallery #arrows div:first-child a:first-child,
.gallery #arrows div:last-child a:last-child {
	display: none;
}
.gallery #arrows a:first-child {
	left: 1%;
}
.gallery #arrows a:last-child {
	right: 1%;
}