@font-face {
    font-family: "OpenSans";
    src: url("OpenDyslexic.ttf");
  }
  
      body {
        margin: 0;
        padding: 10px;
        background-color: #F5F5DC; /* Define o fundo azul */
      }
  
      h1 {
          font-family: OpenSans;
          color: black; /* Texto branco para contraste */
          font-size: 20px;
          text-align: center;
      }
  
      p {
          font-family: OpenSans;
          color: black; /* Texto branco para contraste */
          font-size: 12px;
          text-align: justify;
      }
  
      #p1 {
          font-family: OpenSans;
          color: black; /* Texto branco para contraste */
          font-size: 16px;
          text-align: justify;
      }
  
      #p2 {
          font-family: OpenSans;
          color: black; /* Texto branco para contraste */
          font-size: 16px;
          text-align: center;
      }    
  
  
      img {
        display: block; /* Necessário para usar margin auto */
        margin: auto; /* Centraliza horizontalmente */
      }
  
      /* ===== Scrollbar CSS ===== */
    /* Firefox */
    * {
      scrollbar-width: thin;
      scrollbar-color: #ffffff #F5F5DC;
    }
  
    /* Chrome, Edge, and Safari */
    *::-webkit-scrollbar {
      width: 8px;
    }
  
    *::-webkit-scrollbar-track {
      background: #1700d1;
    }
  
    *::-webkit-scrollbar-thumb {
      background-color: #ffffff;
      border-radius: 7px;
      border: 7px solid #ffffff;
    }
  
    /* ===== Link States ===== */
    a {
        color: black; /* Cor normal */
        text-decoration: none; /* Remove sublinhado padrão */
      }
  
      a:hover {
        color: white; /* Cor quando o mouse passa por cima */
        text-decoration: underline; /* Sublinhado ao passar o mouse */
        background-color: red;
      }
  
      a:visited {
        color: maroon; /* Cor do link visitado */
        text-decoration: double;
      }
  
      a:active {
        color: purple; /* Cor ao clicar no link */
      }
  
      li {
        color: black; /* Cor do texto */
        border: none; /* Remove bordas */
        border-radius: 5px; /* Bordas arredondadas */
        font-size: 16px; /* Tamanho do texto */
      }