  // array of images 
  var imgs = new Array(3); 
    imgs[0] = "images/nav0_01.png"; 
    imgs[1] = "images/nav1_01.png";
    imgs[2] = "images/nav0_02.png"; 
    imgs[3] = "images/nav1_02.png"; 
    imgs[4] = "images/nav0_03.png"; 
    imgs[5] = "images/nav1_03.png"; 
    imgs[6] = "images/nav0_04.png"; 
    imgs[7] = "images/nav1_04.png"; 
    imgs[8] = "images/nav0_05.png"; 
    imgs[9] = "images/nav1_05.png"; 
    imgs[10] = "images/nav0_06.png"; 
    imgs[11] = "images/nav1_06.png"; 
    imgs[12] = "images/nav0_07.png"; 
    imgs[13] = "images/nav1_07.png"; 
    imgs[14] = "images/nav0_08.png"; 
    imgs[15] = "images/nav1_08.png"; 
      
  
  // preload the images 
  function preload() { 
   var tmp = null; 
   for (var j = 0; j < imgs.length; j++) { 
     tmp = imgs[j]; 
     imgs[j] = new Image(); 
     imgs[j].src = tmp; 
   } 
  } 
  void(preload()); 
  
  // swap images 
  function imgSwap(img, swap) { 
   img.src = imgs[swap].src; 
  } 

function opacity(id, opacStart, opacEnd, millisec) {
	//speed for each frame
	var speed = Math.round(millisec / 100);
	var timer = 0;

	//determine the direction for the blending, if start and end are the same nothing happens
	if(opacStart > opacEnd) {
		for(i = opacStart; i >= opacEnd; i--) {
			setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
			timer++;
		}
	} else if(opacStart < opacEnd) {
		for(i = opacStart; i <= opacEnd; i++)
			{
			setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed));
			timer++;
		}
	}
}

//change the opacity for different browsers
function changeOpac(opacity, id) {
    var object = document.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
}

function shiftOpacity(id, millisec) {
	//if an element is invisible, make it visible, else make it ivisible
	if(document.getElementById(id).style.opacity == 0) {
		opacity(id, 0, 100, millisec);
	} else {
		opacity(id, 100, 0, millisec);
	}
}

function blendimage(divid, imageid, imagefile, millisec) {

    var speed = Math.round(millisec / 100);
    var timer = 0;
    
    //set the current image as background
    document.getElementById(divid).style.backgroundImage = document.getElementById(imageid).style.backgroundImage;
    
    //make image transparent
    changeOpac(0, imageid);
    
    //make new image
    document.getElementById(imageid).style.backgroundImage = "url("+imagefile+")";
    

    //fade in image
    for(i = 0; i <= 100; i++) {
       setTimeout("changeOpac(" + i + ",'" + imageid + "')",(timer * speed));
       timer++;
    }
} 

function currentOpac(id, opacEnd, millisec) {
	//standard opacity is 100
	var currentOpac = 100;
	
	//if the element has an opacity set, get it
	if(document.getElementById(id).style.opacity < 100) {
		currentOpac = document.getElementById(id).style.opacity * 100;
	}

	//call for the function that changes the opacity
	opacity(id, currentOpac, opacEnd, millisec);
}

var scrollBarHeight = 248;
var contentPaneHeight = 248;
var scrollFaceHeight = 9;
var diffX, diffY, theElement, eventVar;
var contentHeight;
var contentMargin = 0;
var current;
var speed = 2;
var movedownvar, moveupvar;
var currentSubnav;

function linkTab(id)
{
	this.id = id;
	this.bgy = -35;
	this.timer;
	this.over = function() {
		if (this.bgy+5 <= 0)
		{
			this.bgy = this.bgy + 5;
			document.getElementById(this.id+"Link").style.backgroundPosition = "0px "+this.bgy+"px";
			this.timer = setTimeout(this.id+".over()", 50);
		}
		else {clearTimeout(this.timer);}
	}
	
	this.out = function() {
		if (this.bgy-5 >= -35)
		{
			this.bgy = this.bgy - 5;
			document.getElementById(this.id+"Link").style.backgroundPosition = "0px "+this.bgy+"px";
			this.timer = setTimeout(this.id+".out()", 50);
		}
		else {clearTimeout(this.timer);}
	}
}

