.popup .popup-control.download {
				right: 70px;
			}
			.popup .popup-control.download:after {
				content: "🖫";
			}

			.popup .popup-control.max {
				right: 40px;
			}
			.popup .popup-control.max:after {
				content: "⛶";
			}

			.popup .popup-control.close {
				top: 9px;
				right: 10px;
			}
			.popup .popup-control.close:after {
				content: "🗙";
			}

			#popup1 .content>img {
				max-width: 100%;
				max-height: 90%;
				margin: auto;
				display: block;
				margin: auto;
				top:0;
				bottom:0;
				left:0;
				right:0;
				position:absolute;
			}

			.popup .content {
				height: 100%;
				overflow: auto;
			}

			video {
				max-width: 100%;
				max-height: 100%;
				width: 100%;
				margin: auto;
				position: absolute;
				left: 0;
				top: 0;
				right: 0;
				bottom: 0;
			}

			video::cue {
				text-align: center;
				font-size: 1.5vw;
			}

			.fixedplayer {
				display: none;
				text-align: center;
				position: fixed;
				min-width: 67vw;
				width: 100%;
				height: 24px;
				padding: 0;
				top: 0;
				right: 0;
				left:0;
				z-index: 3;
			}

			.fixedplayer #aplayer{
				width: 432px;
				height: 24px;
			}

			.fixedplayer a {
				position: absolute;
				top: 2px;
				transition: all 200ms;
				font-weight: bold;
				text-decoration: none;
				z-index: 1000;
			}

			/* prevent body scroll when modal is shown */
			.modal-open {
				touch-action: none;
				-webkit-overflow-scrolling: none;
				overflow: hidden;
				overscroll-behavior: none;
				overflow-x: hidden;
				overflow-y: scroll !important;
				position: fixed;
			}

			.maximized {
				width: 100% !important;
				height: 100% !important;
				margin: auto !important;
			}

			{{- if eq (.Req.URL.Query.Get "layout") "grid"}}
			.wrapper {
				max-width: none;
			}
			main {
				margin-top: 1px; 
			}
			{{- end}}

			@media (max-width: 600px) {
				.hideable {
					display: none;
				}

				td:nth-child(2) {
					width: auto;
				}

				th:nth-child(3),
				td:nth-child(3) {
					padding-right: 5%;
					text-align: right;
				}

				h1 {
					color: var(--htxcol);
				}

				h1 a {
					margin: 0;
				}

				#filter {
					max-width: 100px;
				}

				.grid .entry {
					max-width: initial;
				}

				.popup {
					width: 100%;
					height: 100%;
					margin: auto;
				}

				#popup1 .close, #popup1 .max {
					font-size: 25px;
				}
			}

			body,
			a,
			svg,
			.layout.current,
			.layout.current svg,
			.go-up {
				color: var(--txcol);
			}

			h1 a,
			th a {
				color: var(--htxcol);
			}

			h1 {
				color: var(--htxcol);
			}

			h1 a:hover {
				background: hsl(213deg 100% 73% / 20%);
			}

			header,
			main,
			.grid .entry {
				background-color: rgba(12, 12, 12, 0.8);
			}

			tbody tr:hover,
			.grid .entry a:hover {
				background-color: rgba(16, 16, 16, 0.9);
				color: var(--txcol);
			}

			th {
				background-color: rgba(24, 33, 50, 0.8);
			}

			td a,
			.listing .icon-tabler {
				color: #abc8e3;
			}

			td a:hover,
			td a:hover .icon-tabler {
				color: #a6a2a8;
			}

			td a:visited {
				color: #a25cc5;
			}


			.popup .popup-control.close {
				color: #ffe0e0;
			}
			.popup .popup-control.close:hover {
				color: #D8065F;
			}