<!-- LInE - Free Education, Private Data - http://www.usp.br/line -->
<!DOCTYPE html>
<html lang='pt-br'>

<head>
  <meta charset='UTF-8'>
  <meta name='viewport' content='width=device-width, initial-scale=1.0'>

  <meta name="description" content="Collection of educational games for teaching fractions" />
  <meta name="keywords" content="ifractions, ifrações, fraction, game, private data, math, moodle" />

  <link rel="icon" type="image/ico" href="../../assets/flag_icon.png">
  <link rel="stylesheet" href="../../style/bootstrap/bootstrap.min.css">
  <link rel='stylesheet' href="../../style/style.css">

  <title>iFractions | Sobre</title>
</head>

<body class="container-flex">

  <!-- menu superior -->
  <nav class="navbar navbar-expand-lg navbar-dark ifr__color__blue">
  </nav>

  <!-- botao de voltar ao inicio da pagina -->
  <button onclick="backToTop()" type="button" id="ifr__btn__backToTop" title="Go to top"
    class="btn btn-primary">&uparrow;</button>

  <!-- modal -->
  <div id="myModal" class="modal">
    <span class="close">&times;</span>
    <img class="modal-content" id="myModal-img" src="">
    <div id="caption"></div>
  </div>

  <!-- header -->
  <header class="jumbotron jumbotron-flex p-5">
    <nav aria-label="breadcrumb">
      <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="../../index.html">Início</a></li>
        <li class="breadcrumb-item active" aria-current="page">Sobre - especificações</li>
        <!-- <li class="breadcrumb-item active" aria-current="page">Especificações</li> -->
      </ol>
    </nav>
    <h1 class="display-4">Conhecendo o iFractions</h1>
    <!-- <p class="lead">Nessa página, você encontrará um pouco do iFractions.</p> -->
    <hr class="display-4">
  </header>

  <!-- pagina -->
  <main class='container-flex'>
    <div class="row">
      <!-- menu de navegacao lateral -->
      <!-- <div class="col-lg-2 text-start p-1 ifr__toc ifr__noBullet"></div> -->
      <div class="col-lg-2 text-start p-1"></div>

      <div class="col-lg-8 px-5">

        <section id='especificacoes'>
          <h2>Especificações</h2>

          <p>Abaixo, um resumo das especificações do iFractions.</p>

          <table class="table">
            <thead>
              <tr>
                <th>Categoria</th>
                <th>Descriçao</th>
              </tr>
            </thead>
            <tbody>
              <tr>
                <th>Nome</th>
                <td>iFractions</td>
              </tr>
              <tr>
                <th>Resumo</th>
                <td>Coletânea de jogos <i>online</i> para ensino de frações</td>
              </tr>
              <tr>
                <th>Desenvolvido por</th>
                <td><a href="http://www.usp.br/line/" target="_blank">LInE</a> &minus; <em>Free Information, Private
                    data</em></td>
              </tr>
              <tr>
                <th>Gênero</th>
                <td>Educativo</td>
              </tr>
              <tr>
                <th><span class="text-warning">Mídia</span></th>
                <td>Digital</td>
              </tr>
              <tr>
                <th>Plataforma</th>
                <td>
                  <ul class="list-unstyled">
                    <li>Navegador web</li>
                    <li>Moodle</li>
                  </ul>
                </td>
              </tr>
              <tr>
                <th>Idiomas</th>
                <td>
                  <ul class="list-unstyled">
                    <li>Inglês</li>
                    <li>Espanhol</li>
                    <li>Francês</li>
                    <li>Inglês</li>
                    <li>Portuguẽs (Brasil)</li>
                  </ul>
                </td>
              </tr>
              <tr>
                <th>Jogadores</th>
                <td>1</td>
              </tr>
              <tr>
                <th>Gráficos</th>
                <td>2D</td>
              </tr>
              <tr>
                <th><span class="text-warning">Tipo</span></th>
                <td>
                  <ul class="list-unstyled">
                    <li>Puzzle</li>
                    <li>Clique/Touch</li>
                    <!-- teclado é requerido para colocar nome -->
                  </ul>
                </td>
              </tr>
              <tr>
                <th>Licença</th>
                <td>GNU General Public License version 3 (<a href="https://www.gnu.org/licenses/licenses.pt-br.html">GNU
                    GPLv3</a>)</td>
              </tr>
            </tbody>
          </table>
        </section>

        <div class="d-flex justify-content-between">
          <a class="btn btn-primary ms-auto" href='./page_2.html' role="button">Próximo - Personalização</a>
        </div>

      </div>

      <div class="col-lg-2 p-1"></div>
    </div>
  </main>

  <!-- rodape -->
  <footer id='footer' class="container-flex mt-5 py-5 text-center"></footer>

</body>

<script src="../../script/bootstrap/bootstrap.bundle.min.js"></script>
<script src="../../script/index.js"></script>
<script>
  updateMenu(2);
</script>

</html>