jQuery.noConflict();

jQuery(document).ready(function(){
    
   
   if (jQuery('.slides').length > 3){
	jQuery('.slider').css('display','block');
   }
	
   
    jQuery('.slides').each(function(){
        
        jQuery(this).width(jQuery(this).children('a').children('img').width());
        
    })
   
   jQuery('.slides').first().next().addClass('active');
   
   jQuery('.slides.active').each(function(){
        
        jQuery(this).width(jQuery(this).children('a').children('img').width());
        
    })
   jQuery('.slides').last().insertBefore('.slides:first');
   //jQuery('.slides').last().insertBefore('.slides:first');
  //  jQuery('.slides').last().insertBefore('.slides:first');
   var left = jQuery('.slides').first().width();
   
   jQuery('.slider_inside').offset({left:-left}) ;

   


 
   
   jQuery('.right_arr_slider').click(function(){
       
       jQuery('.slides').each(function(){
        
        jQuery(this).width(jQuery(this).children('a').children('img').width());
        
       })
       
       jQuery('.slides.active').each(function(){
        
        jQuery(this).width(jQuery(this).children('a').children('img').width());
        
       })
       
       jQuery('.slides').stop(true, true);
       jQuery('.slides').last().css('display','none').insertBefore('.slides:first');

       jQuery('.active').prev().addClass('render');
   
    


       jQuery('.render').animate({

                top:'30px',
                
                height:'220px',
                width:'+=50px'

           }, 1000, function(){

               jQuery(this).addClass('active');
               jQuery(this).removeClass('render');

       }).css('overflow', 'visible');
       
       jQuery('.render img').animate({

                
                
                height:'220px',
                width:'+=50px'

           }, 1000);
           
       jQuery('.slides.active img').animate({
           
            
            
            height:'180px',
            width:'-=50px'
           
          }, 1000);    

      
       jQuery('.slides.active').animate({
           
            top:'70px',
            
            height:'180px',
            width:'-=50px'
           
          }, 1000, function(){
           
                jQuery(this).removeClass('active');
           
       }).css('overflow', 'visible');
       
      jQuery('.slider_inside').animate({
           
              left:-jQuery('.slides').first().width()-75
       })
      
      jQuery('.slides').show(1000);
      
   })
   
   jQuery('.left_arr_slider').click(function(){
       
        jQuery('.slides').each(function(){
        
        jQuery(this).width(jQuery(this).children('a').children('img').width());
        
       })
       
       jQuery('.slides.active').each(function(){
        
        jQuery(this).width(jQuery(this).children('a').children('img').width());
        
       })
       
       
       
       jQuery('.slides').stop(true, true);
       jQuery('.slides').first().hide(1000,function(){
           
           jQuery(this).insertAfter('.slides:last').show();
           
       });
       
       
       jQuery('.active').next().addClass('render');
   
       jQuery('.slider_inside').animate({
           
              left:-jQuery('.slides').slice(1,2).width()-75
       })    
   
       jQuery('.render').animate({

                top:'30px',
                
                height:'220px',
                width:'+=50px'

           }, 1000, function(){

               jQuery(this).addClass('active');
               jQuery(this).removeClass('render');

       }).css('overflow', 'visible');
       
       
      
       jQuery('.slides.active').animate({
           
            top:'70px',
            
            height:'180px',
            width:'-=50px'
           
          }, 1000, function(){
           
                jQuery(this).removeClass('active');
           
       }).css('overflow', 'visible');
       
       jQuery('.render img').animate({

                
                
                height:'220px',
                width:'+=50px'

           }, 1000);
           
       jQuery('.slides.active img').animate({
           
            
            
            height:'180px',
            width:'-=50px'
           
          }, 1000); 
      
      
      
   })   
   
   
    
})

