title: How can I create this shape using pure CSS3?
body: <p>I'm having problems recreating this sort of shape using CSS3! This is going to be used as a header that will stretch across the whole site, and the background of it needs to be transparent, so I'm having issues attempting to recreate it! </p>
  
  <p>EDIT:
  This is what I've got so far, I just can't recreate the curve!
  <a href="https://dl.dropboxusercontent.com/u/33897365/css3/index.html" rel="nofollow noreferrer">https://dl.dropboxusercontent.com/u/33897365/css3/index.html</a></p>
  
  <p><img src="https://i.stack.imgur.com/lUWD8.jpg" alt="enter image description here"></p>
  
  <p>Current CSS:</p>
  
  <pre><code>body {
      background: #ff00ff;
  }
  
  #header { 
      height: 150px;
      width: 100%;
      background: #000;
      border-bottom-right-radius: 35% 90%;
  }
  </code></pre>