$(document).ready(function(){
		
		//controla quando a classe sera mudada
		var x = 0;
		
		//opcoes para o cyrcle
		var cyrcleOptions = {
			
			fx: 'scrollHorz',
			speed: 'slow',
			timeout: 8000,
			next:   '#next', 
            prev:   '#prev',
			//mudando as setas vermelhas nas imagens pequenas
			before: function(curr, next, opts) {
				//faco pois na primeira vez o plugin erra qual elemento deve mudar
				if(x > 0)
				{
				     var index = opts.nextSlide;
				     //volta todo mundo para o normal
				     $(".image_thumb ul li").removeClass("active");
				     //adiciona a classe
				     $(".image_thumb ul li").eq(index).addClass("active");
				}
				
				x++;
			}
		};
		
		//inciando o plugin 
		$('#bordas').cycle(cyrcleOptions);
			
			
		//ao clicar na li entao vamos a imagem e texto correspondente
		$('.image_thumb ul li').click(function(event) { 
		   //previne que va p/a imagem
		   event.preventDefault();
           //manda para a imagem correspondente
		   $('#bordas').cycle($(this).index());  
           return false;  
        }); 
						   
						   
});
