#game {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    grid-template-rows: repeat(10, 1fr);
    width: 1000px;
    height: 1000px;
    background-image: url("./assets/kazek.gif");
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
}

.class {
    position: absolute;
    top: 0;
    left: 0;
    width: 1000px;
    height: 1000px;
    background-image: url("./assets/kazan.png");
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
}

.item {
    border: 1px solid white;
}

.active {
    background-image: url("./assets/bebech.png");
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
}

/* .up {
    transform: rotate(0);
    transform: rotate(90deg);
}

.down {
    transform: rotate(0);
    transform: rotate(270deg);
}
.left {
    transform: rotate(0);
}
.right {
    transform: rotate(0);
    transform: rotate(180deg);
    transform: scaleX(-1);
} */

.beer {
    background-image: url("./assets/zatecki-kufel.png");
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
}

.head {
    background-image: url("./assets/kazekglowa.gif");
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
}

.points {
    background-color: gold;
    font-size: 30px;
    padding: 10px;
width: 980px;

}

#points {
    margin-left: 10px;
}