Viewport to DIV

Need first DIV to adjust to the viewport, hiding all DIV's underneath.

HTML

<div>
    <div class="window-1"></div>
    <div class="window-2"></div>
    <div class="window-3"></div>
</div>

CSS

body {
    min-height: 100%;
    padding: 0;
    margin: 0;
    overflow: hidden;
}

body > div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
}
.window-1 {
    background-image: url(http://cdn.superbwallpapers.com/wallpapers/nature/south-island-new-zealand-24517-1920x1200.jpg);
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 100%;
    clear:both;
    overflow: hidden;
}
.window-2 {
    background-color: #999;
    width: 100%;
    height: 200px;
    clear:both;
    overflow: hidden;
}
.window-3 {
    background-color: #666;
    width: 100%;
    height: 200px;
    clear:both;
    overflow: hidden;
}