Wootheme flexslider probem flexslider.woothemes

I am now from the carousel part:

http://i.imgur.com/6ERDNzy.jpg

My Website

My billboard looks fine when I coded the carousel part my billboard area broke.It overwrites maybe.

http://i.imgur.com/AhNcQ2n.png

My jquery code:

http://i.imgur.com/MhuC8KX.png

When I tried to comment that code nav area, My carousel works but the billboard area not.

http://i.imgur.com/STDuGr5.jpg

Code:
<script type="text/javascript">
             

    $(window).load(function() {
    /** $('.flexslider').flexslider(); **/

    $('.flexslider').flexslider({
    animation: "slide",
    animationLoop: false,
    itemWidth: 210,
    itemMargin: 5
  		});
  });

</script>

html: 

<div id="featured">
		<div class="container">
        <div class="flexslider">
            <ul class="slides">
                <li>
                  <img src="http://www.webdesignforums.net/forum/images/slide1.jpg" />
                </li>
                <li>
                  <img src="http://www.webdesignforums.net/forum/images/slide2.jpg" />
                </li>
                <li>
                  <img src="http://www.webdesignforums.net/forum/images/kitchen_adventurer_cheesecake_brownie.jpg" />
                </li>
                <li>
                  <img src="http://www.webdesignforums.net/forum/images/kitchen_adventurer_lemon.jpg" />
                </li>
                <li>
                  <img src="http://www.webdesignforums.net/forum/images/kitchen_adventurer_donut.jpg" />
                </li>
                <li>
                  <img src="http://www.webdesignforums.net/forum/images/kitchen_adventurer_caramel.jpg" />
                </li>
                <li>
                  <img src="http://www.webdesignforums.net/forum/images/kitchen_adventurer_cheesecake_brownie.jpg" />
            </ul>
      </div> <!-- end flexslider area --> 
		</div> <!-- end container --> 
	</div> <!-- end featured area -->
My Website