The horizontal rule fits within the width of the container, but doesn't clear the container itself and appear in the whitespace below it.
I don't want to be spoonfed the answer, but some tips would be appreciated, since I've been working on a solution for about 35 minutes with no luck. I've fiddled with margins and padding, placing internal divs within the container, etc.
@yacobgugsa you're missing a closing </div> tag for the container after line 29.
Removing the margin-bottom: -30px and putting a <hr> tag after that new closing div tag will give you a line below the container
Negative margins are evil btw
Now the <hr> clears the container, but it now stretches across the whole page, and text below the <hr> is not centered. Which is exactly why I didn't want to have them outside the container in the first place. http://codepen.io/yacobgugsa/pen/VKXQyW
Scratch that...I'm still tweaking the HTML. I'll be back.