html - firefox positioning cuts page short -

i using css seems cutting page short in firefox looks fine in chrome. not sure how solve problem, cannot change position:relative elements absolute.

the .content class seems place action happening.

.content {     display:block;     position:absolute; /*originally relative*/     background-color: #678238;     min-height: 500px;     width: 100%;     font-family: "open sans";     line-height: 40px;     color: white;     font-size: 16px;     margin: auto;     text-align: center;     padding-top: 200px;     overflow:hidden;     z-index:0; } 

jsfiddle: https://jsfiddle.net/55922jjs/

live version (outdated slightly): http://bitbear.me