body {
    background: #BFD6E3;
  }

  p {
    color: #000000;
  }

  h1 {
    color: #ffffff;
    font-family: 'La Belle Aurore', cursive;
    text-align:center;
    font-size: 50px;
    background: #867d7d;
    border: solid 2px #ffffff;
}
h2 {
  color: #ffffff;
  font-family: 'Caveat', cursive;
  text-align:center;
  font-size: 30px;
  background: #867d7d;
  border: solid px #ffffff;
}

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #867d7d;
}

li a {
  float: left;
}

li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-family: 'Caveat', cursive;
}

/* Change the link color to #111 (black) on hover */
li a:hover {
  background-color: #E2E2E2;}

.bunbunandrosemary {
  
  width: 900px;
  height: 850px;
  margin-left: 550px;
}

h3 a{
  color: #ffffff;
  font-family: 'Caveat', cursive;
  text-align:center;
  font-size: 50px;
  background: #514343;
  border: solid 2px #000000;
  
}

h4 a{
  color: #ffffff;
  font-family: 'Caveat', cursive;
  text-align:center;
  font-size: 50px;
  background: #514343;
  border: solid 2px #000000;

}

.container {
  position: relative;
  max-width: 1000; /* Maximum width */
  margin: 0 auto; /* Center it */
}

.container .content {
  position: sticky; /* Position the background text */
  bottom: 0; /* At the bottom. Use top:0 to append it to the top */
  background: rgb(0, 0, 0); /* Fallback color */
  background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
  color: #f1f1f1; /* Grey text */
  width: 100%; /* Full width */
  padding: 20px; /* Some padding */
}