/* -------------------- Gallery -------------------- */
#content.gallery {
	display: grid;
	height: 100%;
	grid-template-columns: 1fr;
	grid-template-rows: auto 9fr 25px;
}
a:hover {
	color: var(--link_hover) !important;
}
.footer {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 0.75em;
	border: 1px solid gray;
	background: ghostwhite;
}
.imagegallery {
	grid-row: 2;
	display: grid;
	gap: 5px;
	border: 1px solid gray;
	padding: 5px;
	background-color: ghostwhite;
	grid-auto-rows: 50px;
	grid-auto-columns: 1fr;
	overflow-y: auto;
}
.imagegallery.emptygallery > div{
	grid-row: 1 / span 10;
	grid-column: 1;
	display: grid;
	gap: 10px;
	padding: 10px;
	flex-flow: column;
	font-size: 2em;
	object-fit: contain;
	align-items: center;
	justify-items: center;
	border: 1px solid black;
	background-color: white;
}
.imagegallery > .GalleryDiv {
	border: 1px solid rgb(150, 150, 150);
	border-radius: 2px;
	background: gray;
	gap: 1px;
	display: grid;
	grid-template-columns: 50px 3fr 0.25fr 0.5fr 1fr;
	justify-items: stretch;
	align-items: stretch;
}
.imagegallery > .GalleryDiv > * {
	background: white;
	padding: 0px 5px;
	align-content: center;
	text-align: start;
}
.imagegallery > .GalleryDiv > *.text_center {
	text-align: center !important;
}

