## Quick Reference

These quick guides will help you get started. For more detailed instructions check out the documentation.

### Grid (_layout.scss)

Mixin | Usage
--- | ---
`@include container()` | Apply to an element wrapping the column structure
`@include columns($columns, $offset, $gutter)` | `@include columns(8, 0, 0)`
`@include responsive-columns($breakpoint, $columns, $offset, $gutter);` | Apply to overwrite default breakpoint columns

### Grid Settings(_variables.scss)

Grid breakpoints and settings are set in `_variables.scss`

### Grid Examples(_layout.scss)

`@include container()`
`@include columns(3);`
`@include columns(4);`
`@include columns(5);`
`@include columns(5, 2);`
`@include columns(5);`
`@include columns(9);`
`@include columns(6);`
`@include columns(6);`
`@include columns(3);`
`@include columns(9, 0, 10%);`
``@include columns(3);``
`@include columns(6);` `@include responsive-columns('mobile', 0.5);`
``@include columns(6);` `@include responsive-columns('mobile', 0.5);``
`@include columns(5, 0, 0);` `@include responsive-columns('mobile', 0.4, 0, 0);`
`@include columns(7, 0, 0);` `@include responsive-columns('mobile', 0.6, 0, 0);`