Im working on a grid in bootstrap, now I have 4 cols in a row, but I need to set it in two rows (each with two columns) when the screen size is set to md (or sm). How I can get that?
<div class="container">
<div class="row">
<div class="col">
<div class="panel panel-blue">This is a column.</div>
</div>
<div class="col">
<div class="panel panel-purple">This is a column.</div>
</div>
<div class="col">
<div class="panel panel-purple">This is a column.</div>
</div>
<div class="col">
<div class="panel panel-purple">This is a column.</div>
</div>
<div class="col">
<div class="panel panel-purple">This is a column.</div>
</div>
</div>
</div>