Typography

Elevation comes with some simple typographical styling to help enhance the raw power of the theme.

Heading 1

Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor. Donec congue. Morbi auctor hendrerit dui. Aliquam turpis. Maecenas molestie augue in urna. Donec gravida magna eget nulla. Phasellus sed pede et turpis mollis aliquam. Quisque aliquet pede nec turpis. Maecenas ultricies.

Heading 2

Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor. Donec congue. Morbi auctor hendrerit dui. Aliquam turpis. Maecenas molestie augue in urna. Donec gravida magna eget nulla. Phasellus sed pede et turpis mollis aliquam. Quisque aliquet pede nec turpis. Maecenas ultricies.

Heading 3

Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor. Donec congue. Morbi auctor hendrerit dui. Aliquam turpis. Maecenas molestie augue in urna. Donec gravida magna eget nulla. Phasellus sed pede et turpis mollis aliquam. Quisque aliquet pede nec turpis. Maecenas ultricies.

Heading 4

Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor. Donec congue. Morbi auctor hendrerit dui. Aliquam turpis. Maecenas molestie augue in urna. Donec gravida magna eget nulla. Phasellus sed pede et turpis mollis aliquam. Quisque aliquet pede nec turpis. Maecenas ultricies.

 

Heading 5

Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor. Donec congue. Morbi auctor hendrerit dui. Aliquam turpis. Maecenas molestie augue in urna. Donec gravida magna eget nulla. Phasellus sed pede et turpis mollis aliquam. Quisque aliquet pede nec turpis. Maecenas ultricies.

 

Heading 6

Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor. Donec congue. Morbi auctor hendrerit dui. Aliquam turpis. Maecenas molestie augue in urna. Donec gravida magna eget nulla. Phasellus sed pede et turpis mollis aliquam. Quisque aliquet pede nec turpis. Maecenas ultricies.

 

This is a paragraph with the first letter in a span class called dropcap.Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor. Donec congue. Morbi auctor hendrerit dui. Aliquam turpis. Maecenas molestie augue in urna. Donec gravida magna eget nulla. Phasellus sed pede et turpis mollis aliquam. Quisque aliquet pede nec turpis. Maecenas ultricies.

 

This is a div that has the class "clear" assigned to it, while the line shown below is a paragraph or p tag with the "line" class assigned to it.

The following are simple colour stylings for divs and paragraphs.

 

This content is placed within a div with the class blackbox. Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor.

This content is placed within a div with the class greenbox. Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor.

This content is placed within a div with the class redbox. Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor.

This content is placed within a div with the class bluebox. Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor.

This content is placed within a div with the class yellowbox. Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor.

This content is placed within a div with the class brownbox. Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor.

This content is placed within a div with the class purplebox. Aenean sit amet sem. Phasellus rhoncus venenatis felis. Suspendisse iaculis mattis dolor.

 

This is some bold text.

This is some italicised text.

 

The icons used below have been created by the good folk at Dry Icons and are licensed for your use.

 

This is a code snippet if you want to highlight some text or code snippet.

This is a paragraph with the "cloud" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "attachment" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "download" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "imagedownload" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "eq" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "film" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "globe" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "id" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "image" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "lightbulb" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "noteaccept" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "notebook" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "note" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "clock" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "pages" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "camera" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "pin" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "printer" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "prize" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "puzzle" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "recycle" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "report" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "tv" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "tools" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "trash" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

This is a paragraph with the "info" class applied to it. Sed id eros iaculis tellus ultrices vehicula. Suspendisse sed urna consequat nunc condimentum sagittis. Ut laoreet turpis eget orci.

Here are the list classes available in the Organica template:

 

To apply any of these styles simply add the class of the colour that you want applied to your list.

• This is a list item with the class blue assigned to it.
• This is a list item with the class brown assigned to it.
• This is a list item with the class red assigned to it.
• This is a list item with the class green assigned to it.
• This is a list item with the class yellow assigned to it.
• This is a list item with the class black assigned to it.

And just to add some more flavour here are some colours for your spans.

• This is a span with the class blue
• This is a span with the class yellow
• This is a span with the class black
• This is a span with the class red
• This is a span with the class green
• This is a span with the class brown
• This is a span with the class purple