@for $i from 0 through 8 {
        .g-bubble:nth-child(#{$i}) {
            opacity: 0.95;
            // border-radius: 100%;
            position: absolute;
            background: url(https://xz.hanting.site/static/images/kmd.png);
            $width: #{random(200) + 80}px;
            left: #{(random(400))}px;
            bottom: #{random(60)}px;
            width: $width;
            height: $width;
            background-size: 100%;
            animation: moveToTop #{random(10) * 0.5s + 3s} ease-in-out infinite;
            animation-delay: - #{$i * random(10) * 0.2s + 1s}; 
        }
    }
    @keyframes moveToTop {
        70% {
            opacity: 0.05;
        }
        100% {
            opacity: 0.01;
            transform: translate(-50%, -400px) scale(0.3);
        }
    }