.clouds {
    z-index: 4;
    background-repeat: repeat-x;
    height: 144px;
    width: auto;
    background-size: 870px 144px;
    background-image: url('img/clouds.png');
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}

.moreclouds {
    z-index: 2;
    background-repeat: repeat-x;
    height: 144px;
    width: auto;
    background-size: 870px 144px;
    background-image: url('img/moreclouds.png');
    position: absolute;
    left: 0px;
    right: 0px;
    opacity: 0.5;
    bottom: 67px;
}

.ballon1 {
    z-index: 10;
    height: 152px;
    width: 120px;
    background-size: 120px 152px;
    background-image: url('img/ballon2.png');
    position: absolute;

    top: 180px;
    right: 550px;

    transform: translate3d(20px, 20px, 0);
    -webkit-transform: translate3d(20px, 20px, 0);
    -moz-transform: translate3d(20px, 20px, 0);

    animation: bobble 230s infinite;
    -webkit-animation: bobble 230s infinite;
    -moz-animation: bobble 230s infinite;
}

.ballon2 {
    z-index: 9;
    height: 127px;
    width: 100px;
    background-size: 100px 127px;
    background-image: url('img/ballon2.png');
    position: absolute;

    top: 120px;
    right: 400px;

    transform: translate3d(20px, 20px, 0);
    -webkit-transform: translate3d(20px, 20px, 0);
    -moz-transform: translate3d(20px, 20px, 0);

    animation: bobble 330s infinite;
    -webkit-animation: bobble 330s infinite;
    -moz-animation: bobble 330s infinite;

}

.ballon3 {
    z-index: 8;
    height: 98px;
    width: 77px;
    background-size: 77px 98px;
    background-image: url('img/ballon3.png');
    position: absolute;

    top: 210px;
    right: 220px;

    transform: translate3d(20px, 20px, 0);
    -webkit-transform: translate3d(20px, 20px, 0);
    -moz-transform: translate3d(20px, 20px, 0);

    animation: bobble 360s infinite;
    -webkit-animation: bobble 360s infinite;
    -moz-animation: bobble 360s infinite;

}

.ballon4 {
    z-index: 7;
    height: 66px;
    width: 55px;
    background-size: 55px 69px;
    background-image: url('img/ballon3.png');
    position: absolute;

    top: 130px;
    right: 180px;

    transform: translate3d(20px, 20px, 0);
    -webkit-transform: translate3d(20px, 20px, 0);
    -moz-transform: translate3d(20px, 20px, 0);

    animation: bobble 400s infinite;
    -webkit-animation: bobble 400s infinite;
    -moz-animation: bobble 400s infinite;


}

.redrocket {
    z-index: 3;
    width: 120px;
    height: 1300px;
    background-size: 120px 1300px;
    background-image: url('img/rocket.png');
    position: absolute;
    bottom: -1200px;
    right: 170px;
    opacity: 1.0;

    transform: translate3d(0px, 0px, 0);
    -webkit-transform: translate3d(0px, 0px, 0);
    -moz-transform: translate3d(0px, 0px, 0);

    animation: liftoff 30s 1;
    -webkit-animation: liftoff 30s 1;
    -moz-animation: liftoff 30s 1;
}

@keyframes liftoff {
    0% {
        transform: translate3d(0px, -0px, 0px);
        animation-timing-function: ease-in;
    }
    70% {
        transform: translate3d(0px, -1200px, 0px);
        animation-timing-function: ease-in;
        opacity: 0.99;
    }
    100% {
        transform: translate3d(0px, -1300px, 0px);
        animation-timing-function: ease-in;
        opacity: 0.0;
    }
}

@-webkit-keyframes liftoff {
    0% {
        -webkit-transform: translate3d(0px, -0px, 0px);
        -webkit-animation-timing-function: ease-in;
    }
    70% {
        -webkit-transform: translate3d(0px, -1200px, 0px);
        -webkit-animation-timing-function: ease-in;
        opacity: 0.9;
    }
    100% {
        -webkit-transform: translate3d(0px, -1300px, 0px);
        -webkit-animation-timing-function: ease-in;
        opacity: 0.0;
    }
}

@-moz-keyframes liftoff {
    0% {
        -moz-transform: translate3d(0px, -0px, 0px);
        -moz-animation-timing-function: ease-in;
    }
    70% {
        -moz-transform: translate3d(0px, -1200px, 0px);
        -moz-animation-timing-function: ease-in;
        opacity: 0.9;
    }
    100% {
        -moz-transform: translate3d(0px, -1300px, 0px);
        -moz-animation-timing-function: ease-in;
        opacity: 0.0;
    }
}



@keyframes bobble {
    0% {
        transform: translate3d(0px, 10px, 0px);
        -webkit-transform: translate3d(0px, 10px, 0px);
        animation-timing-function: linear;
    }
    30% {
        transform: translate3d(-500px, 40px, 0px);
        -webkit-transform: translate3d(-500px, 40px, 0px);
        animation-timing-function: linear;
    }
    70% {
        transform: translate3d(-1000px, 140px, 0px);
        -webkit-transform: translate3d(-1000px, 140px, 0px);
        animation-timing-function: linear;
    }
    100% {
        transform: translate3d(-1500px, 240px, 0px);
        -webkit-transform: translate3d(-1500px, 240px, 0px);
        animation-timing-function: linear;
    }
}

@-webkit-keyframes bobble {
    0% {
        -webkit-transform: translate3d(0px, 10px, 0px);
        -webkit-animation-timing-function: linear;
    }
    30% {
        -webkit-transform: translate3d(-500px, 40px, 0px);
        -webkit-animation-timing-function: linear;
    }
    70% {
        -webkit-transform: translate3d(-1000px, 140px, 0px);
        -webkit-animation-timing-function: linear;
    }
    100% {
        -webkit-transform: translate3d(-1500px, 240px, 0px);
        -webkit-animation-timing-function: linear;
    }
}
@-moz-keyframes bobble {
    0% {
        -moz-transform: translate3d(0px, 10px, 0px);
        -moz-animation-timing-function: linear;
    }
    30% {
        -moz-transform: translate3d(-500px, 40px, 0px);
        -moz-animation-timing-function: linear;
    }
    70% {
        -moz-transform: translate3d(-1000px, 140px, 0px);
        -moz-animation-timing-function: linear;
    }
    100% {
        -moz-transform: translate3d(-1500px, 240px, 0px);
        -moz-animation-timing-function: linear;
    }
}

@media (max-width: 768px) {
    .redrocket {
        display: none;
    }
    .ballon4 {
        display: none;
    }

    .ballon3 {
        display: none;
    }
    .ballon2 {
        right: 0px;
        top: 370px;
    }
    .ballon1 {
        display: none;
        top: 160px;
        right: -40px !important;
    }
}