CSS - Tea Cozy - Image Alignment - Flexbox

Hi Everyone, This is my first time posting for help on here so if I totally botched the process, forgive me. I am doing the Tea Cozy project and have it mostly completed, however, I am really struggling with getting the 5 images to align properly. There are supposed to be 3 on top and 2 below it with fairly narrow gaps between and centered on the page. Anytime I do the flex-wrap it switches it to a 2x2 image grid with tons of space between the images and currently they are all in one line- ignoring my width of 1000px on the container.
Any help is appreciated. Thank you!
*Going to try and post my code
HTML Here:

[code byte]

  <div class='tea'>

    <p>

      <h2>Tea of the Month</h2>

    </p>

    <p>

      <h4>What's Steeping at The Tea Cozy?</h4>

    </p>

  </div>

  <div  id='menu-pictures'>

    <figure>

      <img src="media/img-berryblitz.webp" width="300" height="200">

      <figcaption>Fall Berry Blitz Tea</figcaption>

    </figure>

    <figure>

      <img src="media/img-spiced-rum.webp" width="300" height="200">

      <figcaption>Spiced Rum Tea</figcaption>

    </figure>

    <figure>

      <img src="media/img-donut.webp" width="300" height="200">

      <figcaption>Seasonal Donuts</figcaption>

    </figure>

    <figure>

      <img src="media/img-myrtle-ave.webp" width="300" height="200">

      <figcaption>Myrtle Ave Tea</figcaption>

    </figure>

    <figure>

      <img src="media/img-bedford-bizarre.webp" width="300" height="200">

      <figcaption>Bedford Bizarre Tea</figcaption>

    </figure>

  </div>

</div>

[/codebyte]
And CSS here:

.middle-container{ width:1000px; margin-top: 60px; margin-left: auto; margin-right: auto; justify-content: center; align-items: center; align-content: space-evenly; } .figure{ width: 300px; margin: 10px; text-align: center; display: block; } #menu-pictures{ display: flex; justify-content: center; }

You set the container around #menu-pictures to width: 1000px, but #menu-pictures may not be filling up that full 1000px. You try setting the width of menu-pictures to 100% so it will fill its parent container.