Bootstrap 3 Проблема с цветом фона при прокрутке ..?

У меня есть некоторые проблемы в bootstrap, я разрабатываю веб-сайт, но после завершения веб-сайта клиент говорит, что они не хотят реагировать на сайт.

Итак, я сначала исправлю ширину.container до 960px! Important;

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

Я хочу 100% -ный фон ширины в нижнем колонтитуле, но когда я изменяю размер браузера и прокручиваю его по горизонтали, он удаляет цвет фона.

Что я могу сделать...

См. Веб-сайт: снимок 1

Когда изменится размер браузера, посмотрите, что происходит с проблемой: Снимок 2

мой html-код написан в bootstrap 3:

<footer>    
<div class="row footercolor">
        <div class="container">  
        <div class="row">
            <div class="col-xs-2 ">
                  <div class="row">
                  <h5 class="undr footertitle">Lorem Ipsum</h5>
                 </div>
             </div>

             <div class="col-xs-3">
              <div class="row">
                  <h5 class="undr footertitle">QUICK LINKS</h5>
                  <div class="col-xs-6">                  
                      <ul class="footerlist list-group">

                       </ul>
                  </div>     
                  <div class="col-xs-6">  
                       <ul class="footerlist list-group">

                       </ul>
                  </div>
                  </div>
             </div>

             <div class="col-xs-4">
             <div class="row">
               <h5 class="undr footertitle">OUR NEIGHBORHOODS</h5>
                   <div class="col-xs-6">                     
                      <ul class="footerlist list-group">

                       </ul>
                   </div>
                   <div class="col-xs-6">                      
                       <ul class="footerlist list-group ">

                       </ul>
                  </div>
             </div>
             </div>
             <div class="col-xs-3">
                  <div class="row">
                        <h5 class="undr footertitle">GET WEEKLY LISTING UPDATES</h5>
                        <div class="input-group">
                          <input type="text" class="form-control">
                          <span class="input-group-addon btn-ftrbtn">Add Me</span>
                        </div>              
                  </div>
                  <div class="row"><br/></div>
                  <div class="row">
                        <ul class="list-unstyled list-inline pull-right">
                            <li><a href="#"><img src="img/fb.png"></a></li>
                            <li><a href="#"><img src="img/twitter.png"></a></li>
                            <li><a href="#"><img src="img/pintrest.png"></a></li>
                        </ul>                                     
                  </div>      
              </div>
          </div>
    </div>
    </div> <!-- /container -->
</footer>

& Мой код CSS:

.footercolor {
    background-color: #5e6872;
}
.footer{color:#c6c6c9}

.footertitle {
    font-family: 'myriad_prosemibold_condensed' !important;
    font-size: 13px!important;
    color: #fff !important;
    letter-spacing: 0.5px;
}
.footerlist li a {
    font-family: 'myriad_prolight_semicondensed' !important;
    font-size: 12px!important;
    color: #c6c6c9 !important;
    text-decoration: none
}
.footerlist li a:hover {
    color: #fff !important;
    cursor: pointer
}

.row {
    margin-left: 0 !important;
    margin-right: 0 !important; 
}
.container{min-width:960px !important;}

На последнем Пожалуйста, дайте мне решение для этого... Любая помощь будет оценена...