Menú "con arte"

Linktext Linktext Linktext Linktext
<div id="buttonbox">
   <span class="cc">
      <span class="button3">
         <span class="aa">
            <span class="bb">
<a class="fatbutt" href="#">Linktext</a>
            </span>
         </span>
      </span>
      <span class="button3">
         <span class="aa">
            <span class="bb">
<a class="fatbutt" href="#">Linktext</a>
            </span>
         </span>
      </span>
      <span class="button3">
         <span class="aa">
            <span class="bb">
<a class="fatbutt" href="#">Linktext</a>
            </span>
         </span>
      </span>
      <span class="button3">
         <span class="aa">
            <span class="bb">
<a class="fatbutt" href="#">Linktext</a>
            </span>
         </span>
      </span>
   </span><!-- cc -->
</div> 
#buttonbox {
width: 10em;
margin: 20px 0;
padding: 4px;
background-color: #d0843e;
color: #000;
border: 3px solid;
border-color: #78561d #e2bf87 #e2bf87 #78561d;
}
#buttonbox .cc {
display: block;
border: 1px solid;
border-color: #78561d #e2bf87 #e2bf87 #78561d;
}
.button3 {
display: block;
padding: 1px;
border: 3px solid;
border-color: #e2bf87 #78561d #78561d #e2bf87;
}
.button3 .fatbutt,
.button3 .aa,
.button3 .bb {
display: block;
}
.button3 .fatbutt {
padding: 2px 1px 2px 0;
text-decoration: none;
text-align: center;
background-color: #e0d0b0;
color: #600;
border: 3px solid;
border-color: #e7dbc2 #d6c093 #d6c093 #e7dbc2;
}
.button3 .aa {
padding: 1px;
border: 2px solid;
border-color: #937639 #c2a361 #c2a361 #937639;
}
.button3 .bb {
border: 1px solid #555;
}
.button3 a:hover.fatbutt {
padding: 2px 0 2px 1px;
border: 3px solid;
border-color: #d6c093 #ebdfc6 #ebdfc6 #d6c093;
background-color: #e6d9bc;
color: #900;
}

Índice Capítulo 7
Contenido material adicional