body {
    overflow: hidden;
}
.stars {
    background: linear-gradient(-45deg, #920505, #b11111, #db1919, #ff3c00);
    background-size: 400% 400%;
    animation: gradient 5s ease infinite;
    width: 100%;
    height: 100vh;
    opacity: 30%;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

@keyframes move-background {
    from {
        -webkit-transform: translate3d(0px, 0px, 0px);
    }
    to {
        -webkit-transform: translate3d(1000px, 0px, 0px);
    }
}
@-webkit-keyframes move-background {
    from {
        -webkit-transform: translate3d(0px, 0px, 0px);
    }
    to {
        -webkit-transform: translate3d(1000px, 0px, 0px);
    }
}
@-moz-keyframes move-background {
    from {
        -webkit-transform: translate3d(0px, 0px, 0px);
    }
    to {
        -webkit-transform: translate3d(1000px, 0px, 0px);
    }
}
@-webkit-keyframes move-background {
    from {
        -webkit-transform: translate3d(0px, 0px, 0px);
    }
    to {
        -webkit-transform: translate3d(1000px, 0px, 0px);
    }
}

.clouds {
    width: 10000px;
    height: 100%;
    background: transparent url("../img/clouds_repeat.png") repeat;
    background-size: 1000px 1000px;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 3;
    opacity: 30%;
    -moz-animation: move-background 30s linear infinite;
    -ms-animation: move-background 30s linear infinite;
    -o-animation: move-background 30s linear infinite;
    -webkit-animation: move-background 30s linear infinite;
    animation: move-background 30s linear infinite;
}
