html{
  height:100%;
}
body{
  height:100%;
  display:flex;
  margin:0;
}
.content {
  width: 300px;
  height: 150px;
  margin: auto;
  -webkit-mask: radial-gradient(circle at 0, transparent 20px, red 0), radial-gradient(circle at right, transparent 20px, blue 0);
  -webkit-mask-size: 50%;
  -webkit-mask-position: 0, 100%;
  -webkit-mask-repeat: no-repeat;
  background: linear-gradient(45deg, orange, red);
}