Retro starburst

by Chris Buttery

HTML

<div class="burst"> <span></span>
 <span></span>
 <span></span>
 <span></span>
 <span></span>
 <span></span>
 <span></span>
 <span></span>
 <span></span>
 <span></span>
 <span></span>
</div>

CSS

.burst {
    background: #076591;
    border-radius: 300px / 430px;
    height: 400px;
    margin-left: 200px;
    margin-top: 100px;
    padding: 0 20px;
    position: relative;
    transform: rotate(10deg);
    width: 250px;
}
span, span:before, span:after {
    border-color: transparent transparent #076591 transparent;
    border-style: solid;
    border-width: 0 35px 100px 35px;
    content:"";
    height: 0px;
    position: absolute;
    width: 0px;
}
span:nth-child(1) {
    left: -15px;
    top: -25px;
    -webkit-transform: rotate(-50deg);
    -moz-transform: rotate(-50deg);
    transform: rotate(-50deg);
}
span:nth-child(1):before {
    left: -62px;
    top: 15px;
    -webkit-transform: rotate(-15deg);
    -moz-transform: rotate(-15deg);
    transform: rotate(-15deg);
}
span:nth-child(1):after {
    left: 14px;
    top: -4px;
    -webkit-transform: rotate(21deg);
    -moz-transform: rotate(21deg);
    transform: rotate(21deg);
}
span:nth-child(2) {
    left: 52px;
    top: -43px;
    -webkit-transform: rotate(-18deg);
    -moz-transform: rotate(-18deg);
    transform: rotate(-18deg);
}
span:nth-child(2):before {
    left: -4px;
    top: -43px;
    -webkit-transform: rotate(11deg);
    -moz-transform: rotate(11deg);
    transform: rotate(11deg);
}
span:nth-child(2):after {
    left: 26px;
    top: -23px;
    -webkit-transform: rotate(33deg);
    -moz-transform: rotate(33deg);
    transform: rotate(33deg);
}
span:nth-child(3) {
    left: 146px;
    top: -83px;
    -webkit-transform: rotate(22deg);
    -moz-transform: rotate(22deg);
    transform: rotate(22deg);
}
span:nth-child(3):before {
    left: 0;
    top: 34px;
    -webkit-transform: rotate(12deg);
    -moz-transform: rotate(12deg);
    transform: rotate(12deg);
}
span:nth-child(3):after {
    left: 51px;
    top: 19px;
    -webkit-transform: rotate(32deg);
    -moz-transform: rotate(32deg);
    transform: rotate(32deg);
}
span:nth-child(4) {
    left: 253px;
    top: 0px;
    -webkit-transform:...