var proposition = new linkTab('proposition');
var home = new linkTab('home');
var portfolio = new linkTab('portfolio');
var products = new linkTab('products');
var team = new linkTab('team');
var news = new linkTab('news');
var contact = new linkTab('contact');
var client = new linkTab('client');



function mouseOverLink(tab)
{
	clearTimeout(tab.timer);
	tab.over();
}

function mouseOutLink(tab)
{
	clearTimeout(tab.timer);
	tab.out();
}

function scrollDrag(event)
{
	eventVar = event;
	theElement = document.getElementById('scrollFace');//event.currentTarget;
	var posX = parseInt(theElement.style.left);
	var posY = parseInt(theElement.style.top);
	
	diffX =eventVar.clientX - posX;
	diffY =eventVar.clientY - posY;
	
	document.onmousemove = mover;
	document.onmouseup = dropper;
	
	try{event.stopPropagation();}
	catch(e){}
	try {event.preventDefault();}
	catch(e){}
	
}

function mover(event)
{
	//theElement.style.left = (event.clientX - diffX) + "px";
	try{event.clientY}
	catch(e){event = eventVar}
	
	if (event.clientY-diffY <= 0)
	{
		theElement.style.top = "0px";
		document.getElementById('content').style.top = "0px";
	}
	else if(event.clientY-diffY >= scrollBarHeight-scrollFaceHeight)
	{
		theElement.style.top = scrollBarHeight - scrollFaceHeight + "px";
		document.getElementById('content').style.top = -(contentHeight-contentPaneHeight)+"px";
	}
	else 
	{
		theElement.style.top = (event.clientY - diffY) + "px";
		document.getElementById('content').style.top = - (contentHeight-contentPaneHeight) * ((event.clientY - diffY) / scrollBarHeight) +"px";
	}
	
	try{eventVar.stopPropagation();}
	catch(e){}
}

function dropper(event) 
{
	document.onmousemove = null;
	document.onmouseup = null;
	try{eventVar.stopPropagation();}
	catch(e){}
}

function movedown(){
if (parseInt(document.getElementById("content").style.top)-speed >= -1*(contentHeight-contentPaneHeight))
{
	document.getElementById('content').style.top = parseInt(document.getElementById("content").style.top)-speed +"px";
	document.getElementById("scrollFace").style.top = Math.abs(parseInt(document.getElementById("content").style.top))*((scrollBarHeight-scrollFaceHeight)/(contentHeight-contentPaneHeight))+"px";
}
movedownvar=setTimeout("movedown()",20);
}

function moveup(){
if (parseInt(document.getElementById("content").style.top) < 0)
{
	document.getElementById('content').style.top = parseInt(document.getElementById("content").style.top)+speed +"px";
	document.getElementById("scrollFace").style.top = Math.abs(parseInt(document.getElementById("content").style.top))*((scrollBarHeight-scrollFaceHeight)/(contentHeight-contentPaneHeight))+"px";
}
moveupvar=setTimeout("moveup()",20);
}
	
function onScrollWheel()
{
	var wheelDelta = (e.wheelDelta)?e.wheelDelta*((!!window.opera)?-1:1) : e.detail*-1;
	if (wheelDelta < 0)
	{ 
		moveup();
	}
	else
	{ 
		movedown();
	}
	// optionally you can stop propagation of the event
	Event.stop(e); 
	return false;
}


function getHeight()
{		
	contentHeight = document.getElementById('content').offsetHeight;
	document.getElementById('content').style.top = "0px";
	document.getElementById("scrollFace").style.top = "0px";
	
	if (contentHeight > contentPaneHeight)
	{
		//scrollFaceHeight = (contentPaneHeight/contentHeight)*scrollBarHeight;
		//document.getElementById('scrollFace').style.height = scrollFaceHeight+"px";
		contentHeight += contentMargin*2;
		document.getElementById('scrollBar').style.visibility = "visible";
	}
	else
		document.getElementById('scrollBar').style.visibility = "hidden";

	//Event.observe(document, "mousewheel", onScrollWheel);//Interner Explorer
	//Event.observe(window, "DOMMouseScroll", onScrollWheel);//FireFox
	//Event.observe(window, "mousewheel", onScrollWheel);//Safari and Opera
		
}

