Встряска контента при скролле

Происходит встряска контента из-за функции скролла, в чем может быть дело? Кто не против, может протестировать сам скролл.

$(window).scroll(function (event) {
   var st = $(this).scrollTop();
   // вниз
   if (st > scrollPos && window_width >= 1024) {
       // если мы в первой секции
       if (st < main_height && !flag) {
           // движемся ко второй секции
           flag = 1;
           $page.animate({
               scrollTop: ($('section.about').offset().top) + 10
           }, 3000, function () {
               if (window_width >= 1200) {
                   $('section.about .video').css({
                       'width': '893px'
                       , 'height': '506px'
                   }).addClass('opened');
                   //player.play();
                   // запускаем видео, как доскролили    
               }
               flag = 0;
               console.log('.');
           });
           // анимация гор, облаков и т д
           $('.clouds-front').css('top', '-295px');
           $('.clouds-back').css('top', '-273px');
           $('.clouds-front2').css('top', '95px');
           $('.clouds-back2').css('top', '73px');
           $('.mountain').css('top', '400px');
           $('.logo').css('top', '500px');
       }
       // вверх 
       // если мы во второй секции, движемся к началу страницы
   }
   else if ((st <= main_height) && !flag && window_width >= 1024) {
       flag = 1;
       $page.animate({
           scrollTop: 0
       }, duration, function () {
           flag = 0;
       });
       // анимация гор, облаков и тд
       $('.clouds-front').css('top', '195px');
       $('.clouds-back').css('top', '273px');
       $('.clouds-front2').css('top', '295px');
       $('.clouds-back2').css('top', '373px');
       $('.mountain').css('top', '324px');
       $('.logo').css('top', '135px');
   }
   scrollPos = st;
});