Дизайн не всегда подходит под существующие фреймворки, и тогда их использование только замедляет процесс.
Обычно это становится понятно по сетке макета, если в ней элементы расставлены не по логике сетки, то даже использование кастомизации фреймворка может не принести результата.
Говоря о фреймворках, можно еще напомнить о susy.
1. Верстаете форму
2. Подключаете magnificPopup/fancyBox, etc…
3. На кнопку вешаете открытые модального окна в ajax-режиме
4. Вешаете событие на submit формы - отправляете $.ajax
5. По success заменяете html в окне на "Спасибо"
У этой анимации есть функция запуска, вам надо ее отложить до момента появления блока в области видимости.
var $animationBlock = $('_selector_to_element');
var $window = $(window);
$window.on('scroll', function(){
if ($animationBlock.offset().top >= $window.scrollTop()){
// animation function
}
});
Для jQuery используйте встроенный метод: api.jquery.com/animate
Используйте вложенния через complete функцию, при большом количестве блоков код может стать неудобочитаемым, тогда можно прибегнуть к итеративным_функциям/setTimeout/setInterval.
Как писал выше geek01 поставьте !important, либо проверьте не стоит ли он уже по умолчанию на основном классе, если так, то лучше выяснить зачем, если просто так, то лучше его убрать.