.mainMenuButton {
  font-size: 18px;
  color: #c1a362;
  padding: 8px 8px;
  border-radius: 8px;
  font-weight: 700;
  cursor: pointer;
  position: relative;
  text-decoration: none;
  transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
  transition-duration: 400ms;
  transition-property: color;
}

.mainMenuButton:focus,
.mainMenuButton:hover {
  color: #fc0;
}

.mainMenuButton:focus:after,
.mainMenuButton:hover:after {
  width: 100%;
  left: 0%;
  text-decoration: underline;
}

 
.mainPageButton {
  cursor: pointer;
  border: 4px;
  border-color: #5b5958;
  border-radius: 7px;
  width: 200px;
  height: 50px;
  background-color: #730603;
  color: #ffc900;
  font-size: 1rem;
  font-weight: 600;
  text-shadow: black 2px 1px;
  -web-kit-box-shadow: inset 0px 0px 1.5px 2px #000000, 0px 0px 15px 3px #000000;
  box-shadow: inset 0px 0px 1.5px 2px #000000, 0px 0px 15px 3px #000000;
  padding: 12px 16px;
  text-decoration: none;
}

.mainPageButton:hover {
	background-color: #a50000;
}


 
.downloadButton {
  width: 140px;
  height: 40px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(to right,#77530a,#ffd277,#77530a,#77530a,#ffd277,#77530a);
  background-size: 250%;
  background-position: left;
  color: #ffd277;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition-duration: 1s;
  overflow: hidden;
  font-size: 14px;
  font-family: "Jost", sans-serif;
  font-weight: 900;
}

.downloadButton::before {
  position: absolute;
  content: "Download MP3";
  color: #ffd277;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 97%;
  height: 90%;
  border-radius: 8px;
  transition-duration: 1s;
  background-color: rgba(0, 0, 0, 0.842);
  background-size: 200%;
}

.downloadButton:hover {
  background-position: right;
  transition-duration: 1s;
}

.downloadButton:hover::before {
  background-position: right;
  transition-duration: 1s;
}

.downloadButton:active {
  transform: scale(0.95);
}