/* /Pages/Home.razor.rz.scp.css */
.container[b-kupg0r379x] {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100vw;
    height: 100vh;
    overflow-x: hidden;
}

.header[b-kupg0r379x] {
    margin: 3vh 0px 3vh 0px;
    font-size: 4vw;
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 900;
    font-style: normal;
}

/* Game */

.game[b-kupg0r379x] {
}

    .game:focus[b-kupg0r379x] {
        outline: none;
    }

.attempt[b-kupg0r379x] {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.letter[b-kupg0r379x] {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3vw;
    height: 3vw;
    margin: 0.3vw;
    border: 0.2vw solid;
    border-radius: 0.2vw;
    font-size: 2vw;
    text-align: center;
    border-color: dimgray;
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 900;
    font-style: normal;
}

.keys[b-kupg0r379x] {
    margin-top: 3vh;
}

.key-row[b-kupg0r379x] {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.key[b-kupg0r379x] {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1.8vw;
    height: 1.8vw;
    margin: 0.2vw;
    border: 0.15vw solid;
    border-radius: 0.15vw;
    font-size: 1vw;
    text-align: center;
    border-color: dimgray;
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 900;
    font-style: normal;
}

/* Text */

.text[b-kupg0r379x] {
    position: absolute;
    font-size: 3vw;
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

.button[b-kupg0r379x] {
    position: absolute;
    padding: 1vh;
    border: 0.2vw solid;
    border-radius: 0.2vw;
    border-color: dimgray;
    color: #f2f2f2;
    background-color: #7dcc06;
    font-size: 3vw;
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

    .button:hover[b-kupg0r379x] {
        background-color: #8ce309;
    }