
html { height: 100%; width: 100%; margin: 0;}

body { font-family: Arial; font-size: 14px; background-color: #242424; color: white; height: 100%; }
h1 {text-align: center; font-size: 28px;}

.login_wrap { width: 100%; height: 200px; margin-top: calc(40vh - 100px); text-align: center;}
.login_wrap form { text-align: center; }
.login_wrap form input { border: 1px solid black; display: inline-block; height: 45px; }
.login_wrap form input[type="text"] { width: 80%; padding: 10px; font-size: 28px; margin-bottom: 20px; }
.login_wrap form input[type="submit"] { color: white; background-color: inherit; border: 1px solid red; padding: 6px 22px; font-size: 18px; letter-spacing: 1px; }

a.button {border: 1px solid red; color: white; padding: 6px 22px; width: 80%; letter-spacing: 1px; font-size: 18px; text-decoration: none; display: inline-block; margin-bottom: 16px;}

#video-container {
  width: 96vw;
  height: 100vw;
  overflow: hidden;
  text-align: center;
}

#video-container #qr-video {
  width: 100%;
  height: auto;
}

#result {
  position: absolute;
  top: 70px;
  width: 100%;
  height: calc(100% - 70px);
  left: 0;
  background-color: #242424;
}

#result .inner-wrap {padding: 20px;}
#result .inner-wrap .head {text-align: center; background-color: green; padding: 40px; font-size: 18px; font-weight: bold; letter-spacing: 0.8px; margin-bottom: 20px;}
#result .inner-wrap .additional {text-align: center; background-color: white; color: #242424; padding: 40px; font-size: 18px; font-weight: bold; letter-spacing: 0.8px; margin-bottom: 20px;}
#result .inner-wrap button {width: 100%;}

#result.failed .inner-wrap .head {background-color: red;}
#result.failed .inner-wrap button {border: 1px solid red;}

.scan_buttons {width: 100%; text-align: left;}
button.scan_button {display: inline-block; height: 45px; color: white; background-color: red; border: 1px solid red; padding: 6px 30px; font-size: 18px; letter-spacing: 1px;}
button.scan_button.start {background-color: green; border: 1px solid green;}
button.scan_button.outline {background-color: #242424;}
button.scan_button.stop {float: right;}
