<div class="global">
<!--row #1-->
  <div class="row rowI">
    <div class="item item1">1</div>
    <div class="col">
      <div class="item item2">2</div>
<!--inner row for items 3 and 4-->
      <div class="row row34">
        <div class="item">3</div>
        <div class="item item4">4</div>
      </div>
    </div>
  </div>
<!--row #2-->
  <div class="row">
    <div class="item item5">5</div>
  </div>
</div>




<!--  UNRELATED-->

marginBetweenItems = 5px

/****BASIC SETUP****/
div
  box-sizing border-box
  
.global
  max-width 40%
  display flex
  flex-direction column
  height 90vh
.row
  display flex
  flex 1
.col
  display flex
  flex-direction column
  flex 2
.item
  flex 1
  margin marginBetweenItems


/****OUT OF ORDER ITEMS AND ROWS****/
.item4
  height 200%
.item5
  margin-right "calc((100% / 3) - %s)" % (marginBetweenItems / 2)


/****VERTICAL STRETCHING****/
.rowI
  flex 2

/****COLORS AND THE RADIA****/
.item
  background-color blue
.item1
  border-top-left-radius 100%
  background-color green
.item2
  border-top-right-radius 100%
  background-color red
.item4
  border-bottom-right-radius 100%
  background-color gold
.item5
  border-bottom-left-radius 100%
  background-color green
  
/****IRRELEVANT VISUAL STYLING****/
.global
  //outline 2px dashed black
  margin 0 auto
.item
  outline 2px dashed pink
  padding 5px
  text-align center
  color transparent
body
  margin 0
  padding-top 4vh
  background-image url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='40' viewBox='0 0 50 40'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%239C92AC' fill-opacity='0.07'%3E%3Cpath d='M40 10L36.67 0h-2.11l3.33 10H20l-2.28 6.84L12.11 0H10l6.67 20H10l-2.28 6.84L2.11 10 5.44 0h-2.1L0 10l6.67 20-3.34 10h2.11l2.28-6.84L10 40h20l2.28-6.84L34.56 40h2.1l-3.33-10H40l2.28-6.84L47.89 40H50l-6.67-20L50 0h-2.1l-5.62 16.84L40 10zm1.23 10l-2.28-6.84L34 28h4.56l2.67-8zm-10.67 8l-2-6h-9.12l2 6h9.12zm-12.84-4.84L12.77 38h15.79l2.67-8H20l-2.28-6.84zM18.77 20H30l2.28 6.84L37.23 12H21.44l-2.67 8zm-7.33 2H16l-4.95 14.84L8.77 30l2.67-8z' /%3E%3C/g%3E%3C/g%3E%3C/svg%3E")