.videogrid {
    display: grid;
    grid-template-columns: (0.5fr, 1fr);
    grid-template-rows: (0.2fr, 1fr);
}
.videogrid1 {
    grid-area: 1 / 1/ 2 / 3;
}
.videogrid2 {
    grid-area: 2 / 1 / 3 / 2;
}
.videogrid3 {
    grid-area: 2 / 2 / 3 / 3;
}

@media all and (max-width: 768px) {


    .videogrid {
        display: grid;
        grid-template-columns: (1fr);
        grid-template-rows: (0.2fr, 1fr, 1fr);
    }
    .videogrid1 {
        grid-area: 1 / 1/ 2 / 2;
    }
    .videogrid2 {
        grid-area: 2 / 1 / 3 / 2;
    }
    .videogrid3 {
        grid-area: 3 / 1 / 4 / 2;
    }
}

video {
    height: 225px;
    width: 240px
}