CSS Layout shifts to Right on iPhone/iPad?

CSS Layout shifts to Right on iPhone/iPad?

Super weird: For some reason, my site's front page layout (CSS) shifts to
the right on a mobile device when it's supposed to be centered? See:
http://www.stylerepublicmagazine.com
Does anyone know why this is? I've seen this error on other forums, but no
one seems to have a solid fix for it.
Here's the main portion of the stylesheet for my template:
#wrapper {
position:absolute;
width:100%;
margin: 0, auto;
margin-top:60px;
}
#socialmedia {
float:right;
}
#topbanner {
margin-left:180px;
width:990px;
}
#magnavigation {
position:absolute;
margin-top:150px;
margin-left:150px;
}
#featureslides {
position:absolute;
margin-top:240px;
margin-left:190px;
width:1000px;
}
div.img
{
padding-top:40px;
margin: 0px;
height: 150px;
width: 150px;
float: left;
text-align: left;
vertical-align:top;
padding-right:62px;
}
div.imglast
{
padding-top:40px;
margin: 0px;
height: 150px;
width: 150px;
float: left;
text-align: left;
vertical-align:top;
}
div.img img
{
display: inline;
margin: 3px;
}
div.articlename {
padding-top:5px;
font-family:'Oswald', sans-serif;
font-size:1.4em;
}
div.desc
{
padding-top:5px;
text-align: left;
font-family:helvetica;
font-size:1em;
font-weight: normal;
width: 140px;
margin: 0px;
padding-bottom:100px;
}
#morefeatures {
margin-top:180px;
float:left;
width:685px;
padding-right:15px;
padding-bottom:20px;
}
#adverts {
width:300px;
float:right;
margin-top:180px;
}
.FrontHeading {
font-family: 'Oswald', sans-serif;
font-size:30px;
padding-bottom:5px;
}
Thanks, B