.wilpet {
    background: transparent;
    border: 0px;
    border-radius: 0%;
    display: block;
    max-width: 100%;
}

#wil {
    position: absolute;
    z-index:0;
    animation: nudgeRight 15s linear infinite;
    left: 60%;
    top: 0;
}
#pet {
    position: absolute;
    z-index:0;
    background-image:"img/background/pet1.png";
    animation: nudgeLeft 15s linear infinite;
}

@media only screen and (max-device-width: 480px) {
    #wil {
        position: absolute;
        max-width:200px;
        max-height:200px;
        width: auto;
        height: auto;

        animation: nudgeRight 15s linear infinite;
        left: 60%;
        top: 0;
    }
    #pet {
        position: absolute;
        max-width:200px;
        max-height:200px;
        width: auto;
        height: auto;
        animation: nudgeLeft 15s linear infinite;
    }

}


@keyframes wil {
    from { background-position: 0 0; }
    to { background-position: 100% 0; }
}

@keyframes nudgeLeft {
    0%, 100% {
        transform: translate(0, 0);
    }

    50% {
        transform: translate(50px, 0);
    }

    80% {
        transform: translate(-50px, 0);
    }
}

@keyframes nudgeRight {
    0%, 100% {
        transform: translate(0, 0);
    }

    30% {
        transform: translate(-50px, 0);
    }

    60% {
        transform: translate(50px, 0);
    }
}


#animate-area	{ 
    width: 560px; 
    height: 400px; 
    background-image: url(bg-clouds.png);
    background-position: 0px 0px;
    background-repeat: repeat-x;


}