Climate.html

<!DOCTYPE html>
<html>

<body>


<div class="topnav">
    <a href="./Home.html">Home</a>
    <a class="active" href="./Climate.html">Climate</a>
    <a href="./Contact.html">Contact</a>
    <a href="./About.html">About</a>
  </div>

  <h1>The Climate of Mars</h1>

  <img class="Mars2" src="C:\Users\44776\Downloads\Mars m\mars.2.jpg" alt="Mars climate image"
  width="750px"
  height="400px"
  
  />

  
  <p>The red planet Mars, named for the Roman god of war, has long been an omen in the night sky. And in its own way, the planet’s rusty red surface tells a story of destruction. Billions of years ago, the fourth planet from the sun
     could have been mistaken for Earth’s smaller twin, with liquid water on its surface—and maybe even life. <br>
     Now, the world is a cold, barren desert with few signs of liquid water. But after decades of study using orbiters, landers, and rovers, scientists have revealed Mars as a dynamic, windblown
      landscape that could—just maybe—harbor microbial life beneath its rusty surface even today.</p>

      <img class="Mars3" src="C:\Users\44776\Downloads\Mars m\mars.3" alt="Mars View"
  width="750px"
  height="400px"
  />

  <p>You may be thinking... Why migrate to Mars, and how is this even possible. As let's face it, no human has ever set foot on this red planet.
    <br>Well, our transportation technology alone works off of simple teleportation rather than the convential space shuttle. 
    In terms of breathable air, we have thought long and hard about a simple solution to mitigate this issue. That being a kinetic dome
    which covers the habitable area, within this air tight dome, we plant trees that can be artifically grown
  </p>

  </body>

  <style>

    .Mars3 {
      float: right;
    }
    
   .Mars2 {
    float: left;
   }


  </body>

  <style>

    .Mars3 {
      float: right;
    }
    
   .Mars2 {
    float: left;
   }

p{
  text-align: center;
  color: white;
  position: inherit;
  font-size:  200%;
  text-shadow: 2px 2px red;
}  

body{
    background-color: black;
}

h1 {
    color: red;
    text-align: center;
  font-size: 500%;
}

  /* Add a black background color to the top navigation */
.topnav {
background-color: rgb(100, 6, 6);
overflow: hidden;

}

/* Style the links inside the navigation bar */
.topnav a {
float: left;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}

/* Change the color of links on hover */
.topnav a:hover {
background-color: red;
color: black;

}

/* Add a color to the active/current link */
.topnav a.active {
background-color: rgb(11, 0, 0);
color: rgb(170, 95, 95);
}
</style>

</html>