{% extends "layout.jinja2" %}
{% block content %}

  <br>

    <div class="row">
      <div class="large-12 columns">
        <div class="panel">



<h1 class="text-center">Typo Heading & Icon list</h1>

   <h1>Heading 1</h1>
   <h2>Heading 2</h2>
   <h3>Heading 3</h3>
   <h4>Heading 4</h4>
   <h5>Heading 5</h5>
   <h6>Heading 6</h6>


<hr>


<i class="fa fa-check"></i></a>

<i class="fa fa-download"></i></a>

<i class="fa fa-envelope"></i></a>

<i class="fa fa-print"></i></a>

<i class="fa fa-bar-chart"></i></a>

<i class="fa fa-twitter"></i></a>

<i class="fa fa-facebook"></i></a>

<i class="fa fa-calendar-o"></i></a>

<i class="fa fa-facebook-square"></i></a>

<i class="fa fa-linkedin"></i></a>

<i class="fa fa-pinterest"></i></a>

<i class="fa fa-pinterest-square"></i></a>

<i class="fa fa-google-plus-square"></i></a>

<i class="fa fa-calendar"></i></a>

<i class="fa fa-google-plus"></i></a>

<i class="fa fa-warning"></i></a>

<i class="fa fa-exclamation"></i></a>

<i class="fa fa-chevron-left"></i></a>

<i class="fa fa-chevron-right"></i></a>

<i class="fa fa-file-pdf-o"></i></a>

<i class="fa fa-file-word-o"></i></a>

<i class="fa fa-file-excel-o"></i></a>

<br>
<a href="http://fortawesome.github.io/Font-Awesome/cheatsheet/" target="blank">Complete icon set > </a>



<hr>


<article itemtype="http://schema.org/Article">

      <header>
          <h1 itemprop="name">Heading 1</h1>
      </header>

      <p itemprop="description">Maecenas ac tortor nec <strong>ligula facilisis commodo</strong>. Etiam cursus augue ac interdum lobortis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per <a href="#" itemprop="url">inceptos himenaeos</a>. Suspendisse libero magna, volutpat vel massa sed, mollis hendrerit nisi. Quisque non augue a nisi auctor molestie ac sed turpis. Phasellus pulvinar, orci nec condimentum fringilla, mi arcu iaculis metus.
      </p>

</article>





       <h2 itemprop="name">Heading 2</h2>
       <p itemprop="description">
        <strong>Maecenas ac tortor nec ligula facilisis commodo</strong>. Etiam cursus augue ac interdum lobortis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse libero magna, volutpat vel massa sed, mollis hendrerit nisi. Quisque non augue a nisi auctor molestie ac sed turpis. Phasellus pulvinar, <a href="#" itemprop="url">inceptos himenaeos</a>, mi arcu iaculis metus.
      </p>


        <h3 itemprop="name">Heading 3</h3>

        <p itemprop="description">
        Maecenas ac tortor nec ligula facilisis commodo. Etiam cursus augue ac interdum lobortis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse libero magna, volutpat vel massa sed, mollis hendrerit nisi. Quisque non augue a nisi auctor molestie ac sed turpis. Phasellus pulvinar, orci nec condimentum fringilla, mi arcu iaculis metus.
        </p>

        <h4 itemprop="name">Heading 4</h4>
        <p itemprop="description">
        Maecenas ac tortor nec ligula facilisis commodo. Etiam cursus augue ac interdum lobortis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse libero magna, volutpat vel massa sed, mollis hendrerit nisi. Quisque non augue a nisi auctor molestie ac sed turpis. Phasellus pulvinar, orci nec condimentum fringilla, mi arcu iaculis metus.
        </p>

        <h5 itemprop="name">Heading 5</h5>
        <p itemprop="description">
        Maecenas ac tortor nec ligula facilisis commodo. Etiam cursus augue ac interdum lobortis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse libero magna, volutpat vel massa sed, mollis hendrerit nisi. Quisque non augue a nisi auctor molestie ac sed turpis. Phasellus pulvinar, orci nec condimentum fringilla, mi arcu iaculis metus.
        </p>

        <h6 itemprop="name">Heading 6</h6>
        <p itemprop="description">
        Maecenas ac tortor nec ligula facilisis commodo. Etiam cursus augue ac interdum lobortis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse libero magna, volutpat vel massa sed, mollis hendrerit nisi. Quisque non augue a nisi auctor molestie ac sed turpis. Phasellus pulvinar, orci nec condimentum fringilla, mi arcu iaculis metus.
        </p>




        </div>
    </div>
</div>




<h1 class="text-center">Parapraphs</h1>

    <div class="row">
      <div class="large-12 columns">
        <div class="panel">





   <p>
        Maecenas ac tortor nec ligula facilisis commodo. Etiam cursus augue ac interdum lobortis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Suspendisse libero magna, volutpat vel massa sed, mollis hendrerit nisi. Quisque non augue a nisi auctor molestie ac sed turpis. Phasellus pulvinar, orci nec condimentum fringilla, mi arcu iaculis metus.
   </p>





<p class="text-left">
Text left - Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>



<p class="text-right">
Text right - Cras leo lacus, ultrices in orci id, porttitor finibus metus. Pellentesque iaculis libero a erat tempor, id interdum lectus sodales. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
</p>

<p class="text-center">
Text center - Cras leo lacus, ultrices in orci id, porttitor finibus metus. Pellentesque iaculis libero a erat tempor, id interdum lectus sodales. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
</p>

<p class="text-justify">
Text justify - Cras leo lacus, ultrices in orci id, porttitor finibus metus. Pellentesque iaculis libero a erat tempor, id interdum lectus sodales. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.Cras leo lacus, ultrices in orci id, porttitor finibus metus. Pellentesque iaculis libero a erat tempor, id interdum lectus sodales. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
</p>









        </div>
    </div>
</div>


{% endblock %}