AlexKeller

https://jsfiddle.net/7q9kesdc/

.main > .content
добавить правило
min-width: 0;
https://jsfiddle.net/z5eLt8w9/1/

<input type="email" id="email-subscribe" name="E-mail" placeholder=" " required>

Убрать required и тип можно на text сменить уж тогда

https://jsfiddle.net/z7enduen/

Вопрос в том, как должен себя вести футер при достаточном количестве контента, уходить под него или все равно быть прилепленным снизу. Если первый вариант, то можно так: https://jsfiddle.net/depL5164/

Почему не просто через свойство flex?
https://jsfiddle.net/7f7nj4qc/
Скролл в блоке только из-за margin у body в iframe. Задайте ему в инспекторе margin: 0; и скролл пропадет

https://jsfiddle.net/ekffrwtb/
Flex для LI, плюс поиграться с выравниванием по вертикали

https://jsfiddle.net/pyjegpby/1/

https://codepen.io/anon/pen/RgOzZj

Какая-то странная задумка, наводить на пустое место...
Но раз уж надо, повесьте на селектор .my:hover a

И что тут такого нереально сложного?

<div class="main">
  <div class="sidebar"></div>
  <div class="container"></div>
</div>

В обычном состояние flex-direction для враппера row, в адаптации - column

Странно, что перезагрузка gulp на что-то тут влияет.
Все импорты CSS-файлов должны идти в начале файла: https://www.w3.org/TR/CSS21/cascade.html#at-import

https://jsfiddle.net/7n2kxfwj/
Если сделать текст в правой колонке короче, то она займет min-width. А с длинным текстом будет max-width

Если нужно, чтобы и при коротком тексте правая занимала max - можно добавить ей flex: 1 1 auto;

Кнопки и подобные - некрупные - элементы дизайна стараюсь делать CSS'ом...
Во-первых, обычно меньше весит...
Во-вторых, если завтра придут и скажут, что мой зеленый недостаточно красный, то в Firebug'е подобрать и заменить цвет будет проще...
Ну и в-третьих, произвольный размер шрифта, все тянется и занимает ровно столько места, сколько требуется...

То, что вы привели в качестве примера, сложно назвать плагином. Обычно плагины каруселей/слайдеров требуют простейшей разметки, грубо говоря так:

<div data-src="images/slide1.jpg">
<div data-src="images/slide2.jpg">
<div data-src="images/slide3.jpg">

А плагин уже сам делает все обвязки.

Здесь же весь HTML уже зашит в коде страницы, все слайды лежат рядом со скрытыми блоками для отображения картинки конкретной фичи. И щелчок по иконке зума просто меняет свойство display этих скрытых блоков. Получается, что из слайдера там только приятный fadeIn/fadeOut очередной картинки. Честно, это своими руками делается быстрее и проще, чем искать специфические плагины...