Data, насколько я помню, двигать html не выйдет. Ни параметрами top/bottom, ни паддингами, ни маргинами. А эта фоновая картинка у вас стоит именно на html. Поддаются вышеупомянутым телодвижениям селекторы, начиная с #pun_wrap'а или даже #pun'а (по порядку вложения друг в друга, как матрешки, идут от внешней к внутренней html, body, #pun_wrap, #pun), следовательно, если ничего не менять в структуре, то вы не сможете исправить ситуацию никак. Только глобально пересмотрев дизайн. То есть, переместив фоновое изображение на другой слой = присвоив это изображение-фон другому селектору, который, в отличие от html, поддается подвижке. К сожалению, сейчас у меня нет возможности давать вам ответ пошагово с примерами или конкретными кодами. Поэтому советую попробовать самостоятельно или дождаться вечера - и тогда помощи от меня, либо, если кто-то еще из помогающих появится в теме в течение дня - помогут они, хотя сложностей у вас возникнуть не должно с тем, чтобы перетасовать картинки, раз вы поняли, в чем проблема.