.buttonLinks {
	margin: 0.2em;
}

.output {
	order: 0;
}

.camera {
	order: 1;
	text-align: center;
}

#change-camera {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 99999;
	font-family: FontAwesome;
	border-style: none;
}
#change-camera:hover,
#change-camera:focus {
	background-color: transparent;
	outline-color: transparent;
	outline-width: 0px;
}

#change-camera em {
	display: none;
}

#change-camera span:after {
	content: "";
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath style='fill:%23fff%3B' d='M37.969 9c-4.009 0-7.445 2.646-8.407 6.531a3 3 0 0 0 0 .031L29.22 17h-5.313C18.506 17 14 21.364 14 26.75v2.344a3 3 0 1 0 6 0V26.75c0-2.092 1.653-3.75 3.906-3.75h7.688a3 3 0 0 0 2.906-2.313l.875-3.718v-.032c.22-.82 1.652-1.937 2.594-1.937H62.03c.942 0 2.374 1.116 2.594 1.938v.03l.875 3.72A3 3 0 0 0 68.406 23h7.688C78.347 23 80 24.658 80 26.75v30.5c0 2.091-1.653 3.75-3.906 3.75H23.906C21.653 61 20 59.341 20 57.25V39.062a3 3 0 1 0-6 0v9.376c-2.29 1.51-4.245 3.192-5.75 5.156-1.82 2.375-3 5.283-3 8.406 0 3.757 1.69 7.111 4.188 9.781 2.496 2.67 5.853 4.868 9.874 6.688 6.114 2.765 13.789 4.655 22.344 5.406l-2.375 1.656a3 3 0 1 0 3.438 4.906l10-7a3 3 0 0 0 0-4.906l-10-7a3 3 0 0 0-1.969-.562 3 3 0 0 0-1.469 5.469l1.094.78c-7.416-.82-14.009-2.526-19.063-4.812-3.578-1.619-6.37-3.53-8.125-5.406-1.753-1.876-2.437-3.51-2.437-5 0-1.238.456-2.537 1.625-4.063.435-.567.997-1.136 1.625-1.718v1.031c0 5.386 4.506 9.75 9.906 9.75h52.188c5.4 0 9.906-4.364 9.906-9.75v-1.031c.628.582 1.19 1.151 1.625 1.718 1.168 1.526 1.625 2.825 1.625 4.063 0 2.3-1.844 5.258-6.188 8.063-4.343 2.804-10.816 5.144-18.468 6.468a2.777 3.249 0 0 0 .812 6.438c8.134-1.408 15.168-3.888 20.375-7.25C90.99 72.356 94.75 67.802 94.75 62c0-3.122-1.18-6.031-3-8.406-1.504-1.964-3.46-3.647-5.75-5.157V26.75c0-5.386-4.506-9.75-9.906-9.75H70.78l-.344-1.438a3 3 0 0 0 0-.03C69.478 11.645 66.04 9 62.032 9H37.97zM50 24c-8.801 0-16 7.199-16 16s7.199 16 16 16 16-7.199 16-16-7.199-16-16-16zm0 6c5.558 0 10 4.442 10 10s-4.442 10-10 10-10-4.442-10-10 4.442-10 10-10z'/%3E%3C/svg%3E");
	width: 24px;
	height: 24px;
	display: inline-block;
	background-position: center;
	background-repeat: no-repeat;
	vertical-align: middle;
	margin: 0;
	line-height: 0.4;
}

#barcode-scanner-video {
	width: 100%;
	max-width: 100vw;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	max-height: 30vh;
}

#qr-shaded-region {
	display: none;
	position: absolute;
	border-width: 40px 40px;
	border-style: solid;
	border-color: rgba(0, 0, 0, 0.48);
	box-sizing: border-box;
	inset: 0px;
}

@media only screen and (min-width: 500px) {
	#qr-shaded-region {
		border-width: 40px 80px;
	}
}