body {
  background-color:mediumseagreen;
}

ul.navbar {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
  overflow: hidden;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-radius: 25px;
  border: 1px solid rgba(255, 255, 255, 0.4);
  background-color: rgba(51, 51, 51, 0.6);
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
}

ul li {
  float: left;
}

ul li .navbtn {
  border: none;
  background-color: rgba(0, 0, 0, 0.0);
  color: white;
  display: inline-block;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 1.5em;
  font-family: monospace;
}

ul li a {
  color: white;
  display: inline-block;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 1.5em;
  font-family: monospace;
}

ul li .navbtn:hover {
  background-color: rgba(17, 17, 17, 0.6);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

ul li a:hover {
  background-color: rgba(17, 17, 17, 0.6);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.active {
  background-color: mediumseagreen;
}