<div class="container">
  <header class="item">Header</header>
  <main>
    <article class="item">Article</article>
    <aside class="item sidebar-left">Left sidebar</aside>
    <aside class="item sidebar-right">Right sidebar</aside>
  </main>
  <footer class="item">Footer</footer>
</div>

html {
  background: #f6faff;
}

/*-- --*/
main {
  display: flex;
  flex-direction: row;
}
.item {
  font-size: 1.5rem;
  line-height: 1;
  text-align: center;
  padding: 3rem 1rem;
  background: #dfeffd;
  border: 3px solid #457fdc;
  color: #457fdc;
  margin: 6px;
}
.sidebar-left { 
  order: 1;
  flex: 1;
}
article {
  order: 2;
  flex: 2;
}
.sidebar-right {
  order: 3;
  flex: 1;
}