#app-title{text-transform:uppercase;font-weight:700;font-size: .875rem;letter-spacing:2px;font-family:arial;text-align:center;padding-bottom:10px}.scan-layout{background-color:rgba(0, 0, 0, 0.5);width:550px;height:350px;border:5px solid #1a1a1a;margin:0 auto;overflow:hidden;display:flex;justify-content:center}.scan-layout-content{width:550px;height:350px;margin:0 auto;overflow:hidden;display:flex;justify-content:center}video{width:600px;overflow:hidden}#accesscode-flexdatalist{width:80% !important}input::-webkit-calendar-picker-indicator{display:none}#camera-name{padding:19px 0;text-align:center}#initiate-qrcodereader-container{display:block;position:absolute;right:12px;top:13px;z-index:1;cursor:pointer !important}#initiate-qrcodereader-btn{color:#565cc0;border:1px solid #565cc0;padding:5px;border-radius:50%;z-index:1;cursor:pointer !important;width: 26px;height: 26px;text-align: center;font-size: 14px}#initiate-qrcodereader-btn::before{display:block;}@-moz-document url-prefix(){#initiate-qrcodereader-btn{width:27px;height:27px}#initiate-qrcodereader-btn::before{padding-top:0}}#initiate-qrcodereader-btn:hover{color:#696ec7;border:1px solid #696ec7}.internalscanloader{border:8px solid #f3f3f3;border-radius:50%;border-top:8px solid #565CC0;width:45px;height:45px;-webkit-animation:directscanspin 0.5s linear infinite;animation:directscanspin 0.5s linear infinite;margin:0 auto}@-webkit-keyframes directscanspin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes directscanspin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.switchedOn{color:#090 !important;font-weight:400}.switchedOff{color:#f55753 !important;font-weight:400}#qrcode-response-wrapper{background:#fafafa;display:none}#target{display:none;width:200px;height:200px;background-repeat:no-repeat;background-size:20px 20px;position:absolute;align-self:center;z-index:5}.target-default{background:linear-gradient(to right, white 4px, transparent 4px) 0 0, linear-gradient(to right, white 4px, transparent 4px) 0 100%, linear-gradient(to left, white 4px, transparent 4px) 100% 0,linear-gradient(to left, white 4px, transparent 4px) 100% 100%, linear-gradient(to bottom, white 4px, transparent 4px) 0 0, linear-gradient(to bottom, white 4px, transparent 4px) 100% 0,linear-gradient(to top, white 4px, transparent 4px) 0 100%, linear-gradient(to top, white 4px, transparent 4px) 100% 100%}.target-success{background:linear-gradient(to right, #7ac142 4px, transparent 4px) 0 0, linear-gradient(to right, #7ac142 4px, transparent 4px) 0 100%, linear-gradient(to left, #7ac142 4px, transparent 4px) 100% 0,linear-gradient(to left, #7ac142 4px, transparent 4px) 100% 100%, linear-gradient(to bottom, #7ac142 4px, transparent 4px) 0 0, linear-gradient(to bottom, #7ac142 4px, transparent 4px) 100% 0,linear-gradient(to top, #7ac142 4px, transparent 4px) 0 100%, linear-gradient(to top, #7ac142 4px, transparent 4px) 100% 100%}.custom-scanner{width:200px;height:10px;background-color:rgba(247, 121, 117, 0.8);position:absolute;align-self:center;-webkit-transition:all 200ms linear;-moz-transition:all 200ms linear;transition:all 200ms linear;-webkit-animation:scanner 1.5s infinite linear;-moz-animation:scanner 1.5s infinite linear;-o-animation:scanner 1.5s infinite linear;animation:scanner 1.5s infinite linear}.hide-scan{display:none !important}#browser-not-supported{display:none;position:absolute;align-self:center;width:156px;height:156px}@-webkit-keyframes scanner{0%{top:0px}50%{top:190px}100%{top:0px}}@-moz-keyframes scanner{0%{top:0px}50%{top:190px}100%{top:0px}}@-o-keyframes scanner{0%{top:0px}50%{top:190px}100%{top:0px}}@keyframes scanner{0%{top:0px}50%{top:190px}100%{top:0px}}.checkmark-tick{position:absolute;align-self:center;width:156px;height:156px;border-radius:50%;display:block;stroke-width:2;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0px 0px 0px #7ac142;animation:fill-tick .4s ease-in-out .4s forwards, scale-tick .3s ease-in-out .9s both}.checkmark-circle-tick{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#7ac142;fill:none;animation:stroke-tick 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards}.checkmark-check-tick{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke-tick 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards}@keyframes stroke-tick{100%{stroke-dashoffset:0}}@keyframes scale-tick{0%,100%{transform:none}50%{transform:scale3d(1.1, 1.1, 1)}}@keyframes fill-tick{100%{box-shadow:inset 0px 0px 0px 130px #7ac142}}.checkmark-cross{position:absolute;align-self:center;width:156px;height:156px;border-radius:50%;display:block;stroke-width:2;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0px 0px 0px #f55753;animation:fill-cross .4s ease-in-out .4s forwards, scale-cross .3s ease-in-out .9s both}.checkmark-circle-cross{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#f55753;fill:none;animation:stroke-cross 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards}.checkmark-check-cross{transform-origin:50% 50%;stroke-dasharray:29;stroke-dashoffset:29;animation:stroke-cross 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards}@keyframes stroke-cross{100%{stroke-dashoffset:0}}@keyframes scale-cross{0%,100%{transform:none}50%{transform:scale3d(1.1, 1.1, 1)}}@keyframes fill-cross{100%{box-shadow:inset 0px 0px 0px 130px #f55753}}@media only screen and (max-width: 600px){.scan-layout{width:250px;height:250px}.scan-layout-content{width:250px;height:250px}}@media only screen and (max-width: 600px){.scan-layout{width:250px;height:250px}.scan-layout-content{width:250px;height:250px}video{width:250px;overflow:hidden}}