#main-content {
    display: grid;
    grid-template-rows: repeat(auto, 1fr);
    justify-content: center;
    margin: 0 auto;
    align-items: stretch;
    grid-template-areas: "my-turns" "all-turns" "video" "memo" "search" "info-link" "info" "videos" "problem";
}

@media screen and (min-width:800px) {
    #main-content {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(auto, 1fr);
        grid-template-areas: "memo all-turns video" "search my-turns info-link" "info videos problem";
    }
}

#my-turns {
    grid-area: my-turns;
}

#all-turns {
    grid-area: all-turns;
}

#video {
    grid-area: video;
}

#memo {
    grid-area: memo;
}

#search {
    grid-area: search;
}

#info-link {
    grid-area: info-link;
}

#info {
    grid-area: info;
}

#problem {
    grid-area: problem;
}

#videos {
    grid-area: videos;
}