Jquery lightbox plugin problem.

Jquery lightbox plugin problem.

Hey people,

so I need the lightbox plugin to make a gallery on my website, on this page z-gfx.co.cc/page.html.
I have tried more than 20 codes to make it work, but it still doesnt work... maybe there is something in my script blocking the jquery but i dont know what... :S

So could you please help me?

Here is the full code:

[code]<!DOCTYPE HTML>
<html>
<head>
<title>Zaboer GFX</title>
<meta name="description" content="website description">
<meta name="keywords" content="website keywords, website keywords">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="css/style.css">

<!-- modernizr enables HTML5 elements and feature detects -->

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script>
<link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" />

<script type="text/javascript">
        $(function() {
            $('.content a').lightBox();
        });
    </script>

</head>
<body>
  <div id="main">
    <header><div id="logo">
        <div id="logo_text">
          <!-- class="logo_colour", allows you to change the colour of the text -->
          <img src="images/z-gfx.png" width="300" height="100" alt="photo_two">
        </div>
      </div>
      <nav><ul class="sf-menu" id="nav">
<li><a href="index.html">Home</a></li>
          <li><a href="examples.html">Request</a></li>
          <li class="selected"><a href="page.html">A Page</a></li>
          <li><a href="another_page.html">Another Page</a></li>
          <li><a href="contact.php">Contact</a></li>
        </ul></nav></header><div id="site_content">
      <div id="sidebar_container">
        <div class="sidebar">
          <h3>Latest News</h3>
          <h4>Under construction</h4>
          <h5>April 19th, 2012</h5>
          <p>Z-GFX is currently under construction! The website will be ready within 1 or 2 weeks.</p>
        </div>
        <div class="sidebar">
          <h3>Useful Links</h3>
          <ul>
<li><a href="http://www.gfx-dc.co.uk">GFX-DC</a></li>
            <li><a href="http://www.deviantart.com/">DeviantArt</a></li>
            <li><a href="http://wallbase.cc/home">Wallbase</a></li>
            <li><a href="http://planetrenders.net/">Planet Renders</a></li>
          </ul>
</div>
      </div>
      <div class="content">
        <h1>A Page</h1>
        
        <a href="images/Zoro.png" title="long description can go here."><img src="images/Thumbs/ZoroThumb.png" width="100" height="100" alt="" /></a>
        <a href="images/vegapunkavatar.png"><img src="images/Thumbs/vegapunkavatarThumb.png" width="100" height="100" alt="" /></a>
      </div>
    </div>
</div>
  <p>&nbsp;</p>
  <!-- javascript at the bottom for fast page loading -->
  <script type="text/javascript" src="js/jquery.js"></script><script type="text/javascript" src="js/jquery.easing-sooper.js"></script><script type="text/javascript" src="js/jquery.sooperfish.js"></script><script type="text/javascript" src="js/jquery.kwicks-1.5.1.js"></script><script type="text/javascript">
    $(document).ready(function() {
      $('#images').kwicks({
        max : 600,
        spacing : 2
      });
      $('ul.sf-menu').sooperfish();
    });
  </script>
</body>
</html>[/code]

and I use Dreamweaver CS6.

Thanks in advance.