.bubbles-area{
    width: 100%;
    height:100%;
    position: absolute;
    left: 0;
    top: 0;
    overflow: hidden;
}

.bubble{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.bubble li{
    position: absolute;
    display: block;
    list-style: none; 
}
/* Group 1 */
.bubble li:nth-child(3){
    left: -25%;
    width: 1194px;
    height: 1194px;
    background: url(../assets/images/bubbles/bubble1.png) no-repeat;
    background-size: cover;
    top: -500px;
    animation: bubble1 50s linear infinite;
}
.bubble li:nth-child(1){
    left: -12%;
    width: 629px;
    height: 629px;
    background: url(../assets/images/bubbles/bubble1-1.png) no-repeat;
    top: -100px;
    /*animation: bubble1-1 25s linear infinite;*/
}
.bubble li:nth-child(2){
    left: 0;
    width: 509px;
    height: 509px;
    background: url(../assets/images/bubbles/bubble1-2.png) no-repeat;
    top: 100px;
    animation: bubble1-1 20s linear infinite;
}

/* Group 2 */
.bubble li:nth-child(6){
    right: -10%;
    width: 509px;
    height: 509px;
    background: url(../assets/images/bubbles/bubble2.png) no-repeat;
    top: 600px;
    animation: bubble2 40s linear infinite;
}

/* Group 3 */
.bubble li:nth-child(7){
    left: 10%;
    width: 497px;
    height: 497px;
    background: url(../assets/images/bubbles/bubble4.png) no-repeat;
    background-size: cover;
    top: 600px;
    animation: bubble3 40s linear infinite;
}
.bubble li:nth-child(4){
    right: -10%;
    width: 820px;
    height: 819px;
    background: url(../assets/images/bubbles/bubble3-1.png) no-repeat;
    top: 200px;
    /*animation: bubble3 39s linear infinite;*/
}
.bubble li:nth-child(5){
    right: 8%;
    width: 630px;
    height: 629px;
    background: url(../assets/images/bubbles/bubble3-2.png) no-repeat;
    top: 500px;
    animation: bubble1-1 15s linear infinite;
}

/* Group 4 */
.bubble li:nth-child(8){
    left: -500px;
    width: 1062px;
    height: 1062px;
    background: url(../assets/images/bubbles/bubble4-1.png) no-repeat;
    top: 800px;
    /*animation: bubble3 39s linear infinite;*/
}
.bubble li:nth-child(9){
    left: 3%;
    width: 630px;
    height: 629px;
    background: url(../assets/images/bubbles/bubble4-2.png) no-repeat;
    top: 1300px;
    animation: bubble1-1 15s linear infinite;
}
.bubble li:nth-child(10){
    left: 50%;
    width: 747px;
    height: 747px;
    background: url(../assets/images/bubbles/bubble4.png) no-repeat;
    top: 1200px;
    animation: bubble4 80s linear infinite;
}

/* Group 5 */
.bubble li:nth-child(11){
    right: -200px;
    width: 773px;
    height: 773px;
    background: url(../assets/images/bubbles/bubble5-1.png) no-repeat;
    top: 2100px;
}
.bubble li:nth-child(12){
    right: -200px;
    width: 509px;
    height: 509px;
    background: url(../assets/images/bubbles/bubble5-2.png) no-repeat;
    top: 2400px;
    animation: bubble1-1 15s linear infinite;
}
.bubble li:nth-child(13){
    left: 0;
    width: 776px;
    height: 776px;
    background: url(../assets/images/bubbles/bubble5.png) no-repeat;
    top: 2100px;
    animation: bubble3 20s linear infinite;
}

/* Group 6 */
.bubble li:nth-child(14){
    right: -10%;
    width: 541px;
    height: 541px;
    background: url(../assets/images/bubbles/bubble6.png) no-repeat;
    top: 3000px;
    animation: bubble2 40s linear infinite;
}

/* Group 7 */
.bubble li:nth-child(15){
    left: -450px;
    width: 992px;
    height: 991px;
    background: url(../assets/images/bubbles/bubble7-1.png) no-repeat;
    top: 3500px;
}
.bubble li:nth-child(16){
    left: -350px;
    width: 788px;
    height: 788px;
    background: url(../assets/images/bubbles/bubble7-2.png) no-repeat;
    top: 3800px;
    animation: bubble1-1 10s linear infinite;
}
.bubble li:nth-child(17){
    left: -50px;
    width: 826px;
    height: 827px;
    background: url(../assets/images/bubbles/bubble7-3.png) no-repeat;
    top: 3600px;
    animation: bubble1-1 15s linear infinite;
}
.bubble li:nth-child(18){
    left: -15%;
    width: 1194px;
    height: 1194px;
    background: url(../assets/images/bubbles/bubble1.png) no-repeat;
    top: 4000px;
    animation: bubble1 70s linear infinite;
}
.bubble li:nth-child(19){
    right: -400px;
    width: 935px;
    height: 935px;
    background: url(../assets/images/bubbles/bubble7-4.png) no-repeat;
    top: 3700px;
    animation: bubble1-1 15s linear infinite;
}
.bubble li:nth-child(20){
    right: -10%;
    width: 497px;
    height: 497px;
    background: url(../assets/images/bubbles/bubble4.png) no-repeat;
    background-size: cover;
    top: 4200px;
    animation: bubble2 35s linear infinite;
}

/* Group 8 */
.bubble li:nth-child(21){
    left: 45%;
    width: 935px;
    height: 935px;
    background: url(../assets/images/bubbles/bubble8-1.png) no-repeat;
    top: 4500px;
    margin-left: -468px;
    animation: bubble1-1 15s linear infinite;
}
.bubble li:nth-child(22){
    left: 35%;
    width: 773px;
    height: 773px;
    background: url(../assets/images/bubbles/bubble5-1.png) no-repeat;
    top: 4800px;
    margin-left: -386px;
    animation: bubble1-1 10s linear infinite;
}
.bubble li:nth-child(23){
    left: 38%;
    width: 735px;
    height: 734px;
    background: url(../assets/images/bubbles/bubble8-3.png) no-repeat;
    top: 4700px;
    animation: bubble1-1 5s linear infinite;
}

/* Group 9 */
.bubble li:nth-child(24){
    right: -400px;
    width: 797px;
    height: 796px;
    background: url(../assets/images/bubbles/bubble9-1.png) no-repeat;
    top: 5500px;
    animation: bubble1-1 25s linear infinite;
}
.bubble li:nth-child(25){
    right: -150px;
    width: 773px;
    height: 773px;
    background: url(../assets/images/bubbles/bubble5-1.png) no-repeat;
    top: 5800px;
    animation: bubble1-1 15s linear infinite;
}
.bubble li:nth-child(26){
    left: 0;
    width: 776px;
    height: 776px;
    background: url(../assets/images/bubbles/bubble5.png) no-repeat;
    top: 6000px;
    animation: bubble3 80s linear infinite;
}

/* Group 10 */
.bubble li:nth-child(27){
    left: 0;
    width: 797px;
    height: 796px;
    background: url(../assets/images/bubbles/bubble10-1.png) no-repeat;
    top: 6700px;
    animation: bubble1-1 25s linear infinite;
}
.bubble li:nth-child(28){
    left: -150px;
    width: 773px;
    height: 773px;
    background: url(../assets/images/bubbles/bubble10-2.png) no-repeat;
    top: 6700px;
    animation: bubble1-1 20s linear infinite;
}
.bubble li:nth-child(29){
    left: -200px;
    width: 552px;
    height: 552px;
    background: url(../assets/images/bubbles/bubble10-3.png) no-repeat;
    top: 6800px;
    animation: bubble1-1 15s linear infinite;
}

/* Group 11 begin 7000 */ 
.bubble li:nth-child(32){
    left: -25%;
    width: 1194px;
    height: 1194px;
    background: url(../assets/images/bubbles/bubble1.png) no-repeat;
    top: 6500px;
    animation: bubble1 50s linear infinite;
}
.bubble li:nth-child(30){
    left: -12%;
    width: 629px;
    height: 629px;
    background: url(../assets/images/bubbles/bubble1-1.png) no-repeat;
    top: 6900px;
    /*animation: bubble1-1 25s linear infinite;*/
}
.bubble li:nth-child(31){
    left: 0;
    width: 509px;
    height: 509px;
    background: url(../assets/images/bubbles/bubble1-2.png) no-repeat;
    top: 7100px;
    animation: bubble1-1 20s linear infinite;
}

/* Group 12 */
.bubble li:nth-child(35){
    right: -10%;
    width: 509px;
    height: 509px;
    background: url(../assets/images/bubbles/bubble2.png) no-repeat;
    top: 7600px;
    animation: bubble2 40s linear infinite;
}

/* Group 13 */
.bubble li:nth-child(36){
    left: 10%;
    width: 497px;
    height: 497px;
    background: url(../assets/images/bubbles/bubble4.png) no-repeat;
    background-size: cover;
    top: 7600px;
    animation: bubble3 40s linear infinite;
}
.bubble li:nth-child(33){
    right: -10%;
    width: 820px;
    height: 819px;
    background: url(../assets/images/bubbles/bubble3-1.png) no-repeat;
    top: 7200px;
    /*animation: bubble3 39s linear infinite;*/
}
.bubble li:nth-child(34){
    right: 8%;
    width: 630px;
    height: 629px;
    background: url(../assets/images/bubbles/bubble3-2.png) no-repeat;
    top: 7500px;
    animation: bubble1-1 15s linear infinite;
}

/* Group 14 */
.bubble li:nth-child(37){
    left: -500px;
    width: 1062px;
    height: 1062px;
    background: url(../assets/images/bubbles/bubble4-1.png) no-repeat;
    top: 7800px;
    /*animation: bubble3 39s linear infinite;*/
}
.bubble li:nth-child(38){
    left: 3%;
    width: 630px;
    height: 629px;
    background: url(../assets/images/bubbles/bubble4-2.png) no-repeat;
    top: 8300px;
    animation: bubble1-1 15s linear infinite;
}
.bubble li:nth-child(39){
    left: 50%;
    width: 747px;
    height: 747px;
    background: url(../assets/images/bubbles/bubble4.png) no-repeat;
    top: 8200px;
    animation: bubble4 80s linear infinite;
}

/* Group 15 */
.bubble li:nth-child(40){
    right: -200px;
    width: 773px;
    height: 773px;
    background: url(../assets/images/bubbles/bubble5-1.png) no-repeat;
    top: 9100px;
}
.bubble li:nth-child(41){
    right: -200px;
    width: 509px;
    height: 509px;
    background: url(../assets/images/bubbles/bubble5-2.png) no-repeat;
    top: 9400px;
    animation: bubble1-1 15s linear infinite;
}
.bubble li:nth-child(42){
    left: 0;
    width: 776px;
    height: 776px;
    background: url(../assets/images/bubbles/bubble5.png) no-repeat;
    top: 9100px;
    animation: bubble3 20s linear infinite;
}

/* Group 16 */
.bubble li:nth-child(43){
    right: -10%;
    width: 541px;
    height: 541px;
    background: url(../assets/images/bubbles/bubble6.png) no-repeat;
    top: 10000px;
    animation: bubble2 40s linear infinite;
}

/* Group 17 */
.bubble li:nth-child(44){
    left: -450px;
    width: 992px;
    height: 991px;
    background: url(../assets/images/bubbles/bubble7-1.png) no-repeat;
    top: 10500px;
}
.bubble li:nth-child(45){
    left: -350px;
    width: 788px;
    height: 788px;
    background: url(../assets/images/bubbles/bubble7-2.png) no-repeat;
    top: 10800px;
    animation: bubble1-1 10s linear infinite;
}
.bubble li:nth-child(46){
    left: -50px;
    width: 826px;
    height: 827px;
    background: url(../assets/images/bubbles/bubble7-3.png) no-repeat;
    top: 10600px;
    animation: bubble1-1 15s linear infinite;
}
.bubble li:nth-child(47){
    left: -15%;
    width: 1194px;
    height: 1194px;
    background: url(../assets/images/bubbles/bubble1.png) no-repeat;
    top: 11000px;
    animation: bubble1 70s linear infinite;
}
.bubble li:nth-child(48){
    right: -400px;
    width: 935px;
    height: 935px;
    background: url(../assets/images/bubbles/bubble7-4.png) no-repeat;
    top: 10700px;
    animation: bubble1-1 15s linear infinite;
}
.bubble li:nth-child(49){
    right: -10%;
    width: 497px;
    height: 497px;
    background: url(../assets/images/bubbles/bubble4.png) no-repeat;
    background-size: cover;
    top: 11200px;
    animation: bubble2 35s linear infinite;
}

/* Group 18 */
.bubble li:nth-child(50){
    left: 45%;
    width: 935px;
    height: 935px;
    background: url(../assets/images/bubbles/bubble8-1.png) no-repeat;
    top: 11500px;
    margin-left: -468px;
    animation: bubble1-1 15s linear infinite;
}
.bubble li:nth-child(51){
    left: 35%;
    width: 773px;
    height: 773px;
    background: url(../assets/images/bubbles/bubble5-1.png) no-repeat;
    top: 11800px;
    margin-left: -386px;
    animation: bubble1-1 10s linear infinite;
}
.bubble li:nth-child(52){
    left: 38%;
    width: 735px;
    height: 734px;
    background: url(../assets/images/bubbles/bubble8-3.png) no-repeat;
    top: 11700px;
    animation: bubble1-1 5s linear infinite;
}

/* Group 19 */
.bubble li:nth-child(53){
    right: -400px;
    width: 797px;
    height: 796px;
    background: url(../assets/images/bubbles/bubble9-1.png) no-repeat;
    top: 12500px;
    animation: bubble1-1 25s linear infinite;
}
.bubble li:nth-child(54){
    right: -150px;
    width: 773px;
    height: 773px;
    background: url(../assets/images/bubbles/bubble5-1.png) no-repeat;
    top: 12800px;
    animation: bubble1-1 15s linear infinite;
}
.bubble li:nth-child(55){
    left: 0;
    width: 776px;
    height: 776px;
    background: url(../assets/images/bubbles/bubble5.png) no-repeat;
    top: 13000px;
    animation: bubble3 80s linear infinite;
}

/* Group 20 */
.bubble li:nth-child(56){
    left: 0;
    width: 797px;
    height: 796px;
    background: url(../assets/images/bubbles/bubble10-1.png) no-repeat;
    top: 13700px;
    animation: bubble1-1 25s linear infinite;
}
.bubble li:nth-child(57){
    left: -150px;
    width: 773px;
    height: 773px;
    background: url(../assets/images/bubbles/bubble10-2.png) no-repeat;
    top: 13700px;
    animation: bubble1-1 20s linear infinite;
}
.bubble li:nth-child(58){
    left: -200px;
    width: 552px;
    height: 552px;
    background: url(../assets/images/bubbles/bubble10-3.png) no-repeat;
    top: 13800px;
    animation: bubble1-1 15s linear infinite;
}

@keyframes bubble1 {
    0%{
        left: -10%;
        transform: rotate(0deg);
        opacity: 1;
    }
    50%{
        left: 75%;
        transform: rotate(350deg);
        opacity: 1;
    }
    100%{
        left: -10%;
        transform: rotate(0deg);
        opacity: 1;
    }
}
@keyframes bubble1-1 {
    0%{
        transform: scale(1);
        opacity: 1;
    }
    50%{
        transform: scale(0.8);
        opacity: 0.8;
    }
    100%{
        transform: scale(1);
        opacity: 1;
    }
}
@keyframes bubble2 {
    0%{
        right: -10%;
        opacity: 1;
        transform: rotate(0deg);
    }
    50%{
        right: 70%;
        opacity: 1;
        transform: rotate(360deg);
    }
    100%{
        right:-10%;
        opacity: 1;
        transform: rotate(0deg);
    }
}
@keyframes bubble3 {
    0%{
        left: 0%;
        opacity: 1;
        transform: rotate(0deg);
    }
    50%{
        left: 80%;
        opacity: 1;
        transform: rotate(360deg);
    }
    100%{
        left: 0%;
        opacity: 1;
        transform: rotate(0deg);
    }
}
@keyframes bubble4 {
    0%{
        left: 50%;
        opacity: 1;
        transform: rotate(0deg);
    }
    50%{
        left: 10%;
        opacity: 1;
        transform: rotate(360deg);
    }
    100%{
        left: 50%;
        opacity: 1;
        transform: rotate(0deg);
    }
}

@media (max-width: 767.98px) {
    /* Group 1 */
    .bubble li:nth-child(3){
        left: -25%;
        width: 420px;
        height: 420px;
        background-size: cover;
        top: -150px;
    }
    .bubble li:nth-child(1){
        left: -20%;
        width: 200px;
        height: 200px;
        background-size: cover;
        top: 30px;
    }
    .bubble li:nth-child(2){
        left: 0;
        width: 150px;
        height: 150px;
        background-size: cover;
        top: 100px;
    }

    /* Group 2 */
    .bubble li:nth-child(6){
        right: -10%;
        width: 220px;
        height: 220px;
        background-size: cover;
        top: 250px;
    }

    /* Group 3 */
    .bubble li:nth-child(7){
        left: 10%;
        width: 160px;
        height: 160px;
        background-size: cover;
        top: 280px;
    }
    .bubble li:nth-child(4){
        right: -30%;
        width: 260px;
        height: 260px;
        background-size: cover;
        top: 200px;
    }
    .bubble li:nth-child(5){
        right: 0;
        width: 200px;
        height: 200px;
        background-size: cover;
        top: 300px;
    }

    /* Group 4 */
    .bubble li:nth-child(8){
        left: -150px;
        width: 320px;
        height: 320px;
        background-size: cover;
        top: 500px;
    }
    .bubble li:nth-child(9){
        left: 3%;
        width: 200px;
        height: 200px;
        background-size: cover;
        top: 650px;
    }
    .bubble li:nth-child(10){
        left: 50%;
        width: 240px;
        height: 240px;
        background-size: cover;
        top: 600px;
    }

    /* Group 5 */
    .bubble li:nth-child(11){
        right: -80px;
        width: 215px;
        height: 215px;
        background-size: cover;
        top: 900px;
    }
    .bubble li:nth-child(12){
        right: 0;
        width: 95px;
        height: 95px;
        background-size: cover;
        top: 1000px;
    }
    .bubble li:nth-child(13){
        left: 0;
        width: 330px;
        height: 330px;
        background-size: cover;
        top: 900px;
    }

    /* Group 6 */
    .bubble li:nth-child(14){
        right: -10%;
        width: 230px;
        height: 230px;
        background-size: cover;
        top: 1300px;
    }

    /* Group 7 */
    .bubble li:nth-child(15){
        left: -150px;
        width: 330px;
        height: 330px;
        background-size: cover;
        top: 1500px;
    }
    .bubble li:nth-child(16){
        left: 0;
        width: 194px;
        height: 194px;
        background-size: cover;
        top: 1680px;
    }
    .bubble li:nth-child(17){
        left: 0;
        width: 150px;
        height: 150px;
        background-size: cover;
        top: 1600px;
    }
    .bubble li:nth-child(18){
        left: -15%;
        width: 420px;
        height: 420px;
        background-size: cover;
        top: 1700px;
    }
    .bubble li:nth-child(19){
        right: -120px;
        width: 250px;
        height: 250px;
        background-size: cover;
        top: 1550px;
    }
    .bubble li:nth-child(20){
        right: -10%;
        width: 160px;
        height: 160px;
        background-size: cover;
        top: 1700px;
    }

    /* Group 8 */
    .bubble li:nth-child(21){
        left: 45%;
        width: 200px;
        height: 200px;
        background-size: cover;
        top: 2050px;
        margin-left: -100px;
    }
    .bubble li:nth-child(22){
        left: 35%;
        width: 215px;
        height: 215px;
        background-size: cover;
        top: 2100px;
        margin-left: -107px;
    }
    .bubble li:nth-child(23){
        left: 38%;
        width: 150px;
        height: 150px;
        background-size: cover;
        top: 2100px;
    }

    /* Group 9 */
    .bubble li:nth-child(24){
        right: -100px;
        width: 200px;
        height: 200px;
        background-size: cover;
        top: 2300px;
    }
    .bubble li:nth-child(25){
        right: -50px;
        width: 215px;
        height: 215px;
        background-size: cover;
        top: 2350px;
    }
    .bubble li:nth-child(26){
        left: 0;
        width: 330px;
        height: 330px;
        background-size: cover;
        top: 2400px;
    }

    /* Group 10 */
    .bubble li:nth-child(27){
        left: 0;
        width: 230px;
        height: 230px;
        background-size: cover;
        top: 2700px;
    }
    .bubble li:nth-child(28){
        left: -110px;
        width: 220px;
        height: 220px;
        background-size: cover;
        top: 2700px;
    }
    .bubble li:nth-child(29){
        left: -30px;
        width: 145px;
        height: 145px;
        background-size: cover;
        top: 2700px;
    }

    /* Group 11 begin 3000 */ 
    .bubble li:nth-child(32){
        left: -25%;
        width: 420px;
        height: 420px;
        background-size: cover;
        top: 2850px;
    }
    .bubble li:nth-child(30){
        left: -20%;
        width: 200px;
        height: 200px;
        background-size: cover;
        top: 3030px;
    }
    .bubble li:nth-child(31){
        left: 0;
        width: 150px;
        height: 150px;
        background-size: cover;
        top: 3100px;
    }

    /* Group 12 */
    .bubble li:nth-child(35){
        right: -10%;
        width: 220px;
        height: 220px;
        background-size: cover;
        top: 3250px;
    }

    /* Group 13 */
    .bubble li:nth-child(36){
        left: 10%;
        width: 160px;
        height: 160px;
        background-size: cover;
        top: 3280px;
    }
    .bubble li:nth-child(33){
        right: -30%;
        width: 260px;
        height: 260px;
        background-size: cover;
        top: 3200;
    }
    .bubble li:nth-child(34){
        right: 0;
        width: 200px;
        height: 200px;
        background-size: cover;
        top: 3300px;
    }

    /* Group 14 */
    .bubble li:nth-child(37){
        left: -150px;
        width: 320px;
        height: 320px;
        background-size: cover;
        top: 3500px;
    }
    .bubble li:nth-child(38){
        left: 3%;
        width: 200px;
        height: 200px;
        background-size: cover;
        top: 3650px;
    }
    .bubble li:nth-child(39){
        left: 50%;
        width: 240px;
        height: 240px;
        background-size: cover;
        top: 3600px;
    }

    /* Group 15 */
    .bubble li:nth-child(40){
        right: -80px;
        width: 215px;
        height: 215px;
        background-size: cover;
        top: 3900px;
    }
    .bubble li:nth-child(41){
        right: 0;
        width: 95px;
        height: 95px;
        background-size: cover;
        top: 4000px;
    }
    .bubble li:nth-child(42){
        left: 0;
        width: 330px;
        height: 330px;
        background-size: cover;
        top: 3900px;
    }

    /* Group 16 */
    .bubble li:nth-child(43){
        right: -10%;
        width: 230px;
        height: 230px;
        background-size: cover;
        top: 4300px;
    }

    /* Group 17 */
    .bubble li:nth-child(44){
        left: -150px;
        width: 330px;
        height: 330px;
        background-size: cover;
        top: 4500px;
    }
    .bubble li:nth-child(45){
        left: 0;
        width: 194px;
        height: 194px;
        background-size: cover;
        top: 4680px;
    }
    .bubble li:nth-child(46){
        left: 0;
        width: 150px;
        height: 150px;
        background-size: cover;
        top: 4600px;
    }
    .bubble li:nth-child(47){
        left: -15%;
        width: 420px;
        height: 420px;
        background-size: cover;
        top: 4700px;
    }
    .bubble li:nth-child(48){
        right: -120px;
        width: 250px;
        height: 250px;
        background-size: cover;
        top: 4550px;
    }
    .bubble li:nth-child(49){
        right: -10%;
        width: 160px;
        height: 160px;
        background-size: cover;
        top: 4700px;
    }

    /* Group 18 */
    .bubble li:nth-child(50){
        left: 45%;
        width: 200px;
        height: 200px;
        background-size: cover;
        top: 5050px;
        margin-left: -100px;
    }
    .bubble li:nth-child(51){
        left: 35%;
        width: 215px;
        height: 215px;
        background-size: cover;
        top: 5100px;
        margin-left: -107px;
    }
    .bubble li:nth-child(52){
        left: 38%;
        width: 150px;
        height: 150px;
        background-size: cover;
        top: 5100px;
    }

    /* Group 19 */
    .bubble li:nth-child(53){
        right: -100px;
        width: 200px;
        height: 200px;
        background-size: cover;
        top: 5300px;
    }
    .bubble li:nth-child(54){
        right: -50px;
        width: 215px;
        height: 215px;
        background-size: cover;
        top: 5350px;
    }
    .bubble li:nth-child(55){
        left: 0;
        width: 330px;
        height: 330px;
        background-size: cover;
        top: 5400px;
    }

    /* Group 20 */
    .bubble li:nth-child(56){
        left: 0;
        width: 230px;
        height: 230px;
        background-size: cover;
        top: 5700px;
    }
    .bubble li:nth-child(57){
        left: -110px;
        width: 220px;
        height: 220px;
        background-size: cover;
        top: 5700px;
    }
    .bubble li:nth-child(58){
        left: -30px;
        width: 145px;
        height: 145px;
        background-size: cover;
        top: 5700px;
    }
}