var subClicked = "";

function getSubsection(sectionName, subsectionNum) 
{
	if (sectionName == "team")
		document.getElementById('content').innerHTML = teamHTML[subsectionNum];
	else if (sectionName == "products")
		document.getElementById('content').innerHTML = productsHTML[subsectionNum];

	if (subClicked != "")
	{
		try{document.getElementById(subClicked).style.color = "";}
		catch(e) {}
	}
	subClicked = sectionName+subsectionNum;
	document.getElementById(subClicked).style.color = "white";
	getHeight();
	document.getElementById('content').style.top = "0px";
	if (theElement) {theElement.style.top = "0px";}
}

function getSection(sectionName)
{
	changeOpac(0, 'scrollContentHolder');
	

	clearInterval(topMid.interval);
	clearInterval(topRight.interval);
	
	topLeft.changePic();
	topMid.interval = setInterval("topMid.changePic()", 140);
	topRight.interval = setInterval("topRight.changePic()", 260);
	
	if (sectionName == "team" || sectionName == "products")
	{
		document.getElementById('bottomLinks').style.display = "inline";
		if (sectionName == "team")
		{
			document.getElementById('bottomLinks').innerHTML = document.getElementById(sectionName+'SalesLinks').innerHTML;
			document.getElementById('teamSales').style.color = "white";
			currentSubnav = "teamSales";
		}
		if (sectionName == "products")
			document.getElementById('bottomLinks').innerHTML = document.getElementById(sectionName+'Links').innerHTML;
		getSubsection(sectionName, 0);
	}
	else
		document.getElementById('bottomLinks').style.display = "none";
	
	document.getElementById('contentHeader').innerHTML = document.getElementById('section' + sectionName).childNodes[0].innerHTML;
	document.getElementById('content').innerHTML = document.getElementById('section' + sectionName).childNodes[1].innerHTML;
	getHeight();
	document.getElementById(current+"Link").style.backgroundColor = "transparent";
	current = sectionName;
	document.getElementById(current+"Link").style.backgroundColor = "#88a0c2";
	document.getElementById('content').style.top = "0px";
	if (theElement) {theElement.style.top = "0px";}
	shiftOpacity('scrollContentHolder', 500);
}

function changeSubnav(section, sub)
{
	document.getElementById(currentSubnav).style.color = "";
	document.getElementById(section+sub).style.color = "white";
	currentSubnav = section+sub;
	document.getElementById('bottomLinks').innerHTML = document.getElementById(section+sub+'Links').innerHTML;
	
	subsectionNum = document.getElementById(section+sub+"Links").childNodes[0].id.replace(/\D/g,'');
	getSubsection(section, subsectionNum);
}

function randOrd(){
return (Math.round(Math.random())-0.5); }

var topPictures = new Array();
for (i = 0; i <= 19; i++)
{
	if (i<10)
		topPictures[i] = "top0"+i+".jpg";
	else
		topPictures[i] = "top"+i+".jpg";
}

topPictures.sort(randOrd);

function bannerPic(id, num)
{
	this.id = id;
	this.interval;
	this.position = num;
	this.offsetNumber = num;
	this.current = ""; //url of picture in use
	this.changePic = function (){
		
		clearInterval(this.interval);
		if (this.position+3 <= 19)
			this.position = this.position+3;
		else
			this.position = this.offsetNumber;
			
		blendimage("top"+this.offsetNumber, this.id, "images/"+topPictures[this.position], 1000);
		this.current = "images/"+topPictures[this.position];
	}
}

var topLeft, topMid, topRight;

function loadPage(sec)
{
	topLeft = new bannerPic('topLeft', 0);
	topMid = new bannerPic('topMid', 1);
	topRight = new bannerPic('topRight', 2);
	if(!sec)
		current = "home";
	else
		current = sec;
	getSection(current);
	getHeight();
}