Responsive classes

By using this classes can alter the screen size on others devices.

You can choose the columns width for any devices For the tablet and mobile width add the class .auto-width
For the hidden of columns on tablet add the class .tablet-hide
For the hidden of columns on mobile add the class .mobile-hide
For the hidden of columns on mobile and tablets add the class .auto-hide For example:

Your header

Lorem ipsum dolor sit amet, netus justo, sed volutpat at et. Posuere at dictum sollicitudin...

HTML Example

<div class="row grid-items">
   <div class="column width-6 auto-width"> 
      <img src="img.jpg" class="full-width"/> 
   </div>
   <div class="column width-6 tablet-center auto-width">  
      ...
   </div>
</div>

Text Align

Using these classes can choose the align of text.

To alter the align of text add the classes .align-left, .align-center, .align-right but for others small screen devices add the classes .tablet-left, .tablet-center, .tablet-right and for mobile version add classes .mobile-left, .mobile-center, .mobile-right

Tablet Right

Align Right

Other classes

By using other classes you can alter others options.

For hide or show any elements add classes .hide, .show
If you want to create padding for all columns inside row add the class .grid-items to row.
If you want to create padding for selected columns inside row add the class .grid-item to column.
If you add class ".grid items" to row for all columns, except selected column add the class .no-padding to selected column.
If you want full width for selected elements add to this elements class .full-width