
.anim-wrap{
    position : fixed;
    top : 0;
    left : 0;
    width : 100%;
    height : 100%;
    overflow : hidden;
}

.star{
    position: absolute;
    bottom : 0;
    right : 30px;
    width: 100px;
    height: 100px;
    z-index: 1;
    background : url(../images/star.png) no-repeat;
    background-size : contain;
}

.bootje{
    position: absolute;
    bottom : 43px;
    right : 130px;
    width: 100px;
    height: 100px;
    z-index: 1;
    background : url(../images/bootjeW.png) no-repeat;
    background-size : contain;
}

.cloud-wrapper{
    position: absolute;
    top : 0;
    left : -80%;
    width : 100%;
    height : 100%;
    padding: 40px;
}

.cloud{
    position: absolute;
    left: 50%;
    width: 80%;
    height: 90%;
    margin: 10px;
    background : url(../images/2clouds.png) no-repeat;
    background-size : contain;
    transform: scale(1.5,1);
}


@media screen and (min-width : 800px) and (min-height : 450px) and (max-width:1600px){

    .bootje{
        right : -130px;
        -webkit-animation: move 69s linear 15s 1, no 8s linear 1s infinite;
        -moz-animation: move 69s linear 15s 1, no 8s linear 1s infinite;
        animation: move 69s linear 15s 1, no 8s linear 1s infinite;
    }

    .cloud-wrapper{
        -webkit-animation: right 40s linear 4s 2;
        -moz-animation: right 40s linear 4s 2;
        animation: right 40s linear 4s 2;
    }

    .cloud{
        /*-webkit-animation: rek 75s linear 1s 2, opacity 64s linear 1s 2 ; */
        /*-moz-animation: rek 75s linear 1s 2, opacity 64s linear 1s 2 ; */
        /*animation: rek 75s linear 1s 2, opacity 64s linear 1s 2 ;*/
    }

    .cloud{
        -webkit-animation: opacity 40s linear 4s 2;
        -moz-animation: opacity 40s linear 4s 2;
        animation: opacity 40s linear 4s 2;
    }

    @-webkit-keyframes right {
        0% { -webkit-transform: translate(0,0); }
        50% { -webkit-transform: translate(80%,0); }
        100% { -webkit-transform: translate(160%,0); }
    }

    @-moz-keyframes right {
        0% { -moz-transform: translate(0,0); }
        50% { -moz-transform: translate(80%,0); }
        100% { -moz-transform: translate(160%,0); }
    }

    @keyframes right {
        0% { transform: translate(0,0); }
        50% { transform: translate(80%,0); }
        100% { transform: translate(160%,0); }
    }

    @-webkit-keyframes move {
        0% { -webkit-transform: translate(0,0); }
        15% { -webkit-transform: translate(-350px,-4px); }
        30% { -webkit-transform: translate(-700px,4px); }
        60% { -webkit-transform: translate(-1400px,-2px); }
        100% { -webkit-transform: translate(-2100px,0); }
    }

    @-moz-keyframes move {
        0% { -moz-transform: translate(0,0); }
        15% { -moz-transform: translate(-350px,-4px); }
        30% { -moz-transform: translate(-700px,4px); }
        60% { -moz-transform: translate(-1400px,-2px); }
        100% { -moz-transform: translate(-2100px,0); }
    }

    @keyframes move {
        0% { transform: translate(0,0); }
        15% { transform: translate(-350px,-4px); }
        30% { transform: translate(-700px,4px); }
        60% { transform: translate(-1400px,-2px); }
        100% { transform: translate(-2100px,0); }
    }

    @-webkit-keyframes rek {
        0% { -webkit-transform: scale(1,1); }
        50% { -webkit-transform: scale(1.5,1); }
        100% { -webkit-transform: scale(1,1); }
    }

    @keyframes rek {
        0% { transform: scale(1,1); }
        50% { transform: scale(1.5,1); }
        100% { transform: scale(1,1); }
    }

    @-webkit-keyframes up {
        0% { -webkit-transform: translateY(0px); }
        50% { -webkit-transform: translateY(-4px); }
        100% { -webkit-transform: translateY(3px); }
    }

    @keyframes up {
        0% { transform: translateY(0px); }
        50% { transform: translateY(-4px); }
        100% { transform: translateY(3px); }
    }

    @-webkit-keyframes up2 {
        0% { -webkit-transform: translate(120px,0px) scale(1,1); }
        50% { -webkit-transform: translate(120px,-420px) scale(.8,.8); }
        100% { -webkit-transform: translate(200px, -650px) scale(.1,.1); }
    }

    @keyframes up2 {
        0% { transform: translate(120px,0px) scale(1,1); }
        50% { transform: translate(120px,-420px) scale(.8,.8); }
        100% { transform: translate(200px, -650px) scale(.1,.1); }
    }

    @-webkit-keyframes opacity {
        0%   {opacity : 1;}
        50%  {opacity : 0.5;}
        100%  {opacity: 1;}
    }

    @keyframes opacity {
        0%   {opacity : 1;}
        50%  {opacity : 0.5;}
        100%  {opacity: 1;}
    }

}