SOURCE

<div class="grid-one">
        <div class="grid-left"></div>
        <div class="grid-right"></div>
    </div>
    <div class="grid-two">
        <div class="grid-two-left"></div>
        <div class="grid-center"></div>
        <div class="grid-two-right"></div>

* {
    margin: 0;
    padding: 0;
}
.grid-one {
    display: grid;
    grid-gap: 20px;
    grid-template-columns: 1fr 300px;
    grid-template-rows: 200px;
    margin-bottom: 18px;
}
.grid-left {
    background-color: #abcdef;
}
.grid-right {
    background-color: #aabbcc;
}
.grid-two {
    display: grid;
    grid-gap: 20px;
    grid-template-columns: 300px 1fr 300px;
    grid-template-rows: 200px;
}
.grid-two-left {
    background-color: #aadddd;
}
.grid-center {
    background-color: #aabbbb;
}
.grid-two-right {
    background-color: #abcdef;
}