Concave Borders

by abhitalks

HTML

<div class="curved"></div>

CSS

body {
    background-color: orange;
}
.curved {
    width: 400px;
    height: 200px;
    border-radius: 0 0 40% 40%;
    background: 
        -webkit-radial-gradient(-19% center, circle, orange 0, orange 124px, transparent 50px), 
        -webkit-radial-gradient(119% center, circle, orange 0, orange 124px, transparent 50px) #ccc;
    background-clip: padding-box;
}