.debug-info{ top: 120vh } .game-body{ width: 100vw; height: 100vh; background-color: lightgray; position: absolute; transform: translate(-50%,-50%); top: 50vh; left: 50vw; display: flex; justify-content: space-evenly; align-items: center; flex-direction: column; } .game-table{ background-color: darkgray; display: flex; flex-direction: column; height: 400px; } .row{ width: 625px; display: flex; flex-direction: row; justify-content: center; } .cell{ width: 200px; height: 100px; border: 1px solid black; background-color: darkgray; display: flex; justify-content: center; align-items: center; } .text{ color: black; } .attr-btn{ width: 200px; height: 100px; border: 1px solid black; background-color: darkgray; display: flex; justify-content: center; align-items: center; font-family: 'Work Sans', sans-serif; } .dec-btn{ width: 200px; height: 50px; border: 1px solid black; background-color: darkgray; display: flex; justify-content: center; align-items: center; font-family: 'Work Sans', sans-serif; } .game-btn{ width: 200px; height: 100px; border: 1px solid black; background-color: darkgray; display: flex; justify-content: center; align-items: center; } .active { display: block; } .inactive { display: none; } .btn-hidden{ width: 100%; } .btn-content{ width: 100%; } .decision_area{ display: flex; align-items: center; justify-content: center; } .text { font-family: 'Work Sans', sans-serif; }