Here’s how to fix it (assuming you want the 2nd/responsive logo to center)
1. The #header .wrap logo needs to be set to “background: none;” in the responsive section of the css since its showing up twice behind the responsive logo.
#header .wrap {
background: none;
}
2. You also need to add width: 100%; to the #header .wrap as well. Currently it is still using the width: 960px; which is why this entire area isn’t resizing due to the fixed width. So adding the 100% percentage will allow the responsive logo to adjust/respond like its supposed to.
#header .wrap {
background: none;
width: 100%;
}