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.0">
    <link rel="stylesheet" href="style.css"> 
    <title>In The lense of Merlina</title>
    <script src="ITLOM.JS" defer></script>
    <script src="tabs.js" defer></script>
</head>
<body class="destination">
  <header class="primary-header flex">
    <div>
      <img src="./logo.svg" alt="space tourism logo" class="logo">
    </div>
    <button class="mobile-nav-toggle" aria-controls="primary-navigation"><span class="sr-only" aria-expanded="false">Menu</span></button>
    <nav>
        <ul id="primary-navigation" data-visible="false" class="primary-navigation underline-indicators flex">
          <li><a class="Hyperlink" href="./index.html"><span aria-hidden="true">00</span>Home</a>
          <li class="active"><a class="Hyperlink" href="./Photography.html"><span aria-hidden="true">01</span>Photography</a>
          <li><a class="Hyperlink" href="./AboutMe.html"><span aria-hidden="true">02</span>AboutMe</a>
          <li><a class="Hyperlink" href="./contactinfo.html"><span aria-hidden="true">03</span>Contact</a>
       </ul>
    </nav>
  </header>
  
  <style>
        body{
  background-image: url('./cover.png');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-position-x: center;
}
  </style>
</body>
</html>