[Помогите] непонятки с фоном

создаю общий блок <div class="wr"> в него вкладываю ещё один блок <div class="wrapper"> , далее делаю шапку, ну а дальше две колонки.
в css такие параметры:
.wr{
width: 1280px;
margin: auto;
height: 100%;
position: relative;
background-image: url("../images/bg.jpg");
background-color: #3b3c44;
background-repeat: no-repeat;
background-position: center top;
}
.wrapper{
width: 1000px;
margin: 0 auto;
}

но почему то фон указанный для блока wr виден только в шапке, а дальше идёт общий фон, указанный в теге body. Не могу понять почему фон дальше не идёт, ведь всё что есть на странице вложено в блок wr

 

Может надо transparent указать? Скинь HTML полностью

 

Как вариант, для шапки высота задана фиксированная, там и отображается фон.
HTML код в студию!