$(document).ready(function () {

	// Add navigation animations
	
	// Adjust portfolio CSS as javascript is enabled (don't need fallback styles anymore)
	$('body:has(#portfolio)').css({backgroundColor: '#c89043', backgroundPosition: 'top'});
	$('#portfolio .panel').css({height: '300px'});
	$('#portfolio .item .extended').css({top: '0'});
	
	// Hide all item extended text, show overviews
	$('#portfolio .item .extended').hide();
	$('#portfolio .item .overview').show();
	
	// Add next/previous buttons to portfolio (add them after footer for IE)
	if ($('body:has(#portfolio)').length > 0) {
		$('#footer')
			.after('<a id="previous" class="scrollButton" href="">Previous</a>')
			.after('<a id="next" class="scrollButton" href="">Next</a>');
	}
	
	// Setup carousel
	$('#portfolio > div').jCarouselLite({
        btnNext: '#next',
        btnPrev: '#previous',
        scroll: 1,
        visible: 1,
        circular: true,
        easing: 'swing',
        speed: 400
    });
    
    // Add navigation links to portfolio items (has to be done after carousel setup)
	$('#portfolio .item .overview').append('<a class="details" href="">View Details</a>');
	$('#portfolio .item .extended').append('<p><a class="back" href="">Back To Portfolio</a></p>');
	$('#portfolio .item').each(function(index) {
		$(this).find('.extended').addClass('extended' + index);
		$(this).find('.overview a.details').click(function() {
			$('.scrollButton').fadeOut();
			$('#portfolio .overview').hide();
			$('#portfolio .extended' + index).fadeIn();
			return false;
		});
		$(this).find('.extended a.back').click(function() {
			$('.scrollButton').fadeIn();
			$('#portfolio .extended' + index).hide();
			$('#portfolio .overview').fadeIn();
			return false;
		});
	});
});