Header scrolling error

I have modified the header to accommodate a jpeg site logo, and am having an issue in some browsers where the header does not scroll along with the main body of the page, but gets “overlapped” by the main body.

Here is the “header” section of the default.css file that was modified:

<—-Start of Code—>
/* header */
#header { background: #1e1b1a; border-bottom: 5px solid #383332; padding: 0 0 15px 0;
background-image:url(‘http://d5053370.u58.c8.ixwebhosting.com/wp-content/themes/arras-theme/images/header1.jpg&#8217;);
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center top; }
#branding { width: 960px; margin: 0 auto; }
.logo { max-width: 590px; float: right; margin: 5px 0 0 0px; }
.blog-name { font-weight: bold; font-size: 0px; margin: 0; line-height: 1em; display: block; text-transform: uppercase; }
.blog-name a:link, .blog-name a:visited { color: #1e1b1a; text-decoration: none; }
/*.blog-name a:link, .blog-name a:visited { text-indent: -9000px; background: url(../../images/icons/logo.png) no-repeat; width: 0px; height:0px; display: block; }*/
.blog-name a:hover { }
.blog-description { line-height: 1em; display: block; font-size: 0px; font-weight: bold; color: #1e1b1a; margin: 0; padding: 5px 0 0; text-transform: uppercase; }
<—-End of Code—>

Currently, the site is behind an admin login, under development, and cannot be publicly viewed. I also have no url for a screenshot. Sorry.

Thanks!