@import"https://fonts.googleapis.com/css2?family=Hind:wght@400;500;600;700&display=swap";.turn-your-device{display:none!important;position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#191919;color:#fff;z-index:1000;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:2rem}.turn-your-device h1{font-size:2rem;margin-top:2rem}.turn-your-device svg{width:8rem;height:auto}@media (orientation: landscape){.turn-your-device{display:flex!important}}.loading-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000c;display:flex;justify-content:center;align-items:center;z-index:9999}.loading-overlay .loading-spinner{display:flex;flex-direction:column;align-items:center;color:#fff}.loading-overlay .loading-spinner .spinner{width:50px;height:50px;border:5px solid #f3f3f3;border-top:5px solid #e21617;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}.loading-overlay .loading-spinner p{font-size:18px;font-weight:500}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}html{font-size:62.5%}html body{margin:0;padding:0;box-sizing:border-box;background:#191919;width:100vw;min-height:100vh;color:#fff;font-family:Hind,sans-serif;font-size:1.6rem}html body *{box-sizing:border-box;margin:0}html body #root,html body #root .page-container{width:100vw;min-height:100vh}html body #root .page-container.classroom-section{display:flex;flex-direction:column;justify-content:space-around;align-items:center;height:100vh}html body #root .page-container.classroom-section header{display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;width:100vw;height:10rem}html body #root .page-container.classroom-section header h1{margin-top:1rem;font-size:2rem}html body #root .page-container.classroom-section header img{height:6rem;width:auto!important}html body #root .page-container.classroom-section header button{background:transparent;border:0;cursor:pointer;outline:0;color:#fff;font-size:inherit;font-family:Hind,sans-serif;display:flex;align-items:center;margin-top:1rem}html body #root .page-container.classroom-section header button svg{height:2rem;width:auto;margin-right:.5rem;position:relative;top:-.2rem}html body #root .page-container.classroom-section header button p{margin:0}html body #root .page-container.classroom-section footer{width:100vw;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1rem}html body #root .page-container.classroom-section footer img{height:8rem}html body #root .page-container.classroom-section footer .recap-actions{margin-top:1rem;display:flex;flex-direction:column;justify-content:center;list-style:none;padding-left:0}html body #root .page-container.classroom-section footer .recap-actions li{margin:.5rem 0;width:100%}html body #root .page-container.classroom-section footer .recap-actions li button{background-color:#4ed964;width:100%;border:0;cursor:pointer;outline:0;color:#fff;font-weight:700;padding:1rem 2rem;border-radius:999rem}html body #root .page-container.classroom-section footer .recap-actions li:nth-child(2) button{background-color:#ff4e4e}html body #root .page-container.classroom-section .camera-intro{display:flex;flex-direction:column;align-items:center;position:fixed;top:0;left:0;z-index:999;background-color:#191919;width:100vw;height:100vh;overflow-x:hidden;padding:2rem 4rem}html body #root .page-container.classroom-section .camera-intro .intro-container{display:flex;flex-direction:column;align-items:center;max-width:400px;width:100%;overflow-y:auto;overflow-x:hidden;height:100vh;justify-content:center}html body #root .page-container.classroom-section .camera-intro .intro-container:not(:has(>:last-child:in-viewport)){justify-content:flex-start}html body #root .page-container.classroom-section .camera-intro .intro-container .logo{height:6rem;margin-bottom:3rem}html body #root .page-container.classroom-section .camera-intro .intro-container>p{text-align:left;width:100%;margin:1rem}html body #root .page-container.classroom-section .camera-intro .intro-container ul{list-style:none;padding-left:0;width:100%}html body #root .page-container.classroom-section .camera-intro .intro-container ul li{color:#fff;display:flex;font-weight:700;align-items:center;padding:1rem;margin:1rem 0}html body #root .page-container.classroom-section .camera-intro .intro-container ul li img{width:7rem;height:7rem;margin-right:1rem;object-fit:contain}html body #root .page-container.classroom-section .camera-intro .intro-container button{margin-top:3rem;padding:1rem 2rem;border:0;border-radius:999rem;background-color:#e21617;color:#fff;font-weight:700;cursor:pointer;outline:0}html body #root .page-container.classroom-section .camera-container{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#191919;position:relative;overflow:visible;flex-wrap:wrap}html body #root .page-container.classroom-section .camera-container video{width:100vw;height:100vw;max-width:400px;max-height:400px;object-fit:cover}html body #root .page-container.classroom-section .camera-container .centrage{width:100vw;height:100vw;max-width:400px;max-height:400px;position:absolute;z-index:2}html body #root .page-container.classroom-section .camera-container .switch-camera{position:absolute;bottom:1rem;right:1rem;border:0;background:#0000004d;border-radius:999rem;width:4rem;height:4rem;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3}html body #root .page-container.classroom-section .camera-container .switch-camera svg{width:2rem;height:auto}html body #root .page-container.classroom-section .camera-container .scan-template-container{width:100vw;height:100vw;max-width:400px;max-height:400px;display:flex;align-items:center;justify-content:center;position:absolute;top:0;left:0;pointer-events:none}html body #root .page-container.classroom-section .camera-container .scan-template-container .scan-template-image{height:90%;opacity:.5}html body #root .page-container.classroom-section .checkpoints{display:flex;width:100vw;max-width:400px;list-style:none;padding-left:0;justify-content:center;align-items:center}html body #root .page-container.classroom-section .checkpoints li{width:calc(7.1428571429vw - 1rem);max-width:calc(28.5714285714px - 1rem);margin:.5rem;height:calc(7.1428571429vw - 1rem);max-height:calc(28.5714285714px - 1rem);background-color:#ff4e4e;transition:background-color .2s;border-radius:999rem}html body #root .page-container.classroom-section .checkpoints li.done{background-color:#4ed964}html body #root .page-container.classroom-section .camera-recap{width:100vw;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;padding:.5rem}html body #root .page-container.classroom-section .camera-recap div{width:calc(33% - 1rem);margin:.5rem}html body #root .page-container.classroom-section .camera-recap div img{width:100%;height:auto}html body #root .page-container.classroom-section .camera-recap div p{opacity:.7;text-align:center}html body #root .page-container.story-section{display:flex;flex-direction:column;justify-content:space-around;align-items:center}html body #root .page-container.story-section header{display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;width:100vw;height:calc((100vh - 100vw)/2);min-height:calc((100vh - 400px)/2)}html body #root .page-container.story-section header h1{margin-top:1rem;font-size:2rem}html body #root .page-container.story-section header img{height:6rem;width:auto!important}html body #root .page-container.story-section header p{margin:0}html body #root .page-container.story-section .camera-container{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#191919;position:relative;overflow:hidden;flex-wrap:wrap}html body #root .page-container.story-section .camera-container video{width:100vw;height:100vw;max-width:400px;max-height:400px;object-fit:cover}html body #root .page-container.story-section .camera-container .centrage{width:100vw;height:100vw;max-width:400px;max-height:400px;position:absolute;z-index:2;transform:scale(1.3)}html body #root .page-container.story-section .camera-container .switch-camera{position:absolute;bottom:1rem;right:1rem;border:0;background:#0000004d;border-radius:999rem;width:4rem;height:4rem;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:3}html body #root .page-container.story-section .camera-container .switch-camera svg{width:2rem;height:auto}html body #root .page-container.story-section .camera-container .preview{position:absolute;z-index:2;width:100vw;height:100vw;max-height:400px;max-width:400px;top:0;left:0}html body #root .page-container.story-section .camera-container .story-recap h2{font-size:2rem;text-align:center;margin-bottom:1rem}html body #root .page-container.story-section .camera-container .story-recap ul{display:flex;list-style:none;padding-left:0;width:100vw;max-width:400px;padding:0 .5rem}html body #root .page-container.story-section .camera-container .story-recap ul li{width:calc(33.3333333333% - .5rem);margin:.25rem;padding:0}html body #root .page-container.story-section .camera-container .story-recap ul li button{background:transparent;border:0;cursor:pointer;outline:0;padding:0;border:solid .3rem #191919;border-radius:1rem;overflow:hidden}html body #root .page-container.story-section .camera-container .story-recap ul li button.active{border:solid .3rem white}html body #root .page-container.story-section .camera-container .story-recap ul li button img{width:100%;height:100%;object-fit:cover;display:block}html body #root .page-container.story-section .camera-container .scan-template-container{width:100vw;height:100vw;max-width:400px;max-height:400px;display:flex;align-items:center;justify-content:center;position:absolute;top:0;left:0;pointer-events:none}html body #root .page-container.story-section .camera-container .scan-template-container .scan-template-image{height:90%;opacity:.5}html body #root .page-container.story-section footer{height:calc((100vh - 100vw)/2);min-height:calc((100vh - 400px)/2);display:flex;align-items:center;justify-content:center;flex-direction:column}html body #root .page-container.story-section footer .capture-button{background:#000;width:8rem;height:8rem;display:flex;align-items:center;justify-content:center;padding:1rem;outline:0;cursor:pointer;border:solid .5rem rgb(148,148,148);border-radius:999rem}html body #root .page-container.story-section footer .capture-button img{width:75%;height:auto}html body #root .page-container.story-section footer .recap-actions{margin-top:1rem;display:flex;flex-direction:column;justify-content:center;list-style:none;padding-left:0}html body #root .page-container.story-section footer .recap-actions li{margin:.5rem 0;width:100%}html body #root .page-container.story-section footer .recap-actions li button{background-color:#4ed964;width:100%;border:0;cursor:pointer;outline:0;color:#fff;font-weight:700;padding:1rem 2rem;border-radius:999rem}html body #root .page-container.story-section footer .recap-actions li:nth-child(2) button{background-color:#ff4e4e}html body #root .flash{position:fixed;inset:0;width:100vw;height:100vh;z-index:999;background:#fffc;opacity:0;transition:opacity .2s;pointer-events:none}html body #root .flash.active{opacity:1}@keyframes flash-effect{0%{opacity:0}10%{opacity:1}to{opacity:0}}.flash.active{animation:flash-effect .5s}#root>div{display:flex;justify-content:center;align-items:center;flex-direction:column;width:100vw;min-height:100vh;padding:2rem}body header{padding:2rem;display:flex;justify-content:center}body header img{width:80%;max-width:10rem}body .page-container{min-height:auto!important}body .page-container h1{width:calc(100% - 4rem);text-align:center;display:block;margin:0 auto 3rem}body .page-container form{display:flex;flex-direction:column;justify-content:center;align-items:center}body .page-container form input{width:100%;max-width:20rem;padding:1rem;font-size:1.6rem;border-radius:.5rem;border:0;outline:0;background-color:#000;color:#fff;text-align:center;margin-bottom:3rem}body .page-container form button{width:8rem;height:8rem;font-size:2rem;font-weight:700;border-radius:9999px;border:0;outline:0;background-color:#80171e;color:#fff}body .page-container form button:hover{background:transparent}body .page-container.login-section{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh}body .page-container.login-section header{padding:0 2rem 2rem}body .page-container.login-section header img{width:auto;max-width:8rem}body .page-container.home-section ul{list-style:none;padding-left:0}body .page-container.home-section ul li{width:100%;list-style:none;padding-left:0;background-color:#111}body .page-container.home-section ul li:nth-child(odd){background-color:transparent}body .page-container.home-section nav ul{background-color:#111;height:6rem;display:flex;justify-content:center;align-items:center}body .page-container.home-section nav ul li{width:max-content}body .page-container.home-section nav ul li button{font-size:1.6rem;background-color:#060606;border:0;outline:0;padding:1rem 1.5rem;color:#fff;margin:0 1rem}body .page-container.home-section nav ul li button.selected{background-color:#80171e}body .page-container.home-section .clients li{padding:1rem}body .page-container.home-section .clients li a{color:#fff;text-decoration:none;font-size:1.8rem;text-align:center;font-weight:700;position:relative;width:100%;display:flex;justify-content:center;align-items:center}body .page-container.home-section .clients li a p{width:100%}body .page-container.home-section .clients li a span{display:block;opacity:.8;font-weight:400;display:flex;justify-content:center;align-items:center;text-align:center}body .page-container.home-section .clients li a span svg{height:1.6rem;margin-right:.2rem;position:relative;top:-.2rem}body .page-container.home-section .clients li a .remove-button{width:5rem;height:5rem;background-color:#000;display:flex;justify-content:center;align-items:center;z-index:0;border:0;outline:0;border-radius:.5rem}body .page-container.home-section .clients li a .remove-button img{height:60%;width:auto;display:block}body .page-container.home-section .clients li.no-client{text-align:center;padding:2rem;font-size:1.6rem;color:#666}#root>div{display:flex;justify-content:center;align-items:center;flex-direction:column;width:100vw;height:100vh;padding:2rem}#root>div h1{font-size:2.2rem;font-weight:400;text-align:center}.success-checkmark{width:80px;height:115px;margin:0 auto}.success-checkmark .check-icon{width:80px;height:80px;position:relative;border-radius:50%;box-sizing:content-box;border:4px solid #4CAF50}.success-checkmark .check-icon:before{top:3px;left:-2px;width:30px;transform-origin:100% 50%;border-radius:100px 0 0 100px}.success-checkmark .check-icon:after{top:0;left:30px;width:60px;transform-origin:0 50%;border-radius:0 100px 100px 0;animation:rotate-circle 4.25s ease-in}.success-checkmark .check-icon:before,.success-checkmark .check-icon:after{content:"";height:100px;position:absolute;background:#191919;transform:rotate(-45deg)}.success-checkmark .check-icon .icon-line{height:5px;background-color:#4caf50;display:block;border-radius:2px;position:absolute;z-index:10}.success-checkmark .check-icon .icon-line.line-tip{top:46px;left:14px;width:25px;transform:rotate(45deg);animation:icon-line-tip .75s}.success-checkmark .check-icon .icon-line.line-long{top:38px;right:8px;width:47px;transform:rotate(-45deg);animation:icon-line-long .75s}.success-checkmark .check-icon .icon-circle{top:-4px;left:-4px;z-index:10;width:80px;height:80px;border-radius:50%;position:absolute;box-sizing:content-box;border:4px solid rgba(76,175,80,.5)}.success-checkmark .check-icon .icon-fix{top:8px;width:5px;left:26px;z-index:1;height:85px;position:absolute;transform:rotate(-45deg);background-color:#191919}@keyframes rotate-circle{0%{transform:rotate(-45deg)}5%{transform:rotate(-45deg)}12%{transform:rotate(-405deg)}to{transform:rotate(-405deg)}}@keyframes icon-line-tip{0%{width:0;left:1px;top:19px}54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}to{width:25px;left:14px;top:45px}}@keyframes icon-line-long{0%{width:0;right:46px;top:54px}65%{width:0;right:46px;top:54px}84%{width:55px;right:0;top:35px}to{width:47px;right:8px;top:38px}}
