#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#2c3e50}nav{padding:30px}nav a{font-weight:700;color:#2c3e50}nav a.router-link-exact-active{color:#42b983}.container{flex-direction:column;margin-top:1rem}.container,.position-container{display:flex;justify-content:center;align-items:center;gap:2rem}.main-btn{width:20rem;padding:.5rem 1rem;font-size:1rem;background-color:orange;color:#fff;border-radius:10px;border:0}.web-camera-container,body{display:flex;justify-content:center}.web-camera-container{margin-top:2rem;margin-bottom:2rem;padding:2rem;flex-direction:column;align-items:center;border:1px solid #ccc;border-radius:4px;width:500px}.web-camera-container .camera-button{margin-bottom:2rem}.web-camera-container .camera-box .camera-shutter{opacity:0;width:450px;height:337.5px;background-color:#fff;position:absolute}.web-camera-container .camera-box .camera-shutter.flash{opacity:1}.web-camera-container .camera-shoot{margin:1rem 0}.web-camera-container .camera-shoot button{height:60px;width:60px;display:flex;align-items:center;justify-content:center;border-radius:100%}.web-camera-container .camera-shoot button img{height:35px;-o-object-fit:cover;object-fit:cover}.web-camera-container .camera-loading{overflow:hidden;height:100%;position:absolute;width:100%;min-height:150px;margin:3rem 0 0 -1.2rem}.web-camera-container .camera-loading ul{height:100%;position:absolute;width:100%;z-index:999999;margin:0}.web-camera-container .camera-loading .loader-circle{display:block;height:14px;margin:0 auto;top:50%;left:100%;transform:translateY(-50%);transform:translateX(-50%);position:absolute;width:100%;padding:0}.web-camera-container .camera-loading .loader-circle li{display:block;float:left;width:10px;height:10px;line-height:10px;padding:0;position:relative;margin:0 0 0 4px;background:#999;animation:preload 1s infinite;top:-50%;border-radius:100%}.web-camera-container .camera-loading .loader-circle li:nth-child(2){animation-delay:.2s}.web-camera-container .camera-loading .loader-circle li:nth-child(3){animation-delay:.4s}@keyframes preload{0%{opacity:1}50%{opacity:.4}to{opacity:1}}