* {
                font-family: -apple-system, BlinkMacSystemFont,"Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell","Fira Sans", "Droid Sans", "Helvetica Neue",sans-serif;
            }
            body {
                margin: 0 auto;
                width: 95%;
                max-width: 960px;
                padding-bottom: 50vh;
            }
            .hidden {
                visibility: hidden !important;
                display: none !important;
            }
            .btn-lg {
                cursor: pointer;
                margin: 0.5em 0;
                height: 44px;
                border-radius: 8px;
                width: 100%;
                font-size: large;
                color: white;
                background-color: #4285f4;
                border: 1px solid grey;
            }
            .btn-lg:disabled, .btn-lg[disabled] {
                background-color: grey;
            }
            select {
                width: 100%;
                margin: 0.5em 0;
                zoom: 1.25;
            }
            .accordian fieldset {
                overflow: hidden;
                border-radius: 8px;
                padding: 40px 10px 0;
                margin-bottom: 20px;
                height: auto;
                min-height: 100px;
                box-shadow: 0px 0px 5px rgb(0 0 0 / 90%), 0px 0px 10px rgb(0 0 0 / 20%);
                border: unset;
                position:relative;
            }
            .accordian fieldset legend {
                cursor: pointer;
                padding: 6px 0;
                text-align: center;
                left: 0;
                top: 0;
                width: 100%;
                position: absolute;
                border-bottom: 1px solid #adadad;
            }
            .accordian fieldset legend:hover {
                background-color: rgba(0,0,0,0.2);
            }

            .accordian[data-active="0"] fieldset[data-step="0"],
            .accordian[data-active="1"] fieldset[data-step="1"],
            .accordian[data-active="2"] fieldset[data-step="2"],
            .accordian[data-active="3"] fieldset[data-step="3"],
            .accordian[data-active="4"] fieldset[data-step="4"],
            .accordian[data-active="5"] fieldset[data-step="5"],
            .accordian[data-active="6"] fieldset[data-step="6"] {
                box-shadow: 0px 0px 5px rgb(0 128 0 / 90%), 0px 0px 10px rgb(0 128 0 / 20%);
            }
            .accordian[data-active="0"] fieldset[data-step="0"] legend,
            .accordian[data-active="1"] fieldset[data-step="1"] legend,
            .accordian[data-active="2"] fieldset[data-step="2"] legend,
            .accordian[data-active="3"] fieldset[data-step="3"] legend,
            .accordian[data-active="4"] fieldset[data-step="4"] legend,
            .accordian[data-active="5"] fieldset[data-step="5"] legend,
            .accordian[data-active="6"] fieldset[data-step="6"] legend {
                background-color: rgb(22 153 14 / 10%);
            }

            th {
                text-align: left;
            }
            td {
                white-space: nowrap;
            }
            td:first-child {
                padding-right: 8px;
            }
            td:last-child {
                width: 100%;
            }

            pre {
                word-break: break-all;
                white-space: break-spaces;
            }
            code {
                font-family: monospace;
                text-decoration: underline;
                word-break: keep-all;
                white-space: nowrap;
                background-color: snow;
            }
            .unstyled-btn{background-color: transparent;border:none;}.abcRioButton{border-radius:1px;box-shadow:0 2px 4px 0 rgba(0,0,0,.25);-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:background-color .218s,border-color .218s,box-shadow .218s;transition:background-color .218s,border-color .218s,box-shadow .218s;-webkit-user-select:none;-webkit-appearance:none;background-color:#fff;background-image:none;color:#262626;cursor:pointer;outline:none;overflow:hidden;position:relative;text-align:center;vertical-align:middle;white-space:nowrap;width:auto}.abcRioButton:hover{box-shadow:0 0 3px 3px rgba(66,133,244,.3)}.abcRioButtonBlue{border:none;color:#fff}.abcRioButtonBlue,.abcRioButtonBlue:hover{background-color:#4285f4}.abcRioButtonBlue:active{background-color:#3367d6}.abcRioButtonLightBlue{background-color:#fff;color:#757575}.abcRioButtonLightBlue:active{background-color:#eee;color:#6d6d6d}.abcRioButtonIcon{float:left}.abcRioButtonBlue .abcRioButtonIcon{background-color:#fff;border-radius:1px}.abcRioButtonSvg{display:block}.abcRioButtonContents{font-family:Roboto,arial,sans-serif;font-size:14px;font-weight:500;letter-spacing:.21px;margin-left:6px;margin-right:6px;vertical-align:top}.abcRioButtonContentWrapper{height:100%;width:100%}.abcRioButtonBlue .abcRioButtonContentWrapper{border:1px solid transparent}.abcRioButtonErrorWrapper,.abcRioButtonWorkingWrapper{display:none;height:100%;width:100%}.abcRioButtonErrorIcon,.abcRioButtonWorkingIcon{margin-left:auto;margin-right:auto}.abcRioButtonErrorState,.abcRioButtonWorkingState{border:1px solid #d5d5d5;border:1px solid rgba(0,0,0,.17);box-shadow:0 1px 0 rgba(0,0,0,.05);color:#262626}.abcRioButtonErrorState:hover,.abcRioButtonWorkingState:hover{border:1px solid #aaa;border:1px solid rgba(0,0,0,.25);box-shadow:0 1px 0 rgba(0,0,0,.1)}.abcRioButtonErrorState:active,.abcRioButtonWorkingState:active{border:1px solid #aaa;border:1px solid rgba(0,0,0,.25);box-shadow:inset 0 1px 0 #ddd;color:#262626}.abcRioButtonWorkingState,.abcRioButtonWorkingState:hover{background-color:#f5f5f5}.abcRioButtonWorkingState:active{background-color:#e5e5e5}.abcRioButtonErrorState,.abcRioButtonErrorState:hover{background-color:#fff}.abcRioButtonErrorState:active{background-color:#e5e5e5}.abcRioButtonErrorState .abcRioButtonErrorWrapper,.abcRioButtonWorkingState .abcRioButtonWorkingWrapper{display:block}.abcRioButtonErrorState .abcRioButtonContentWrapper,.abcRioButtonErrorState .abcRioButtonWorkingWrapper,.abcRioButtonWorkingState .abcRioButtonContentWrapper{display:none} .-webkit-keyframes abcRioButtonWorkingIconPathSpinKeyframes {0% {-webkit-transform: rotate(0deg)}}
            #connectedp263wz8u1unb {
                display: none;
            }
            #not_signed_inp263wz8u1unb {
                display: block;
            }
            #gauth[data-state="connected"] #connectedp263wz8u1unb {
                display: block;
            }
            #gauth[data-state="connected"] #not_signed_inp263wz8u1unb {
                display: none;
            }

            /* HOMEPAGE */


            dl {
                counter-reset: list;
            }
            dt {
                font-weight: bold;
                counter-increment: list;
            }
            dt::before {
                content: counter(list) ": ";
            }
            img {
                height: auto;
                width: 100%;
                max-width: 640px;
            }

            button[disabled] {
                cursor: unset;
            }

            /* SCANNER */

        .flex-container {
            position: relative;
        }
        .scan-container {
            position: relative;
            display: inline-block;
            box-sizing: border-box;
            width: 100vw;
            height: 49vh;
        }
        .target-area {
            visibility: hidden;
            position: absolute;
            width: auto;
            height: 37.5vh;
            top: 50%;
            left: 50%;
            aspect-ratio: 1/1;
            box-sizing: border-box;
            background-color: transparent;
            border: 3px dashed rgb(128,128,128);
            border-radius: 5%;
            transform: translate(-50%,-50%);
            mix-blend-mode: difference;
        }
        .everything-else {
            position: relative;
            display: inline-block;
            box-sizing: border-box;
            width: 100vw;
            height: 49vh;
            padding: 1em;
            overflow-y: scroll;
        }
        .scan-video {
            background-color: grey;
            object-fit: cover;
            width: 100%;
            height: 100%;
        }
        @media (orientation: landscape) {
            .scan-container {
                width: 49vw;
                height: 100vh;
            }
            .target-area {
                height: auto;
                width: 37.5vw;
            }
            .everything-else {
                width: 49vw;
                height: 100vh;
            }
        }
        .hidden {
            visibility: hidden !important;
            display: none !important;
        }
        .camera-container {
            text-align: center;
        }
        .info-container {
            position: relative;
            width: 100%;
            text-align: center;
        }
        .info-container p {
            font-size: 200%;
        }
        table {
            margin: 0 auto;
        }
        td {
            padding-right: 1em;
            width: 50%;
        }
        tr {
            text-align: left;
        }
        .gauth-container {
            position: absolute;
            bottom: 1em;
            right: 3em;
        }
        .btn-start {
            cursor: pointer;
            position: absolute;
            width: 150px;
            height: 40px;
            left: calc(50% - 75px);
            top: calc(50% - 20px);
            border-radius: 20px;
            background-color: #1fa3ec;
            border: 1px solid grey;
            color: white;
        }
        .btn-xl {
            zoom: 2;
            box-shadow: 0 0 10px green;
            animation: pulsate 2s ease-out infinite;
            margin: 4px;
        }
        @-webkit-keyframes pulsate {
            0%   { box-shadow: 0 0 0 green; }
            50%  { box-shadow: 0 0 10px green; }
            100% { box-shadow: 0 0 0 green; }
        }
        .modal {
            width: 100vw;
            height: 100vh;
            height: calc(var(--vh, 1vh) * 100);
            pointer-events: none;
            opacity: 0;
            transition: opacity 300ms;
            color: white;
            text-align: center;
            position: absolute;
            top: 0;
            left: 0;
        }
        .modal-result {
            font-size: 160%;
            padding: 20px;
            overflow-y: scroll;
            overflow-wrap: break-word;
            overflow-wrap: anywhere;
        }
        .modal-helper {
            position: absolute;
            width: 100%;
            bottom: 10px;
        }
        .modal[data-active=true] {
            pointer-events: unset;
            opacity: 1;
        }
        .modal[data-state=success] {
            background-color: #016601;
        }
        .modal[data-state=success]::after {
            content: ' ';
            position: absolute;
            bottom: 10vh;
            display: block;
            background-position: center;
            background-repeat: no-repeat;
            height: 30%;
            width: 100%;
            background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIGZpbGw9IiNGRkYiIHZpZXdCb3g9IjAgMCAzMDUgMzA1Ij48cGF0aCBkPSJNMTUyLjUgMEM2OC41IDAgMCA2OC40IDAgMTUyLjVTNjguNCAzMDUgMTUyLjUgMzA1Yzg0IDAgMTUyLjUtNjguNCAxNTIuNS0xNTIuNVMyMzYuNiAwIDE1Mi41IDB6bTAgMjgwQTEyNy42IDEyNy42IDAgMCAxIDI1IDE1Mi41QzI1IDgyLjIgODIuMiAyNSAxNTIuNSAyNVMyODAgODIuMiAyODAgMTUyLjUgMjIyLjggMjgwIDE1Mi41IDI4MHoiLz48cGF0aCBkPSJtMjE4LjUgOTQtOTAuNiA5MC41LTQxLjQtNDEuNEExMi41IDEyLjUgMCAwIDAgNjkgMTYwLjhsNTAgNTAuMmExMi41IDEyLjUgMCAwIDAgMTcuNyAwbDk5LjQtOTkuNEExMi41IDEyLjUgMCAwIDAgMjE4LjUgOTR6Ii8+PC9zdmc+');
        }
        .modal[data-state=error],.modal[data-state=wait] {
            background-color: #444e4e;
        }
        .modal[data-state=error]::after {
            content: ' ';
            position: absolute;
            bottom: 10vh;
            display: block;
            background-position: center;
            background-repeat: no-repeat;
            height: 30%;
            width: 100%;
            background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIGZpbGw9IiNGRkYiIHZpZXdCb3g9IjAgMCA0OTAgNDkwIj4KICA8cGF0aCBkPSJNMjQ1IDBhMjQ1IDI0NSAwIDEgMCAwIDQ5MCAyNDUgMjQ1IDAgMCAwIDAtNDkwem0wIDQ1OS40Yy0xMTguMiAwLTIxNC40LTk2LjItMjE0LjQtMjE0LjRTMTI2LjggMzAuNiAyNDUgMzAuNiA0NTkuNCAxMjYuOCA0NTkuNCAyNDUgMzYzLjIgNDU5LjQgMjQ1IDQ1OS40eiIvPgogIDxwYXRoIGQ9Im0yNjYuOCAyODcgOC40LTE3Mi4xaC02MC40bDguNyAxNzIuMXptLTIxLjYgMTlhMzMgMzMgMCAwIDAtMzQuMiAzNC41IDMzIDMzIDAgMCAwIDM0LjIgMzQuNmMyMC41IDAgMzMuOC0xNC44IDMzLjgtMzQuNS0uNC0yMC4yLTEzLjctMzQuNi0zMy44LTM0LjZ6Ii8+Cjwvc3ZnPg==');
        }
        .modal[data-state=wait]::after {
            content: ' ';
            position: absolute;
            bottom: 10vh;
            display: block;
            background-position: center;
            background-repeat: no-repeat;
            height: 30%;
            width: 100%;
            background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIGZpbGw9IiNGRkYiIHZpZXdCb3g9IjAgMCAxNzkuMyAxNzkuMyI+PHBhdGggZD0iTTg5LjYgODIgNjYgNjkuNVY0OS42aDE1djEwLjlsOC43IDQuNSA4LjgtNC41VjQ5LjZoMTV2MjBMODkuNiA4MnpNNjYgMTA5LjdWMTUwaDE1di0zMS4ybDguNy00LjYgOC44IDQuNlYxNTBoMTV2LTQwLjNMODkuNiA5Ny4zIDY2IDEwOS43em0tOSA2OS42SDM1LjZ2LTE1SDQzVjEwM2ExNCAxNCAwIDAgMSA3LjYtMTIuNGwxLjktMS0yLTFBMTQgMTQgMCAwIDEgNDMgNzYuMVYxNWgtNy4zVjBoMTA3Ljl2MTVoLTcuMnY2MS4yYTE0IDE0IDAgMCAxLTcuNiAxMi40bC0yIDEgMiAxYTE0IDE0IDAgMCAxIDcuNiAxMi41djYxLjJoNy4ydjE1SDU3em0xLTE1aDYzLjR2LTYwLjZsLTI2LjgtMTQgMjYuOC0xNFYxNUg1Ny45djYwLjZsMjYuOCAxNC0yNi44IDE0djYwLjd6Ii8+PC9zdmc+');
            animation: waitSpin 2s cubic-bezier(0.78, 0.06, 0.16, 0.94) 1s infinite normal forwards;
        }
        @keyframes waitSpin {
            0% {
                transform: rotate(0deg);
            }
            100% {
                transform: rotate(180deg);
            }
        }
        .modal[data-state=warn] {
            background-color: #c16a00;
        }
        .modal[data-state=warn]::after {
            content: ' ';
            position: absolute;
            bottom: 10vh;
            display: block;
            background-position: center;
            background-repeat: no-repeat;
            height: 30%;
            width: 100%;
            background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIGZpbGw9IiNGRkYiIHZpZXdCb3g9IjAgMCA0OTAgNDkwIj4KICA8cGF0aCBkPSJNMjQ1IDBhMjQ1IDI0NSAwIDEgMCAwIDQ5MCAyNDUgMjQ1IDAgMCAwIDAtNDkwem0wIDQ1OS40Yy0xMTguMiAwLTIxNC40LTk2LjItMjE0LjQtMjE0LjRTMTI2LjggMzAuNiAyNDUgMzAuNiA0NTkuNCAxMjYuOCA0NTkuNCAyNDUgMzYzLjIgNDU5LjQgMjQ1IDQ1OS40eiIvPgogIDxwYXRoIGQ9Im0yNjYuOCAyODcgOC40LTE3Mi4xaC02MC40bDguNyAxNzIuMXptLTIxLjYgMTlhMzMgMzMgMCAwIDAtMzQuMiAzNC41IDMzIDMzIDAgMCAwIDM0LjIgMzQuNmMyMC41IDAgMzMuOC0xNC44IDMzLjgtMzQuNS0uNC0yMC4yLTEzLjctMzQuNi0zMy44LTM0LjZ6Ii8+Cjwvc3ZnPg==');
        }
        .modal[data-state=fail] {
            background-color: #8b0000;
        }
        .modal[data-state=fail]::after {
            content: ' ';
            position: absolute;
            bottom: 10vh;
            display: block;
            background-position: center;
            background-repeat: no-repeat;
            height: 30%;
            width: 100%;
            background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIGZpbGw9IiNGRkYiIHZpZXdCb3g9IjAgMCAzMDUgMzA1Ij4KICA8cGF0aCBkPSJNMTUyLjUgMEM2OC41IDAgMCA2OC40IDAgMTUyLjVTNjguNCAzMDUgMTUyLjUgMzA1Yzg0IDAgMTUyLjUtNjguNCAxNTIuNS0xNTIuNVMyMzYuNiAwIDE1Mi41IDB6bTAgMjgwQTEyNy42IDEyNy42IDAgMCAxIDI1IDE1Mi41QzI1IDgyLjIgODIuMiAyNSAxNTIuNSAyNVMyODAgODIuMiAyODAgMTUyLjUgMjIyLjggMjgwIDE1Mi41IDI4MHoiLz4KICA8cGF0aCBkPSJtMTcwLjIgMTUyLjUgNDMuMS00My4xYTEyLjUgMTIuNSAwIDEgMC0xNy43LTE3LjdsLTQzLjEgNDMuMS00My4xLTQzLjFhMTIuNSAxMi41IDAgMCAwLTE3LjcgMTcuN2w0My4xIDQzLjEtNDMuMSA0My4xYTEyLjUgMTIuNSAwIDAgMCAxNy43IDE3LjdsNDMuMS00My4xIDQzLjEgNDMuMWExMi41IDEyLjUgMCAwIDAgMTcuNyAwIDEyLjUgMTIuNSAwIDAgMCAwLTE3LjdsLTQzLjEtNDMuMXoiLz4KPC9zdmc+');
        }