Safari glitches when left,top,width,height is transitioned

[skmasq]

When I start transition, the div disapears, then appears full sized in right top corner of screen, then appears middle center as it should and then disapears (did not fadeOut ).

Here is my code:

var start = {
    keyhole: {
        step1: {
            top: "-3500px",
            left: "-3000px",
            height: "8000px",
            width: "8000px",
            translate3d: [0, 0, 0],
            duration: 2000,
            complete: function (){
                $(this).fadeOut()
            }
        }
    }
}

$(".key-hole").transition(start.keyhole.step1);

Here is starting css:

.key-hole{
            position: absolute;
            z-index: 4;
            top: 50%;
            left: 50%;
            width: 375px;
            height: 375px;
            margin-top: -187.5px;
            margin-left: -187.5px;
            -moz-background-origin: content-box;
            -webkit-background-origin: content-box;
            background-origin: content-box;
            background-image: url(/Content/img/keyhole_bg_complete.png);
            #bundle .background-size();
        }