порядок блоков на разных экранах

Визуальная часть шаблона

<div class="rowall">
<div class="col1">Первый</div>
<div class="col2">Второй</div>
<div class="col3">Третий</div>
<div class="col4">Четвертый</div>
</div>

код css 

<style>
.rowall {display: flex;flex-flow: wrap;}
.col1, .col2, .col3, .col4 { width: 100%;}
.col1 {order: 3;}
.col2 {order: 1;}
.col3 {order: 2;}
.col4 {order: 0;}
</style>