@font-face{font-family:SansitaOneRegular;src:url(sansitaone-webfont.3285233a.woff2) format("woff2");font-weight:400;font-style:normal}html{box-sizing:border-box}*,:after,:before{box-sizing:inherit}body,html{font-family:SansitaOneRegular;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#444;color:#fff;margin:0;padding:0;width:100%;height:100%;overflow:hidden}.ball text{font-size:16px;text-anchor:middle;fill:#fff;stroke-width:0}.ball1{fill:#f39c12;stroke:#e67e22}.ball2{fill:#2ecc71;stroke:#27ae60}.ball3{fill:#3498db;stroke:#2980b9}.ball4{fill:#9b59b6;stroke:#8e44ad}.ball5{fill:#a86;stroke:#765}.ball6{fill:#e74c3c;stroke:#c0392b}section{max-width:150vh;margin:0 auto;padding:0;position:absolute;top:0;bottom:0;left:0;right:0}section.overlay{background-color:rgba(0,0,0,.8)}section h2{font-size:10vmin;text-align:center;margin:3vmin 0}section .controls{position:absolute;left:0;bottom:0;width:100%;margin:0;padding:0;list-style-type:none;display:flex;flex-direction:column;justify-content:space-around;font-size:calc(3vh - 3vw);line-height:2}section .controls li{text-align:center;width:99vw;padding-bottom:3vw}section .controls li a{display:flex;flex-direction:column;color:#ccc;text-decoration:none;outline:none}section .controls li a:focus,section .controls li a:hover{color:#3498db}section .controls li a:focus svg *,section .controls li a:hover svg *{fill:#3498db}section .controls li svg{width:calc(15vh - 20vw);height:calc(15vh - 20vw);max-width:100px;max-height:100px;margin:0 auto}@media (min-aspect-ratio:7/24){section .controls{flex-direction:row;flex-wrap:wrap;font-size:3vh}section .controls li{width:49vw}section .controls li svg{width:calc(14vh - 10vw);height:calc(14vh - 10vw)}}@media (min-aspect-ratio:7/12){section .controls li{width:24vw}section .controls li svg{width:18vw;height:18vw}}@media (min-aspect-ratio:17/24){section .controls li{width:49vw}section .controls li svg{width:25vw;height:25vw}}@media (min-aspect-ratio:5/6){section .controls{font-size:3vw}section .controls li{width:22vw}section .controls li svg{width:16vw;height:16vw}}@media (min-aspect-ratio:3/2){section .controls li{width:30vh}section .controls li svg{width:24vh;height:24vh}}@media (min-aspect-ratio:7/4){section .controls{font-size:5.5vh}}#home header{margin:0;padding:0;width:100%;display:flex;flex-direction:column}#home header h1{font-size:25vmin;text-align:center;margin:3vmin 0}#home header .logo{display:block;width:45vmin;height:auto;margin:10vmin auto;padding:0}@media (min-aspect-ratio:17/24){#home header{flex-direction:row-reverse;justify-content:space-around}#home header h1{font-size:20vw}#home header .logo{width:20vw;height:20vw;margin:3vw 0}}@media (min-aspect-ratio:5/6){#home header{margin-top:calc(90vh - 70vw)}}@media (min-aspect-ratio:5/4){#home header{margin-top:0}}@media (min-aspect-ratio:3/2){#home header h1{font-size:30vh}#home header .logo{width:30vh;height:auto;margin:4.5vh 0}}#home .controls .play img{animation-name:pulse;animation-duration:.5s;animation-iteration-count:infinite;animation-direction:alternate;animation-timing-function:ease-out}#home .controls .sound{display:none}.ambiancesoundloaded #home .controls .sound,.soundeffectsloaded #home .controls .sound{display:block}#home .controls .sound .on{display:none}#home .controls .sound .off,#home .controls .sound.on .on{display:block}#home .controls .sound.on .off{display:none}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.1)}}#play{font-size:15vmin;line-height:1.5}#play .level,#play .lives,#play .score,#play h1,#play ul{margin:0;padding:0}#play h1{font-size:20vmin;color:#ccc;padding:0 3vmin;height:30vmin}#play .progress{position:absolute;top:30vmin;left:0;width:100vw;height:calc(100vh - 30vmin - 134.375vw);display:flex;flex-direction:column;justify-content:space-around}#play .progress .score{padding:0 3vmin;font-size:1.5em;text-align:center}#play .progress ul{width:100%;list-style-type:none;display:flex;flex-direction:column;justify-content:space-around;color:#ccc}#play .progress ul li{text-align:center}#play .progress ul span{color:#eee}#play .progress .icon{margin-right:3vmin;width:.75em;height:.75em}#play .level,#play .lives,#play .score{display:inline-block;transition-property:color,transform;transition-duration:.5s;transition-timing-function:ease-in-out}#play .level.changeDown,#play .lives.changeDown,#play .score.changeDown{color:#c0392b;transform:scale(1.2)}#play .level.changeUp,#play .lives.changeUp,#play .score.changeUp{color:#27ae60;transform:scale(1.2)}#play svg#board{position:absolute;left:0;bottom:0;width:100vw;height:134.375vw;pointer-events:none}#play svg#board path{pointer-events:visibleFill}#play svg#board .playzone{stroke-width:0;fill:#777}#play svg#board #playable,#play svg#board #playableSpring{pointer-events:none}#play svg#board #playable:hover,#play svg#board #playableSpring:hover{cursor:pointer}#play svg#board #playable.throwable,#play svg#board #playableSpring.throwable{animation-delay:0;animation-duration:.7s;animation-timing-function:ease-in-out;animation-iteration-count:infinite}#play svg#board #playable{transform-origin:294px center}#play svg#board #playable.throwable{animation-name:ballAnimation}#play svg#board #playableSpring{stroke-width:2;stroke:#cee;fill:none;transform-origin:308px center;transform:scaleX(.5)}#play svg#board #playableSpring.throwable{animation-name:springAnimation}#play .controls{position:static}#play .controls .pause{position:absolute;top:3vmin;bottom:auto;left:auto;right:3vmin;width:20vmin;height:20vmin}#play .controls .pause svg{width:100%;height:100%}@media (min-aspect-ratio:1/3){#play .progress ul{flex-direction:row}}@media (min-aspect-ratio:11/24){#play{font-size:calc(5.41667vh - 2vw)}#play .progress{position:absolute;left:3vmin;width:calc(100vw - 3vmin);height:auto!important}#play .progress .score{padding:0;text-align:left}#play .progress ul{position:static;line-height:1.2;left:3vmin;width:25vw;flex-direction:column}#play .progress ul li{text-align:left}}@media (min-aspect-ratio:5/8){#play h1{font-size:12.5vh;height:18.75vh}#play svg#board{width:62.5vh;height:83.984375vh;left:auto;right:0}#play .progress{font-size:6vw}#play .controls .pause{width:12.5vh;height:12.5vh}}@media (min-aspect-ratio:19/24){#play svg#board{width:79.1666666667vw;max-width:74.4186046512vh;height:106.3802083333vw;max-height:100vh}#play .progress{top:calc(18.75vh + 3vmin);width:calc(20.83333vw - 3vmin)}#play .progress ul{width:100%}#play .controls .pause{top:auto!important;left:3vmin;right:auto;bottom:3vmin}}@media (min-aspect-ratio:1/1){#play .progress{width:calc(100vw - 6vmin - 74.4186vh);height:calc(68.75vh - 9vmin)}#play .progress .score,#play .progress ul li{text-align:center}}@media (min-aspect-ratio:3/2){#play{max-width:150vh}#play svg#board{width:74.4186046512vh;height:100vh}#play .progress{width:calc(75.5814vh - 6vmin);font-size:9vh}}@keyframes ballAnimation{0%{transform:translateX(0)}50%{transform:translateX(-16px)}to{transform:translateX(0)}}@keyframes springAnimation{0%{transform:scaleX(.5)}50%{transform:scaleX(1)}to{transform:scaleX(.5)}}#pause .sound{display:none}.ambiancesoundloaded #pause .sound,.soundeffectsloaded #pause .sound{display:block}#pause .sound .on{display:none}#pause .sound .off,#pause .sound.on .on{display:block}#pause .sound.on .off{display:none}#gameover p{text-align:center}#gameover .message{font-size:5vmin;margin:2em 1em 0}#gameover .score{font-size:10vmin;margin:0 1em}.highscores{list-style-type:none;margin:5vmin;font-size:5vh;text-align:right}.highscores .thisone{color:#27ae60;font-size:1.3em}.highscores .tryagain{color:#c0392b;font-size:1.3em}@media (min-aspect-ratio:1/2){.highscores{column-count:2}}@media (min-aspect-ratio:3/4){.highscores{column-count:3}}@media (min-aspect-ratio:1/1){.highscores{column-count:4}}#about .about{margin:5vmin;display:flex;flex-direction:column}@media (min-aspect-ratio:5/6){#about .about{flex-direction:row}}#about .description a:link,#about .description a:visited{color:#3498db;text-decoration:underline}@media (min-aspect-ratio:5/6){#about .description{flex:3}}#about .social{text-align:center;display:flex;justify-content:center}#about .social a{margin:1em}#about .social a,#about .social a svg{width:15vmin;height:15vmin}@media (min-aspect-ratio:5/6){#about .social{flex-direction:column}}@keyframes revealDescription{0%{opacity:0}to{opacity:1}}#description{position:absolute;top:0;bottom:0;left:0;right:0;margin:0;padding:1em;overflow-y:scroll;opacity:0;animation-duration:1s;animation-timing-function:ease-out;animation-delay:1s;animation-iteration-count:1;animation-fill-mode:forwards;animation-name:revealDescription}#description h1{font-size:3em;text-align:center}#description h2,#description p{font-family:sans-serif}#description p.icon{text-align:center}#description p.icon img{max-width:50%;height:auto}#description a:link,#description a:visited{color:#ccc}#description a:active,#description a:hover{color:#fdd}#description .error{padding:.2em .5em;border:1px solid #962d22;background-color:#f2c9c5;color:#c0392b}#description .error a:link,#description .error a:visited{color:#c0392b}#description .error a:active,#description .error a:hover{color:#962d22}*{user-select:none}a,button,input,label,select,summary,textarea{touch-action:manipulation}