body{
    background-color: black;
    
     
}

.audio-container {
  position: fixed;
  top: 50%;
  left: 50%;
transform: translate(-50%, -50%);
}
.wrapper{
     position: fixed;
     right:50%;
bottom:50%;
  z-index: 999;
    display: flex;
    text-align: justify;
}
.dont {
    position: fixed;
    display: flex;
    right:0;
bottom:0;
}
.dont p{
  color:black;
    right:0;
}

a{
  text-decoration: none;
  color:white;
  text-align-last: center;
  font-size:larger
}

.flowers img{
  position: fixed;
  image-rendering: pixelated;
  transform: scale(0.6);
  
}

#img1 {
  translate: 12vw 86vh;
}
#img2{
  translate: 20vw 10vh;
}
#img3{
  translate: 4vw 40vh;
}
#img4{
  translate: 30vw 21vh;
}
#img5{
  translate: 76vw 15vh;
}
#img6{
  translate: 2vw 3vh;
}
#img7{
  translate: 17vw 36vh;
}
#img8{
  translate: 32vw 55vh;
}
#img9{
  translate: 37vw 73vh;
}
#img10{
  translate: 56vw 4vh;
}
#img11{
  translate: 3vw 58vh;
}
#img12{
  translate: 58vw 18vh;
}
#musicbox{
  top: 50%; left: 50%; 
  translate: -50% -50%;
}

#lake{
  right: 0;
  transform-origin: right;
}
#waves{
  right: 0;
  transform-origin: right;
  animation: slide-waves 20s ease-in-out infinite;
}
@keyframes slide-waves {
    0% {
        transform: translateX(0) scale(0.6);
    }
    70% {
       transform:translateX(1%) scale(0.6); 
    }
    100% {
      
        transform: translateX(0) scale(0.6);
       
    }
}