Как реализовать блок шириной больше .container?

<header>
    <div class="wrapper">
        контент
    </div> 
</header>
<div class="green">
    <div class="wrapper">
        контент
    </div> 
</div> 
<div>
    <div class="wrapper">
        контент
    </div> 
</div>

.wrapper{
    width: 1200px;
    margin: 0 auto;
}

<header>
  <div class="container">
    <!-- Header stuff -->
  </div> 
</header>
<main>
  <div class="container">
    <!-- Optional stuff -->
  </div>
  <div class="big-green-block">
    <!-- Big green block stuff -->
  </div>
  <div class="container">
    <!-- Some other stuff -->
  </div>
<main>