Use flexbox instead of bootstrap columns for activities in tab-directory.html

[DanielCaspers]

Unless certain types of activities are kept under character limit, there will be a layout bug.

[DanielCaspers]

Why Flexbox?

Flexbox will allow us to make the best use of screen real estate by allowing larger items more space and smaller items less space. This could be nice on things like buttons for text, but aren't necessarily as important for the image recommendations.