body { 
	--ctrlht:179px;
}
.ctrldown {
	--ctrlht:11px;
}
@media only screen and (max-width:700px), screen and (max-height:700px) {
	body { --ctrlht:115px; } /* this would really vary as a function of width, but that could be a pain to calculate */
	#display {
		margin-top:0px;
	}
}

body, html {
	background:#000;
}

#display {
	margin-top:-18px; /* correct for odd offset that I can't find */
}

#display * { filter: url('#cvd'); }

video, img {
	height:calc(100vh - var(--ctrlht)); 
	width:100vw;
	object-fit:contain;
}

video { display:none; }
.video img { display:none; }
.video video { display:block; }

#credit {
	position:fixed;
	top:0px;
	left:0px;
	background:#fff;
	padding:1px 4px;
	font-family:Arial;
}

/****************** controls ***********************/

#ctrlback { 
	display:flex; flex-flow:row wrap; 
	justify-content:space-between; 
	align-items:flex-start; 
	z-index:2;
}
.moreoptions { 
	border-bottom:none; 
	margin-bottom:0px; 
	grid-template-columns: repeat(2,auto);
}
.controlgrid.one :nth-child(n+2) { margin-left: unset; }

select { 
	height:26px; 
}
select[name='vision'] { 
	width:114px; 
}
select[name='scene'] { 
	width:144px; 
	text-overflow: ellipsis; 
}

input[name='severity'] { 
	width:54px; 
}


#fileinput { display:none; }
label.btn { padding-top:5px; }
label.btn { width:96px; }

.drop {
	background:#eee;
	padding-top:5px;
	width:150px;
}


.nocam label.needcam *, .nocam span.needcam { 
	color:gray;
	fill:#888;
}

svg.icon {
	width:19px;
	height:12px;
	overflow:visible;
	position:relative;
	top:1px;
	fill:#444;
}

/* hide irrelevant info text */
.v0 .change:not(.v0):not(.image) { display:none; }
.v1 .change:not(.v1):not(.image) { display:none; }
.v2 .change:not(.v2):not(.image) { display:none; }
.v3 .change:not(.v3):not(.image) { display:none; }
.v4 .change:not(.v4):not(.image) { display:none; }

/* this doesn't quite fix the button
see https://support.mozilla.org/en-US/questions/1266036
https://searchfox.org/mozilla-release/source/layout/style/res/forms.css search for select > button, lines 224, 261
@-moz-document url-prefix() { 
	select.btn {
		background:unset;
		border:unset;
		border-radius:unset;
	}
}
*/