.octomodel--columns {
  display: flex;
  flex-wrap: wrap;
  margin: -1em 0 0 -1em;
}

.octomodel--columns > .octomodel-post-list__item {
  box-sizing: border-box;
  width: 100%;
  padding: 1em 0 0 1em;
}

@media (min-width: 768px) {
  /* Show two columns for all column settings. */
  .octomodel--columns > .octomodel-post-list__item {
    width: 50%;
  }
}

@media (min-width: 992px) {
  /* Show three columns for all column settings... */
  .octomodel--columns > .octomodel-post-list__item {
    width: 33.33%;
  }
  /* ...except the two column setting. */
  .octomodel--columns-2 > .octomodel-post-list__item {
    width: 50%;
  }
}

@media (min-width: 1200px) {
  /* Show four columns for all column settings... */
  .octomodel--columns > .octomodel-post-list__item {
    width: 25%;
  }
  /* ...except the two and three column settings. */
  .octomodel--columns-2 > .octomodel-post-list__item {
    width: 50%;
  }
  .octomodel--columns-3 > .octomodel-post-list__item {
    width: 33.33%;
  }

  /* Show all items on one line for the nowrap column setting. */
  .octomodel--columns-nowrap {
    flex-wrap: nowrap;
  }
  .octomodel--columns-nowrap > .octomodel-post-list__item {
    width: 100%;
  }
}