The grid system is used by applying the class l-grid. In total, no more than 12 columns can fill up the grid. Every child element of the grid is called l-grid__col. The child is properly applied by adding the amount of columns to the child class. An example of a child could be: l-grid__col-4-12, l-grid__col-6-12 or l-grid__col-2-12.
When there are no modifiers applied to the grid, it will render itself as columns and rows.
The grid has empty spaces and is irregular. This can be done by placing some u-gird__col inside another div with the class l-grid__row.
Standard, the grid is created without spacing. To add spacing to the grid, add the modifier l-grid--with-margins. It will use the amount defined in the gutter variabele to add the correct amount of spacing.
