jquery.transition bug with colors

HTML

<script src="https://raw.github.com/louisremi/jquery.transition.js/master/jquery.transition.js"></script>
<script src="https://raw.github.com/tobia/Pause/master/jquery.pause.min.js"></script>
<div id="stop" class="btn">stop</div>
<div id="play" class="btn">play</div>
<div class="black">Yo!</div>

CSS

.black {
    background-color: black;
    width: 200px;
    height: 200px;
}
div {
    display: inline-block;
    margin: 20px;
}
.btn {
    background-color: #bada33;
    width: 70px;
    height: 20px;
}

JavaScript

$("div.black").on("click", function() {
    $(this).animate({
        margin: "100px"
    }, {
        duration: 5000
    });
});

$("#stop").on("click", function() {
    $("div.black").pause();
});

$("#play").on("click", function() {
    $("div.black").resume();
});