Overlay shifts div when triggered

Overlay shifts div when triggered

I appologise in advance as I already posted this a few mins ago and I was unable to edit the post as it was under moderation. However upon further testing this appears to affect Chrome aswell. 

When an overlay is triggered it is causing the content div to shift apprx 50px to the right. The content div is inside a page container div here is the css code for both. This is not happening in IE 8.

#page-container {
width: 760px;
margin: auto;
text-align: left;
}
#content {
line-height: 18px;
}
#content .padding {
    padding: 25px;
}

The really odd thing is this is inconsistent. It appears to occur 85% of the time however occasionally it does not occur. Is this a firefox browser issue or a problem with how I layed out my divs/css?