title: CSS radial gradient drop shadow - reversed
body: <p>Have some pre-existing code from a Wordpress template that draws an ellipse drop shadow.  The shadow radiates downward in an ellipse. Only the bottom half of the ellipse is visible, creating a bottom shadow effect.</p>
  
  <p>I simply want to "reverse" the ellipse "shadow effect" so that only the <em>top</em> half of the shadow is visible.  Seems simple. I'm lost.</p>
  
  <p>What I believe is the code snippet drawing the radial shadow:</p>
  
  <pre><code>.fusion-separator.sep-shadow {
    height: 1px;
    overflow: visible;
    border: none;
    background: none;
    background: linear-gradient(left, rgba(150, 150, 150, 0) 0%, rgba(150, 150, 150, 0) 15%, rgba(150, 150, 150, 0.65) 50%, rgba(150, 150, 150, 0) 85%, rgba(150, 150, 150, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#00000000', GradientType=1);
  }
  .fusion-separator.sep-shadow:after {
    display: block;
    margin-top: 10px;
    height: 6px;
    width: 100%;
    content: '';
    background: radial-gradient(ellipse at 50% -50%, rgba(0, 0, 0, 0.5) 0px, rgba(255, 255, 255, 0) 65%);
  }
  </code></pre>
  
  <p><a href="http://sawyerfirm.ignitte.com/auto-accidents/" rel="nofollow noreferrer">Live example on site:</a></p>
  
  <p><a href="https://i.stack.imgur.com/EwU2n.png" rel="nofollow noreferrer">Existing Radial Shadow</a></p>
  
  <p><a href="https://i.stack.imgur.com/EwU2n.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/EwU2n.png" alt="enter image description here"></a></p>