That's because of this line in your each() loop.
var active = TweenMax.staggerTo(".timeline-circle", '.6', {css:{className:'+=active'}, ease: Power2.easeOut}, '.1');
That will create an identical stagger tween for all the .fade-section elements that animates every .timeline-circle. So, when you hit the first trigger, all the circles animate. You want to only target the .timeline-circle contained within each particular .fade-section.
Please try this:
var active = TweenMax.to($(this).siblings(".timeline-circle"), '.6', {css:{className:'+=active'}, ease: Power2.easeOut});
If you want the text and circle to animate at the same time you can also change line 12 to this.
timeline.add(fadeIn, 0).add(active, 0);
Happy tweening.