Hero Carousel not working

I am working on a site: The Element

I am trying to use the Hero Carousel but it does not seem to be working and I can't see whats wrong. I just see the images lined up on top of each other.

This is the code I have right now:

JQUERY

$(document).ready(function(){

var menuBtn   = $('img.menu-btn');
    nav       = $('nav');
    post      = $('div.post');
    searchbtn = $('img.searchbtn');
    search    = $('div.search-area');

menuBtn.click(function() {
    nav.toggleClass('menu-open');
});

searchbtn.click(function() {
    search.toggle();
});

post.hover(function() {
    $(this).find('a').find('p').fadeIn(250);
},function() {
    $(this).find('a').find('p').fadeOut(250);
});

$('.hero-carousel').heroCarousel({
    easing: 'easeOutExpo',
    css3pieFix: true
});
});

PHP

    <?php get_header(); ?>

<div class="hero">
    <div class="hero-carousel">
        <article>
            <img src="http://ift.tt/1skZV9u" >
                </article>
                <article>
            <img src="http://ift.tt/1w2laf5" >
                </article>
                <article>
            <img src="http://ift.tt/1w2laf7" >
                </article>
                <article>
                    <img src="http://ift.tt/1skZV9E" > 
                </article>
    </div>
</div>

<div id="main">

    <?php if ( function_exists( 'get_wp_parallax_content_slider' ) ) { get_wp_parallax_content_slider(); } ?>

    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

        <div <?php post_class() ?> id="post-<?php the_ID(); ?>">

        <?php if ( has_post_thumbnail() ) : ?>
            <a href="<?php the_permalink(); ?>">
                <?php the_post_thumbnail(); ?>
                <p><?php the_excerpt(); ?></p  
            </a>
        <?php endif; ?>
    <a href="<?php the_permalink(); ?>">
            <h3><?php the_title(); ?></h3>  
        </a>

        </div>

    <?php endwhile; ?>

    <?php include (TEMPLATEPATH . '/inc/nav.php' ); ?>

    <?php else : ?>

        <h2>Not Found</h2>

    <?php endif; ?>

</div><!--Main End-->

<?php get_footer(); ?>