virtual-scroller
{
  flex-grow: 1;

  &.machines .scrollable-content
  {
    max-width: 100%;
    width: auto;
    height: auto;
    padding-bottom: 1rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    margin-top: -1rem;
    --bs-gutter-y: 2rem;
    position: relative;

    > *
    {
      flex-shrink: 0;
      max-width: 100%;
      padding-right: calc(var(--bs-gutter-x)/ 2);
      padding-left: calc(var(--bs-gutter-x)/ 2);
      padding-bottom: calc(var(--bs-gutter-y) / 2);
      margin-top: calc(var(--bs-gutter-y) / 2);
    }
  }
}

@media (min-width: 576px)
{
  virtual-scroller.machines .scrollable-content
  {
    --bs-gutter-x: 1.5rem;
  }
}

@media (max-width: 576px)
{
  virtual-scroller.machines .scrollable-content
  {
    --bs-gutter-y: 1.5rem;
  }
}