Putting an Image in the background of a MOBI

Hi, any help on this would be greatly appreciated. I am currently working on a MOBI project. For the TOC we are attempting to fill the screen with a background image that text will sit over. I have used the following code but the attached screenshot shows that only a portion of the image shows up. I suspect it is because the image is in the 'div.toc tag' but for a Mobi iam not sure were else to place the image.

/* TOC */
div.toc {
text-align: center;
text-indent: 0;
max-height: 100%;
max-width: 100%;
margin-top: -1em;
padding-top: 0;
page-break-after: always;
background-image: url(../images/TOC_pageArt_ebook.jpg);
background-size: contain;
background-repeat: no-repeat;
}

Attached Thumbnails