body {
    font-family: 'Public Pixel', sans-serif;
    font-weight: bold;
    text-align: center;
    user-select: none;
    background-image: url('wallpaperflare.com_wallpaper.jpg');
    color: white;
}

.board {
    background-color: lightgray;
    border: 8px solid rgb(150, 148, 148);
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
}

.board div {
    width: 29px;
    height: 29px;
    border: 1px solid whitesmoke;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}

#restart-button, #computer-play {
    width: 170px;
    height: 50px;
    font-size: 17px;
    background-color: lightgray;
    border: 2px solid darkgray;
    cursor: pointer;
    font-family: 'Public Pixel', sans-serif;
    color: black;
}


.board :not(.tiles-cleared):hover {
    background-color: darkgray;
}

#computer-play:hover, #restart-button:hover {
    background-color: darkgray;
	border-color: lightgray;
}

.disabled {
    background-color: darkgray;
}

.tiles-cleared {
    background-color: darkgray;
}

.x1 { 
    color: blue;
}

.x2 { 
    color: green;
}

.x3 { 
    color: red;
}

.x4 { 
    color: navy;
}

.x5 { 
    color: brown;
}

.x6 { 
    color: teal;
}

.x7 { 
    color: black;
}

.x8 { 
    color: gray;
}
