Svetlana_P

Всё посмотрела. К сожалению, мне сложновато понять вопрос Отвечу, как поняла.
У Вас не получается повернутый блок прилепить к правому краю. Решение вот https://jsfiddle.net/Benedetta/xohao506/3/ Т.е. сначала поднимаете блок на высоту, равную самому себе, а потом поворачиваете его на нужный угол вокруг правого нижнего угла. Неважно, какого размера будет контент внутри или окно.
 
 

Чтобы дочерние элементы не поворачивались, задавайте им ту же трансформацию, но со знаком минус. Вот, например 
 
А так, куча способов есть, в зависимости от макета и задач выбирают. Не у всех хорошо с адаптивностью и кроссбраузерностью.
Некоторые тут можно подсмотреть: https://css-tricks.com/creating-non-rectangular-headers/
Вообще, много примеров есть. Вы ищите по запросу CSS Skewed Background
 

Я бы иконки векторными сделала или использовала иконочный шрифт.
Покажите сайт, где Вы видели изменение фото под разные экраны без потери качества? Можно воспользоваться той же техникой  Но не думаю, что просто меняя свойства через css, этого можно добиться.
Посмотрите еще в сторону JS плагинов. Я про этот слышала http://adaptive-images.com/ , но не пользовалась еще.
 

Да, из-за Bootstrap. Правило не срабатывает, потому что оно имеет меньшую специфичность (т.е. "приоритетность"), чем родное бутстраповское. Если Вы не знаете, о чем речь, то советую почитать про специфичность селекторов CSS. Это важно.
Что можно сделать? Вижу три варианта.
1. Добавить специфичности к правилу: так, чтобы применялось даже внутри navbar-default:
2. В файл бутстрапа залезть и там изменить правило, но я бы не стала.
3. Добавить еще к ссылке еще один класс, определяющий цвет
 

Проблемы две: с сеткой и слайдер не настроен, поэтому при уменьшении ширины окна справа вылезает лишний отступ.
Вы хотите, чтобы сайт имел минимальную ширину 1000px? Или будете дальше делать адаптивным?
Если оставляете 1000px, то достаточно прописать для page_wrapper минимальную ширину 1000px и довести до ума слайдер. Сейчас там просто картинка slider.png аж 1248px шириной. Вот она и растягивает общий контейнер. Так выглядит стр. с min-width: 1000px и запретом слайдеру растягивать страницу http://benedetta.ru/project25/Test Frikker2.html
Или если полностью адаптивным сайт делать, то здесь вместе с max-width нужно задать правила и для остальных блоков, в том числе через медиа запросы. Тут уже дело не в фоне.
PS Кстати, для чего Вы сверстали колонку #page-wrapper через flexbox? В чем преимущества?

Посмотрела. У дива с классом .container сделайте нулевые паддинги по бокам. Вместо 25px. Тогда белые поля уйдут.
Кстати, так не советую писать  { width: 600;} Потому что Вы не указываете единицу измерения. 600 чего? Наверное, 600px