Handling layout changes for multiple screen sizes is as simple as adding a few more classes to your markup.

Available Classes:

screen- tablet- mobile- phone-

<div class="row double-gutters">
  <div class="columns screen-60 tablet-50 mobile-40 phone-100">
  ...
  </div>
  <div class="columns screen-40 tablet-50 mobile-60 phone-100">
  ...
  </div>
</div>

as of v.5.5 gutter chnages:

<div class="row big gutters">
  <div class="columns screen-60 tablet-50 mobile-40 phone-100">
  ...
  </div>
  <div class="columns screen-40 tablet-50 mobile-60 phone-100">
  ...
  </div>
</div>

To set the width of a grid column just add the desired width percentage class for the targeted breakpoint: