SOURCE

<h1 id="h1">
  hi!
</h1>
<section class="row">
  <div id="div1" style="background-color:#fffaaa; " class="col-md-3 col-sm-3  col-xs-offset-1">
    Consectetur art party Tonx culpa semiotics. Pinterest assumenda minim
    organic quis.
    <section class="row">
      <div style="background-color:white;" class=" col-xs-6 ">
        1
      </div>
      <div style="background-color:yellow;" class="col-xs-6">
        2
      </div>
    </section>
  </div>
  <div id="div1" style="background-color:pink;" class="col-md-6 col-sm-9">
    Consectetur art party Tonx culpa semiotics. Pinterest assumenda minim
    organic quis.
  </div>
  <div id="div1" style="background-color:#aaaaff;" class="col-md-3 col-sm-12">
    Consectetur art party Tonx culpa semiotics. Pinterest assumenda minim
    organic quis.
    <section class="row">
      <div style="background-color:white;" class=" col-xs-6 ">
        1
      </div>
      <div style="background-color:yellow;" class="col-xs-6">
        2
      </div>
    </section>
  </div>
</section>
<h1 id="h2">HTML</h1>
<section>
  <div style="background-color:#aaafff;" class="col-xs-8 col-xs-offset-4">left</div>
    <div style="background-color:#afffff;" class="col-xs-8 ">right</div>
</section>

#h1 {
  font-size: 60px;
  text-align: center;
  text-shadow: 5px 5px 5px;
}

#div1 {
  text-align: right;
  border-style: solid;
  border-color: #aaaaaf;
}
#h2 {
  font-size: 40px;
  text-align: center;
  text-shadow: 5px 5px 5px;
}