1Impacto_aprendizagem.html

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Impact on Learning</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>Impacts on learning</b></h2>
<br>
<nav>
  <a class="menu" href="#books">Difficulties in the School Environment  
  </a>
  <a class="menu" href="#software"> Social and Emotional Impact of Dyslexia 
  </a>
  <a class="menu" href="#applications">The Role of Adequate Support 
  </a>

</nav>

  <br>

  <h2 id="books"><b>Difficulties in the School Environment </b></h2>


  <div class="content">
    <p>
      Dyslexia affects many aspects of learning and personal development. In the school environment, difficulties with reading and writing can translate into lower performance in activities that involve reading texts and producing written content. This often generates frustrations and emotional challenges, such as low self-esteem, anxiety and fear of participating in the classroom. 
    </p>
    
    <br>


    <h2 id="software"><strong> Social and Emotional Impact of Dyslexia 
    </strong></h2>
    <p>In addition to the academic impact, dyslexia can also affect social development and the student's relationship with learning. In environments where there is little understanding about the condition, students may feel stigmatized or even experience bullying. Therefore, support from teachers and colleagues, along with an inclusive learning environment, is essential for students to feel valued and have their capabilities recognized. 
      </p>


      <div style="text-align: center;"> <img src="img/img.2 e 11.jpg" style="height: 500px; "></div>
  
      <br>
      <br>
      <h2 id="applications"><b>The Role of Adequate Support </b></h2>
  </div>
      
      
      </main>
     
     <div class="content">
      <p>However, with appropriate support and inclusive educational strategies, the impact of dyslexia can be significantly minimized. Many students with dyslexia excel in areas that do not require the use of conventional reading and writing, such as arts, music and even science. This shows that, despite the difficulties, dyslexia does not define a person's capabilities and that a welcoming learning environment can make all the difference to success and personal fulfillment.
        </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>