Skifte font hover-farve inde i span-link

Hej,

Jeg har en span (hitbox) der allerede fungerer fint som et link. Jeg har også lavet så der kommer en baggrundsfarve når man kører musen over hitbox. Eneste problem jeg har nu er med teksten inde i hitbox og lave en hover effekt på denne. Jeg vil gerne når man kører musen indenfor hitbox-feltet, at teksten indeni skifter farve. Hvad er det lige jeg har overset? :)

HTML:

<a href='#d10' id='inline'><span class='hitbox'><h2>10</h2></span></a>

CSS:

h2 {
margin-top: 27px;
font-size: 20px;}

  h2:hover {color: #fff; text-decoration: none;}
  h2:active {color: #fff; text-decoration: none;}

------------------

.hitbox {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 10;}
       
  .hitbox:hover {background-color: #333;}