Images

Image align left, lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur mauris nisi, rutrum ac accumsan sed, pharetra a eros. Ut in purus enim, vel congue nisl. Sed non justo magna, sed eleifend nulla. Nullam augue nibh, vulputate ut ultrices et, molestie eget libero. Nunc porta purus sed velit ultrices sodales. Sed in urna arcu. Pellentesque feugiat purus non massa viverra blandit. Aliquam quis vestibulum lacus.

Aliquam sagittis ultricies lectus, quis ultrices ante tempus convallis. Nulla hendrerit justo sed mauris tristique dapibus. Etiam libero leo, dignissim id egestas id, iaculis sit amet justo. Nullam a justo erat. Aenean auctor urna ut odio vulputate faucibus. Mauris imperdiet faucibus nibh vel elementum. Morbi sit amet ante id elit cursus consectetur.

Image align right with frame class, duis quis scelerisque dolor. Sed eu ipsum libero, ac placerat sapien. Curabitur a vestibulum felis. Ut feugiat blandit dolor, ut facilisis libero bibendum ut. Cras ut varius leo. Morbi felis odio, iaculis vitae aliquet sed, placerat in velit. This is link Mauris nec turpis quam. Donec ultrices est ut augue vulputate a blandit eros laoreet. Nunc sodales justo volutpat libero porta eu pharetra lacus tempus.

Nam fringilla placerat urna in rutrum. Praesent justo turpis, lacinia id tempus ut, pharetra quis sem. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse porta laoreet dignissim. Curabitur dapibus, neque sit amet rhoncus ullamcorper, nisi mauris lobortis lacus, vitae convallis nibh dui id lacus. Morbi a varius odio. Vivamus vitae turpis odio. Pellentesque nec tortor tellus. Vestibulum at interdum diam. Integer ut arcu ante, sed facilisis tellus. Fusce adipiscing turpis sed magna sagittis et suscipit sapien adipiscing. Cras malesuada tempor enim, eu malesuada turpis hendrerit in. Etiam semper metus nec risus mollis ultricies.

Image align center with frame class nam fringilla placerat urna in rutrum. Praesent justo turpis, lacinia id tempus ut, pharetra quis sem. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse porta laoreet dignissim. Curabitur dapibus, neque sit amet rhoncus ullamcorper, nisi mauris lobortis lacus, vitae convallis nibh dui id lacus.

<img href="http://image_url" alt="Image text" class="alignleft" />
<img href="http://image_url" alt="Image text" class="alignleft frame" />
<img href="http://image_url" alt="Image text" class="alignright" />
<img href="http://image_url" alt="Image text" class="alignright frame" />
<img href="http://image_url" alt="Image text" class="aligncenter" />
<img href="http://image_url" alt="Image text" class="aligncenter frame" />

Shadow boxes

<div class="shadow-box-medium"> <img title="" src="http://image_link" /> </div>

<div class="shadow-box-big"> <img title="" src="http://image_link" /> </div>

Headings

H1 Heading

H2 Heading

H3 Heading

H4 Heading

H1 Heading

H6 Heading

<h1>H1 Heading</h1>
<h2>H2 Heading</h2>
<h3>H3 Heading</h3>
<h4>H4 Heading</h4>
<h5>H1 Heading</h5>
<h6>H6 Heading</h6>

Example heading with line

<h3 class="line-heading">Example heading with line</h3>

Resizable buttons

Example white buttonExample blue button Example orange buttonExample violet buttonExample green button

<a href="#" class="button button-white">Example white button</a>

Big button

This is a big button!

<a href="#" class="button-big">Button text</a>

Black box

<div class="black-box">
   <p>Black box content</p>
</div>

Latest tweets

• Sed fringilla neque non velit pharetra nec ornare metus faucibus. Morbi est ipsum, congue id tempus eleifend, lacinia vestibulum orci. Curabitur elementum mollis ipsum et congue. - Posted 9 hours ago -

• Praesent justo turpis, lacinia id tempus ut, pharetra quis sem. Lorem ipsum dolor sit amet. - Posted 9 hours ago -

<ul class="tweets styled">
   <li>
      <p>tweet here<span>- Posted 9 hours ago -</span></p>
   </li>
   <li>
      <p>tweet here<span>- Posted 9 hours ago -</span></p>
   </li>
</ul>
<div class="divider"></div>

Blockquote/tetimonials

Sed fringilla neque non velit pharetra nec ornare metus faucibus. Morbi est ipsum, congue id tempus eleifend, lacinia vestibulum orci. Curabitur elementum mollis ipsum et congue. - John Doe (Manager)

<blockquote>
  <p>Curabitur elementum mollis ipsum et congue. <span class="author">- John Doe (Manager)</span></p>
</blockquote>

Lists

Donec dignissim tristique consectetur. Vestibulum vel magna mi. Aliquam ac faucibus est. Sed vel libero diam. Aenean lacus orci, tincidunt quis bibendum in, sollicitudin et tellus. In enim velit, pretium sollicitudin ultricies in, aliquam nec risus. Suspendisse vel risus sem, eget hendrerit eros.

<ul>
  <li>List element</li>
  <li>List element
   <ul>
    <li>List element</li>
    <li>List element</li>
   </ul>
  </li>
  <li>List element</li>
</ul>

<ul class="check-list-green styled">
  <li>List element</li>
  <li>List element</li>
  <li>List element</li>
</ul>

<ul class="bullet-list-green styled">
  <li>List element</li>
  <li>List element</li>
  <li>List element</li>
</ul>

Code:

<pre>Example code here...</pre>

Abbreviation, cite, delete, insert...

This is abbreviation text.
This is cite text.
This is deleted text text.
This is inserted text.
This is emphysis text.
This is a definition text.
This is bold text

<abbr>This is abbreviation text.</abbr>
<cite>This is cite text.</cite>
<del>This is deleted text text.</del>
<ins>This is inserted text.</ins>
<em>This is emphysis text.</em>
<dfn>This is a definition text.</dfn>
<strong>This is bold text</strong>

Table:

<table>
   <tbody>
    <tr>
     <th colspan="4">Vivamus vitae turpis odio</th>
    </tr>
    <tr>
     <td class="even">Vivamus vitae turpis</td>
     <td class="even">10440</td>
     <td class="even">922</td>
     <td class="even">63435</td>
    </tr>
  </tbody>
 </table>