//Style last item in tabs list
$(document).ready(function(){
	
	//Open all links with rel="external" in new window
	$('a[rel="external"]').click( function() {
        window.open( $(this).attr('href') );
        return false;
    });

	$('#tab_2').hide();
	$('h3.product_overview a').parent().addClass('selected');
	
	$('h3.product_overview a').click(function() {
		$(this).parent().addClass('selected');
		$('h3.product_specification a').parent().removeClass('selected');
		$('#tab_1').show();						 	
		$('#tab_2').hide();
		return false;
	});
	$('h3.product_specification a').click(function() {
		$(this).parent().addClass('selected');
		$('h3.product_overview a').parent().removeClass('selected');							   
		$('#tab_2').show();						 	
		$('#tab_1').hide();	
		return false;
	});


	// carousel stuff here
	$("#carousel_ul li:first").before($("#carousel_ul li:last")); 
  
	$("#right_scroll img").click(function()
		{
		var item_width = $("#carousel_ul li").outerWidth() + 10;	  
		var left_indent = parseInt($("#carousel_ul").css("left")) - item_width;
		
		$("#carousel_ul:not(:animated)").animate({"left" : left_indent},500,function()
		{    
			$("#carousel_ul li:last").after($("#carousel_ul li:first")); 
			$("#carousel_ul").css({"left" : "-210px"});
		}); 
	});
        
	//when user clicks the image for sliding left
	$("#left_scroll img").click(function(){
		
		var item_width = $("#carousel_ul li").outerWidth() + 10;
		
		/* same as for sliding right except that it"s current left indent + the item width (for the sliding right it"s - item_width) */
		var left_indent = parseInt($("#carousel_ul").css("left")) + item_width;
		
		$("#carousel_ul:not(:animated)").animate({"left" : left_indent},500,function(){    
		
		/* when sliding to left we are moving the last item before the first list item */            
		$("#carousel_ul li:first").before($("#carousel_ul li:last")); 
		
		/* and again, when we make that change we are setting the left indent of our unordered list to the default -210px */
		$("#carousel_ul").css({"left" : "-210px"});
		});

	});

// big target here

	$("ol.bigTarget p a").bigTarget();

});// this is the end!

