CSS3 Liberty

<div id="liberty">

<div id="liberty-title">Liberty</div>

<div id="liberty-spikes">

<div id="liberty-spike-four"></div>

<div id="liberty-spikes-one">

<div id="liberty-spike-one"></div>

<div id="liberty-spike-seven"></div>

</div>

<div id="liberty-spikes-two">

<div id="liberty-spike-two"></div>

<div id="liberty-spike-six"></div>

</div>

<div id="liberty-spikes-three">

<div id="liberty-spike-three"></div>

<div id="liberty-spike-five"></div>

</div>

</div>

<div id="liberty-head"></div>

</div>

/* More at http://vuild.com  :)  */

#liberty {

background: #BEF7E0;

height: 950px;

width:900px;

text-align: center;

padding-top: 50px;

padding-bottom: 300px;

}

#liberty-title {

font-size: 6em;

font-family:WebfontBold, Arial Black, sans-serif;

color: white;

padding-top: 160px;

padding-bottom: 50px;

text-transform: uppercase;

}

#liberty-head {

margin-top:-105px;

background: #6C9E89; 

margin-left:auto;

margin-right:auto;

width:250px; 

height:375px;

-webkit-border-radius:98px 98px 98px 98px/

112px 112px  168px 168px ;

border-radius:50% 50% 50% 50%/40% 40% 60% 60%;

}

#liberty-spikes {

height: 300px;

width: 800px;

margin-top: 80px;

margin-left:auto;

margin-right:auto;

}

#liberty-spike-four {

width: 0;

height: 0;

border-left: 15px solid transparent;

border-bottom: 150px solid #6C9E89;

border-right: 15px solid transparent;

margin-left:auto;

margin-right:auto;

margin-bottom: -100px;

}

#liberty-spikes-one {

height: 150px;

width: 650px;

margin-left:auto;

margin-right:auto;

}

#liberty-spike-one {

float: left;

width: 0;

height: 0;

margin-top:-19px;

margin-left: 190px;

border-left: 15px solid transparent;

border-bottom: 150px solid #6C9E89;

border-right: 15px solid transparent;

-moz-transform: rotate(-30deg);

-webkit-transform: rotate(-30deg);

-o-transform: rotate(-30deg);

-ms-transform: rotate(-30deg);

transform: rotate(-30deg);

}

#liberty-spike-seven {

float: right;

width: 0;

height: 0;

margin-top:-19px;

margin-right: 190px;

border-left: 15px solid transparent;

border-bottom: 150px solid #6C9E89;

border-right: 15px solid transparent;

-moz-transform: rotate(30deg);

-webkit-transform: rotate(30deg);

-o-transform: rotate(30deg);

-ms-transform: rotate(30deg);

transform: rotate(30deg);

}

#liberty-spikes-two {

height: 150px;

width: 600px;

margin-left:auto;

margin-right:auto;

}

#liberty-spike-two {

float: left;

width: 0;

height: 0;

margin-left: 90px;

margin-top: -100px;

border-left: 15px solid transparent;

border-bottom: 150px solid #6C9E89;

border-right: 15px solid transparent;

-moz-transform: rotate(-57deg);

-webkit-transform: rotate(-57deg);

-o-transform: rotate(-57deg);

-ms-transform: rotate(-57deg);

transform: rotate(-57deg);

}

#liberty-spike-six {

float: right;

width: 0;

height: 0;

margin-right: 90px;

margin-top: -100px;

border-left: 15px solid transparent;

border-bottom: 150px solid #6C9E89;

border-right: 15px solid transparent;

-moz-transform: rotate(57deg);

-webkit-transform: rotate(57deg);

-o-transform: rotate(57deg);

-ms-transform: rotate(57deg);

transform: rotate(57deg);

}

#liberty-spikes-three {

height: 100px;

width: 600px;

margin-left:auto;

margin-right:auto;

margin-bottom: -200px;

}

#liberty-spike-three {

float: left;

width: 0;

height: 0;

margin-top: -170px;

margin-left: 60px;

border-left: 15px solid transparent;

border-bottom: 160px solid #6C9E89;

border-right: 15px solid transparent;

-moz-transform: rotate(-80deg);

-webkit-transform: rotate(-80deg);

-o-transform: rotate(-80deg);

-ms-transform: rotate(-80deg);

transform: rotate(-80deg);

}

#liberty-spike-five {

float: right;

width: 0;

height: 0;

margin-top: -170px;

margin-right: 60px;

border-left: 15px solid transparent;

border-bottom: 150px solid #6C9E89;

border-right: 15px solid transparent;

-moz-transform: rotate(80deg);

-webkit-transform: rotate(80deg);

-o-transform: rotate(80deg);

-ms-transform: rotate(80deg);

transform: rotate(80deg);

}

/* Thanks for looking. More at http://enrappture.com  :)  */