Begin on media Queries

@media screen(max-width:1024px){

.content{
    display:grid;
    grid-template-areas:"first two"
                        "three four";
    grid-template-columns:repeat(2 ,1fr);
    grid-template-rows:repeat(2 ,1fr);
}

.first{
    grid-area: first;
}

.two{
    grid-area:two;
}

.three{
    grid-area:three;
}

.four{
    grid-area:four;
}

.middle{
    visibility: hidden;
}

.right{
    visibility: hidden; 
}
}

@media screen(max-width:1024px){

.content{
    display:grid;
    grid-template-areas:"first two"
                        "three four";
    grid-template-columns:repeat(2 ,1fr);
    grid-template-rows:repeat(2 ,1fr);
}

.first{
    grid-area: first;
}

.two{
    grid-area:two;
}

.three{
    grid-area:three;
}

.four{
    grid-area:four;
}

.middle{
    visibility: hidden;
}

.right{
    visibility: hidden; 
}
}