JQuery 1.7.2 conflicting with Featured Content Gallery plugin

I am completely at a lose on how to fix this.

I have been using Featured Content Gallery fine with no problems. My website then had 4 boxes beneath the FCG to navigate to other areas on the site. I wanted these boxes to have a transition affect and so I have applied Codrops CSS3 Hover transitions to it.

I have added the required javascript:

<?php if (is_page(‘home’) ) { ?>
<!–home page custom JS–>
<script type=’text/javascript’ src=”https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js”></script&gt;
<script type=’text/javascript’ src=”<?php bloginfo(‘stylesheet_directory’); ?>/js/jquery.hoverdir.js”></script>
<script type=”text/javascript”>
$(function() {
$(‘#portfolio-areas > li’).hoverdir( {
hoverDelay : 75
} );
});
</script>
<?php } ?>

in the header and footer and both causes FCG to stop working.

It seems to be the google’s jquery that seems to be causing this but is there a way I can load a script specifically to one area and not just a page?