Coder Wrap provides free to use snippets

/**Typeo CSS Start**/
  @import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,400;0,500;0,700;0,800;1,300;1,400;1,500;1,600;1,700&display=swap');
  * {
  box-sizing: border-box;
  }
  body {
  margin: 0px;
  background-color: #d5d5d5;
  }
  /**Typeo CSS End**/
  .brands-scn, .brands-scn * {
  --page-width: 1230px;
  --base-fm:'Rubik', sans-serif;
  --title-size:30px;
  --base-size:16px;
  --white-clr:#ffffff;
  --bg-clr:#efedeb;
  }
  /**Brand Section Start**/
.brands-scn {
 font-family: var(--base-fm);
 background-color: var(--bg-clr);
 padding:60px 0;
 color: var(--white-clr);
 background-size: cover;
}
.brands-scn h2 {
 font-size: var(--title-size);
 margin: 0px 0 20px 0;
}
  .page-width {
  max-width: var(--page-width);
  padding: 0 15px;
  margin: auto;
  width: 100%;
  }
  .brands-list {display: flex;flex-flow: row wrap;justify-content: space-between;}

.brands-list .brands-item {
    padding: 15px;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    justify-content: center;
    background-color: var(--white-clr);
    width: calc(16.66% - 14px);
    margin: 7px 0px;

}
.brands-list .brands-item img {
 max-width: 70%;
}
@media(max-width: 992px) {
 .brands-scn {
  padding: 30px 0;
 }
 .brands-scn h2 {
  font-size: calc(var(--title-size) - 6px);
 }
 .brands-scn p {
  font-size: calc(var(--base-size) - 2px);
 }
 .brands-list .brands-item {
  width: calc(33.33% - 8px);
  margin: 6px 0px;
 }
}