XF 1.4 CSS Sprite Background Position Issue

[Rum Runner Entertainment]

I've been having some CSS sprite background position issues. This is the code currently in the EXTRA.css template:

.terms-and-rules-sprite
{
width:550px;
height:378px;
background: url('https://forums-rumrunnerentertainment.com/data/images/tarsprite.png') no-repeat 0 0;
direction: ltr;
}

.terms-and-rules-sprite.head
{
background-position: 0 -550px;
}

.terms-and-rules-sprite.tou
{
background-position:;
}

.terms-and-rules-sprite.tar
{
background-position:;
}

.terms-and-rules-sprite.cr
{
background-position:;
}

.terms-and-rules-sprite.pr
{
background-position:;
}

.terms-and-rules-sprite.ap
{
background-position:;
}

And this is what the image currently looks like even though the code has not yet been completed: