body {
  margin: 0px;
  background-color: whitesmoke;
  height: 100vh;
  display: flex;
  flex-direction: column;

}

.header {
  display: flex;
  flex-direction: row;
  margin: 18px;
}

.footer {
  display: flex;
  flex-direction: row;
  padding: 18px;
  background-color: #eeeeee;
  margin-top: auto;
  justify-content: space-around;
}
.button-link {
    display: inline-block;
    padding: 10px 20px;
    background-color: #007BFF; /* Replace with your desired button color */
    color: #fff; /* Text color */
    text-decoration: none;
    border-radius: 5px;
  }
  
  .button-link:hover {
    background-color: #0056b3; /* Change color on hover */
  }

  p {
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    text-align: center;
  }

  h1, h2 {
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  }

  h1 {
    text-align: center;
    margin-bottom: 60px;
  }

  .button-list li {
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    border: black 2px solid;
    padding: 30px;
    background-color: beige;
    display: inline-block;
    height: 100;
    flex: 1;
    border-radius: 20%;
    text-align: center;
    margin-top: 50px;

  }

  li:hover {
    background-color: orange;
    padding: 20px;
    border-radius: 20%;
    text-align: center;

  }

  ul {
    display: flex;
    flex-wrap: nowrap;
    gap: 34px;
    list-style: none;
    padding-left: 0;
  }

  a {
    text-decoration: none;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
    color: black;
    display: inline;  }
  .strong {
    font-weight: 900;
  }


.right-links {
  margin-left: auto;
}

.button-list {
  display: flex;
  flex-wrap: wrap;
}