Is there a CSS method to vertically center div between 2 fixed margin at the top and bottom?

Question

If possible, how can I use CSS only to vertically center a div between fixed margin at the top and bottom? The margin is to accommodate a header and a footer.

http://jsfiddle.net/u8PhW/6/

<div id="header" style="position: fixed; height: 200px; background-color: orange;"></div>
<div class="viewport" style="overflow: hidden">
    <div class="page">
        <div class="content">Vertically Aligned Section 1</div>
    </div>
    <div class="page">
        <div class="content">Vertically Aligned Section 2</div>
    </div>
</div>
<div id="footer" style="position: fixed; height: 50px; bottom: 0px; background-color: gray;"></div>

The idea of this HTML is that there is a fixed header and footer and the content should be centered between these 2 divs. Additionally, the javascript allows the just to "jump" to different pages. The content within these page should be centered between the header and footer.

Answer 1

Demo

css

div.content {
    position: fixed;
    background-color: red;
    top:200px;
    bottom:50px;
    margin:auto;
    height: 200px;
}