body {
  margin: 0;
  padding: 0;
  background-color: #504d4dc9;
  color: #fff;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.main-menu {
  text-decoration: none;
  background-color: #333;
  position: fixed;
  height: 100%;
  padding: 1.5em;
  color: #fff;
  list-style-type: none;
  margin-top: -20px !important;
}

.main-menu li {
  margin: 7px 0;
}

a {
    text-decoration: none;
    color: #fff;
}

.main-menu a {
  color: #fff;
  padding: 5px;
  border-radius: 5px;
}

.main-menu a:active {
  color: darkcyan;
}

.main-menu a:link {
  color: #fff;
}

.main-menu a:hover {
  color: #fff;
  background-color: gray;
  text-decoration-line: none;
}

.main {
  margin-left: 7.7rem;
}

/* footer {
    display: flex;
    align-self: end;
} */

footer a {
  color: #fff;
  text-decoration: none;
  padding: 5px;

  position: relative;
  left: 80%;
  bottom: 0;
}

footer a:hover {
  color: #fff;
  background-color: gray;
  text-decoration-line: none;
}


.multi-code {
  background-color: rgb(42, 175, 30);
  width: max-content;
  padding: 5px;
  border-radius: 8px;
  color: #fff;
}

.copy-btn {
  background-color: blue;
  color: #fff;
  padding: 3px;
  border-radius: 8px;
  
}

hr {
  color: coral;
}