Lightbox image viewer 2.03a trouble :(..HELP!

[mx5]

i really want the Lightbox image viewer 2.03a to work on my website

im using the html editor on freewebs
and so far this is how the outline of my page looks:

<style type="text/css">
body, html, div, font, p, td {
	font-family: verdana;
	font-size: 7pt;
	line-height: 7pt;
	color: #000000;
	margin: 0;
	padding: 0;
}

.entrytext{
font-weight: normal;
}
h1 {
	background: #000000;
	color: #ffffff;
	font-family: verdana;
	font-size: 9pt;
	line-height: 9pt;
	font-weight: bold;
	text-transform: uppercase;
	text-align: left;
	margin: 1px;
	margin-top: 2px;
	margin-bottom: 2px;
	padding-top: 2px;
	padding-bottom: 2px;
        border-top: 0px solid #ffffff 
	border-bottom: 2px dotted #ffffff;
}
h2 {
	background: #6200B6;
	color: #ffffff;
	font-family: verdana;
	font-size: 7pt;
	line-height: 8pt;
	font-weight: bold;
	text-align: left;
	margin: 0;
        width: px;
	margin-top: 2px;
	padding: 0px;
	padding-bottom: 0px;
	border-bottom: 0px solid #6200B6;
}
h3 {
	background: tansparent;
	color: #ffffff;
	font-family: verdana;
	font-size: 8pt;
	line-height: 10pt;
	font-weight: normal;
	text-transform: none;
	text-align: left;
	margin: 1px;
	margin-bottom: 2px;
	padding: 0px;
	padding-bottom: 2px;
	border-bottom: 0px solid none;
}
.special {
	font-family: verdana;
	font-size: 7pt;
	color: #ffffff;
	font-weight: bold;
	line-height: 7pt;
}



a:link, a:visited, a:active {
        text-decoration: none;
	font-weight: bold;
	font-family: arial;
	color: #ffffff;
	cursor: crosshair;
}
a:hover { 
	text-decoration: none;
	font-weight: bold;
	font-family: tahoma;
	color: #ffffff;
	cursor: crosshair;
}


a.nav, a.nav:link, a.nav:active, a.nav:visited {
height:10;
padding:0;	
padding-left:1;
padding-right:1;
color:#ffffff;
border-bottom:1px solid #ffffff;
display:block;
text-transform:none;
background:#ffffff;
}
a.nav:hover {
height:10;
padding:0;
padding-left:1;
padding-right:1;
color:#585858;
border-bottom:1px solid #ffffff;
display:block;
text-transform:none;
background:#ffffff;
}



input, select {
	color: #4e504e;
	background: #ffffff;
	font-size: 7pt;
	font-weight: normal;
	font-weight: bold;
	text-decoration: none;
	font-family: verdana; 
	text-align: center;
	border-width: 1px;
	border-style: solid;
	border-color: #000000;
}
TEXTAREA {
	color: #e6e6e6;
	background: #ffffff;
	font-size: 7pt;
	font-weight: normal;
	text-decoration: none;
	font-family: verdana; 
	text-align: center;
	border-width: 1px;
	border-style: solid;
	border-color: #000000;
}

img {
border: none;
}

</style>

 <style>a.box:link, a.box:visited, a.box:active {
text-decoration : none;
color : #000000;
font-size : 7pt;
font-family : verdana;
display:block;
border-left:5px #000000 solid;}
}
a.box:hover {
	text-transform:lowercase;
	style:normal;
	background: url() no-repeat;
    background-color: #000000;
	color: #ffffff;
	display:block;
border-left:5px #ffffff solid;}
</style>
<style>
body {
background-color: transparent; }
</style>

<TABLE><TR><P ALIGN="left">
<div style="position:absolute; width:400px; x-index:0; left: 0px; top:0px;">
<h1>About Us</h1>
<h2>Chromatic-Designs; </h2>
<h3> </h3>

..i want the lightbox to go in the header 3 bit.
I seriously don't understnd the instuctions on the page for Lightbox image viewer 2.03a on the dynamic drive website.

Some one please help me on
-what i have to do exactly
-what do i have to change/adjust in the codes provided
-how to setup and activate using the freewebs html editor


..