Why is the border going outside of the parent?

[LaBelleDameSansMerci]

Here's my test case:http://codepen.io/jgclifton/pen/hKyndI want the border on .outer to be container inside the .innerUltimately the effect I want to achieve is the lighter grey box is 10px thinner top and bottom than the dark grey box (so the thinner light grey box is in the middle of the dark grey).