Doch, die Navigation befindet sich auch in einem <div class="container">. Das ist in deinem Fall ne häufige Klasse, die benutzt wird um die ganze Seite zu zentrieren und maximal 1200px breit zu machen. Wenn Bereiche wiederum über die ganze Seite gehen sollen, befinden sie sich NICHT in einem solchen Container.
Ich würde dafür sorgen dass du nicht alle .container ansprichst, sondern nur diesen einen. Du musst also entweder dem .container eine zusätzliche Klasse oder ID geben, die du ansprichst. Angenommen du nennst die neue Klasse "banner", dann verwendest du den Selektor .container.banner
Alternativ kannst du den Container über <div class="main-container col1-layout"> ansprechen, das wäre der äußere Wrapper. Also folgendes schreiben:
Code:
.main-container .container {
width: 100%;
}