Если по макету или заданию какие-то блоки могут переноситься, то пускай переносятся (например плитки товара в каталоге товаров). А если не должно переноситься (как контент и сайдбар), то уменьшайте размер (через media для каждого разрешения, или в процентах задавайте).
Заметил что вы используете бутстрап. Облегчил бы вам задачу тем, что посоветовал бы для элемента .item-hover добавить атрибут data-toggle="dropdown", который собственно сделает его кнопкой переключателем. При клике, будет добавляться класс open для .item-type-line и сниматься с остальных, но чтобы он по клику на кнопку в элементе не пропадал, добавьте скрипт
$(document).on('click.bs.dropdown.data-api', '.iframe.cboxElement', function (e) { e.stopPropagation() })
Ссылку не сразу заметил. Я бы вам посоветовал по клику на .item добавлять ему класс, open например, который влияет на содержимое аналогично :hover. То есть к такому коду .item-type-line .item-hover:hover { opacity: 1; }
добавить правила для .open
Для грамотного фронтенда посоветовал бы изучить сперва HTML/HTML5 (применение различных тегов, когда и как применять html5 теги). Затем начать осваивать CSS/CSS3 (базовые знания, кроссбраузерность, css3 и т.п.). На стадии изучения CSS начнете понимать, как нужно/правильно делать HTML структуры каких-то UI элементов, их взаимодействие друг с другом. Без подобных основ делать что-то более объемное, сложное на бутстрапе будет проблематично.
Полноценных знаний верстки не будет, только опыт построения на основе бутстрапа и создание своего похожего на него. HTML5, семантика и т.п. придётся осваивать отдельно
Если мало опыта в построение html структуры UI элементов, кроссбраузерной стилизации и т.п. , то трудно будет правильно и грамотно компоновать, совмещать, перестилизовывать и строить структуры на его основе, для чего он собственно и нужен
Учиться его применять начинающим разработчикам не совсем хорошая идея. А учиться создавать html структуру, стилизацию глядя как сделано в бутстрапе, заимствуя и изучая что-то новое - ничего плохого)
Тогда одного min-height: 100%; для body мало, нужно 100% высоту делать. Но опять проблемы с фиксацией футера могут быть. Придется к jQuery обратится за выставлением высоты либо для body либо для контейнера с видео.
jsfiddle.net/4qxer3w8 перенес на скорую руку ваш код, тут только нужно задать минимальную высоту всему контейнеру, чтобы при ресайзе окна не уродовалось и картинки вставлять по ширине процентов на 15-30 больше ширины контейнера. Аналогичным способом сделано в приведенном вами примере.
jsfiddle.net/keha1enj/1 Пример посмотрите. Прямо в html после модалки вставлен скрипт (в окне HTML), можно перед модалкой вставить. При загрузке открывается. Посмотрите в консоли, есть ли ошибки.
Какую версию bootstrap вы используете? В старых версиях показ модалки можно было сделать классами "fade in". В последней версии не прокатит, так как там помимо классов ещё некоторые CSS свойства у элементов добавляются, в том числе и самой странице.
Вы же можете средствами php вывести подключение скрипта при повторной загрузке?
или 
? В последней строка поиска на панели задач, Cortana.