Spacing issue in Nesting Flex Grid Items

Hello, I am facing a spacing issue between my two containers. I am trying to replicate this mock up (https://ibb.co/cy44QdV). Using these guidelines (https://dds.digitalservices.syr.edu/layout/flexbox).
Any suggestions will help. Here is what I have

 {% load i18n wagtailcore_tags %} {% load i18n static %}  <main class="main">  <div class='flex-container'>  <div class='flex-grid'>  <div class='flex-grid-item-7-md'>  <div class='flex-row'>  <div class='flex-grid-item-7-md '>  <div...
Code (markup):

Spacing issue in Nesting Flex Grid Items