.imagegallery > .GalleryDiv.folder {
	border: 1px solid black;
}
.imagegallery > .GalleryDiv > a {
	background-color: white;
	max-height: 100%;
	height: 100%;
	text-decoration: none;
	text-wrap: nowrap;
	text-overflow: clip;
	overflow: hidden;
	justify-items: stretch;
}
.imagegallery > .GalleryDiv > a > .title {
	background-color: BlanchedAlmond;
	color: black;
	border-bottom: 1px solid black;
	font-size: 0.6em;
	align-content: center;
}
.imagegallery > .GalleryDiv.folder > a > .title {
	background-color: rgb(252, 186, 100);
}
.imagegallery > .GalleryDiv > img {
	padding: 0px 0px;
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.imagegallery_navigation {
	background-color: ghostwhite;
	min-height: 40px;
	max-height: 40px;
	padding: 0px 5px;
	gap: 5px;
	font-size: 1em;
	grid-row: 1;
	min-width: 100%;
	border: 1px solid gray;
	justify-content: center;
	align-content: stretch;
	display: grid;
	text-align: start;
	grid-template-columns: 3fr 1fr 3fr;
}
.imagegallery_navigation > .subcontainer {
	display: flex;
	padding: 0px 0px;
	width: 100%;
	align-content: center;
}
.imagegallery_navigation > .subcontainer > .wrapper > * {
	display: flex;
	min-width: auto;
	align-content: stretch;
	align-items: stretch;
}
.imagegallery_navigation > .subcontainer.navigation > .wrapper{
	background-color: black;
	justify-content: start;
	padding: 0px;
	gap: 1px !important;
}
.imagegallery_navigation > .subcontainer.navigation > .wrapper > a {
	display: flex;
	height: 100%;
	flex: 1 0;
	align-content: center;
	align-items: center;
	justify-content: center;
	padding: 0px 5px;
	color: Black;
	background-color: BurlyWood;
}
.imagegallery_navigation > .subcontainer.navigation > .wrapper > a:first-child::before {
	color: black;
	content: '';
}
.imagegallery_navigation > .subcontainer.navigation > .wrapper > a::after {
	color: black;
	content: '';
}
.imagegallery_navigation > .subcontainer.pagination  {
	justify-content: center;
	justify-self: stretch;
	gap: 10px;
}
.imagegallery_navigation > .subcontainer.pagination > .wrapper {
	background-color: BurlyWood;
}
.imagegallery_navigation > .subcontainer.textbars {
	display: grid;
	grid-template-columns: 1fr;
	gap: 5px;
	align-content: stretch;
}
.imagegallery_navigation > .subcontainer.textbars > .wrapper.parted {
	font-family: Courier New;
	font-size: 0.75em;
	width: auto;
	justify-content: start;
	overflow-x: scroll;
	overflow-y: hidden;
	scrollbar-gutter: auto;
	scrollbar-width: thin;
	text-wrap: nowrap;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.imagegallery_navigation > .subcontainer.textbars > .wrapper.parted > a::after {
	content: "/";
	color: black !important;
}
.imagegallery_navigation > .subcontainer.textbars > .wrapper.parted > a:last-child::after {
	content: "";
}
.imagegallery_navigation > .subcontainer > .wrapper {
	display: flex;
	width: 100%;
	margin: 5px 0px;
	padding: 3px 5px;
	border: 1px solid black;
	background-color: white;
	align-content: center;
	justify-content: center;
}
.imagegallery_navigation > .subcontainer.navigation > .wrapper {
	width: 100%;
	gap: 10px;
}
.imagegallery_navigation > .subcontainer.pagination > .wrapper {
	gap: 10px;
}
.imagegallery_navigation > .subcontainer.textbars > .wrapper {
	background-color: white;
}
.imagegallery_navigation > .subcontainer.textbars > .wrapper:hover {
}
.imagegallery_navigation form > input {
	width: 100%;
	border: none;
	background: inherit;
	font-size: inherit;
	color: inherit;
}
.imagegallery_navigation form > input::placeholder {
	opacity: 1;
	color: inherit;
}
.imagegallery_navigation form input:focus-visible {
	outline: none !important;
}
.imagegallery_navigation a {
	min-width: 0;
	color: black;
	text-decoration: none;
}
.imagegallery.singleimage {
	grid-template-columns: 3fr 1fr; 
	grid-template-rows: auto 3fr; 
	gap: 5px;
}
.imagegallery.singleimage > div {
	border: 1px solid transparent;
	border-radius: 3px;
	background-color: rgb(230, 230, 230);
}
.imagegallery.singleimage > .media_container {
	grid-row: 1 / span 2;
	grid-column: 1;
	align-content: center;
}
.imagegallery.singleimage > .media_container > * {
	width: 100%;
	height: 100%;
	overflow-y: auto;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}
.imagegallery.singleimage > .imageinfo {
	grid-row: 1;
	grid-column: 2;
	display: grid;
	grid-template-columns: 1fr;
	grid-auto-rows: minmax(10px, 60px);
}
.imagegallery.singleimage > .imageinfo > div {
	display: grid;
	grid-template-columns: subgrid;
	text-align: start;
	border-bottom: 1px solid gray;
}
.imagegallery.singleimage > .imageinfo > div:last-child {
	border-bottom: none;
}
.imagegallery.singleimage > .imageinfo > div > * {
	padding: 5px;
}
.imagegallery.singleimage > .imageinfo > div > .label {
	grid-row: 1;
	text-decoration: underline;
}
.imagegallery.singleimage > .imageinfo > div > .label.download {
	justify-self: end;
}
.imagegallery.singleimage > .imageinfo > div > .text {
	overflow-x: scroll;
	scrollbar-width: none;  /* Firefox */
	text-wrap: nowrap;
	text-overflow: ellipsis;
}
.imagegallery.singleimage > .wrapper {
	overflow-y: scroll;
	scrollbar-width: thin;
	padding: 5px;
}
.imagegallery.singleimage > .wrapper > .other_files {
	grid-row: 2;
	grid-column: 2;
	display: grid;
	gap: 5px;
	background-color: inherit;
	/* grid-template-rows: repeat(5, 1fr); */
	grid-auto-rows: 100px;
	grid-template-columns: 1fr;
}
.imagegallery.singleimage > .wrapper > .other_files > a {
	display: grid;
	grid-template-rows: 1fr;
	grid-template-columns: 1fr 1.5fr;
	justify-items: stretch;
	align-items: stretch;
	padding: 0px 0px;
	background-color: white;
	text-decoration: none !important;
	border: 0px solid gray;
	border-radius: 3px;
}
.imagegallery.singleimage > .wrapper > .other_files > a > img {
	grid-row: 1;
	grid-column: 1;
	object-fit: cover;
	margin: 5px;
	border: 1px solid gray;
	border-radius: 5px;
}
.imagegallery.singleimage > .wrapper > .other_files > a > .text {
	grid-row: 1;
	grid-column: 2;
	display: grid;
	grid-template-rows: 3fr 0fr;
	color: black !important;
	padding: 5px 5px;
}
.imagegallery.singleimage > .wrapper > .other_files > a > .text > .title {
	overflow-wrap: anywhere;
	text-overflow: ellipsis;
	font-size: 1em;
	display: flex;
	text-align: start;
}
.imagegallery.singleimage > .wrapper > .other_files > a > .text > .pos {
	font-size: 1em;
	display: none;
	justify-content: end;
	align-items: end;
	text-align: end;
}
.imagegallery.singleimage > .wrapper > .other_files > a > .duration {
}