html,body{height:100%}body{margin:0;background-color:#222;font-family:Helvetica Neue,sans-serif}header{top:0;left:0;right:0;display:flex;flex-direction:row;justify-content:space-between;color:#fff;font-family:Helvetica Neue,sans-serif;font-weight:700}header section{cursor:pointer;padding:20px;font-size:25px;display:flex;justify-content:center;align-items:center}header section .icon{margin:0 10px;cursor:pointer;display:flex}header aside{background-color:#222222f2;box-shadow:0 0 20px transparent;position:fixed;top:0;bottom:0;width:100vw;max-width:500px;transition:all .5s;z-index:1000;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-items:center}header aside.left{left:-100vw}header aside.left .close{left:0}header aside.left.active{left:0}header aside.right{right:-100vw}header aside.right .close{right:0}header aside.right.active{right:0}header aside.active{box-shadow:0 0 20px #00000080}header aside .close{cursor:pointer;padding:20px 35px;font-size:25px;position:absolute;display:inline-block;top:0}header aside .title{padding:50px 50px 5px;border-bottom:2px solid white;margin-bottom:0}header aside .players{overflow-y:scroll;width:100%;padding-top:45px}header aside .players .player{text-align:center;padding:0 20px}header aside .players .player.offline{opacity:.4}.svg-icon{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:.9;stroke-linecap:round;stroke-linejoin:round}.svg-icon circle{fill:currentColor;stroke:none}.init,.setup{font-family:Helvetica Neue,sans-serif;font-weight:700;color:#fff;position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:space-around}.init .title,.setup .title{font-size:50px;text-align:left}.init section,.setup section{text-align:center}.init .controls,.setup .controls{display:flex;flex-direction:column}.init .secondary,.setup .secondary{opacity:.5}.init .game,.setup .game{margin-bottom:10px;text-align:center}.init .error,.setup .error{color:#2ecc71;font-size:14px;font-weight:400}.field{position:relative;display:inline-block;width:180px;padding-top:18px;text-align:left}.field input{box-sizing:border-box;width:100%;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.7);color:#fff;font-family:Helvetica Neue,sans-serif;font-size:16px;font-weight:400;padding:6px 0 7px;outline:none;border-radius:0}.field input:focus{border-bottom:2px solid #2ecc71;padding-bottom:6px}.field .label{position:absolute;left:0;top:24px;color:#ffffffb3;font-size:16px;font-weight:400;pointer-events:none;transition:all .15s ease-out}.field.filled .label,.field input:focus+.label{top:0;font-size:12px}.field input:focus+.label{color:#2ecc71}.available-games .detail{font-size:10px;opacity:.5;margin-top:-15px;margin-bottom:20px}.text{font-family:Helvetica Neue,sans-serif;font-weight:700;color:#fff;font-size:20px;padding-bottom:5px;margin-bottom:20px}.big-text{font-family:Helvetica Neue,sans-serif;font-weight:700;color:#fff;font-size:40px;padding-bottom:10px;margin-bottom:40px}.button{display:inline-block;text-align:center;cursor:pointer;transition:all linear .25s;opacity:1}.button span{border-bottom:2px solid white}.button.disabled{opacity:.5}.table{position:fixed;inset:0;display:flex;flex-direction:column}.cards{display:flex;flex-direction:row;align-items:center;justify-content:center;flex-wrap:wrap}.cards.question{flex-direction:column}.cards.question .master-name{font-family:Helvetica Neue,sans-serif;font-weight:700;color:#fff;opacity:.2}.waiting{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1}.animation{width:100px;margin:0 auto}p{font-family:Helvetica Neue,sans-serif;font-weight:700;font-size:18px;color:#fff;text-align:center;max-width:80vw;margin:0 auto 30px}main{flex:1 0 auto;display:flex;flex-direction:column}main.master{flex-wrap:nowrap;justify-content:flex-start;overflow-x:scroll;overflow-y:visible;-ms-overflow-style:none;scrollbar-width:none}main.master::-webkit-scrollbar{display:none}main.master.winner{flex-direction:column;justify-content:center;text-align:center}main.master.winner .text{margin-bottom:5px;margin-top:20px}main.master.winner .big-text{margin-bottom:10px}main.master .master-waiting{width:100vw}main.master .master-waiting .animation{width:100px}main.player .question{flex:1 0 auto}.hand{flex-wrap:nowrap;justify-content:flex-start;overflow-x:scroll;overflow-y:visible;min-height:35vh;padding:0 5px;-ms-overflow-style:none;scrollbar-width:none}.hand::-webkit-scrollbar{display:none}footer{font-family:Helvetica Neue,sans-serif;font-weight:700;color:#fff;text-align:center;font-size:18px;margin-bottom:20px;padding:10px 0}.instruction{padding:10px}.ready{color:#2ecc71;cursor:pointer;text-decoration:underline;text-underline-offset:4px}@media screen and (min-width:1400px){.answers{justify-content:center}}.card.question{background-color:#000;border:1px solid black;color:#fff}.card.question caption .answer{display:block;border-bottom:1px solid white;height:1.7857142857vh;padding-bottom:5px;margin-top:.3571428571vh;margin-bottom:.7142857143vh;color:#ffffff4d;text-align:center}.card.question caption .answer.colon,.card.question caption .answer.question-mark,.card.question caption .answer.exclamation-mark{margin-right:10px;position:relative}.card.question caption .answer.colon:after{content:":";color:#fff;position:absolute;padding-left:5px;left:100%}.card.question caption .answer.question-mark:after{content:"?";color:#fff;position:absolute;padding-left:2px;left:100%}.card.question caption .answer.exclamation-mark:after{content:"!";color:#fff;position:absolute;padding-left:2px;left:100%}.card:not(.question){cursor:pointer}.card.answer{background-color:#000;border:5px solid black;color:#fff;margin:1.1904761905vh;width:35.7142857143vh;height:50vh;border-radius:1.7857142857vh;padding:3.5714285714vh}.card.answer caption .answer{display:block;font-style:italic;color:#3498db;font-size:1.7857142857vh;margin-top:.3571428571vh;margin-bottom:.7142857143vh}.card.selected{border-color:#2ecc71;margin-top:-5%}.card{box-sizing:border-box;position:relative;background-color:#fff;border:5px solid white;color:#000;margin:.7142857143vh;transition:all .4s;width:21.4285714286vh;height:30vh;border-radius:1.0714285714vh;box-shadow:0 0 20px #00000080;font-family:Helvetica Neue,sans-serif;font-weight:700;font-size:1.7857142857vh;padding:2.1428571429vh;display:flex;flex-direction:column}.card caption{display:block;flex:1 0 auto;text-align:left}.card footer{position:relative;display:flex;flex-direction:row;align-items:center;margin:0;padding:0;font-size:inherit;color:inherit}.card footer img{height:2.1428571429vh}.card footer span{white-space:nowrap;margin-left:.7142857143vh;font-size:1.0714285714vh}.card footer .position{position:absolute;bottom:.4em;right:0;color:#2ecc71;font-size:3em}@media screen and (min-width:1000px){.card.question caption .answer{height:1.6666666667vw;margin-top:.3333333333vw;margin-bottom:.6666666667vw}.card.answer{margin:.8333333333vw;width:25vw;height:35vw;border-radius:1.25vw;padding:2.5vw}.card.answer caption .answer{font-size:1.6666666667vw;margin-top:.3333333333vw;margin-bottom:.6666666667vw}.card{margin:.6666666667vw;width:20vw;height:28vw;border-radius:1vw;font-size:1.6666666667vw;padding:2vw}}@media screen and (min-width:1000px)and (hover:hover){.card:not(.question):hover{margin-top:-.6666666667vw}}@media screen and (min-width:1000px){.card footer img{height:2vw}.card footer span{margin-left:.6666666667vw;font-size:1vw}}@media screen and (min-width:1400px){.card.question caption .answer{height:1.0833333333vw;margin-top:.2166666667vw;margin-bottom:.4333333333vw}.card.answer{margin:.6666666667vw;width:20vw;height:28vw;border-radius:1vw;padding:2vw}.card.answer caption .answer{font-size:1.0833333333vw;margin-top:.2166666667vw;margin-bottom:.4333333333vw}.card{margin:.4333333333vw;width:13vw;height:18.2vw;border-radius:.65vw;font-size:1.0833333333vw;padding:1.3vw}}@media screen and (min-width:1400px)and (hover:hover){.card:not(.question):hover{margin-top:-.4333333333vw}}@media screen and (min-width:1400px){.card footer img{height:1.3vw}.card footer span{margin-left:.4333333333vw;font-size:.65vw}}