@media (min-width: 900px) {
    .grid-container {
        /* esta es una forma
        grid-template-columns: 200px auto;
        grid-template-rows: 100px 50px auto 100px;
        /*background-color: blue;*/
        /*grid-template-areas: 
        "header header"
        "navbar navbar"
        "sidebar main"
        "footer footer";*/

        /* esta es otra forma más sencilla*/
        grid-template: 
        "header  header header" 50px
/*        "navbar  main sidebar" auto  */
        "navbar main main" auto
        "footer  footer  footer" 50px /
        120px    auto    0px;
    }

    .navbar img:hover{
        .grid-container{
            grid-template: 
            "header  header header" 50px
/*        "navbar  main sidebar" auto  */
            "navbar main main" auto
            "footer  footer  footer" 50px /
            120px    auto    auto;
    }

    }
}