grid и flex при натяжке шаблона на WordPress

Здравствуйте, уважаемые коллеги!

Занимаюсь натяжкой самодельного шаблона на CMS WordPress. Сделал grid-сетку на три колонки (сразу над подвалом сайта), сами карточки упакованы во flex-боксы.

.colonka {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
    border: solid green 1px;
    text-align: center;
    font-family: OpenSans;
    font-size: 21px;
}

Гриду заданы атрибуты minmax и autofit.

Проблема в том, что при уменьшении вьюпорта по горизонтали и вертикали первая сносимая вниз карточка становится слева, а справа всегда остается пустое белое поле.. По мере сужения окна браузера все колонки выстроятся по вертикали, но на определенном разрешении выглядит не очень.. Поделитесь, пожалуйста, опытом, подскажите, как можно было бы решить проблему..

Заранее огромное спасибо, что уделили время!

Страница, с которой нужна помощь: [войдите, чтобы увидеть ссылку]