I have such code (all)
http://jsfiddle.net/NSzdm/
But main trouble is that i try to do as usual footer at the bottom of the page, but i get something like this:

Simple there is still wrapper with center, but also i have footer, which must be after wrapper… Please see jsfiddle, all code is there…
footer css:
.footer {
margin: 50px 0 0 0;
background-color: #3a3a3a;
background-image: linear-gradient(bottom, #3b3b3b 0%, #424242 100%);
background-image: -o-linear-gradient(bottom, #3b3b3b 0%, #424242 100%);
background-image: -moz-linear-gradient(bottom, #3b3b3b 0%, #424242 100%);
background-image: -webkit-linear-gradient(bottom, #3b3b3b 0%, #424242 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3b3b3b', endColorstr='#ff424242',GradientType=0);
/* IE6-9 */
width: 100%;
height: 144px;
}
I think you just need to change position:absolute to position:relative in your CSS for .wrapper .center {position:relative}.
That seemed to move your footer down, not sure if it affects the other parts of your page, hard to tell with no images.