<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <link rel="icon" type="image/png" sizes="32x32" href="./assets/favicon-32x32.png">
  <!-- Google fonts -->
  <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=Barlow+Condensed:wght@400;700&family=Bellefair&family=Barlow:wght@400;700&display=swap"
      rel="stylesheet">
      
  <!-- Our custom CSS -->
  <link rel="stylesheet" href="index.css">
  <title>Frontend Mentor | Space tourism website</title>
</head>
<body class="home">
  
  <header class="primary-header flex">
    <div>
      <img src="./assets/shared/logo.svg" alt="space tourism logo" class="logo">
    </div>
    <!-- <nav>
        <ul class="primary-navigation underline-indicators flex">
            <li class="active"><a class="ff-sans-cond uppercase text-white letter-spacing-2" href="index.html"><span>00</span>Home</a>
            <li><a class="ff-sans-cond uppercase text-white letter-spacing-2" href="destination.html"><span>01</span>Destination</a>
            <li><a class="ff-sans-cond uppercase text-white letter-spacing-2" href="crew.html"><span>02</span>Crew</a>
            <li><a class="ff-sans-cond uppercase text-white letter-spacing-2" href="technology.html"><span>03</span>Technology</a>
        </ul>
    </nav> -->
  </header>

  <div class="grid-container">
    <div>
      <h1 class="text-accent fs-500 ff-sans-cond uppercase letter-spacing-1">So, you want to travel to
      <span class="d-block fs-900 ff-serif text-white">Space</span></h1>
      
      <p>Let’s face it; if you want to go to space, you might as well genuinely go to 
      outer space and not hover kind of on the edge of it. Well sit back, and relax 
      because we’ll give you a truly out of this world experience! </p>
    </div>
    <div>
      <a href="#" class="large-button uppercase ff-serif fs-600 text-dark bg-white">Explore</a>
    </div>
  </div>

</body>
</html>

<div>

</div>

<!-- <nav>

<li class="active"><a class="ff-sans-cond uppercase text-white letter-spacing-2"

href="index.html"><span>00</span>Home</a>

<li><a class="ff-sans-cond uppercase text-white letter-spacing-2"

href="destination.html"><span>01</span>Destination</a>

<li><a class="ff-sans-cond uppercase text-white letter-spacing-2"

href="crew.html"><span>02</span>Crew</a>

<li><a class="ff-sans-cond uppercase text-white letter-spacing-2"

href="technology.html"><span>03</span>Technology</a>

</ul>

</nav> -->

</header>

<div>

<h1 class="text-accent fs-500 ff-sans-cond uppercase letter-spacing-1">So, you want to travel

<span class="d-block fs-900 ff-serif text-white">Space</span></h1>

<p>Let’s face it; if you want to go to space, you might as well genuinely go to

outer space and not hover kind of on the edge of it. Well sit back, and relax

because we’ll give you a truly out of this world experience! </p>

</div>

<div>

<a href="#" class="large-button uppercase ff-serif fs-600 text-dark bg-white">Explore</a>

</div>

</body>

</html>

<head>

family=Bellefair&family=Barlow:wght@400;700&display=swap"

rel="stylesheet">

<title>Frontend Mentor | Space tourism website</title>

</head>

-13:20