index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Open+Sans&family=PT+Sans&family=Raleway&display=swap"
      rel="stylesheet"
    />
    <link rel="stylesheet" href="./css/index.css" />
    <link rel="stylesheet" href="./css/animate.css"/>
    <title>Algo_Visualizer</title>
  </head>
  <body>
    <div class="nav">
      <div class="title">
        <ul>
          <li><a href="#" class="Algo">Algo-Visualizer</a></li>
        </ul>
      </div>
      <div class="links">
        <ul>
          <li><a href="./about.html" class="About">About</a></li>
          <li><a href="./contact.html" class="Contact">Contact Us</a></li>
        </ul>
      </div>
    </div>

    <br />
    <br />
    <br />
    <div class="splash">
      <div class="image-div">
        <img src="./img/logogif.gif" class="image" />
      </div>
      <div class="infodiv">
        <div class="infotext">
          Algo-Visualizer helps you <br />
          visually understand how <br />common algorithms work
        </div>
        <a href="./canvas_page.html" class="visualize-button">
          <div class="btn-text">Let's Visualize</div>
        </a>
      </div>
    </div>
    <br><br><br>
  </body>
</html>