index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" style.css="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <header>
      <nav>
        <ul>
          <li><a href="index.html"> Home </a></li>
          <li></li>
          <li><a href="Food.html"> Food </a></li>
          <li></li>
          <li><a href="Attraction.html"> Attraction </a></li>
          <li></li>
          <li><a href="Music.html"> Music </a></li>
          <li></li>
        </ul>
      </nav>
    </header>

    <main>
      <h1>Welcome to egypt</h1>
      <article>
        <h1 class="funsise">Welcome to Egypt</h1>

        <p id="myCoo1Text">My website is baout Egypt</p>

        <p>Click the links in the menu above to explore!</p>
      </article>

      <img
        id="imgTito"
        src="img/Image20240720152827.png"
        alt="Bakar"
        class="solidRoundBorders"
        height="300px"
      />

      <p>This is Bakar. He will be your tourguide!</p>

      <p>
        Visit the
        <a class="niceLinks" href="https://en.wikipedia.org/wiki/Egypt"
          >Wikipedia page</a
        >
        to learn even more about Egypt!
      </p>
    </main>

    <!-- <div style="position: relative; height: 0; padding-bottom: 56.25%">
      <iframe
        src="https://www.youtube.com/embed/BapSQFJPMM0"
        width="640"
        height="360"
        frameborder="0"
        style="position: absolute; width: 100%; height: 100%; left: 0"
        allowfullscreen
      >
      </iframe>
    </div>

    <h2>
      Lorem ipsum dolor, sit amet consectetur adipisicing elit. Nam maiores quos
      nobis expedita aspernatur saepe. Placeat tempore suscipit unde,
      perspiciatis, deserunt tempora, praesentium non voluptates dolore
      laboriosam debitis a eveniet.
    </h2>
    <a href="https://en.wikipedia.org/wiki/Egypt">more info</a> -->
  </body>
</html>