Anton fon Faust

transform: translate3d(Xpx, Ypx, Zpx); а с помощью javascript назначаются подходящие классы по событиям, вот и все.

А если так:
document.getElementById('bg').play();
Работает?
Пути правильно прописаны?

Три стиля:
1 - анимация до центра страницы
2 - анимация - в центре (тряска + infinite)
3 - анимация полета вверх
Смена стилей с помощью javascript по мере загрузки данных, или назначение второго стиля по событию animationend (ищите полифилл для кроссбраузерности) первого стиля и третьего по событию загрузки.

.section-background-image>:not(.bg-color--white)
выбирает все, что является прямым потомком .section-background-image за исключением элементов с классом .bg-color--white

Как вы себе представляете вместо формата изображения/расширения файла html-тег?
Переформулируйте задачу.

Обрабатываете событие change на input, к которому привязан ползунок и результат пишете куда вам надо.

Весь код приводите.
А лучше на jsfiddle.net воспроизведите.

Например, вот так: https://jsfiddle.net/khq6adf5/1/

А почему не подходит

$(".main_block").off('click');
$(".random_two").on('click', function(){});

?

Анализируйте содержимое navigator.userAgent
www.webmasters.by/articles/web-programming/3118-br... - тут написано что и как делать.

position:absolute; для section.item-about вам поможет. Но если не хотите вычислять координаты для каждого блока - назначте position:relative; для div.item и section.item-about добавляйте в div.item.

position: fixed;
Но, вообще, посмотрели бы примеры бутсраповские.

можно использовать, например, в качестве единиц измерения vw, а не пиксели.

У вас функция formSubmit(event) находится в замыкании события load, соответственно, она имеет доступ только к своему и родительским областям видимости, а ее элементы из родительских областей видимости не видят.
Нужно или вынести из замыкания объявление функции, или использовать

window.formSubmit = function(event) {
//и далее чего нужно
}

В общем, почитайте про область видимости переменных и функций в javascript и все станет на свои места.

по событию скролла вычисляем положение нижней границы блока на странице и если оно меньше чем скролл+высота viewport, делаем ему position: fixed, если я правильно понял что вы хотите сделать.