If you look at your stylesheet, you will see that the margins of 25px you are trying to apply to the mainWrapper are being cancelled out by later declarations referring to #mainWrapper...
Code:
/*wrappers - page or section containers*/
#mainWrapper {
background-color: #ffffff;
text-align: left;
width: 80%;
vertical-align: top;
border: 1px solid #9a9a9a;
margin-bottom: 25px;
margin-top: 25px;
}
#headerWrapper, #contentMainWrapper, #logoWrapper, #cartBoxListWrapper, #ezPageBoxList, #cartBoxListWrapper ul, #ezPageBoxList ul, #mainWrapper, #popupAdditionalImage, #popupImage {
margin: 0em;
padding: 0em;
}
#logoWrapper{
background-image: url(../images/header_bg.jpg);
background-repeat: repeat-x;
background-color: #ffffff;
height:160px;
}
#navColumnOneWrapper, #navColumnTwoWrapper, #mainWrapper {
margin: auto;
}
#navColumnOneWrapper, #navColumnTwoWrapper {
margin-left: 0.5em;
margin-right: 0.5em;
}
The browser will always apply the LAST style it sees, so you must not have conflicting declarations...
You should, ideally, fix these conflicts, but if you just put this one at the BOTTOM of your stylesheet, it will effect a quick repair.
Code:
#mainWrapper {
margin-left: 25px;
margin-right: 25px;
}