Одиночка Айс

.header{
	background:#fff; //вы просто забыли перекрыть фоном все безобразие
	position:relative;
	z-index:2;
}
.header-top{
	padding-top:20px; //margin тут не нужен
}
.slider{
	position:relative;
	z-index:1;
}

Технически можно - https://codepen.io/daemonhk/pen/MWyQNKW
Практически? Оно вам надо?

Если что, спрашивайте - https://codepen.io/daemonhk/pen/RwaVZLg

Для начала определитесь чего вы хотите делать - сайты, приложения, игры?

Читать книги - скучно, смотреть видосы, где автор что-то мямлит (а таких 99%) - скучно, по сто раз писать одно и то же - скучно.

Хотите быстро увидеть результат работы перед собой? Идите в веб, нажал F5 и готово, вот плоды твоей деятельности. Хотите помучиться подольше? Идите в другие языки, лично мне становилось скучно, когда я видел ошибки в дебаггере, аж спать хотелось.

Программирование слишком обширная область, чтобы в ней разочароваться (это только со временем придет).

Дублирую ответ по просьбе ТС:

Хостер может принудительно все сам кэшировать, если ваш клиент сидит на shared'е. Нужно писать письмо в ТП (техподдержка) хостера, дабы они они отключили это кэширование.

Это как один из вариантов возникшей проблемы с кэшированием файлов.

Скрипт запускается и рисует вместо себя iframe, который и содержит кнопку. Если посмотреть исходный код, то мы увидим, что скрипт внутри фрейма не сработал (политика iframe'ов, бла бла бла, не помню уже). Таким образом, вместо него можно использовать див с opacity:0. Если есть возможность установить стили дочерним элементам, то нужно будет фрейм растянуть на ширину/высоту родительского дива.