/* CSS Document */

body {
	background-image:url(images/bgsqdot.gif);
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
.style1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
}
.style2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
}
.style3 {font-size: 15px}
.style4 {font-family: Arial, Helvetica, sans-serif; font-size: 15px; }
.style5 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #999999;
}
.style6 {
	color: #FFFFFF;
	font-size: 11px;
}

.style7 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #FFFFFF;
	font-weight: bold;
}

a:link {
	color: #CCCCCC;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
	color: #CCCCCC;
}
a:hover {
	text-decoration: none;
	color: #990000;
}
a:active {
	text-decoration: none;
	color: #CCCCCC;
}


/*------------ Top link  ------------*/

A.toplink:link, A.toplink:active, A.toplink:visited {
	font-family: Arial; 
	font-size: 8pt; 
	font-style: normal; 
	font-weight: bold; 
	color: #0066FF; 
	text-decoration: none;
}

A.toplink:hover {
	font-family: Arial; 
	font-size: 8pt; 
	font-weight: bold; 
	color: #FFFFFF; 
	text-decoration: underline
}

.tfvHighlight{
	background-color: #FFB6C1;
}

.tfvNormal{
	background-color: #FFFFFF;
}

<style type="text/css">

#picturearea{
filter:alpha(opacity=100);
-moz-opacity: 0;
}

<!-- Change path below to point to "getpics.php" on your server -->
<script src="getpics.php" type="text/javascript"></script>

<script type="text/javascript">

<!-- Dynamic PHP Picture Viewer (v1.0)- By JavaScriptKit.com (http://www.javascriptkit.com) //--->
<!-- For this and over 400+ free scripts, visit JavaScript Kit- http://www.javascriptkit.com/ //--->
<!-- This notice must stay intact for use //--->

function populateSelect(selectobj){
for (var i=0; i<picsarray.length; i++)
selectobj.options[selectobj.options.length]=new Option(picsarray[i], picsarray[i])
if (selectobj.options.length>1){
selectobj.selectedIndex=0
showpicture(document.getElementById("picsform").picslist)
}


function showpicture(selectobj){
piccontainerobj=document.getElementById("picturearea")
resetfade(10)
piccontainerobj.innerHTML='<img src="'+locationstring+selectobj.options[selectobj.selectedIndex].value+'">'
fadepictoview=setInterval("gradualfade(piccontainerobj)",50)
}

function resetfade(degree){
if (window.fadepictoview)
clearInterval(fadepictoview)
if (typeof piccontainerobj.style.MozOpacity=="string")
piccontainerobj.style.MozOpacity=degree/100
else if (piccontainerobj.filters)
piccontainerobj.filters.alpha.opacity=degree
}

function gradualfade(){
if (typeof piccontainerobj.style.MozOpacity=="string" && piccontainerobj.style.MozOpacity<1)
piccontainerobj.style.MozOpacity=Math.min(parseFloat(piccontainerobj.style.MozOpacity)+0.2, 0.99)
else if (piccontainerobj.filters && piccontainerobj.filters.alpha.opacity<100)
piccontainerobj.filters.alpha.opacity+=20
else //if not IE or Moz
clearInterval(fadepictoview)
}

window.onload=function(){
populateSelect(document.getElementById("picsform").picslist)
}

</script>