<div class="container">
		   <div class="pannel">pannel-1</div>
		   <div class="pannel">pannel-2</div>
		   <div class="pannel">pannel-3</div>
		   <div class="pannel">pannel-4</div>
		   <div class="pannel">pannel-5</div>
		   <div class="pannel">pannel-6</div>
		 </div>

.container {
  max-width: 960px;
  /*min-width: 320px;*/
  background: #dcd1d1;
  padding: 0.5em;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap-reverse; /* Switches flow, so the first become last, and get stretched */
  /*flex-direction: row-reverse;*/
}
.pannel {
  background: #eee;
  margin: 0.5em;
  padding: 0.5em;
  flex: 1 0 calc(25% - 2.125em);
  text-align: center;
}
.pannel:nth-child(-n+2){
  order: 99; /* Puts the first two on the top row (end of reversed flow) */
}