Redimensionar janela mantendo as DIV's no mesmo lugar

Pessoal... tenho o seguinte layout:

Janela com 1920x1080: http://d-3.me/full.jpg

O que eu quero é que se pessoa tiver uma resolução menor, ou então redimensionar a tela, essas duas div's preta e vermelha da foto, fiquem no mesmo lugar aparecendo somente o que é possivel visualizar dentro da janela...

Exemplo: janela com 1024x1080: http://d-3.me/1024.jpg

A div preta e a vermelha permanecem no mesmo lugar e é visualizado somente o que aparece dentro da area de visualização da janela mesmo, sem a barra de rolagem...

eu cheguei a fazer assim, conforme abaixo, mas não está dando certo: Lembrando que essas div's pretas e vermelha serão imagens.

<div id="wrap_home_bts">
 <div class="bt_woman"></div>
 <div class="bt_man"></div>
</div>

e meu css:

#wrap_home_bts{
 position:relative;
 width:100%;
 height:100%;
}

 .bt_woman{
 width:880px;
 height:389px;
 background:#FFCC00;

 position:absolute;
 left:0;
 bottom:245px;

 }

 .bt_man{
 width:733px;
 height:168px;
 background:#CC00FF;

 position:absolute;
 right:0;
 bottom:74px;

 }