function loadComp(){
	$("#mainBox").fadeIn("slow");
	$('.loading').hide();
	slideImg(1);
	slideImg(2);
	slideImg(3);
	slideImg(4);
}

var imgs = new Array();
function slideImg(num){
	var selector = ".box" + num + "  li ";
	imgs[num] = new Array();
	$(selector).each(function(i){
		imgs[num][i] = $(this);
		var w = $(this).width();
		var h = $(this).height();
	});
	switch(num){
		case 1:
		 setTimeout("a1()", 100);
		 clearTimeout();
		break;
		
		case 2:
		 setTimeout("a2()", 200);
		 clearTimeout();
		break;
		
		case 3:
		 setTimeout("a3()", 300);
		 clearTimeout();
		break;
		
		case 4:
		 setTimeout("a4()", 400);
		 clearTimeout();
		break;
	}
}
function a1(){setInterval('slideLtoR()', 4000 );}
function a2(){setInterval('slideDown()', 4000 );}
function a3(){setInterval('slideRtoL()', 4000 );}
function a4(){setInterval('slideUp()', 4000 );}

var currentNum1 = 1;
var zNum1 = 1;
function slideLtoR(){
	if(currentNum1 == 3){
		currentNum1 = 0;
	}else{
		currentNum1 += 1;
	}
	zNum1 += 1;
	//alert(imgs[1][currentNum1]);
	$(imgs[1][currentNum1]).css("z-index", zNum1);
	$(imgs[1][currentNum1]).css("left", $(this).width());
	$(imgs[1][currentNum1]).css("top", "0px");
	$(imgs[1][currentNum1]).animate({left: 0}, {easing:  "easeInOutExpo",queue:false, duration:2000});
	//alert(currentNum1);
}
var currentNum2 = 1;
var zNum2 = 1;
function slideDown(){
	if(currentNum2 == 3){
		currentNum2 = 0;
	}else{
		currentNum2 += 1;
	}
	zNum2 += 1;
	//alert(imgs[2][currentNum2]);
	$(imgs[2][currentNum2]).css("z-index", zNum2);
	$(imgs[2][currentNum2]).css("left", 0);
	$(imgs[2][currentNum2]).css("top", -$(this).height());
	$(imgs[2][currentNum2]).animate({top: 0}, {easing:  "easeInOutExpo",queue:false, duration:2000});
}
var currentNum3 = 1;
var zNum3 = 1;
function slideUp(){
	if(currentNum3 == 3){
		currentNum3 = 0;
	}else{
		currentNum3 += 1;
	}
	zNum3 += 1;
	//alert(imgs[3][currentNum3]);
	$(imgs[3][currentNum3]).css("z-index", zNum2);
	$(imgs[3][currentNum3]).css("left", 0);
	$(imgs[3][currentNum3]).css("top", $(this).height());
	$(imgs[3][currentNum3]).animate({top: 0}, {easing:  "easeInOutExpo",queue:false, duration:2000});
}
var currentNum4 = 1;
var zNum4 = 1;
function slideRtoL(){
	if(currentNum4 == 3){
		currentNum4 = 0;
	}else{
		currentNum4 += 1;
	}
	zNum4 += 1;
	//alert(imgs[4][currentNum4]);
	$(imgs[4][currentNum4]).css("z-index", zNum2);
	$(imgs[4][currentNum4]).css("left", -$(this).width());
	$(imgs[4][currentNum4]).css("top", 0);
	$(imgs[4][currentNum4]).animate({left: 0}, {easing:  "easeInOutExpo",queue:false, duration:2000});
}