<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="main.css"/>
  </head>

  <body>
    <div id="main">

      <header id="left">
        <nav id="menu">
          <header id="title">
            <img src="../img/logo-32.png">
          </header>
          <ul>
            <li><a href="#home" onclick="loadHtml('home');"><i class="fa fa-home icon"></i> 1.</a></li>
            <li><a href="#conj" onclick="loadHtml('conj');"><i class="fa fa-star icon"></i> CJ</a></li>
            <li><a href="#tf" onclick="loadHtml('tf');"><i class="fa fa-photo icon"></i> TF</a></li>
            <li><a href="#cg" onclick="loadHtml('cg');"><i class="fa fa-question-circle icon"></i> CG</a></li>
            <li><a href="#op1" onclick="loadHtml('op1');"><i class="fa fa-coffee icon"></i> OP1</a></li>
            <li><a href="#op2" onclick="loadHtml('op2');"><i class="fa fa-keyboard-o icon"></i> OP2</a></li>
            <li><a href="#lxg" onclick="loadHtml('lxg');"><i class="fa fa-keyboard-o icon"></i> LXG</a></li>
            <li><a href="#tests" onclick="loadHtml('lxg');"><i class="fa fa-keyboard-o icon"></i> TST</a></li>
          </ul>
        </nav>
      </header> <!-- #left -->


      <div id="page">
        <article id="loadedpage">
          <!-- here goes the page loaded via JS -->
        </article>
      </div> <!-- #page -->

    </div> <!-- #main -->

    <script src="main.js"></script>
  </body>

</html>
