html - Timber Shopify Theme Push/Pull columns based on screen size

Been stuck on this shopify html template that's using the Timber CSS framework. https://github.com/Shopify/Timber/blob/master/assets/timber.scss.liquid (https://github.com/Shopify/Timber/blob/master/assets/timber.scss.liquid)

I need to swap two divs with the class

grid__item

if the user is on a mobile device.

Below is the code that I have. I have no idea on how to make the swap. I believe bootstrap refers to this as push/pull?

<div class="grid">
  <div class="grid__item one-half medium-down--one-whole">1</div>
  <div class="grid__item one-half medium-down--one-whole">2</div>
</div>Copy code