*{
    font-family: Geramond;
    color: white;
}
header{
    background-color: indigo;
    text-align: center;
    padding: 2px;
}
#lewa, #prawa{
    background-color: indigo;
    height: 600px;
    }
#srodek{
    background-color: black;
    height: 600px;
    overflow: scroll;
    }
.punkty{
    background-color: tomato;
    padding: 5px;
    border-radius: 50%;
}
footer{
    background-color: indigo;
    height: 150px;
    }
li{
    padding: 5px;
}
input[type="text"]
{
    margin: 10px;
    color: indigo;
}
div.gry{
    float: left;
    text-align: center;
    padding: 3px;
}
main{
    display: flex;
    flex-direction: column;
}
@media (min-width:801px){
    main{
        flex-direction: row;
    }
    #lewa, #prawa{
        width: 20%;
    }
    #srodek{
        width: 60%;
    }
}
@media (max-width:800px){
    main{
        flex-direction: colummn;
    }
    
}