CSS3 Technology Poster

<div id="liberty-tech">

<div id="liberty-tech-title">Technology</div>

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

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

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

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

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

</div>

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

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

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

</div>

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

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

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

</div>

</div>

<div id="liberty-tech-headband">

<div id="liberty-tech-window-eight"></div>

</div>

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

<div id="liberty-tech-forehead"></div>

</div>

<div id="liberty-tech-roller"></div>

</div>

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

#liberty-tech {

background:#BEF7E0;

height: 950px;

width:900px;

text-align: center;

padding-top: 50px;

padding-bottom: 300px;

}

#liberty-tech-title {

font-size: 4.5em;

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

color: gray;

padding-top: 160px;

padding-bottom: 50px;

text-transform: uppercase;

}

#liberty-tech-head {

width:250px; 

height:375px;

background:gray; 

margin-left:auto;

margin-right:auto;

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

112px 112px  168px 168px ;

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

}

#liberty-tech-forehead {

width: 240px;

height: 135px;

margin-left:auto;

margin-right:auto;

padding-top:6px;

background: #ccc;

opacity:.3;

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

112px 112px  168px 168px ;

border-radius:51% 51% 50% 50%/95% 95% 10% 10%;

}

#liberty-tech-roller {

width: 25px;

height: 60px;

background: #666;

margin-left: auto;

margin-right: auto;

margin-top: -350px;

position: relative;

-webkit-border-radius:5px;

-moz-border-radius:5px;

border-radius:5px;

}

#liberty-tech-headband {

width: 217px;

margin-right:auto;

margin-left:auto;

margin-top: -100px;

margin-bottom: -125px;

border-radius:5px;

-webkit-border-radius:5px;

-moz-border-radius:5px;

position:relative;

}

#liberty-tech-window-eight {

width: 2px;

height: 120px;

background: #666;

margin-right:auto;

background:#555;

margin-left:auto;

}

#liberty-tech-spikes {

height: 300px;

width: 800px;

margin-top: 80px;

margin-bottom:-30px;

margin-left:auto;

margin-right:auto;

}

#liberty-tech-spike-four {

width: 0;

height: 0;

border-left: 15px solid transparent;

border-bottom: 150px solid gray;

border-right: 15px solid transparent;

margin-left:auto;

margin-right:auto;

margin-bottom: -100px;

}

#liberty-tech-spikes-one {

height: 150px;

width: 650px;

margin-left:auto;

margin-right:auto;

}

#liberty-tech-spike-one {

float: left;

width: 0;

height: 0;

margin-top:-19px;

margin-left: 190px;

border-left: 15px solid transparent;

border-bottom: 150px solid gray;

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-tech-spike-seven {

float: right;

width: 0;

height: 0;

margin-top:-19px;

margin-right: 190px;

border-left: 15px solid transparent;

border-bottom: 150px solid gray;

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-tech-spikes-two {

height: 150px;

width: 600px;

margin-left:auto;

margin-right:auto;

}

#liberty-tech-spike-two {

float: left;

width: 0;

height: 0;

margin-left: 90px;

margin-top: -100px;

border-left: 15px solid transparent;

border-bottom: 150px solid gray;

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-tech-spike-six {

float: right;

width: 0;

height: 0;

margin-right: 90px;

margin-top: -100px;

border-left: 15px solid transparent;

border-bottom: 150px solid gray;

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-tech-spikes-three {

height: 100px;

width: 600px;

margin-left:auto;

margin-right:auto;

margin-bottom: -1200px;

}

#liberty-tech-spike-three {

float: left;

width: 0;

height: 0;

margin-top: -170px;

margin-left: 60px;

border-left: 15px solid transparent;

border-bottom: 150px solid gray;

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-tech-spike-five {

float: right;

width: 0;

height: 0;

margin-top: -170px;

margin-right: 60px;

border-left: 15px solid transparent;

border-bottom: 150px solid gray;

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  */