$(function () { 
  $('#showcase img:first').fadeIn(1000, function() { 
  	$container = $("#showcase").cycle({
    	pager : '#nav',
			pagerAnchorBuilder: pagerFactory,            
    	next : ".next",
    	prev : ".previous",
    	cssBefore: "",
    	easing : 'easeOutCubic',
    	speed : '700',
    	timeout : '6500',
    	after : afterFunction,
    	fx : 'fade',
    	height: '476px',
    	fit : '1',
    	slideExpr : '',
    	cleartype: !$.support.opacity    
    });
  
    
   function pagerFactory(idx, slide) {  // cycle() native functionality here    
     return '<li><a class="nav-dot"></a></li>'; 
    
   };            
   function afterFunction(currSlideElement, nextSlideElement, options, forwardFlag) {  
   	var index = options.currSlide;
		options.direction = 'left';
   	$('#showcase .content-tab-content').css('opacity','0').eq(index).animate({  // to have the tab fade in as soon as stage fade is finished.
   		opacity: 1
   	}, 250);
   	
   }
               


	});
		
	$('#hover-left, #hover-right, .nav-dot, .right-arrow, .left-arrow').bind('click',function(){   // for the "blinking" when clicked
		$(this).css({ // for the "blinking" when clicked
			opacity : '0',
			filter : ''
		},0).delay(125).css({
			opacity : '1',
			filter : ''
		
		},0)
		$('#showcase').cycle('pause');
	})
	
	$('#hover-area-left, #hover-area-right').bind('click',function(){   // for the "blinking" when clicked
		$(this).children().animate({ // for the "blinking" when clicked
			opacity : '0',
			filter : ''
			
		},0).delay(125).animate({
			opacity : '1',
			filter : ''
			
		
		},0)
	})
   
  $('#hover-area-left').hover(function() {
  	$('#hover-left').css({
  		'opacity' : '1',
  		'filter' : '',
  		'display' : 'block'
  	}, 0);
 	
  
  
  }, function() {

  	$('#hover-left').animate({
  		'opacity' : '0',
  		'filter' : ''
  	}, 150, function() {
  		$(this).css('display','none')
  	});            
  
  }); 
  
             	
  $('#hover-area-right').hover(function() {
  	$('#hover-right').css({
  		'opacity' : '1',
  		'filter' : '',
  		'display' : 'block'
  	}, 0);
 	
  
  
  }, function() {

  	$('#hover-right').animate({
  		'opacity' : '0',
  		'filter' : ''
  	}, 150, function() {
  		$(this).css('display','none')
  	});            
  
  });  
   

   
   
});