Headers and leads

h1. SmartAdmin heading Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus.	'Open Sans' 26px Light
h2. SmartAdmin heading SmartAdmins's global default `font-size` is 13px, with a `line-height` of 1.428. This is applied to the `<body>` and all paragraphs. In addition, `<p>` (paragraphs) receive a bottom margin of half their computed line-height (10px by default).	'Open Sans' 22px Light
h3. SmartAdmin heading An abbreviation of the word attribute is attr. `<abbr title="attribute">attr</abbr>`	'Open Sans' 18px Light
h4. SmartAdmin heading	'Open Sans' 17px Light
h5. SmartAdmin heading	'Open Sans' 16px Light
h6. SmartAdmin heading	'Open Sans' 14px Bold

<h1>h1. SmartAdmin heading</h1>
<h2>h2. SmartAdmin heading</h2>
<h3>h3. SmartAdmin heading</h3>
<h4>h4. SmartAdmin heading</h4>
<h5>h5. SmartAdmin heading</h5>
<h6>h6. SmartAdmin heading</h6>

h1. SmartAdmin heading Secondary text

h2. SmartAdmin heading Secondary text

h3. SmartAdmin heading Secondary text

h4. SmartAdmin heading Secondary text

h5. SmartAdmin heading Secondary text

h6. SmartAdmin heading Secondary text

<h1>h1. SmartAdmin heading <small>Secondary text</small></h1>
<h2>h2. SmartAdmin heading <small>Secondary text</small></h2>
<h3>h3. SmartAdmin heading <small>Secondary text</small></h3>
<h4>h4. SmartAdmin heading <small>Secondary text</small></h4>
<h5>h5. SmartAdmin heading <small>Secondary text</small></h5>
<h6>h6. SmartAdmin heading <small>Secondary text</small></h6>

Text and BG color options

Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh. .bg-color-green	`.txt-color-green`
Nullam id dolor id nibh ultricies vehicula ut id elit. .bg-color-greenDark	`.txt-color-greenDark`
Duis mollis, est non commodo luctus, nisi erat porttitor ligula. .bg-color-greenLight	`.txt-color-greenLight`
Maecenas sed diam eget risus varius blandit sit amet non magna. .bg-color-purple	`.txt-color-purple`
Etiam porta sem malesuada magna mollis euismod. .bg-color-magenta	`.txt-color-magenta`
Donec ullamcorper nulla non metus auctor fringilla. .bg-color-pink	`.txt-color-pink`
Lorem ipsum dolor sit amet, consectetur adipiscing elit. .bg-color-pinkDark	`.txt-color-pinkDark`
Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. .bg-color-blue	`.txt-color-blue`
Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien. bg-color-blueLight	`.txt-color-blueLight`
Libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros. .bg-color-blueDark	`.txt-color-blueDark`
Donec sodales sagittis magna. Sed consequat. .bg-color-teal	`.txt-color-teal`
Leo eget bibendum sodales, augue velit cursus nunc. .bg-color-yellow	`.txt-color-yellow`
Sed ut perspiciatis unde omnis iste natus error. .bg-color-orange	`.txt-color-orange`
Nemo enim ipsam voluptatem quia voluptas sit aspernatur. .bg-color-orangeDark	`.txt-color-orangeDark`
Qui dolorem ipsum quia dolor sit amet, consectetur. .bg-color-red	`.txt-color-red`
Nam libero tempore, cum soluta nobis est eligendi optio. .bg-color-redLight	`.txt-color-redLight`
Cumque nihil impedit quo minus id quod maxime placeat facere.	`.text-muted`
Qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit.	`.text-primary`
Ducimus qui blanditiis praesentium voluptatum deleniti.	`.text-success`
Aolorem eum fugiat quo voluptas nulla pariatur?	`.text-danger`
Ut enim ad minima veniam, quis nostrum exercitationem.	`.text-warning`
Tempora incidunt ut labore et dolore magnam aliquam quaerat.	`.text-info`

All Lists

Unordered List Item
I am inside a strong tag
I am Italic!
- We can also be red
- Or green
- Even purple!
I am inside a strong and Italic tag, I may also break into a new line if squized
I am inside a small tag

<ul>
  <li>...</li>
</ul>

Ordered List Item
Ordered List Item
Ordered List Item
- Unstyled list with custom icon
- Unstyled list with custom icon
- Unstyled list with custom icon
I am inside a strong and Italic tag, I may also break into a new line if squized
I am a label

<ol>
  <li>...</li>
</ol>

Inline List Item #1
Inline List Item #2
Inline List Item #3

<ul class="list-inline">
  <li>...</li>
</ul>

Quotes

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
Someone famous in Source Title

<blockquote>
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
  <small>Someone famous in <cite title="Source Title">Source Title</cite></small>
</blockquote>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
Someone famous in Source Title

<blockquote class="pull-right">
  ...
</blockquote>

Discription Lists

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.

<dl>
  <dt>...</dt>
  <dd>...</dd>
</dl>

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.
Felis euismod semper eget lacinia: Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.

<dl class="dl-horizontal">
  <dt>...</dt>
  <dd>...</dd>
</dl>

Address

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

Full Name
first.last@example.com

<address>
  <strong>Twitter, Inc.</strong><br>
  795 Folsom Ave, Suite 600<br>
  San Francisco, CA 94107<br>
  <abbr title="Phone">P:</abbr> (123) 456-7890
</address>

<address>
  <strong>Full Name</strong><br>
  <a href="mailto:#">first.last@example.com</a>
</address>

Alignment

Left aligned text.

Center aligned text.

Right aligned text.

<p class="text-left">Left aligned text.</p>
<p class="text-center">Center aligned text.</p>
<p class="text-right">Right aligned text.</p>

Text sizes

Take full control over the font by controling the size with the following CSS

.font-xl
.font-lg
.font-md
.font-sm
.font-xs