body {
    background-color: #212121;
    border: 2em groove #34F989;
    padding: 1em;
    color: #34F989;
    font-family: "Stack Sans Notch", sans-serif;
}
/* LINKS */
a {
    color: #ECA8F5;
    text-decoration: none;
}
    
    a:hover {
        text-decoration underline;
        background-color: #34F989;
        color: #212121;
        border-radius: 5px;
    }
    
img {
     border: 1em groove #34F989;
}

.logo {
    border: none;
  width: 10%;
}


h1 {
    font-family: "Quantico", sans-serif;
}


* {
  border-sizing: border-box;
  margin: 8px;
  padding: 0;
}

nav {
  display: flex;
  height: 4em; /* Define a fixed height for the nav */
  
  background-color: #333;
  align-items: stretch; /* Forces children to take full container height */
  
  justify-content: center;
  background-color: #2FC175 ;

}

.nav-link {
  display: flex;
  align-items: center; /* Centers text vertically within the nav */
  
  padding: 0 3em; /* Adjust the second number to add more spacing between the menu items */
  
  color: white;
  text-decoration: none;
  font-size: 1.4em;
  transition: background-color 0.3s;
}

.nav-link:hover {
  background-color: #34F989; 
    text-decoration: none;

}

.logo {
  display: flex;
  align-items: center;
}

.logo img {
  height: 4em; 
  width: 4em;
  /* match the logo size to the nav height */
}

/*FLOAT IMAGE TO THE RIGHT*/
.FloatRight {
    width:25%;
    float: right ;
}