Typography

@import url('https://fonts.googleapis.com/css?family=Rubik:300,400,500,700');;
font-family : 'Rubik', sans-serif ;
font-weight: normal ;

Heading

All HTML headings, <h1>through <h6>, are available.

h1. Bootstrap heading

h2. Bootstrap heading

h3. Bootstrap heading

h4. Bootstrap heading

h5. Bootstrap heading

h6. Bootstrap heading

Blockquotes

For quoting blocks of content from another source within your document. Wrap <blockquote class="blockquote">around any HTMLas the quote.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.

Someone famous in Source Title

Display Headings

Traditional heading elements are designed to work best in the meat of your page content.

Display 1

Display 2

Display 3

Display 4

Alignments

Use text utilities as needed to change the alignment of your text.

This line of text is left.

This line of text is center.

This line of text is right.

This line of text is justify.

Unstyled List

Integer molestie lorem at massa
Nulla volutpat aliquam velit
- Phasellus iaculis neque
- Purus sodales ultricies
- Vestibulum laoreet porttitor sem
Faucibus porta lacus fringilla vel

Unorder List

Integer molestie lorem at massa
Nulla volutpat aliquam velit
- Phasellus iaculis neque
- Purus sodales ultricies
- Vestibulum laoreet porttitor sem
Faucibus porta lacus fringilla vel

Order List

Integer molestie lorem at massa
Nulla volutpat aliquam velit
- Phasellus iaculis neque
- Purus sodales ultricies
- Vestibulum laoreet porttitor sem
Faucibus porta lacus fringilla vel

Inline text elements

Styling for common inline HTML5 elements.

You can use the mark tag to highlighttext.

~~This line of text is meant to be treated as deleted text.~~

~~This line of text is meant to be treated as no longer accurate.~~

This line of text is meant to be treated as an addition to the document.

This line of text will render as underlined

This line of text is meant to be treated as fine print.

This line rendered as bold text.

This line rendered as italicized text.

Text Color

Convey meaning through color with a handful of color utility classes.

This text color is primary

This text color is success

This text color is danger

This text color is warning

This text color is info

This text color is secondary

This text color is muted

This text color is light

Description list alignment

Align terms and descriptions horizontally by using our grid system’s predefined classes (or semantic mixins). For longer terms, you can optionally add a .text-truncateclass to truncate the text with an ellipsis.

Description lists

A description list is perfect for defining terms.

Euismod

Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.

Donec id elit non mi porta gravida at eget metus.

Malesuada porta

Etiam porta sem malesuada magna mollis euismod.

Truncated term is truncated

Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.

Nesting

Nested definition list: Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc.

Address

Start to <address>tag.

Twitter, Inc.
795 Folsom Ave, Suite 600
San Francisco, CA 94107
P:(123) 456-7890