Is it possible to bend a linear gradient CSS?

I am trying to create this "swoosh" through the image with CSS.

http://imgur.com/a/wOyvk (without gradient) I have tried doing this with a radial gradient, however, I can't get the gradient to "shut off" abruptly, as the gradient approaches the center. Would the best approach to this be to somehow bend a liner gradient?

This is what I have so far, I don't want the blue to be in the corner, I just want a "slice" of the gradient running down the image. https://jsfiddle.net/uh882Lcw/

HTML

<div class="banner-image">
  <div class="glint">

  </div>
</div>

CSS

.glint {
    background: radial-gradient(ellipse at center, rgba(0, 0, 255, 0.4) 0%, rgba(255, 255, 255, 0) 80%, rgba(255, 255, 255, 0) 100%);
    pointer-events: none;
    z-index: 1;
    position: absolute;
    top: -700px;
    left: 250px;
    width: 1300px;
    height: 1060px;
    border-radius: 100%;
}

.banner-image {
    overflow: hidden;
    background-image: url('http://via.placeholder.com/960x361');
    width: 960px;
    height: 361px;
    position: relative;
    }