# h1 Heading 
## h2 Heading (#anchors-in-markdown)
### h3 Heading
#### h4 Heading
##### h5 Heading
###### h6 Heading

            

                <h1>h1 Heading</h1>
<h2>h2 Heading (#anchors-in-markdown)</h2>
<h3>h3 Heading</h3>
<h4>h4 Heading</h4>
<h5>h5 Heading</h5>
<h6>h6 Heading</h6>

            

                
## Horizontal Rules

___

***

***

            

                <h2>Horizontal Rules</h2>
<hr>
<hr>
<hr>

            

                
## Typographic replacements

Enable typographer option to see result.

(c) (C) (r) (R) (tm) (TM) (p) (P) +-

test.. test... test..... test?..... test!....

!!!!!! ???? ,,

Remarkable -- awesome

"Smartypants, double quotes"

'Smartypants, single quotes'

            

                <h2>Typographic replacements</h2>
<p>Enable typographer option to see result.</p>
<p>(c) (C) (r) (R) (tm) (TM) (p) (P) +-</p>
<p>test.. test... test..... test?..... test!....</p>
<p>!!!!!! ???? ,,</p>
<p>Remarkable -- awesome</p>
<p>&quot;Smartypants, double quotes&quot;</p>
<p>'Smartypants, single quotes'</p>

            

                
## Emphasis

**This is bold text**

__This is bold text__

*This is italic text*

_This is italic text_

~~Deleted text~~

Superscript: 19^th^

Subscript: H~2~O

++Inserted text++

==Marked text==

            

                <h2>Emphasis</h2>
<p><strong>This is bold text</strong></p>
<p><strong>This is bold text</strong></p>
<p><em>This is italic text</em></p>
<p><em>This is italic text</em></p>
<p><del>Deleted text</del></p>
<p>Superscript: 19<sup>th</sup></p>
<p>Subscript: H<sub>2</sub>O</p>
<p><ins>Inserted text</ins></p>
<p><mark>Marked text</mark></p>

            

                
## Blockquotes

> Blockquotes can also be nested...
>> ...by using additional greater-than signs right next to each other...
> > > ...or with spaces between arrows.

            

                <h2>Blockquotes</h2>
<blockquote>
<p>Blockquotes can also be nested...</p>
<blockquote>
<p>...by using additional greater-than signs right next to each other...</p>
<blockquote>
<p>...or with spaces between arrows.</p>
</blockquote>
</blockquote>
</blockquote>

            

                
## Lists

Unordered

+ Create a list by starting a line with `+`, `-`, or `*`
+ Sub-lists are made by indenting 2 spaces:
  - Marker character change forces new list start:
    * Ac tristique libero volutpat at
    + Facilisis in pretium nisl aliquet
    - Nulla volutpat aliquam velit
+ Very easy!

Ordered

1. Lorem ipsum dolor sit amet
2. Consectetur adipiscing elit
3. Integer molestie lorem at massa


1. You can use sequential numbers...
1. ...or keep all the numbers as `1.`

Start numbering with offset:

57. foo
1. bar

            

                <h2>Lists</h2>
<p>Unordered</p>
<ul>
<li>Create a list by starting a line with <code>+</code>, <code>-</code>, or <code>*</code></li>
<li>Sub-lists are made by indenting 2 spaces:
<ul>
<li>Marker character change forces new list start:
<ul>
<li>Ac tristique libero volutpat at</li>
</ul>
<ul>
<li>Facilisis in pretium nisl aliquet</li>
</ul>
<ul>
<li>Nulla volutpat aliquam velit</li>
</ul></li>
</ul></li>
<li>Very easy!</li>
</ul>
<p>Ordered</p>
<ol>
<li>Lorem ipsum dolor sit amet</li>
<li>Consectetur adipiscing elit</li>
<li>Integer molestie lorem at massa</li>
</ol>
<ol>
<li>You can use sequential numbers...</li>
<li>...or keep all the numbers as <code>1.</code></li>
</ol>
<p>Start numbering with offset:</p>
<ol start="57">
<li>foo</li>
<li>bar</li>
</ol>

            

                
## Custom Number

((1)) Lorem ipsum dolor sit amet

((2)) Consectetur adipiscing elit

((3)) Integer molestie lorem at massa

  (((a))) Integer molestie lorem at massa

  (((b))) Integer molestie lorem at massa

  (((c))) Integer molestie lorem at massa

((54)) Integer molestie lorem at massa

            

                <h2>Custom Number</h2>
<p><span class="number primary">1</span> Lorem ipsum dolor sit amet</p>
<p><span class="number primary">2</span> Consectetur adipiscing elit</p>
<p><span class="number primary">3</span> Integer molestie lorem at massa</p>
<p><span class="number secondary indent">a</span> Integer molestie lorem at massa</p>
<p><span class="number secondary indent">b</span> Integer molestie lorem at massa</p>
<p><span class="number secondary indent">c</span> Integer molestie lorem at massa</p>
<p><span class="number primary">54</span> Integer molestie lorem at massa</p>

            

                
## Code

Inline `code`

Indented code

    // Some comments
    line 1 of code
    line 2 of code
    line 3 of code


Block code "fences"

```
Sample text here...
```

Syntax highlighting

``` js
var foo = bar

console.log(foo(5));
```

            

// Some comments
line 1 of code
line 2 of code
line 3 of code

Sample text here...

var foo = bar

console.log(foo(5));

                <h2>Code</h2>
<p>Inline <code>code</code></p>
<p>Indented code</p>
<pre><code>// Some comments
line 1 of code
line 2 of code
line 3 of code
</code></pre>
<p>Block code &quot;fences&quot;</p>
<pre><code>Sample text here...
</code></pre>
<p>Syntax highlighting</p>
<pre><code class="language-js"><span class="hljs-keyword">var</span> foo = bar

<span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-title function_">foo</span>(<span class="hljs-number">5</span>));
</code></pre>

            

                
## Tables

| Option | Description |
| ------ | ----------- |
| data   | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext    | extension to be used for dest files. |


Right aligned columns

| Option | Description |
| ------:| -----------:|
| data   | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext    | extension to be used for dest files. |


Center aligned columns

| Option | Description |
| :-----:| :----------:|
| data   | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext    | extension to be used for dest files. |

            

                <h2>Tables</h2>
<table>
<thead>
<tr><th>Option</th><th>Description</th></tr>
</thead>
<tbody>
<tr><td>data</td><td>path to data files to supply the data that will be passed into templates.</td></tr>
<tr><td>engine</td><td>engine to be used for processing templates. Handlebars is the default.</td></tr>
<tr><td>ext</td><td>extension to be used for dest files.</td></tr>
</tbody>
</table>
<p>Right aligned columns</p>
<table>
<thead>
<tr><th style="text-align:right">Option</th><th style="text-align:right">Description</th></tr>
</thead>
<tbody>
<tr><td style="text-align:right">data</td><td style="text-align:right">path to data files to supply the data that will be passed into templates.</td></tr>
<tr><td style="text-align:right">engine</td><td style="text-align:right">engine to be used for processing templates. Handlebars is the default.</td></tr>
<tr><td style="text-align:right">ext</td><td style="text-align:right">extension to be used for dest files.</td></tr>
</tbody>
</table>
<p>Center aligned columns</p>
<table>
<thead>
<tr><th style="text-align:center">Option</th><th style="text-align:center">Description</th></tr>
</thead>
<tbody>
<tr><td style="text-align:center">data</td><td style="text-align:center">path to data files to supply the data that will be passed into templates.</td></tr>
<tr><td style="text-align:center">engine</td><td style="text-align:center">engine to be used for processing templates. Handlebars is the default.</td></tr>
<tr><td style="text-align:center">ext</td><td style="text-align:center">extension to be used for dest files.</td></tr>
</tbody>
</table>

            

                
## Links

[link text](http://dev.nodeca.com)

[link with title](http://nodeca.github.io/pica/demo/ "title text!")

Autoconverted link https://github.com/nodeca/pica (enable linkify to see)

            

                <h2>Links</h2>
<p><a href="http://dev.nodeca.com">link text</a></p>
<p><a href="http://nodeca.github.io/pica/demo/" title="title text!">link with title</a></p>
<p>Autoconverted link https://github.com/nodeca/pica (enable linkify to see)</p>

            

                
## Images

![Minion](https://octodex.github.com/images/minion.png)
![Stormtroopocat](https://octodex.github.com/images/stormtroopocat.jpg)

Like links, Images also have a footnote style syntax

![Alt text][id]

            

Images

Like links, Images also have a footnote style syntax

![Alt text][id]

                <h2>Images</h2>
<p><div class="image"><figure><img src="https://octodex.github.com/images/minion.png" alt="Minion"><figcaption>Minion</figcaption></figure></div>
<div class="image"><figure><img src="https://octodex.github.com/images/stormtroopocat.jpg" alt="Stormtroopocat"><figcaption>Stormtroopocat</figcaption></figure></div></p>
<p>Like links, Images also have a footnote style syntax</p>
<p>![Alt text][id]</p>

            

                
## Footnotes

Footnote 1 link[^first].

Footnote 2 link[^second].

Inline footnote^[Text of inline footnote] definition.

Duplicated footnote reference[^second].

[^first]: Footnote **can have markup**

    and multiple paragraphs.

[^second]: Footnote text.

            

                <h2>Footnotes</h2>
<p>Footnote 1 link<sup class="footnote-ref"><a href="#fn1" id="fnref1">[1]</a></sup>.</p>
<p>Footnote 2 link<sup class="footnote-ref"><a href="#fn2" id="fnref2">[2]</a></sup>.</p>
<p>Inline footnote<sup class="footnote-ref"><a href="#fn3" id="fnref3">[3]</a></sup> definition.</p>
<p>Duplicated footnote reference<sup class="footnote-ref"><a href="#fn2" id="fnref2:1">[2]</a></sup>.</p>
<hr class="footnotes-sep">
<section class="footnotes">
<ol class="footnotes-list">
<li id="fn1"  class="footnote-item"><p>Footnote <strong>can have markup</strong></p>
<p>and multiple paragraphs. <a href="#fnref1" class="footnote-backref">↩</a></p>
</li>
<li id="fn2"  class="footnote-item"><p>Footnote text. <a href="#fnref2" class="footnote-backref">↩</a> <a href="#fnref2:1" class="footnote-backref">↩</a></p>
</li>
<li id="fn3"  class="footnote-item"><p>Text of inline footnote <a href="#fnref3" class="footnote-backref">↩</a></p>
</li>
</ol>
</section>

            

                
## Definition lists

Term 1

:   Definition 1
with lazy continuation.

Term 2 with *inline markup*

:   Definition 2

        `some code, part of Definition 2`

    Third paragraph of definition 2.

_Compact style:_

Term 1
  ~ Definition 1

Term 2
  ~ Definition 2a
  ~ Definition 2b

            

                <h2>Definition lists</h2>
<dl>
<dt>Term 1</dt>
<dd><p>Definition 1
with lazy continuation.</p>
</dd>
<dt>Term 2 with <em>inline markup</em></dt>
<dd><p>Definition 2</p>
<pre><code>  `some code, part of Definition 2`
</code></pre>
<p>Third paragraph of definition 2.</p>
</dd>
</dl>
<p><em>Compact style:</em></p>
<dl>
<dt>Term 1</dt>
<dd>Definition 1
</dd>
<dt>Term 2</dt>
<dd>Definition 2a
</dd>
<dd>Definition 2b
</dd>
</dl>

            

                
## Abbreviations

This is HTML abbreviation example.

It converts "HTML", but keep intact partial entries like "xxxHTMLyyy" and so on.

*[HTML]: Hyper Text Markup Language

            

                <h2>Abbreviations</h2>
<p>This is <abbr title="Hyper Text Markup Language">HTML</abbr> abbreviation example.</p>
<p>It converts &quot;<abbr title="Hyper Text Markup Language">HTML</abbr>&quot;, but keep intact partial entries like &quot;xxxHTMLyyy&quot; and so on.</p>

            

                
## Admonition
:::caution On peut changer le titre aussi
Beware Ogre
:::
:::note
Beware Ogre
:::
:::important
Beware Ogre
:::

:::tip
Beware Ogre
:::

:::warning
Beware Ogre
:::

            

                <h2>Admonition</h2>

    <div class="admonition admonition-caution">
      <div class="admonition-heading">
        <h5><div class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="16" viewBox="0 0 12 16"><path fill-rule="evenodd" d="M5.05.31c.81 2.17.41 3.38-.52 4.31C3.55 5.67 1.98 6.45.9 7.98c-1.45 2.05-1.7 6.53 3.53 7.7-2.2-1.16-2.67-4.52-.3-6.61-.61 2.03.53 3.33 1.94 2.86 1.39-.47 2.3.53 2.27 1.67-.02.78-.31 1.44-1.13 1.81 3.42-.59 4.78-3.42 4.78-5.56 0-2.84-2.53-3.22-1.25-5.61-1.52.13-2.03 1.13-1.89 2.75.09 1.08-1.02 1.8-1.86 1.33-.67-.41-.66-1.19-.06-1.78C8.18 5.31 8.68 2.45 5.05.32L5.03.3l.02.01z"/></svg></div>  On peut changer le titre aussi</h5>
      </div>
      <div class="admonition-content">
    <p>Beware Ogre</p>
</div></div>
    <div class="admonition admonition-note">
      <div class="admonition-heading">
        <h5><div class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="16" viewBox="0 0 14 16"><path fill-rule="evenodd" d="M6.3 5.69a.942.942 0 0 1-.28-.7c0-.28.09-.52.28-.7.19-.18.42-.28.7-.28.28 0 .52.09.7.28.18.19.28.42.28.7 0 .28-.09.52-.28.7a1 1 0 0 1-.7.3c-.28 0-.52-.11-.7-.3zM8 7.99c-.02-.25-.11-.48-.31-.69-.2-.19-.42-.3-.69-.31H6c-.27.02-.48.13-.69.31-.2.2-.3.44-.31.69h1v3c.02.27.11.5.31.69.2.2.42.31.69.31h1c.27 0 .48-.11.69-.31.2-.19.3-.42.31-.69H8V7.98v.01zM7 2.3c-3.14 0-5.7 2.54-5.7 5.68 0 3.14 2.56 5.7 5.7 5.7s5.7-2.55 5.7-5.7c0-3.15-2.56-5.69-5.7-5.69v.01zM7 .98c3.86 0 7 3.14 7 7s-3.14 7-7 7-7-3.12-7-7 3.14-7 7-7z"/></svg></div> note</h5>
      </div>
      <div class="admonition-content">
    <p>Beware Ogre</p>
</div></div>
    <div class="admonition admonition-important">
      <div class="admonition-heading">
        <h5><div class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="16" viewBox="0 0 14 16"><path fill-rule="evenodd" d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"/></svg></div> important</h5>
      </div>
      <div class="admonition-content">
    <p>Beware Ogre</p>
</div></div>
    <div class="admonition admonition-tip">
      <div class="admonition-heading">
        <h5><div class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" width="12" height="16" viewBox="0 0 12 16"><path fill-rule="evenodd" d="M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"/></svg></div> tip</h5>
      </div>
      <div class="admonition-content">
    <p>Beware Ogre</p>
</div></div>
    <div class="admonition admonition-warning">
      <div class="admonition-heading">
        <h5><div class="admonition-icon"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z"/></svg></div> warning</h5>
      </div>
      <div class="admonition-content">
    <p>Beware Ogre</p>
</div></div>