title: How to create desired shapes and position them accordingly using CSS, CSS3?
body: <p>Below is the image which shows the design that I want to display in one of my page, </p>
  
  <p><img src="https://i.stack.imgur.com/IcOJ7.jpg" alt="enter image description here"></p>
  
  <p>I'm more of a developer than a designer so designing as shown above is quite of a higher level to me. So any suggestions or tips on how to achieve the above task? (Examples through jsfiddle or any such platform would be extremely helpful ;) )</p>