@font-face{font-display:swap;font-family:llamarollFont;src:url(/img/font/Rollama-final-Regular.ttf)}body{font-family:llamarollFont}.text-yellow{color:#ffd849}.text-white{color:#fff}.text-purple{color:#733381}*,:after,:before{box-sizing:border-box}body{align-items:center;background-color:#414141;display:flex;flex-direction:row;justify-content:center;margin:0;min-height:100vh;overflow-x:hidden;padding:0}.game-container{flex:1;margin-left:10px;margin-right:10px;max-width:1000px;padding-bottom:0;padding-top:0}img{max-width:100%}.fadingBackgroundAnimation{animation:gradient 25s ease infinite;background:linear-gradient(-45deg,#ffd849,#fbb149,#994fb2,#7bb662);background-size:200% 200%}.fadingBackgroundAnimationDark{background:linear-gradient(45deg,#404040,#589c48,#994fb2,#733381)}.fadingBackgroundAnimationBees{animation:gradient 15s ease infinite;background:linear-gradient(45deg,#838181,#ffd849,#f8a96d,#646300);background-size:400% 400%}.fadingBackgroundAnimationlight{background:linear-gradient(45deg,#fbb149,#f58024,#f8a96d,#fff)}.overlay{align-items:center;background-color:rgba(0,0,0,.6);bottom:0;display:flex;flex-direction:column;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:100}.custom-modal,.pause-modal{background-color:#fbb149;border-radius:1rem;box-shadow:5px 5px #733381;color:#404040;margin:0 auto;max-height:85vh;max-width:700px;overflow-y:auto;padding:20px;position:relative;width:95%}.custom-modal__header{align-items:center;display:flex;flex-direction:column;justify-content:space-evenly;text-align:center}.custom-modal__header__two-col{display:flex;flex-direction:row;justify-content:space-evenly;width:100%}.custom-modal__header__image{border-radius:25px;margin-bottom:10px;max-width:250px;width:100%}.custom-modal__title{font-size:3rem}.custom-modal__time{align-items:flex-start;background-color:rgba(251,177,73,.6);border-radius:15px;box-shadow:0 0 10px rgba(0,0,0,.2);display:flex;font-size:1.5rem;padding:5px 10px 0;position:absolute;right:20px;top:20px}.custom-modal__content{font-size:1.4rem;text-align:center}.custom-modal__content p{margin-bottom:.5rem}.custom-modal__list{font-size:1.6rem;line-height:1.1;list-style:none;margin:0;padding:0}.custom-modal__list li:before{content:"- "}.custom-modal__footer{align-items:center;-moz-column-gap:5px;column-gap:5px;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-evenly;row-gap:12px}.custom-modal__footer>*{border-radius:15px;box-shadow:5px 5px #733381;height:70px!important;margin:0;max-width:180px;padding:0}.custom-modal__footer>*>img{height:100%}.custom-modal__footer .button{padding:0}.custom-modal__footer .start-button{border:none;padding:0 10px}.custom-modal__footer .teacherbutton{height:70px}@media (max-height:500px){.custom-modal__header{flex-direction:row}.custom-modal__header__image{max-width:200px}.custom-modal__list{font-size:1.4rem}}@media (max-width:576px){.custom-modal,.pause-modal{padding:15px 10px}.custom-modal__header{flex-direction:column}.custom-modal__header__image{max-width:220px}.custom-modal__header__two-col{flex-direction:column}}.pause-modal{align-items:center;display:flex;flex-direction:column;justify-content:center;max-width:400px;z-index:10}.pause-modal .modal-title{display:block;margin:0 auto;width:70%}.pause-modal .modal-text{font-size:28px;font-weight:700;margin:15px 0;text-align:center}.pause-modal .modal-text button{all:unset}.pause-modal .modal-text a{color:inherit;text-decoration:none}.pause-modal .modal-text>:focus,.pause-modal .modal-text>:hover{cursor:pointer;text-decoration:underline}.pause-modal .action-list{display:flex;flex-direction:column;gap:10px}@media only screen and (max-width:380px){.pause-modal a{display:flex;justify-content:center}.pause-modal a img{max-width:80px!important}.pause-modal .modal-title{width:40%}.pause-modal .modal-text{font-size:20px;line-height:1}}@media only screen and (min-device-width:375px) and (max-device-width:667px) and (orientation:landscape){.pause-modal a{display:flex;justify-content:center}.pause-modal a img{max-width:80px!important}.pause-modal .modal-title{width:40%}.pause-modal .modal-text{font-size:20px;line-height:1}}.block{background-color:#ffd849;border:1px solid transparent;border-radius:15px;box-shadow:5px 5px #733381;color:#733381;font-size:1.8rem;padding:10px 20px;text-align:center}.block--beige{background-color:#f1c991}.block--orange{background-color:#fbb149}.block--blue{background-color:#91c3f1}.block--white-shadow{box-shadow:5px 5px #fff}.block--disabled,.block.disabled{background-color:#733381;border:1px solid #fff;color:#fff;pointer-events:none}.block--question{align-items:center;display:flex;flex-direction:row;justify-content:center;line-height:1.2;margin-left:auto;margin-right:auto;min-height:100px;padding-bottom:5px;padding-top:5px;width:100%}.block--option{align-items:center;cursor:pointer;display:grid;font-size:1.7rem;gap:10px;grid-template-columns:auto 1fr;padding:10px 15px;position:relative;transition:.1s ease-in-out}.block--option:after{animation:slideRight .7s forwards;border:1.5px solid #000;border-radius:1.2rem;bottom:-15px;color:#fff;font-family:Font Awesome\ 5 Free;font-size:.9rem;font-weight:900;opacity:0;padding:2px 12px;position:absolute;right:-25px;transform:translateX(-50%);z-index:1}.block--option.correct:after,.block--option.correct_symbol:after{background-color:#7bb662;content:"\f00c"}.block--option.wrong:after,.block--option.wrong_symbol:after{background-color:#ff5c33;content:"\f00d"}.block--option.missed:after{background-color:rgba(123,182,98,.3);border:1.5px dotted #7bb662;content:"\f00c"}.block--option.missed_symbol:after{background-color:#7bb662;border:1.5px dotted #7bb662;content:"\f00c"}.block--option:hover{background-color:#f1c991}.block--note{margin-bottom:10px;max-width:500px;padding:5px 15px;width:100%}.block--small{max-width:180px;width:100%}.block.correct,.block.correct:hover{background-color:#7bb662}.block.wrong,.block.wrong:hover{background-color:#ff5c33}@media screen and (max-width:768px){.block{font-size:1.6rem}.block--question{font-size:1.7rem}.block--option{font-size:1.5rem}}@media (max-width:576px),(orientation:landscape) and (max-height:800px){.block--question{min-height:82px}.block--option{padding:2px 5px}}.w-0{width:0!important}.w-5{width:5%!important}.w-10{width:10%!important}.w-15{width:15%!important}.w-20{width:20%!important}.w-25{width:25%!important}.w-30{width:30%!important}.w-35{width:35%!important}.w-40{width:40%!important}.w-45{width:45%!important}.w-50{width:50%!important}.w-55{width:55%!important}.w-60{width:60%!important}.w-65{width:65%!important}.w-70{width:70%!important}.w-75{width:75%!important}.w-80{width:80%!important}.w-85{width:85%!important}.w-90{width:90%!important}.w-95{width:95%!important}.w-100{width:100%!important}@keyframes swing{0%{transform:rotate(0deg)}10%{transform:rotate(10deg)}30%{transform:rotate(0deg)}40%{transform:rotate(-10deg)}50%{transform:rotate(0deg)}60%{transform:rotate(5deg)}70%{transform:rotate(0deg)}80%{transform:rotate(-5deg)}to{transform:rotate(0deg)}}@keyframes gradient{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}@keyframes slideRight{0%{bottom:15px;opacity:0;right:120px}to{bottom:-15px;opacity:1;right:-25px}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes scaleUp{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes translateVertical{0%{transform:translateY(var(--translateY-start,-100vh))}to{transform:translateY(var(--translateY-end,0))}}@keyframes fadeInWithTranslate{0%{opacity:0;transform:translateY(var(--translateY-start,-30px))}to{opacity:1;transform:translateY(var(--translateY-end,0))}}:root{--default-shake-x:0px;--default-shake-y:0px}@keyframes shake{0%{transform:translate(calc(var(--default-shake-x, 0px) + 1px),calc(var(--default-shake-y, 0px) + 1px)) rotate(0deg)}10%{transform:translate(calc(var(--default-shake-x, 0px) - 1px),calc(var(--default-shake-y, 0px) - 2px)) rotate(-1deg)}20%{transform:translate(calc(var(--default-shake-x, 0px) - 3px),var(--default-shake-y,0)) rotate(1deg)}30%{transform:translate(calc(var(--default-shake-x, 0px) + 3px),calc(var(--default-shake-y, 0px) + 2px)) rotate(0deg)}40%{transform:translate(calc(var(--default-shake-x, 0px) + 1px),calc(var(--default-shake-y, 0px) - 1px)) rotate(1deg)}50%{transform:translate(calc(var(--default-shake-x, 0px) - 1px),calc(var(--default-shake-y, 0px) + 2px)) rotate(-1deg)}60%{transform:translate(calc(var(--default-shake-x, 0px) - 3px),calc(var(--default-shake-y, 0px) + 1px)) rotate(0deg)}70%{transform:translate(calc(var(--default-shake-x, 0px) + 3px),calc(var(--default-shake-y, 0px) + 1px)) rotate(-1deg)}80%{transform:translate(calc(var(--default-shake-x, 0px) - 1px),calc(var(--default-shake-y, 0px) - 1px)) rotate(1deg)}90%{transform:translate(calc(var(--default-shake-x, 0px) + 1px),calc(var(--default-shake-y, 0px) + 2px)) rotate(0deg)}to{transform:translate(calc(var(--default-shake-x, 0px) + 1px),calc(var(--default-shake-y, 0px) - 2px)) rotate(-1deg)}}@keyframes slideUp{0%{opacity:0;top:0}to{opacity:1;top:-35px}}@keyframes soundLoaderMovement{0%{height:32%;top:4px}50%,to{height:16px;top:12px}}@keyframes flyToPosition{0%{left:calc(var(--start-left)*1px);top:calc(var(--start-top)*1px)}70%{left:calc(var(--end-left)*.6px);top:calc(var(--end-top)*1px)}to{left:calc(var(--end-left)*1px);top:calc(var(--end-top)*1px)}}@keyframes slideDown{0%{top:-110%}to{top:0}}@keyframes transition-up{to{transform:translateY(-200%)}}.button-header{display:flex;justify-content:space-between;margin:.5rem auto;padding:0 .5rem;width:100%}.button-header--around{justify-content:space-around}@media screen and (max-width:576px){.button-header{padding:.4rem}}@media (min-height:800px) and (orientation:landscape){.button-header{margin:1rem auto 4rem}}.button-footer{justify-content:space-around;margin:1rem auto;max-width:650px}.button,.button-footer{align-items:center;display:flex;flex-direction:row}.button{background-color:#ffd849;border:none;border-radius:10px;box-shadow:5px 5px #733381;color:#733381;font-size:1.8rem;justify-content:center;line-height:1;max-width:200px;padding:.5rem;text-align:center}.button.disabled{background-color:#b6b6b6;color:#404040;pointer-events:none}.button--orange{background-color:#fbb149}.button--orange:hover{background-color:#fcc67b}.button--beige{background-color:#f1c991}.button--beige:hover{background-color:#f7dfbe}.button--control{display:flex;font-size:1.8em;justify-content:center;margin:0;max-width:120px;padding:.7rem .5rem;width:100%}@media screen and (max-width:375px){.button--control{max-width:50px}}.button--pause,.button--static{font-size:2.2rem;max-width:165px;width:100%}.button--control i,.button--pause i,.button--static i{font-size:.8em;margin-right:10px}.button--control .icon-right,.button--pause .icon-right,.button--static .icon-right{margin-left:10px;margin-right:0}@media screen and (max-width:475px){.button--control,.button--pause,.button--static{max-width:65px}.button--control .button__text,.button--pause .button__text,.button--static .button__text{display:none}.button--control .icon-right,.button--control i,.button--pause .icon-right,.button--pause i,.button--static .icon-right,.button--static i{font-size:1em;margin:0}}.button--narrow{max-width:80px}.button--control:active,.button--pause{transform:translateY(4px)}@media screen and (max-width:576px){.button{font-size:1.6rem}.button--pause,.button--static{font-size:2rem;max-width:125px}.button--narrow{max-width:70px}}@media screen and (max-width:475px){.button{font-size:1.45rem}.button--pause,.button--static{font-size:1.8rem;max-width:75px}.button--narrow{max-width:65px}}@media screen and (max-width:375px){.button{font-size:1.3rem}.button--pause,.button--static{font-size:1.5rem;max-width:50px}.button--narrow{max-width:65px}}.gif-parent{max-width:600px;position:relative;width:95%}.ending-gif{width:100%}.gif-text{align-items:center;bottom:14%;color:#733381;display:flex;flex-direction:column;font-size:1.8rem;font-weight:700;justify-content:center;left:53%;line-height:1.2;position:absolute;right:8%;text-align:center;top:40%}@media (max-height:500px){.gif-parent{max-width:380px}}.teacherbutton{border-radius:10px;box-shadow:5px 5px #733381;cursor:pointer;display:block;height:65px}.teacherbutton:active{box-shadow:5px 5px #733381;transform:translateY(4px)}@media screen and (max-width:576px){.teacherbutton{height:60px}}@media screen and (max-width:475px){.teacherbutton{height:55px}}@media screen and (max-width:375px){.teacherbutton{height:50px}}.loader__background{background-color:rgba(0,0,0,.5);bottom:0;left:0;position:fixed;right:0;top:0;z-index:100}.loader__icon{left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:150px}.image-button{height:100%;max-width:120px;-o-object-fit:contain;object-fit:contain}.endlinks{margin:0 15px;max-height:55px}.endlinks.button{min-width:120px}.endlinks>img{height:55px}.countdown{--size:65px;align-items:center;border-radius:10px;cursor:pointer;display:flex;flex-direction:row;font-size:45px;font-weight:500;height:var(--size);justify-content:center;overflow:hidden;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:var(--size)}.countdown__fill{background:#733381;bottom:0;display:block;height:100%;left:0;opacity:1;position:absolute;width:100%}.countdown__digit{color:#fff;mix-blend-mode:difference;pointer-events:none;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}@media screen and (max-width:576px){.countdown{--size:60px}}@media screen and (max-width:475px){.countdown{--size:55px;font-size:30px}}@media screen and (max-width:375px){.countdown{--size:50px;font-size:26px}}body{background-image:url(/img/tricky-trios/trianglify1.png);background-size:100% 100%}.tricky-trios-container{display:flex;flex:1;flex-direction:column;margin:0 auto;max-width:1200px}.tricky-trios-main{height:445px;overflow:hidden}.tricky-trios-header-container,.tricky-trios-main{display:flex;gap:10px;justify-content:space-around}.tricky-trios-header-container>*,.tricky-trios-main>*{flex:1}.tricky-trios-column-header{background-color:#f58024;border:3px solid #fff;border-radius:10px;color:#fff;font-size:1.5rem;font-size:1.8rem;margin:0 0 5px;max-width:240px;padding:5px;position:relative;text-align:center}.tricky-trios-column-header:first-child{background-color:#70367a}.tricky-trios-column-header:nth-child(2){background-color:#315828}.tricky-trios-column-header:nth-child(3){background-color:#ac591a}.tricky-trios-column-header:after,.tricky-trios-column:after{background-color:#fff;bottom:2%;content:"";height:100%;left:50%;position:absolute;transform:translateX(-50%);width:5px;z-index:-1}.tricky-trios-column-header:after{bottom:0;height:calc(100% + 5px);top:100%}.off-screen{animation:translateVertical 1s forwards;transform:translateY(-100vh)}.tricky-trios-column[data-column="0"] .off-screen:first-child{animation-delay:0s}.tricky-trios-column[data-column="1"] .off-screen:first-child{animation-delay:.2s}.tricky-trios-column[data-column="2"] .off-screen:first-child{animation-delay:.4s}.tricky-trios-column[data-column="0"] .off-screen:nth-child(2){animation-delay:.2s}.tricky-trios-column[data-column="1"] .off-screen:nth-child(2){animation-delay:.4s}.tricky-trios-column[data-column="2"] .off-screen:nth-child(2){animation-delay:.6s}.tricky-trios-column[data-column="0"] .off-screen:nth-child(3){animation-delay:.4s}.tricky-trios-column[data-column="1"] .off-screen:nth-child(3){animation-delay:.6s}.tricky-trios-column[data-column="2"] .off-screen:nth-child(3){animation-delay:.8s}.tricky-trios-column[data-column="0"] .off-screen:nth-child(4){animation-delay:.6s}.tricky-trios-column[data-column="1"] .off-screen:nth-child(4){animation-delay:.8s}.tricky-trios-column[data-column="2"] .off-screen:nth-child(4){animation-delay:1s}.tricky-trios-column[data-column="0"] .off-screen:nth-child(5){animation-delay:.8s}.tricky-trios-column[data-column="1"] .off-screen:nth-child(5){animation-delay:1s}.tricky-trios-column[data-column="2"] .off-screen:nth-child(5){animation-delay:1.2s}.tricky-trios-column[data-column="0"] .off-screen:nth-child(6){animation-delay:1s}.tricky-trios-column[data-column="1"] .off-screen:nth-child(6){animation-delay:1.2s}.tricky-trios-column[data-column="2"] .off-screen:nth-child(6){animation-delay:1.4s}.tricky-trios-column[data-column="0"] .off-screen:nth-child(7){animation-delay:1.2s}.tricky-trios-column[data-column="1"] .off-screen:nth-child(7){animation-delay:1.4s}.tricky-trios-column[data-column="2"] .off-screen:nth-child(7){animation-delay:1.6s}.tricky-trios-column{align-items:center;display:flex;flex-direction:column-reverse;height:100%;justify-content:flex-start;position:relative}[data-column="0"] .item{background-color:#994fb2;color:#fff}[data-column="1"] .item{background-color:#589c48;color:#fff}[data-column="2"] .item{background-color:#f58024;color:#fff}.item{border:3px solid #fff;border-radius:1.5rem;box-shadow:5px 5px 0 3px #733381;cursor:pointer;height:60px;margin:10px 0;max-width:300px;padding:10px 0;position:relative;transition:all .3s ease-in-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;z-index:2}.item:after{background-color:#eee;border-radius:100%;box-shadow:inset 0 0 3px 1px #000;content:"";height:10px;position:absolute;top:105%;width:20px}.item.selected{background-color:#49c8ff;color:#733381}.item.correct{background-color:#7bb662;color:#fff;height:0;margin-top:-2px;opacity:0;padding:0}.item.wrong{animation:shake .82s cubic-bezier(.36,.07,.19,.97);background-color:#ff5c33;color:#fff}.item.hint{animation:heartbeat 1s linear}@media (max-width:576px){.tricky-trios-main{height:430px}.tricky-trios-column-header{font-size:1.4rem}}@media (max-width:475px){.tricky-trios-main{height:410px}.tricky-trios-column-header{font-size:1.2rem}}@media (max-width:375px){.tricky-trios-main{height:380px}.item{border-width:2px}}@media (max-height:500px){.tricky-trios-main{height:325px;margin-bottom:5px}.tricky-trios-column-header{font-size:1.2rem;padding:2px 5px}.item{font-size:1.8rem;margin:8px 0;padding:2px 0}}