Intro text is larger and allows for a slightly offset text at the top of the page. It is a paragraph with a class of intro.

Body copy is 18px/28px in Proxima Nova Regular. Curabitur blandit tempus porttitor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Nullam quis risus eget urna mollis ornare vel eu leo.

Curabitur this is bolded text tempus porttitor. This is a link. It is teal and bolded. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Nullam quis risus eget urna mollis ornare vel eu leo.

Headings

Heading 1 (xl)

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Alternate Headings

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Sed posuere consectetur est at lobortis. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam.

Blockquotes

Blockquotes are Jubilat Italic. 24px/36px. On blog posts they extend outside the left margin. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.

Tweet Quotes

Tweet quotes are created using <blockquote class=”tweet”>, which means you’ll need to switch to HTML mode.

Tweet quotes are Jubilat Italic. 24px/36px and blue. On click they open a tweet window.

Aenean eu leo quam. Pellentesque ornare sem  lacinia quam venenatis vestibulum. Vivamus sagittis  lacus vel augue laoreet rutrum faucibus dolor  auctor. Aenean lacinia bibendum nulla sed  consectetur. Aenean eu leo quam. Aenean eu leo  quam.

Pellentesque ornare sem augue laoreet lacinia quam venenatis vestibulum. Vivamus sagittis  lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas sed diam eget risus varius blandit sit amet non magna.

Buttons

Primary Button Secondary Button Tertiary Button Dark Button Subtle Button Large Button Small Button

Sed posuere consectetur est at lobortis. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam.

Images

Images with .alignleft or .alignright will float left or right accordingly and can only be up to 40% of the width of the container. Images set to .alignnone can fill full width ofthe container element. Duis commodo mollis, est non commodo luctus, nisi erat ligula, eget lacinia odio sem nec elit. Sed consectetur est at lobortis. Aenean eu leo. Pellentesque ornare sem lacinia quam vestibulum. Donec sed odio dui. Maecenas faucibus mollis interdum. Donec ullamcorper nulla non metus auctor fringilla. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Maecenas sed diam eget risus varius.

Maecenas faucibus mollis interdum. Donec ullamcorper nulla non metus auctor fringilla. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Maecenas sed diam eget risus varius

Images with .aligncenter will be up to 40% of the width of the container and centered.

Images with .alignnone will be full-width and act as more of a graphic element.