<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>