Максим

JQUERY BEFORE/AFTER PLUGIN по описанию на это похоже

вот так ?
оригинал :

переделка

если не отображаются стили на локальном сервере то хоть лопни : не правильно подключено либо КЭШ

если адаптивно то по любому на мобилках они 100% экрана
а извращаться только на декстопах ну максимум на планшетах и то не рекомендуется

вам этой подсказки хватит ? https://codepen.io/MaximLensky/pen/QOdqJo

https://codepen.io/MaximLensky/pen/jarNqE вроде так но как будто не то ...

https://codepen.io/MaximLensky/pen/XzmKWw?editors=1100 так ?

html,body{
    overflow:hidden;
}

ужасно тормозит ваш сайт

скопировать код svg и вставить его в файл (для примера fon.svg) и применить ...

откройте паинт и вырежьте вашу картинку и вставьте куда надо

это не хак ...а стандартные свойства css3

я уже задавал подобный вопрос но разница в том что у меня по по hover: Как реализуется подобный hover?

ну вот у вас все элементы имеют : position:absolute; top:0; это означает что вы приказали им всем встать в самом вверху top:0; и при всём при том что нету элемента родителя который должен быть position:relative

codepen.io/MaximLensky можно даже в IE8 проверить