function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt)
{
    // The index() method calculates the index from a
    // given index who is out of the actual item range.
    var idx = carousel.index(i, mycarousel_itemList.length);
    carousel.add(i, mycarousel_getItemHTML(mycarousel_itemList[idx - 1]));

	$(".carouselItem").hover(function() {
		
		$(".carouselItem").click(function() {
			window.location = $('.image',this).children(':first').attr('href');
		});
		
		$('.bg', this).stop();
		$('.title', this).stop();
		$('.text', this).stop();
		$(this).parent().parent().parent().parent().children(":first").stop();
		$(this).parent().parent().parent().parent().children(":first").next().stop();
		
		//$(this).parent().parent().parent().css('z-index', 10);
		//$(this).parent().parent().parent().parent().children(":first").css('left', '-8');
		
		$(this).parent().parent().parent().parent().children(":first").animate({
			left: '-7px'
		}, 200);
		
		$(this).parent().parent().parent().parent().children(":first").next().animate({
			right: '-7px'
		}, 200);
		
		$('.bg', this).animate({
			height: 18 + $('.title', this).height() + $('.text', this).height() + 'px'
		}, 200);

		$('.title', this).animate({
			top: 150 - 10 - $('.title', this).height() - $('.text', this).height() + 'px'
		}, 200);
		
		$('.text', this).animate({
			top: 150 - 6 - $('.text', this).height() + 'px'
		}, 200);

		} , function() {
		$('.bg', this).stop();
		$('.title', this).stop();
		$('.text', this).stop();
		$(this).parent().parent().parent().parent().children(":first").stop();
		$(this).parent().parent().parent().parent().children(":first").next().stop();
		
		//$(this).parent().parent().parent().css('z-index', 1);
		$(this).parent().parent().parent().parent().children(":first").animate({
			left: '3px'
		}, 200);
		
		$(this).parent().parent().parent().parent().children(":first").next().animate({
			right: '3px'
		}, 200);
		
		$('.bg', this).animate({
			height: '28px'
		}, 200);
		
		$('.title', this).animate({
			top: '130px'
		}, 200);
		
		$('.text', this).animate({
			top: '150px'
		}, 200);
	});
	
	
};

function mycarousel_itemVisibleOutCallback(carousel, item, i, state, evt)
{
    carousel.remove(i);
};

/**
 * Item html creation helper.
 */
function mycarousel_getItemHTML(item)
{
    return '<div class="carouselItem"><div class="spot"><div class="title">' + item.title + '</div><div class="text">' + item.text + '</div><div class="bg" style="background-color:' + item.bgcolor + '"></div></spot><div class="image"><a href="' + item.href + '"><img src="' + item.image + '" width="230" height="150" border="0"/></a></div></div>';
};