<div class="container">

  <div class="colour-box teal">

    <div class="colours">

      <div class="teal-left colour-palette"></div>

      <div class="teal-right colour-palette"></div>

    </div>

    <div class="info">

      <p class="colour-name">Teal</p>

      <p class="colour-left">A0CECB</p>

      <p class="colour-right">7DB1B1</p>

    </div>

  </div>

  <div class="colour-box straw last">

    <div class="colours">

      <div class="straw-left colour-palette"></div>

      <div class="straw-right colour-palette"></div>

    </div>

    <div class="info">

      <p class="colour-name">Straw</p>

      <p class="colour-left">E8CE4D</p>

      <p class="colour-right">C0C341</p>

    </div>

  </div>

  <div class="colour-box plum">

    <div class="colours">

      <div class="plum-left colour-palette"></div>

      <div class="plum-right colour-palette"></div>

    </div>

    <div class="info">

      <p class="colour-name">Plum</p>

      <p class="colour-left">8067B7</p>

      <p class="colour-right">6A50A7</p>

    </div>

  </div>

  <div class="colour-box ruby last">

    <div class="colours">

      <div class="ruby-left colour-palette"></div>

      <div class="ruby-right colour-palette"></div>

    </div>

    <div class="info">

      <p class="colour-name">Ruby</p>

      <p class="colour-left">D8334A</p>

      <p class="colour-right">BF263C</p>

    </div>

  </div> 

</div>