gistfile1.txt

/**
    3 pillar blocks
    */
#pillars {
    float: left;
    width: 910px;
    padding-left: 40px;
    padding-right: 40px;
    margin-top: 100px;
}

#pillars dt {
    color: #e5efe2;
    font-size: 32px;
    padding-bottom: 15px;
}

#pillars dd {
    float: left;
}

#pillars a {
    display: block;
}

#design {
    background: url(../images/design-pillar.png) -29px -15px no-repeat;
    width: 279px;
    height: 213px;
    margin-top: 5px;
}

#design a {
    background: url(../images/p-design.png) 10px 12px no-repeat;
    height: 180px;
    width: 279px;
    text-indent: -9999px;
}

#design a:hover {
    background-position: 0 -183px;
    top: 13px;
    left: 3px;
    position: relative;
}

#develop {
    background: url(../images/develop-pillar.png) no-repeat;
    width: 279px;
    height: 233px;
    text-indent: -9999px;
    margin-top: -10px;
}

#develop a {
    background: url(../images/p-develop.png) top center no-repeat;
    height: 181px;
    width: 280px;
    position: relative;
    top: 20px;
    left: 40px;
}

#develop a:hover {
    background-position: 0 -181px;
    position: relative;
    top: 19px;
    left: 33px;
}

#promote {
    background: url(../images/develop-pillar.png) no-repeat;
    width: 279px;
    height: 233px;
    text-indent: -9999px;
    margin-top: -11px;
    margin-left: 27px;
}

#promote a {
    background: url(../images/p-promote.png) top center no-repeat;
    height: 183px;
    width: 290px;
    position: relative;
    top: 15px;
    left: 40px; 
}

#promote a:hover {
    background-position: 0 -183px;
    top: 15px;
    left: 33px;
}



<section id="pillars">
	<dl>
		<dt>I am enthusiastic about...</dt>
		<dd id="design"><a href="" title="Webjam - Trevor Delamorandiere - Design">Design</a></dd>
		<dd id="develop"><a href="" title="Webjam - Trevor Delamorandiere - Develop">Develop</a></dd>
		<dd id="promote"><a href="" title="Webjam - Trevor Delamorandiere - Promote">Promote</a></dd>
	</dl>
</section>