img {
    width: 15%; 
    animation:bounce .3s ease-in-out infinite; 
}
body {
    margin:0;
    height: 100vh;
    display:flex;
    justify-content:center;
    align-items:center;
    background-color:black ;
    cursor:url("assets/Baby.1.png"), auto;
}
.music {
    position: relative; 
    display:flex;
    justify-content: center
}
.note {
    position: absolute;
    bottom: 20%;           
    left: 50%;             
    font-size: 24px;
    color: white;
    opacity: 0;
    animation: float 3s linear infinite;
}


.note:nth-child(2) { animation-delay: 0.5s; }
.note:nth-child(3) { animation-delay: 1s; }

@keyframes float {
    0% {
        transform: translateX(0) translateY(0) rotate(0deg);
        opacity: 1;
    }
    50% {
        transform: translateX(-10px) translateY(-50px) rotate(-10deg);
        opacity: 0.5;
    }
    100% {
        transform: translateX(10px) translateY(-150px) rotate(20deg);
        opacity: 0;
    }
}

@keyframes bounce {
    0%, 100% { 
        transform: translateY(0);
     }
    50% { 
        transform: translateY(-10px);
     }
    /* - is up none is down */
}