Problem with customization in Piet Mondrian's Composition II (bootstrap-grid-painting) exercise


I’m working on this exercise:
This is my actual code:

Let’s thinking about only A,B,C fragments of picture, to make it simple.

What I want to achieve, is this 3 design variations based on screen-size:

Now, this issues I have:

  1. How to get rid of vertical space at medium screen? I have been playing with the margin of respective element, but no success at all.
  2. How to achieve the goal for large screen?
  3. Column size 12 in div A, mean: take all space from parent div area(which is 4) or take all space from container in a global?