Section

Section is a logical grouping of content.

Section

We've added some convenient classes for logically grouping content. We call it a section. A section adds padding to the top and bottom of the content and takes up 100% of its container. You can also change its background color. For example, this is a normal section. It has a white background.

Section (gradient)

By adding a class of "gradient", we can change the background color to gradient that fades from a gray to white.

Section (light)

By adding a class called "light", we can change the background color to a light gray.

Section (slate)

By adding a class called "slate", we can change the background color to a darker gray.

Section (dark)

By adding a class called "dark", we can change the background color to a black(ish) color. We also inverse the default font color to be white.

Section (condensed)

By adding a class called "condensed", we can cut the padding values down to 1.25rem. For everyone who wants less whitespace.

Section (collapse)

By adding a class called "collapse", we can remove the padding. You can use this in conjunction with any of the color classes.