Circle Expanding Border

When hovering over the Circle's container, the circles border-width animates from 2px to 6px with an elastic effect.

HTML

<div id="pictureCont"><div id="circle"></div></div>

CSS

#circle {
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 50px;
    
    background:#000;
    width:30px;
    height:30px;
    position:absolute;
    left:90px;
    top:90px;
    z-index:10;
    
    border:#3c3 solid 2px;

}

#pictureCont {
    width:200px;
    height:200px;
    background:#eee;
}

JavaScript

$('#pictureCont').hover(function(){
    $(this).find('#circle').stop(false, true)
        .animate({borderLeftWidth: "6px",
                  borderRightWidth: "6px",
                  borderTopWidth: "6px",
                  borderBottomWidth: "6px",
                  marginLeft:"-=4px", marginTop:"-=4px"}, 400)
}, function() {
    $(this).find('#circle').stop(false, true)
        .animate({borderTopWidth: "2px",
                  borderLeftWidth: "2px",
                  borderBottomWidth: "2px",
                  borderRightWidth: "2px",
                  marginLeft:"+=4px", marginTop:"+=4px"}, 400)
})