
	function slideSwitch() {
		if($('#slideshow div').is('.stop_autoloop')) return;
	
		//var $active = $('#slideshow IMG.active');
		var $active = $('#slideshow div.active'); //must be used if using <div> then <img>
		var $active_circle = $('#slide_circle a.active');
		var $active_description = $('#slide_description span.active');

		if ( $active.length == 0 ) { 
			//$active = $('#slideshow IMG:last');
			$active = $('#slideshow div:last'); //must be used if using <div> then <img>
			$active_circle = $('#slide_circle a:last');
			$active_description = $('#slide_description span:last');
		}
		// use this to pull the images in the order they appear in the markup
		var $next =  $active.next().length ? $active.next()
			: $('#slideshow div:first'); //must be used if using <div> then <img>
			//: $('#slideshow IMG:first');
			
		var $next_circle = $active_circle.next().length ? $active_circle.next()
			: $('#slide_circle a:first');	
			
		var $next_description = $active_description.next().length ? $active_description.next()
			: $('#slide_description span:first');	
	  
		$active.addClass('last-active'); 
		
		$active_circle.addClass('last-active');
		
		$active_description.addClass('last-active');
		
		//$('#slideshow IMG').removeClass('active last-active');
		$('#slideshow div').removeClass('active last-active'); //must be used if using <div> then <img>
		$next.css({opacity: 0.0})
			.addClass('active')
			.animate({opacity: 1.0}, 1000, function() {
				/*$active.removeClass('active last-active');*/
			});

		
		 $('#slide_circle a').removeClass('active last-active');
		 $next_circle.css({opacity: 1.0})
			.addClass('active');
		 /*$active_circle.removeClass('active last-active');*/
		 
		 $('#slide_description span').removeClass('active last-active');
		 $next_description.css({opacity: 1.0})
			.addClass('active');
		 /*$active_description.removeClass('active last-active');*/
		 
	}

	$(function() {
		setInterval( "slideSwitch()", 13000 );
	});


