Need some Help with Footer in Responsive HTML5

[jubcheng]

Hi.
I'm customizing a Bootstrap template but I'm stuck with the footer I've created.
Here a link to CodePen for you to see the HTML and CSS.
When you scroll down on the CodePen page you can see that the footer does not cover the whole width on the left, it's only about 5px.
The content inside the footer displays alright in FF, Chrome & IE, but not in CodePen, I don't know why that is.
Here a Screenshot.jpg so you can see that it displays correct in the browser.
I really would appreciate if someone could point out what I'm doing wrong.
Thanks in advance for any feedback.
Cheng

Edit:
Sorry, I just noticed that I've posted in the wrong forum section.
Please move this thread to HTML.