JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<div class="main-wrapper">
<div class="col-xs-8 left-wrapper">
    <div class="col-xs-7 smallbox box-1">
    box1
    </div>
    <div class="col-xs-5 smallbox box-2">
    box2
    </div>
    <div class="col-xs-5 smallbox box-3">
    box3
    </div>
    <div class="col-xs-7 smallbox box-4">
    box4
    </div>
</div>
<div class="col-xs-4 right-wrapper box-5">
box 5
</div>
</div>

CSS

.main-wrapper{
  display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}
.left-wrapper{padding:0}
.smallbox {color:#FFFFFF; min-widht:300px; min-height:100px;}
.box-1{ background:#c49a6c}
.box-2{ background:#bcbec0}
.box-3{ background:#9b8579}
.box-4{ background:#3c2415}
.box-5{ background:#726658;color:#FFF}