body{margin:0;display:flex;justify-content:center;align-items:center;min-height:85vh;background-color:#f0f0f0;transition-delay:.1s;transition:all .5s ease-in-out}.App{font-family:Roboto}#grid-container{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:800px;margin:0 auto;position:relative}.gameOver-button{position:absolute;top:50%;left:50%;width:175px;height:175px;font-size:175px;fill:#fff;user-select:none;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:1;transition-delay:.1s;transition:all .5s ease-in-out;transform:translate(-50%,-50%);clip-path:circle(50% at 50% 50%);box-shadow:0 0 10px #00000080;padding:30px}.overlay{position:absolute;left:0;top:0;width:100%;height:100%;transition:all .5s ease}.overlay.animated{opacity:0;visibility:hidden;user-select:none;.gameOver-button,.settings-dialog {opacity: 0; visibility: hidden; transition-delay: .1s;} &.show {opacity: 1; visibility: visible; .gameOver-button,.settings-dialog {opacity: 1; visibility: visible;} .gameOver-button:hover {opacity: 1;}}}.tile{width:74px;height:74px;border:1px solid #ccc;border-radius:10px;background-color:transparent;display:flex;align-items:center;justify-content:center;margin:1px;font-size:25px;user-select:none}.tile-picture{transition-delay:.2s;transition:all .5s ease}.display-text,.gamemode-counter{margin-top:5px;text-align:center;z-index:1;user-select:none}.button-container{width:300px;margin:0 auto 10px;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:1fr;grid-column-gap:0px;grid-row-gap:0px;cursor:pointer}.settings-button{grid-area:1 / 1 / 2 / 2;justify-self:center;align-self:center}.theme-button{grid-area:1 / 2 / 2 / 3;justify-self:center;align-self:center;font-size:40px;user-select:none}.sound-button{grid-area:1 / 3 / 2 / 4;justify-self:center;align-self:center}.darkmode-button{grid-area:1 / 4 / 2 / 5;justify-self:center;align-self:center}.button-container .settings-button:active,.button-container .theme-button:active,.button-container .sound-button:active,.button-container .darkmode-button:active{transform:translateY(3px);transition:transform .1s}.wrapper{position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);z-index:2}.settings-dialog{position:absolute;overflow:hidden;top:45%;left:50%;transform:translate(-50%,-50%);padding:20px;background:white;border:2px solid #333;border-radius:10px;width:325px;z-index:2;user-select:none;transition:all .5s ease}.settings-header{display:flex;align-items:center;justify-content:space-between}.close-button{position:absolute;top:10px;right:20px;cursor:pointer;font-size:24px;color:#555}.close-button:hover{color:#222}.settings-label{margin:0 0 10px;font-size:24px;position:relative;top:50%;left:50%;transform:translate(-50%,-25%)}.menu-item{display:grid;grid-template-columns:1fr 1fr;align-items:center;margin-top:-10px;margin-bottom:-10px}.menu-item label{display:flex;justify-content:center;align-items:center;text-align:center;min-width:75px}.menu-item ul{margin-block-start:.75em;margin-block-end:.75em;padding-inline-start:0px;list-style:none;display:flex;flex-wrap:wrap;justify-content:center;min-width:225px}.menu-item li{cursor:pointer;padding:8px;border:1px solid #ccc;border-radius:5px;margin:3px;text-align:center}.menu-item li:active,.reset-button:active,.close-button:active{transform:translateY(2px);transition:transform .1s}.menu-item li.selected{background-color:#333;color:#ccc}.menu-item li:hover{background-color:#555;color:#ccc}.reset-button{align-items:center;margin:15px auto 5px;width:200px;display:flex;flex-wrap:wrap;justify-content:center;font-family:Roboto;text-align:center;display:block;background:#777;color:#fff;border:none;padding:10px;border-radius:5px;cursor:pointer;user-select:none}.reset-button:hover{background-color:#333;color:#ccc}button:hover{background-color:#555}button:active{background-color:#333}.gameboard{width:100%;height:100%;position:relative;border:1px solid black;border-radius:10px;padding:10px;margin:auto;boxSizing:border-box}body *{-webkit-tap-highlight-color:transparent;outline:none}
