Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Cubic Crayon</title>
<link rel="stylesheet" href="supersized.css" type="text/css" media="screen" />
<link rel="stylesheet" href="base_styles.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script src="js/effects.core.js"></script>
<script src="js/effects.slide.js"></script>
<script type="text/javascript" src="supersized.3.0.js"></script>>
<script type="text/javascript">
$(function(){
$.fn.supersized.options = {
startwidth: 640,
startheight: 480,
vertical_center: 1,
slideshow: 1,
navigation: 0,
thumbnail_navigation: 0,
transition: 1, //0-None, 1-Fade, 2-slide top, 3-slide right, 4-slide bottom, 5-slide left
pause_hover: 0,
slide_counter: 0,
slide_captions: 0,
slide_interval: 3000,
slides : [
{image : 'slides/background_1.jpg', title : 'City Clock Tower'},
{image : 'slides/background_2.jpg', title : 'City Clock Tower'},
{image : 'slides/background_3.jpg', title : 'City Clock Tower'},
{image : 'slides/background_4.jpg', title : 'City Clock Tower'},
]
};
$('#supersized').supersized();
});
</script>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_preloadimages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadimages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
</head>
<body class="gallery_bg">
<div id="content-wrapper">
<div class="content">
<div class="navigation">
<div class="nav"><img src="images/news_nav_on.png" width="140" height="40" alt="news" name="news" /></div>
<div class="nav"><a href="gallery.html" onmouseover="MM_swapImage('gallery','','images/gallery_nav_over.png',1)" onmouseout="MM_swapImgRestore()"><img src="images/gallery_nav.png" width="140" height="40" alt="gallery" name="gallery" /></a></div>
<div class="nav"><a href="about.html" onmouseover="MM_swapImage('about','','images/about_nav_over.png',1)" onmouseout="MM_swapImgRestore()"><img src="images/about_nav.png" width="140" height="40" alt="about" name="about" /></a></div>
<div class="nav"><a href="contact.html" onmouseover="MM_swapImage('contact','','images/contact_nav_over.png',1)" onmouseout="MM_swapImgRestore()"><img src="images/contact_nav.png" width="140" height="40" alt="contact" name="contact" /></a></div>
</div><!--navigation end-->
<div class="logo">
<a href="mailto:marc@cubiccrayon.co.nz" onmouseover="MM_swapImage('logo','','images/logo_news_over.png',1)" onmouseout="MM_swapImgRestore()"><img src="images/logo_news.png" width="120" height="40" alt="Email Cubic Crayon" name="logo" /></a>
</div><!--logo end-->
<div class="maincontent">
<div class="column">
<h1>new website</h1>
<p>22 Dec 2010 - Hey you, yeah you... I'm amazed you're reading this. This website's new so you must be the only person reading... wanna be my friend?</p>
<p class="more"><a href="news_dec_2010.html">read more</a></p>
</div>
<div class="column">
<h1>merry christmas</h1>
<p>22 Dec 2010 - I don't really want to wish you a merry christmas, I just need to fill up this space with something for the site launch.</p>
<p class="more"><a href="news_dec_2010.html">read more</a></p>
</div>
<div class="column">
<h1>fill this spot too</h1>
<p>22 Dec 2010 - blah blah doobily doody rumteedum borachadada YOU SHALL NOT PASS and all that mumbo jumbo malarky.</p>
<p class="more"><a href="news_dec_2010.html">read more</a></p>
</div>
</div><!--main content-->
</div><!--content end -->
</div><!--content-wrapper end-->
<!--Slides-->
<div id="supersized"></div>
</body>
</html>