body {
  overflow-y: scroll;
  color: black;
  font-family: Arial;
  background-repeat: no-repeat;
  background-attachment: fixed; 
  background-size: 100% 100%;
}

body::-webkit-scrollbar {
    display: none;
}

p {
  margin:0;
  font-size: 14px;
}

.content {
  display: flex;
}

.pics {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  margin: 0 auto;
}

#gallery {
  position: relative;
  float: left;
  display: flex;
  align-items: center;
}

#gallery img {
  overflow-y: scroll;
  z-index: 1;
  width: 98%;
  align-content: center;
  display: flex;
  height: auto;
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 10px;
  justify-content: center;
  flex-direction: column;
}

audio {
  position: relative;
  z-index: 0;
}

.track {
  height: auto;
  width: 300px;
  padding: 5px;
}

.track h2 {
  margin-top: 7.5px;
  margin-bottom: 0px;
  color: Teal;
}

.track p {
  margin-top: 0px;
  color: Teal;
}

.cover {
  max-height: 67px;
  max-width: 67px;
  float: right;
  transition:transform 0.25s ease;
  position: relative;
  z-index: 1;
  bottom: 5px;
}

.cover img {
}

.cover:hover {
  transform: scale(4.5) translate(-26.5px, 26.5px);
}

.content img {
  transition:transform 0.25s ease;
}

/*a:hover ~ :not(:hover) {
  -webkit-ms-transform:scale(1.5);
  transform:scale(1.5);
  z-index: 3;
}*/

.content:has(img:hover) img:not(:hover) {
    -webkit-ms-transform: scale(0.97);
    transform: scale(0.97);
    opacity: 0.5;
    filter: grayscale(30%);
}

/*.side {
  display: block;
  padding: 10px;
  margin: 200px;
}*/


#title {
  color: SlateBlue;
  font-size: 20px;
  height: 10px;
  line-height: 10px;
  text-align: left;
}

#titlenew {
  margin: auto;
  color: MediumTurquoise;
  font-size: 20px;
  height: 30px;
  line-height: 30px;
  text-align: left;
}