1Causa_e_Sintomas.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Symptoms and Causes</title>
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/materiais2.css">
    <link rel="stylesheet" href="css/estilo_login.css">
    <link rel="stylesheet" href="css/botao.css">

</head>

<body>
  <button id="btnTopo" onclick="voltarAoTopo()"><img class="imagem-editar" src="img/SetaCima.webp"></button>
  <script src="js\botao.js"></script>
  <style>
    body {
      font-family: "Arial", sans-serif;
      margin: 0;
    }
    .navbar {
      display: flex;
      justify-content: space-between;
      align-items: center;
      background-color: #1E3D51;
      padding: 8px;
      font-size: small;
    }
    .navbar-logo {
      color: white;
      font-size: 24px;
      text-decoration: none;
      padding-left: 10px;
      width: 8rem;
      height: auto;
    }
    .navbar-menu {
      display: flex;
      justify-content: center;
      list-style-type: none;
      margin: 0;
      padding: 0;
    }
    .navbar-menu li {
      position: relative;
    }
    .navbar-menu li a {
font-family: "Montserrat", sans-serif;

      color: white;
      padding: 14px 20px;
      text-decoration: none;
      display: block;
    }
    .navbar-menu li a:hover {
      background-color: #2a5674;
border-radius: 5px;

    }
    .dropdown-content {
      display: none;
      position: absolute;
      background-color: #2a5674;
      min-width: 160px;
      z-index: 1;
    }
    .dropdown-content a {
      padding: 12px 16px;
    }
    .dropdown:hover .dropdown-content {
      display: block;
      background-color: #1E3D51;
    }
    
    h2,h1{
    font-family: "Montserrat", sans-serif;
      color: #326A8F; 
      padding-left: 2rem;
    }
  
  </style>
</head>
<body>

  <nav class="navbar">
    <a href="1index.html" class="navbar-logo"><img class="navbar-logo" src="img/image 27.png"></a>
    <ul class="navbar-menu">
      <li><a href="1index.html">Home</a></li>
              <li class="dropdown">
                <a href="#">Dyslexia</a>
                <div class="dropdown-content">
                  <a href="1O_que_e.html">What is it?</a>
                  <a href="1Causa_e_Sintomas.html">Symptoms and Reasons</a>
                  <a href="1Diagnostico.html">Diagnoses</a>
                  <a href="1Historias.html">History</a>
                  <a href="1tratamento.html">Treatments</a>
                </div>
              </li>
              <li class="dropdown">
                <a href="#">More</a>
                <div class="dropdown-content">
                  <a href="1Impacto_aprendizagem.html">Impacts on learning</a>
                  <a href="1Estrategias_de_ensino.html">Teaching Strategies</a>
                  <a href="1Leis.html">Rights and legislation</a>
                  <a href="1Acessibilidade_Online.html">Online Accessibility</a>
                  <a href="1materiais2.html">Materials and resources</a>
                  <a href="1Bibliografia.html">Bibliography</a>
                </div>
              </li>
              <li><a href="1Sobre_nos.html">About us</a></li>
    <li class="open-modal-btn" style='font-family: "Montserrat", sans-serif;'>Login</li>
              

            </ul>
          </nav>
          <div id="modal" class="modal-overlay">
            <div class="modal-content">
                <button class="fechar" id="fechar"> X</button>
                <h2>Register</h2>
                <form>
                    <label for="email">Email</label>
                    <input type="email" id="email" name="email" placeholder="Your email" required>
       
                    <label for="senha">Password</label>
                    <input type="password" id="senha" name="senha" placeholder="Your password" required>
       
                    <button type="submit">sign in</button>
                     
                </form>
               <p>Don't have a registration yet? <br> Click here to<A href="1cadastrobia.html"> Register</A>
    </div>
</div>

<script>
   const modal = document.getElementById('modal');
const openModalBtn = document.querySelector('.open-modal-btn');
const fechar = document.querySelector('.fechar');

openModalBtn.addEventListener('click', () => {
modal.style.display = 'flex';
});

fechar.addEventListener('click', () => {
modal.style.display = 'none';
});
window.addEventListener('click', (e) => {
if (e.target === modal) {
    modal.style.display = 'none';
}
});
</script>
<br>
<h2 style="color:#326A8F"><b>Symptoms and Causes</b></h2>
<br>
  <nav>
      <a class="menu" href="#books">Symptoms of Dyslexia
      </a>
      <a class="menu" href="#software">Causes of Dyslexia
      </a>
  </nav>
  <br>

  <h2 id="books"><b>Symptoms of Dyslexia</b></h2>


  <div class="content">
      <p>The symptoms of dyslexia can vary from mild to severe and manifest themselves differently in each person. Here are some common signs:
        
        
        <p>• Slow and hesitant reading: Difficulty recognizing words and reading fluidly.</p>
        <p>• Difficulty with spelling: Frequent mistakes in words and difficulties in learning spelling rules.</p>
        <p>• Exchange of letters and sounds: Confusion between letters with similar sounds (such as “b” and “d”) or inversion of the order of letters.</p>
        <p>• Problems with writing: Difficulty organizing thoughts on paper, as well as grammar and punctuation errors.</p>
        <p>• Short-term memory problems: Difficulty remembering recently seen or heard words.</p>
        <p>• Difficulty with mathematics: Although dyslexia mainly affects reading, some children also have problems with numbers and mathematical symbols, especially in tasks such as interpreting written problems.</p>
        
      </p>
      <br>

      <div style="text-align: center;"> <img src="img/img.7.jpg" style="height: 500px; "></div>
      <br>

      <h2 id="software"><strong>Causes of Dyslexia
      </strong></h2>
      <p>Dyslexia is considered a genetic condition, as it tends to run in families. Research indicates that it is caused by differences in the development and functioning of regions of the brain responsible for processing language. Other factors that may contribute include: </p>
        <p>• Genetic factors: Children who have family members with dyslexia are more likely to have the disorder.</p>
        <p>• Changes in the brain: Neuroimaging studies show that the brains of people with dyslexia process information differently, especially in the areas responsible for recognizing words and sounds.</p>
        <p>• Prenatal environment and birth: Some studies suggest that complications during pregnancy or birth may increase the risk of dyslexia.</p>

    
        <br>
       
    </div>
        
        
        </main>
        
        <br>
       
        <footer class="footer" style="margin-top: 60px;">
          <div class="footer-logo">
            <img src="img/image 27.png" alt="Logo da Página">
          </div>
        
        
          <div class="footer-links-right">
            <a href="#">
              <img src="img/footer/facebook.png" class="fotter-img-size"> 
                   Helplexia <i class="icon-class"></i>
              </a>
              <a href="#">
                  <img src="img/footer/instagram.png" class="fotter-img-size"> 
                  Helplexia <i class="icon-class"></i>
              </a>
              <a href="#">
                  <img src="img/footer/email.png" class="fotter-img-size"> 
                Helplexia@gmail.com <i class="icon-class"></i>
              </a>
          </div>
        </footer>
</body>

</html>