Как поставить все изображения в ряд?

.fac {
  width: 80%;
  margin: auto;
  text-align: center;
  padding-top: 100px;
}

.col {
  flex-basis: 31%;
  border-radius: 10px;
  margin-bottom: 5%;
  text-align: center;
}

.col img {
  width: 100%;
  border-radius: 10px;
  padding: 5px;
  margin-right: -4px;
}

.col p {
  padding: 0;
}

.col h3 {
  margin-top: 16px;
  margin-bottom: 15px;
  text-align: left;
}

.col p {
  padding: 0;
}

.col h3 {
  margin-top: 16px;
  margin-bottom: 15px;
  text-align: left;
}

<section class = "fac">
  <h1>Linia de productie sau ceva</h1>
  <p>Yes, I guess?</p>
  <div class = "row">
    <div class = "col">
      <img src = "../photos/stc.jpg">
      <h3>yuo gen roadmap</h3>
      <p>ceva descriere</p>
    </div>
  </div>
  <div class = "row">
    <div class = "col">
      <img src = "../photos/meatthemeat.jpg">
      <h3>Bsalasaaa da</h3>
      <p>dfasd</p>
    </div>
  </div>
  <div class = "row">
    <div class = "col">
      <img src = "../photos/bbc.jpg">
      <h3>aasdasa da</h3>
      <p>adsfd</p>
    </div>
  </div>
</section>