Theme Powerplay_2.0 Customize Header Footer Full width

I am trying to make my header and footer full width but I can’t seem to figure it out. I am using the powerplay_2.0 theme and this is the site structure.

/* -----------------------------------------------------------

   3:  SITE STRUCTURE

	Elements on all or most pages

   ----------------------------------------------------------- */
#wrapper { margin:0 auto; width:980px; position:relative; }
#inner { float:left; background:#fff; padding:0; width:980px; }
#header-wrap { float:left; width:980px; }
#header{ position:relative; width:920px; float:left; padding:31px 0px 0px 0px; min-height:75px;/* background:url(lib/img/dashedline.png) no-repeat bottom;*/ }
#header-top{width:960px; padding:5px 10px 2px 10px; margin: 0 0 0 0px; background:#f4f4f4; float:left;position:absolute; top:0; right:-60px;}

#logo { float:left; width:350px; }
#logo h1 { font-size:48px; margin:0; }
#logo h1 a { color:#222; text-decoration:none; line-height:1em; }
.inner { margin:0 auto; width:900px; }

.content-wrap {float:left; width:900px; margin:0; padding:0 40px 30px 40px;}

.pageheader {float:left; display:block; width:900px; margin:0 0 30px -40px; padding:0 40px 0px 40px; background:#444;}
.pageheader h1, .pageheader h2, .pageheader h3{color:#f9f9f9; margin-top:20px;}

#content-default { float:left; width:590px; padding:0; display:block; margin: 0 30px 0 0; min-height:200px; }
.content-default { float:left; width:590px; padding:0; display:block; margin: 0 0 0 0; min-height:200px; }

/* For proper floating of content/sidebar */
.content-left {display:block; width:590px; float:right; padding: 0 0 0 30px; margin:0 0 0 0; border-left:1px solid #ddd; /* When left sidebar */}
.content-right{display:block; width:590px; float:left; padding: 0 30px 0 0; margin:0 0 0 0; border-right:1px solid #ddd; /* When right sidebar */}

#footer {width:900px; background:#222; padding:40px; float:left; }

/* Column layout */
.one-third, .two-third, .one-fourth, .three-fourth, .one-half, .one-fifth, .two-fifth, .three-fifth { display:inline; float:left; }
.one-fifth { width:164px; margin:0 20px 20px 0; }
.two-fifth { width:348px; margin:0 20px 20px 0; }
.three-fifth { width:532px; margin:0 20px 20px 0; }
.one-fourth { width:210px; margin:0 20px 20px 0; }
.three-fourth { width:670px; margin:0 20px 20px 0; }
.one-third { width:280px; margin:0 30px 20px 0; }
.two-third { width:590px; margin:0 30px 20px 0; }
.one-half { width:440px; margin:0 20px 20px 0; }

You can see it at https://www.paylinedata.com
I want to make the top menu, header, footer menu and menu all full width to fit the browser. I am okay if the main menu can’t be full width but I would like it to be as well.

Thank you in advance for any help.