.top-nav{color:#fff;background-color:#2e4053;display:flex;padding:.5em 0 .5em 2em;height:6em;align-items:center;justify-content:space-around}.top-nav p{font-size:2.2em}.top-nav button{background:none;border:none;color:#fff;font-size:1.2em;cursor:pointer;height:3em;border-radius:5px;min-width:3em}.top-nav button:hover{background-color:#449976}.top-nav button:active{background-color:#3e8e41;transform:translateY(4px)}.select-algo select{background:#2e4053;color:#fff;font-size:1.2em;border-color:transparent;cursor:pointer}.legend-box{display:flex;justify-content:space-around;margin:2em}.legend-box div{display:flex;font-size:1.2em;justify-content:center;align-items:center}.legend-box div *{margin:0 5px;font-size:25px}.legend-wall-node{background-color:#2e4053;width:25px;height:25px}.legend-visited{background:#818181;width:25px;height:25px}.legened-path{background:#ffff98;width:25px;height:25px}.grid-box{display:flex;align-items:center;justify-content:center;margin:5em 0 0}.comment{display:flex;justify-content:center;align-items:center;font-size:1.5em}.node{width:25px;height:25px;border:.5px solid black;display:flex;font-size:1.3em;justify-content:center;align-items:center}.node-visited{font-size:1.3em;justify-content:center;align-items:center;background:#818181;animation:popVisited 2s}.node-path{font-size:1.3em;justify-content:center;align-items:center;background:#ffffac;animation:popWall .2s ease}.node-wall{background-color:#2e4053;animation:popWall .2s ease}@keyframes popWall{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes popVisited{0%{background:#fff}30%{transform:scale(.6);background:#7a7a7a}to{transform:scale(1);background:#818181}}.row{display:flex}.grid{border:.5px solid black;width:max-content;gap:1px;-webkit-user-select:none;user-select:none}