@media screen and (max-width:1250px){
    html,body{
        font-size: 15px;
    }
    .container{
        width: 280px;
    }
    h1.title{
        font-size: 31px;
    }
    .score-container,
    .best-container{
        padding: 3px 10px;
    }
    .game-container{
        margin-top: 10px;
        width: 280px;
        height: 280px;
    }
    .grid-container,
    .tile-container{
        width: 260px;
        height: 260px;
    }
    .grid-row,
    .tile{
        height: 22.75%;
    }
    .grid-cell,
    .tile{
        width: 22.75%;
    }
    .grid-row{
        margin-bottom: 3%;
    }
    .grid-cell{
        margin-right: 3%;
    }
    .tile{
        font-size: 35px;
    }
    .tile[data-val="128"],
    .tile[data-val="256"],
    .tile[data-val="512"]{
        font-size: 25px;
    }
    .tile[data-val="1024"],
    .tile[data-val="2048"]{
        font-size: 21px;
    }

    .pop-container p{
        font-size: 30px;
    }
}