body {
    background-color: lightblue;
    font-family: 'Kristen ITC';
    
}

.container{
    height: 95vh;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
    font-size: 2.5rem;
    margin-top: 0.5px;
    margin-bottom: 0.5px;
    color: color-mix(in hsl shorter hue, blue 50%, green 50%);

}

.player{
    width: flex;
    height: flex;
    justify-content: center;
    align-items: center;
    display: flex;
    font-size: 2.5rem;
    margin-bottom: 20px;
    color: color-mix(in hsl shorter hue, blue 50%, green 50%);
}

.field1{
    justify-content: center;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    color: aqua ;
}

.field1 button{
    width: 175px;
    height: 175px;
    font-size: 8rem;
    cursor:cell;
    color: color-mix(in hsl shorter hue, blue 75%, green 50%);
    
}

.field2{
    justify-content: center;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.field2 button{
    width: 175px;
    height: 175px;
    font-size: 8rem;
    cursor:cell;
    color: color-mix(in hsl shorter hue, blue 75%, green 50%);
}


.field3{
    justify-content: center;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.field3 button{
    width: 175px;
    height: 175px;
    font-size: 8rem;
    cursor:cell;
    color: color-mix(in hsl shorter hue, blue 75%, green 50%);
}

.win{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 20px;
    font-size: 2.5rem;
    color: limegreen;
}

.restart{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.restart button {
    width: 200px;
    height: 100px;
    font-size: 4rem;
    margin: 20px;
    color: color-mix(in hsl shorter hue, blue 75%, green 50%);
}