html,body,*{margin:0;padding:0;box-sizing:border-box}body{background-color:#black;position:relative}h1,h2,p,a{text-align:center;color:#444;font-family:Roboto,Tahoma,Arial,sans-serif}h1{font-size:3em;margin:0 0 0.2em 0;font-variant:small-caps}h2{font-size:1.8em;margin:0 0 1em 0}pre{color:#444;max-width:500px;margin:1em auto}main{min-height:100vh;display:flex;align-items:center;justify-content:center}main>section{display:none;width:100vw;padding:2em}main>section.active{display:block}main>section#incompatible{padding-bottom:5em}@media screen and (max-width: 600px){main>section{padding-bottom:8em}}footer{position:absolute;bottom:0;left:0;right:0;padding:1em;font-size:0.8em;text-align:left}footer p,footer a{color:#919191}#popup{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background-color:rgba(0,0,0,0);pointer-events:none;transition:background-color 0.2s ease}#popup.active{background-color:rgba(0,0,0,0.4);pointer-events:all}#popup.active #content{transform:scale(1);opacity:1}#popup #content{max-width:1000px;padding:2em;border-radius:10px;background-color:#eb0909;-webkit-box-shadow:0px 0px 33px -10px rgba(0,0,0,0.75);-moz-box-shadow:0px 0px 33px -10px rgba(0,0,0,0.75);box-shadow:0px 0px 33px -10px rgba(0,0,0,0.75);transition:transform 0.2s ease, opacity 0.2s ease;transform:scale(0.7);opacity:0}#popup #content .buttons{text-align:center;margin:1em auto 0 auto}#popup #content .buttons button{margin:1em;padding:1em 1.5em;color:#EEEEEE;border-radius:5px;border:0;cursor:pointer;font-family:Roboto,Tahoma,Arial,sans-serif;font-size:0.9em}#popup #content .buttons button.yes{background-color:#36a252}#popup #content .buttons button.yes:focus{background-color:#32974c}#popup #content .buttons button.yes:hover{background-color:#3aad58}#popup #content .buttons button.no{background-color:#e45252}#popup #content .buttons button.no:focus{background-color:#e24545}#popup #content .buttons button.no:hover{background-color:#e65f5f}main section.buttons{display:flex;flex-direction:row;align-items:center;justify-content:center;margin:2em}main section.buttons button{width:20vw;max-width:200px;min-width:140px;height:20vw;max-height:200px;min-height:140px;margin:5vh 2vw 5vh 2vw;border-radius:50%;background-color:#cdcdce;border:0px;cursor:default;color:#888;font-family:Roboto,Tahoma,Arial,sans-serif;transition:background-color 0.2s ease, border 0.2s ease}main section.buttons button.active{background-color:#3237d4;cursor:pointer;color:#eee}main section.buttons button.active:focus{background-color:#2b30cc}main section.buttons button.active:hover{background-color:#3f43d7}main section.buttons button.complete{background-color:#36a252;cursor:pointer;color:#eee}main section.buttons button.complete:focus{background-color:#339a4e}main section.buttons button.complete:hover{background-color:#39aa56}main section.buttons button.complete span{color:#36a252;font-size:0;width:38px;height:57px;padding-top:6px;margin:0px auto}main section.buttons button.complete span:before{content:' ';left:50px;display:block;box-sizing:content-box;width:28px;height:15px;border:5px solid white;border-top:0;border-right:0;transform:translate(0px, 18px) rotate(-45deg);transform-origin:left top;-ms-animation:checkmark-animation 0.6s 1 ease;-webkit-animation:checkmark-animation 0.6s 1 ease;animation:checkmark-animation 0.6s 1 ease}@-ms-keyframes checkmark-animation{main section.buttons button.complete span 0%{height:0;width:0;opacity:1}main section.buttons button.complete span 50%{height:15px;width:0;opacity:1}main section.buttons button.complete span 100%{height:15px;width:28px;opacity:1}}@-webkit-keyframes checkmark-animation{0%{height:0;width:0;opacity:1}50%{height:15px;width:0;opacity:1}100%{height:15px;width:28px;opacity:1}}@keyframes checkmark-animation{0%{height:0;width:0;opacity:1}50%{height:15px;width:0;opacity:1}100%{height:15px;width:28px;opacity:1}}main section.buttons button:focus{outline:none}main section.buttons button span{font-size:3em;display:block;margin:0 0 0.2em 0}@media screen and (max-width: 600px){main section.buttons{flex-direction:column;margin:4vh}main section.buttons button{margin:2vh 2vw 2vh 2vw}}