@keyframes pulse{0%{transform:scale(1)}20%{transform:scale(1.2)}to{transform:scale(1)}}html,body{padding:0;margin:0}#nollie{cursor:pointer;display:block;margin:0 auto;width:100px}#s{margin-top:20px}#s-f{background-color:#4267b2;color:#f7f7ff;padding:10px 20px;border-radius:4px;display:inline-block;font-weight:700}body{background-color:#f7f7ff}.popup{z-index:50;position:fixed;top:0;left:0;height:100%;width:100%;overflow:scroll}.popup .popup-overlay{background-color:#f7f7ff;opacity:.8;height:100%;width:100%;position:absolute;top:0;left:0;z-index:1}.popup .popup-box{position:relative;z-index:10;top:0;left:0;padding:60px;border:solid 2px #b7b7c3;max-width:558px;margin:90px auto 20px;background-color:#f7f7ff;border-radius:4px}@media(max-width:558px){.popup .popup-box{margin:10px;padding:20px}}#close-share{top:0;right:10px;font-size:30px;padding:10px;position:absolute;color:#b7b7c3;cursor:pointer}#close-share:hover{color:#000300}#copyright{margin:100px 0 40px}#matrix-wrapper,#matrix-menu{max-width:500px;width:calc(100% - 2px);margin:20px auto 0}#matrix-menu{display:flex;font-size:20px}#matrix-menu .col1{text-align:left;margin-left:1px;height:100%;width:calc(45.4545454545% - 1px);display:flex;flex-direction:column}#matrix-menu .col2{width:27.2727272727%;display:flex;flex-direction:column}#matrix-menu .col3{width:18.1818181818%;display:flex;flex-direction:column}#matrix-menu .col4{width:9.0909090909%;display:flex;flex-direction:column}.green{color:#5cc98a}#welcome-title{font-size:200%;font-weight:700;margin-bottom:40px}#rules-understood{cursor:pointer;border-radius:3px;border:solid 2px #000300;font-weight:700;padding:10px 20px;margin-top:40px;display:inline-block}#rules-understood:hover{background-color:#a8d5ba;border-color:#a8d5ba;color:#f7f7ff}#get-hint{margin-top:3px}#get-hint:not(.hinted){cursor:pointer}#get-hint:not(.hinted):hover{color:#a8d5ba}#get-hint.hinted{cursor:default;color:#b7b7c3}.fa-heart{color:#f2a6b3;margin:0 5px}#restart{margin-top:3px;color:#b7b7c3;cursor:pointer;border-radius:3px}#restart.gameover{color:#000300;animation:pulse ease-in-out .4s infinite}#restart:hover{color:#f2a6b3}#score-caption{font-size:125%}#hints-used-caption{color:#b7b7c3;font-size:75%}#matrix-container{margin-top:20px;padding-top:100%;width:100%;position:relative}#open-rules,#ip{color:#000300;font-weight:700;cursor:pointer}#open-rules:hover,#ip:hover{color:#a8d5ba}#ip{text-decoration:none}#matrix-inner{position:absolute;top:0;left:0;width:100%;height:100%}#matrix{width:100%;height:100%;padding-left:1px;padding-top:1px}#matrix.gameover .cell{cursor:default!important}#matrix.gameover .cell:not(.value8){opacity:.4!important}#matrix.gameover .cell.value8{opacity:1!important}#matrix .row{display:flex;height:calc(9.0909090909% - 1px);margin-bottom:1px}@media(max-width:900px){#matrix .row .cell{font-size:24px}}#matrix .row .cell{font-size:30px;color:#fff;cursor:pointer;font-weight:500;height:100%;width:9.0909090909%;margin-right:1px;display:flex;justify-content:center;flex-direction:column}#matrix .row .cell.hinted{box-shadow:1px 1px 1px #f7f7ff,-1px 1px 1px #f7f7ff,1px -1px 1px #f7f7ff,-1px -1px 1px #f7f7ff;animation:pulse ease-in-out .4s infinite;z-index:30}#matrix .row .cell:not(.value0):hover{opacity:.5}#matrix .row .cell.value1{background-color:#f6e6a0;color:#5a4a0a}#matrix .row .cell.value2{background-color:#a0c4e8;color:#1a3a5a}#matrix .row .cell.value3{background-color:#f2a6b3;color:#6a0a1a}#matrix .row .cell.value4{background-color:#c4a6d7;color:#2a0a4a}#matrix .row .cell.value5{background-color:#f5c5a3;color:#5a2a0a}#matrix .row .cell.value6{background-color:#a8d5ba;color:#0a4a2a}#matrix .row .cell.value7{background-color:#c4a882;color:#2a1a0a}#matrix .row .cell.value8{background-color:#000300;animation:pulse ease-in-out .6s;z-index:1}#matrix .row .cell.value9{background-color:#f0c6e0;color:#6a2a5a}#matrix .row .cell.value0{cursor:default;background-color:#f7f7ff;color:#0ead69;font-weight:700;animation:pulse ease-in-out .4s;z-index:20}#rules{border:solid 1px #b7b7c3;padding:40px;max-width:558px;margin:0 auto;position:fixed;z-index:10;background-color:#f7f7ff}#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#2c3e50}#gameover{font-weight:700}
