fixes

site/camera-info/main.css

@@ -1,6 +1,9 @@
-body {
+body, html {
 	margin: 0px;
 	padding: 0px;
+	overflow: clip;
+	width: 100vw;
+	height: 100vh;
 }
 
 body > div {
@@ -8,25 +11,19 @@ body > div {
 	top: 0px;
 	left: 0px;
 	width: 100vw;
+	height: 100vh;
 	display: flex;
 	flex-direction: column;
 	align-items: center;
 	justify-content: center;
 }
 
-body > div > * {
-	margin: 20px;
-}
-
 #camview {
 	max-width: 100vw;
-	box-shadow: 0px 0px 50px 0px black;
 	display: flex;
 	flex-direction: column;
 	align-items: center;
 	justify-content: center;
-	padding: 30px;
-	box-sizing: border-box;
 }
 
 @media (orientation:portrait) {
@@ -68,9 +65,23 @@ body > div > * {
 	flex-shrink: 0;
 }
 
+#precanvas.took {
+	position: absolute;
+	right: 0px;
+	top: 0px;
+	max-height: 25vh;
+	z-index: 7700;
+	margin: 0px;
+}
+
 #preview {
-  width: 100%;
+  width: 100vw;
   display: inline-block;
+  position: absolute;
+  top: 50vh;
+  left: 50vw;
+  transform: translate(-50%, -50%);
+  margin: 0px;
 }
 
 
@@ -89,3 +100,48 @@ video.unbounded {
 #final {
 	border: 1px solid black;
 }
+
+
+#picbar {
+	position: absolute;
+	bottom: 50px;
+	left: 50vw;
+	transform: translateX(-50%);
+	z-index: 2;
+	display: flex;
+	flex-direction: row;
+	width: max-content;
+}
+
+button {
+	border-radius: calc(infinity * 1px);
+	padding: 10px;
+	font-size: 1.5em;
+	border: none;
+	margin: 10px;
+	background-color: lightgrey;
+}
+
+button:hover {
+	background-color: grey;
+}
+
+input {
+	font-size: 1.5em;
+}
+
+#details > span {
+	font-size: 1.5em;
+}
+
+* {
+	font-family: sans-serif;
+}
+
+#finalresult {
+	align-items: stretch;
+}
+
+iframe {
+	flex-grow: 3;
+}