Modal-style pop-up form is glitchy in Chrome upon open/closing

My website has a modal-style form that appears when a user clicks a link. The problem is that in Chrome the form is slightly glitchy while opening/closing. It appears quickly and is mostly evident around the edges of the form; its almost like it flashes open/close quickly, before finally opening.

In Internet Explorer it works fine.

The demo site can be see here. Then click "Click here" in upper-right.

The HTML for the link you click is:

<li><a href="#login-box" class="login-window">Click HERE</a></li>

And the 3 primary scripts are below. I apologize if this a stupid question but I don't know where else to go. Thanks for any feedback!

<script>
        var $btn = $('#flybutton');
        $("#contactform").validate({
            submitHandler: function (form) {
                fly(form);
            }
        });

        $btn.on('fliyingEnd', function (e, form) {

            $('#mask').fadeOut(300);
            $("#login-box").fadeOut(300); 
        })



        function fly(form){

            $btn.toggleClass('clicked');
            $btn.find('p').text(function(i, text) {
                return text === "Fire!" ? "Fire!" : "Fire!";
            });

            setTimeout(function () {
                $btn.trigger('fliyingEnd', [form]);
            }, 1000);

        }
    </script>





<script>
$(document).ready(function() {

  /* Attach a submit handler to the form */
$("#contactform").submit(function(event) {

    /* Stop form from submitting normally */
    event.preventDefault();

    /* Clear result div*/
    $("#result").html('');

    /* Get some values from elements on the page: */
    var values = $(this).serialize();

    /* Send the data using post and put the results in a div */
    $.ajax({
        url: "submit.php",
        type: "post",
        data: values,

    });
});
});
</script>





<script type="text/javascript">
$(document).ready(function() {
$('a.login-window').click(function() {

            //Getting the variable's value from a link 
    var loginBox = $(this).attr('href');

    //Fade in the Popup
    $(loginBox).fadeIn(300);

    //Set the center alignment padding + border see css style
    var popMargTop = ($(loginBox).height() + 24) / 2; 
    var popMargLeft = ($(loginBox).width() + 24) / 2; 

    $(loginBox).css({ 
        'margin-top' : -popMargTop,
        'margin-left' : -popMargLeft
    });

    // Add the mask to body
    $('body').append('<div id="mask"></div>');
    $('#mask').fadeIn(300);

    return false;
});
// When clicking on the button close or the mask layer the popup closed
    $('a.closest, #mask').bind('click', function() { 
      $('#mask , .login-popup').fadeOut(300 , function() {
        $('#mask').remove();  
    }); 
    return false;
    });
});
</script>