[jQuery] After click, two events occurring at the same time... why?

[Kev]

I'm developing this site, here is the current snapshot:
http://tester.hearsaynashville.com/services

If you click on either "Contact Us" or "Client Login" in the upper
left, or on the gray "Ready to Get Started?" button, you'll see a
slideDown. Excellent. Now click the same button. It scrolls up,
exactly like I want it to, all smooth and nice. Now try it again, but
click one of the buttons and then a different one. One panels slides
up at the same time as the other sliding down. Why is that? I can't
figure out how to get one panel to scroll up before the next one
scrolls down. Here's my code:

$(document).ready(function(){

        $(".contact-slide").click(function(){
        if ($(".panels:not(#contact-panel)").is(":visible")) {
                $(".panels").slideUp("fast");
        }
                $("#contact-panel").slideToggle("normal");
        return false;
        });

        $(".client-slide").click(function(){
        if ($(".panels:not(#client-panel)").is(":visible")) {
                $(".panels").slideUp("fast");
        }
                $("#client-panel").slideToggle("normal");
        return false;
        });

        $(".getstarted-slide").click(function(){
        if ($(".panels:not(#getstarted-panel)").is(":visible")) {
                $(".panels").slideUp("fast");
        }
                $("#getstarted-panel").slideToggle("normal");
        return false;
        });

});