function onAppear(first_image, second_image){		
		//document.getElementById('output').innerHTML += first_image +' '+ second_image +'<hr>';
		
		//swap the images so that the one that has been faded in is in the outer div
		//and the next one to be faded in is waiting in the invisible inner div...
		$("outer-appear").style.background = 'url('+first_image+')';
		$("outer-appear").style.backgroundRepeat = 'no-repeat';
		$("outer-appear").style.backgroundColor = '#EFEFEF';
		$("outer-appear").style.backgroundPosition = 'bottom center';

		$("appear-div").style.display = 'none';
		$("appear-div").style.background = 'url('+second_image+')';
		$("appear-div").style.backgroundRepeat = 'no-repeat';	
		$("appear-div").style.backgroundColor = '#EFEFEF';
		$("appear-div").style.backgroundPosition = 'bottom center';
	}
	
	function Appear(pic_one_id, pic_two_id){
		var one_id, two_id;
		
		//fade in the first time..
		new Effect.Appear('appear-div');
		
		//pic one becomes pic two, the one that has been morphed to...
		one_id = pic_two_id;
				
		//if we have come to end of pics array, start from start again...
		if(pic_two_id == pics_array.length-1)
			two_id = 0;
		else
			two_id = pic_two_id+1;
		
		//document.getElementById('output').innerHTML += one_id +' '+ two_id +'<br>';
			
		//get the pics to pass to onAppear...
		pic_one = pics_array[one_id];
		pic_two = pics_array[two_id];
		
		//document.getElementById('output').innerHTML += pic_one.src +' '+ pic_two.src +'<br>';

		setTimeout("onAppear('"+pic_one.src+"', '"+pic_two.src+"')", 9000);
		setTimeout("Appear("+one_id+", "+two_id+")", 10000);		
		
	}