Add a maximum number of columns with fxLayout

I'm using fxLayout in my HTML/CSS/Angular project and i would like have 3 squares (divs), with the same size, using fxLayout attributes. I have a lot of difficulties with fxLayout so i'm trying to get some help here.

Example of what I need, on much rows

By the way, I'd like every time I add a div and I've got already 5 on my line, I go to the line below and it starts a new one.

My code for the moment (I'm using several containers to have the behaviour I want but i would have a only one container as I said)

<div class="container" style="width: 75%" fxLayout="row" fxLayoutGap="20px" fxLayout.xs="column" fxLayoutAlign="center"
     fxLayoutWrap>
  <div fxFlex="25%" class="projects">
    <div class="blackdiv" style="background: url('../../assets/backgrounds/test.jpg'); height: 100%; width: 100%;"></div>
    <div class="infos">
      <h3>TITLE**strong text**</h3>
      <p>Application corporate</p>
    </div>
  </div>
  <div fxFlex="25%" class="projects">
    <div class="blackdiv" style="background: url('../../assets/backgrounds/test.jpg'); height: 100%; width: 100%;"></div>
    <div class="infos">
      <h3>TITLE</h3>
      <p>Application évenementielle</p>
    </div>
  </div>
  <div fxFlex="25%" class="projects">
    <div class="blackdiv" style="background: url('../../assets/backgrounds/test.jpg'); height: 100%; width: 100%;"></div>
    <div class="infos">
      <h3>TITLE</h3>
      <p>Application participative</p>
    </div>
  </div>
</div>

<div style="margin-bottom: 20px"></div>

<div class="container" style="width: 75%" fxLayout="row" fxLayoutGap="20px" fxLayout.xs="column" fxLayoutAlign="center"
     fxLayoutWrap>
  <div fxFlex="25%" class="projects">
    <div class="blackdiv" style="background: url('../../assets/backgrounds/test.jpg'); height: 100%; width: 100%;"></div>
    <div class="infos">
      <h3>TITLE</h3>
      <p>Application forum</p>
    </div>
  </div>
  <div fxFlex="25%" class="projects">
    <div class="blackdiv" style="background: url('../../assets/backgrounds/test.jpg'); height: 100%; width: 100%;"></div>
    <div class="infos">
      <h3>TITLE</h3>
      <p>Application score dynamique</p>
    </div>
  </div>
</div>

I hope you will be able to help me guys, thanks