<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<link rel="stylesheet" href="stylesheets/style.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/easySlider1.7.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#slider").easySlider({
auto: true,
continuous: true,
numeric: true
});
});
</script>
</head>
<body>
<div class="container">
<div id="header">
<div id="logo" ><h1><a href="#">Example 18</a></h1></div>
<div id="taal">
<a href="#"><img src="images/nl.jpg" width="16" height="11" alt="nl" /></a>
<a href="#"><img src="images/en.jpg" width="16" height="11" alt="en" /></a>
</div>
<div id="clear"></div>
<ul class="menu_top" >
<li class="home" ><a href="#">Home</a></li>
<li><a href="#">men</a></li>
<li><a href="#">woman</a></li>
<li><a href="#">children</a></li>
<li><a href="#">electronics</a></li>
<li class="last" ><a href="#">Lorum Ipsum</a>
<div id="dropdown_content">
<a href="#">Lorum</a>
<a href="#">Ipsum</a>
<a href="#">Dollor</a>
<a href="#">SIT</a>
<a href="#">Amet</a>
</div>
</li>
</ul>
</div> <!-- END HEADER -->
<div id="slider">
<ul>
<li>
<div class="blok">
<h2><a href="#">Macbook pro 13"</a></h2>
<img class="aanbieding_thumb" src="images/laptop.jpg" width="305" height="190" alt="laptop" />
<p class="aanbieding_specs" >
2,3-GHz dual-core<br /> Intel Core i5<br />
4 GB, 1333 MHz<br />
320 GB, 5400 rpm1<br />
Intel HD Graphics 3000<br />
Ingebouwde batterij (7uur)<br />
</p>
<div class="price">
<p class="line_through" >1199,99</p>
<p>1099,99</p>
</div>
</div>
</li>
<li>
<div class="blok">
<h2><a href="#">Macbook pro 13"</a></h2>
<img class="aanbieding_thumb" src="images/laptop.jpg" width="305" height="190" alt="laptop" />
<p class="aanbieding_specs" >
2,3-GHz dual-core<br /> Intel Core i5<br />
4 GB, 1333 MHz<br />
320 GB, 5400 rpm1<br />
Intel HD Graphics 3000<br />
Ingebouwde batterij (7uur)<br />
</p>
<div class="price">
<p class="line_through" >1199,99</p>
<p>1099,99</p>
</div>
</div>
</li>
<li>
<div class="blok">
<h2><a href="#">Macbook pro 13"</a></h2>
<img class="aanbieding_thumb" src="images/laptop.jpg" width="305" height="190" alt="laptop" />
<p class="aanbieding_specs" >
2,3-GHz dual-core<br /> Intel Core i5<br />
4 GB, 1333 MHz<br />
320 GB, 5400 rpm1<br />
Intel HD Graphics 3000<br />
Ingebouwde batterij (7uur)<br />
</p>
<div class="price">
<p class="line_through" >1199,99</p>
<p>1099,99</p>
</div>
</div>
</li>
<li>
<div class="blok">
<h2><a href="#">Macbook pro 13"</a></h2>
<img class="aanbieding_thumb" src="images/laptop.jpg" width="305" height="190" alt="laptop" />
<p class="aanbieding_specs" >
2,3-GHz dual-core<br /> Intel Core i5<br />
4 GB, 1333 MHz<br />
320 GB, 5400 rpm1<br />
Intel HD Graphics 3000<br />
Ingebouwde batterij (7uur)<br />
</p>
<div class="price">
<p class="line_through" >1199,99</p>
<p>1099,99</p>
</div>
</div>
</li>
</ul>
</div> <!-- END SLIDER -->
<div id="winkelmandje">
<h4 class="mand" >Chart</h4>
<table>
<tr>
<td>Lorum Ipsum:</td>
<td>4</td>
</tr>
<tr>
<td>Total price:</td>
<td>€125.50</td>
</tr>
</table>
<div class="inhoud">
<a href="#">Lorum Ipsum</a>
<img src="images/border.jpg" width="29" height="11" alt="border" />
<a href="#">Checkout</a>
</div>
<h4 class="lijst" >Lorum Ipsum</h4>
<p>Lorem Ipsum is simply dummy text of the printing.</p>
</div> <!-- END WINKELMANDJE -->
<div class="spacer"></div>
<div id="content">
<div id="cats">
<h3>Categorieën</h3>
<ul>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
<li><a href="#">t-shirts</a></li>
</ul>
</div>
<div id="products">
<p>You are here: <a href="#">Electronics</a>   >>>   <a href="#">Apple</a></p>
<div class="prod">
<div class="prod_left">
<img src="images/iphone.jpg" width="112" height="138" alt="iphone" />
<div class="specs">
<a href="">Lorum Ipsum</a>
</div>
</div>
<div class="prod_right">
<h2>iPod Touch 4g 8GB</h2>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap <a class="leesverder" href="#">..read more</a>
</p>
<div class="voorraad">
<p>Lorum ipsum dollor sit</p>
<p class="groen" >lorum</p>
</div>
<div class="ww">
<a href="#">add to chart</a>
</div>
</div>
</div> <!-- END PROD -->
<div class="prod">
<div class="prod_left">
<img src="images/iphone.jpg" width="112" height="138" alt="iphone" />
<div class="specs">
<a href="">Lorum Ipsum</a>
</div>
</div>
<div class="prod_right">
<h2>iPod Touch 4g 8GB</h2>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap <a class="leesverder" href="#">..read more</a>
</p>
<div class="voorraad">
<p>Lorum ipsum dollor sit</p>
<p class="groen" >lorum</p>
</div>
<div class="ww">
<a href="#">add to chart</a>
</div>
</div>
</div> <!-- END PROD -->
<div class="prod">
<div class="prod_left">
<img src="images/iphone.jpg" width="112" height="138" alt="iphone" />
<div class="specs">
<a href="">Lorum Ipsum</a>
</div>
</div>
<div class="prod_right">
<h2>iPod Touch 4g 8GB</h2>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap <a class="leesverder" href="#">..read more</a>
</p>
<div class="voorraad">
<p>Lorum ipsum dollor sit</p>
<p class="groen" >lorum</p>
</div>
<div class="ww">
<a href="#">add to chart</a>
</div>
</div>
</div> <!-- END PROD -->
</div> <!-- END PRODUCTS -->
<div id="sidebar">
<div class="cats2">
<h3>Informatief</h3>
<ul>
<li><a href="#">Lorum Ipsum dollor</a></li>
<li><a href="#">It is a long established</a></li>
<li><a href="#">Lorum Ipsum dollor</a></li>
<li><a href="#">It is a long established</a></li>
<li><a href="#">Lorum Ipsum dollor</a></li>
<li><a href="#">It is a long established</a></li>
</ul>
</div>
<div class="cats2">
<h3>Informatief</h3>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard.
</p>
<form method="get" action="#">
<fieldset>
<input class="input" type="text" value="" name="s"/>
<input name="submit" value="" type="submit" />
</fieldset>
</form>
</div>
</div> <!-- END SIDEBAR -->
<div class="spacer"></div>
</div> <!-- END CONTENT -->
</div> <!-- END CONTAINER -->
<div id="footer">
<div class="container">
<div class="footer_list">
<h3>Lorum Ipsum</h3>
<ul>
<li><a href="#">about us</a></li>
<li><a href="#">about us</a></li>
<li><a href="#">about us</a></li>
<li><a href="http://www.psdtohtmlshop.com" title="PSD to HTML" >PSD to HTML</a></li>
</ul>
</div>
<div class="footer_list">
<h3>Lorum Ipsum</h3>
<ul>
<li><a href="#">about us</a></li>
<li><a href="#">about us</a></li>
<li><a href="#">about us</a></li>
<li><a href="#">about us</a></li>
</ul>
</div>
<div class="footer_list">
<h3>Lorum Ipsum</h3>
<ul>
<li><a href="#">about us</a></li>
<li><a href="#">about us</a></li>
<li><a href="#">about us</a></li>
<li><a href="#">about us</a></li>
</ul>
</div>
<div class="betaalmethodes">
<a href="#"><img src="images/ideal.png" width="51" height="44" alt="ideal" /></a>
<a href="#"><img src="images/postnl.png" width="46" height="45" alt="postnl" /> </a>
<a href="#"><img src="images/paypal.png" width="100" height="28" alt="paypal" /> </a>
</div>
</div>
</div> <!-- END FOOTER -->
<p style="position: fixed; top: 20px; right: 120px;" >
<a href="http://validator.w3.org/check?uri=https%3A%2F%2Fwww.psdtohtmlshop.com%2FExamples%2FExample-18%2Findex.html" rel="nofollow" target="_blank" >
<img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Transitional" height="31" width="88" />
</a>
</p>
<p style="position: fixed; top: 20px; right: 10px;">
<a href="http://jigsaw.w3.org/css-validator/" rel="nofollow" target="_blank" >
<img style="border:0;width:88px;height:31px" src="http://jigsaw.w3.org/css-validator/images/vcss" alt="Valide CSS!" />
</a>
</p>
</body>
</html>