	var effectStarted = false;
	
	function setActiveItem(obj, url)
	{
		if (obj.style.display == 'none' && effectStarted == false)
		{
			effectStarted = true;
			
			var el1 = $('selected');
			var el2 = obj;
			
			el1.id = '';
			el2.previous().id = 'selected';
				
			effect = new Effect.Parallel([
				Effect.SlideUp(el1.next(), {sync: true}),
				Effect.SlideDown(el2, {sync: true})
			], { duration: 0.5,
				afterFinish: function() {
					effectStarted = false;
				}
			});
		}
		else
			document.location.href = url;
	}
	
	function colorFade(target,element,start,end,steps,speed) {
	  var startrgb,endrgb,er,eg,eb,step,rint,gint,bint,step;
	  //var target = document.getElementById(id);
	  steps = steps || 20;
	  speed = speed || 20;
	  clearInterval(target.timer);
	  endrgb = colorConv(end);
	  er = endrgb[0];
	  eg = endrgb[1];
	  eb = endrgb[2];
	  if(!target.r) {
		startrgb = colorConv(start);
		r = startrgb[0];
		g = startrgb[1];
		b = startrgb[2];
		target.r = r;
		target.g = g;
		target.b = b;
	  }
	  rint = Math.round(Math.abs(target.r-er)/steps);
	  gint = Math.round(Math.abs(target.g-eg)/steps);
	  bint = Math.round(Math.abs(target.b-eb)/steps);
	  if(rint == 0) { rint = 1 }
	  if(gint == 0) { gint = 1 }
	  if(bint == 0) { bint = 1 }
	  target.step = 1;
	  target.timer = setInterval( function() { animateColor(target,element,steps,er,eg,eb,rint,gint,bint) }, speed);
	}

	// incrementally close the gap between the two colors //
	function animateColor(target,element,steps,er,eg,eb,rint,gint,bint) {
	  //var target = document.getElementById(id);
	  var color;
	  if(target.step <= steps) {
		var r = target.r;
		var g = target.g;
		var b = target.b;
		if(r >= er) {
		  r = r - rint;
		} else {
		  r = parseInt(r) + parseInt(rint);
		}
		if(g >= eg) {
		  g = g - gint;
		} else {
		  g = parseInt(g) + parseInt(gint);
		}
		if(b >= eb) {
		  b = b - bint;
		} else {
		  b = parseInt(b) + parseInt(bint);
		}
		color = 'rgb(' + r + ',' + g + ',' + b + ')';
		if(element == 'background') {
		  target.style.backgroundColor = color;
		} else if(element == 'border') {
		  target.style.borderColor = color;
		} else {
		  target.style.color = color;
		}
		target.r = r;
		target.g = g;
		target.b = b;
		target.step = target.step + 1;
	  } else {
		clearInterval(target.timer);
		color = 'rgb(' + er + ',' + eg + ',' + eb + ')';
		if(element == 'background') {
		  target.style.backgroundColor = color;
		} else if(element == 'border') {
		  target.style.borderColor = color;
		} else {
		  target.style.color = color;
		}
	  }
	}

	// convert the color to rgb from hex //
	function colorConv(color) {
	  var rgb = [parseInt(color.substring(0,2),16), 
		parseInt(color.substring(2,4),16), 
		parseInt(color.substring(4,6),16)];
	  return rgb;
	}

				// begin ---- knopeffect
	function slowhigh(which2, base)
	{
		imgobj = which2
		instantset(base)
		highlighting = setInterval("gradualfade(imgobj)", 30)
	}

	function slowlow(which2, base)
	{
		cleartimer()
		instantset(base)
	}

	function instantset(degree)
	{
			imgobj.style.MozOpacity = degree / 100
			//imgobj.filters.alpha.opacity = degree
			//imgobj.style.opacity = degree / 100
	}

	function cleartimer()
	{
		if (window.highlighting) clearInterval(highlighting)
	}

	function gradualfade(cur2)
	{
		if (cur2.style.MozOpacity < 1)
			cur2.style.MozOpacity = Math.min(parseFloat(cur2.style.MozOpacity) + 0.1, 0.99)
	}
	// eind ---- knopeffect

	function fadecolor(li, dir, cf, ct)
	{
		if (dir == 'over')
			colorFade(li,'color',cf,ct,5,15)
		else
			colorFade(li,'color',cf,ct,15,40)
	}
	
	var arVersion = navigator.appVersion.split("MSIE")
	var version = parseFloat(arVersion[1])

	function fixPNG(myImage) 
	{
		if ((version >= 5.5) && (version < 7) && (document.body.filters)) 
		{
		   var imgID = (myImage.id) ? "id='" + myImage.id + "' " : ""
		   var imgClass = (myImage.className) ? "class='" + myImage.className + "' " : ""
		   var imgTitle = (myImage.title) ? 
						 "title='" + myImage.title  + "' " : "title='" + myImage.alt + "' "
		   var imgStyle = "display:inline-block;" + myImage.style.cssText
		   var strNewHTML = "<span " + imgID + imgClass + imgTitle
					  + " style=\"" + "width:" + myImage.width 
					  + "px; height:" + myImage.height 
					  + "px;" + imgStyle + ";"
					  + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
					  + "(src=\'" + myImage.src + "\', sizingMethod='scale');\"></span>"
		   myImage.outerHTML = strNewHTML	  
		}
	}
	
	var fadenr = -1;
	// mouseover
	function fadeOver(nr, obj)
	{
		if (fadenr != nr)
		{
			// effect is al eens gebruikt
			if (typeof(effecten[nr]) == 'object')
				effecten[nr].cancel();
			
			// opacity bekijken
			if(obj.getStyle('opacity') == 1)
				obj.setOpacity(0);
			
			obj.style.zIndex = 2;
				
			//effect (weer) activeren
			effecten[nr] = new Effect.Appear(obj, {duration:1, from:0, to:1});
			
			//het vorige appeareffect ophalen en laten faden (indien aanwezig)
			if(fadenr >= 0)
			{
				// dit moet eigenlijk nu altijd wel
				if (typeof(effecten[fadenr]) == 'object')
				{
					effecten[fadenr].cancel();
					effecten[fadenr] = new Effect.Fade(effecten[fadenr].element, {duration:0.5, from:(effecten[fadenr].element.getStyle('opacity')), to:0});
				}
			}
			fadenr = nr;
		}
	}
	
	function showStyleImage(nr)
	{
		blnNextStyle = true;
		
		if (nr == 'prev')
		{	
			if(curImage > 0)
				nr = curImage-1;
			else
				blnNextStyle = false;
		}
		
		if (nr == 'next')
		{
			if (curImage < maxImage)
				nr = curImage+1;
			else
				blnNextStyle = false;
		}
		
		if (blnNextStyle)
		{
			$('stylebox' + curImage).removeClassName('display');
			$('nav'+curImage).removeClassName('selected');
			curImage = nr;
			$('nav'+curImage).addClassName('selected');
			$('stylebox' + curImage).addClassName('display');
		}
	}
	
	function scrollStyles(page)
	{
		if (!blnScrollStyles)
		{
			var dir = 1;
			blnScrollStyles = true;
			
			if (page == 'prev')
			{	
				if(curPage > 0)
					page = curPage-1;
				else
					blnScrollStyles = false;
			}
			
			if (page == 'next')
			{
				if (curPage < maxPage)
					page = curPage+1;
				else
					blnScrollStyles = false;
			}
			
			if (blnScrollStyles)
			{
				if (page > curPage)
					dir = dir * -1
					
				if (page != curPage)
				{
					scrollStyleEffect = new Effect.Move($('stylesWrapper'),{
						x:dir*Math.abs(page-curPage)*975,
						y:0,
						duration: 0.5,
						mode: 'relative',
						afterFinish: function() {
							blnScrollStyles = false;
							$('nav'+curPage).removeClassName('selected');
							$('nav'+page).addClassName('selected');
							curPage = page;
						}
					});
				}
			}
		}
	}