CSS margins using jquery-mobile

I'm not able to create margins using css on a html page using jquery-mobile when the header and footer is data-position="fixed" .

My example: link

How do I resolve this when I need the header and footer to be fixed?