Edit
Você também pode chamar a imagem de acordo com a resolução, utilizando Media Queries. Dessa forma, você escolhe a resolução para a imagem ser chamada. Logo, você precisará ter uma imagem "tratada" para cada resolução. Um exemplo seria assim:
@media (min-width: 768px) {
.login-page
{
background-image: url('img200.jpg');
background-repeat: no-repeat;
bottom: 0;
color: black;
left: 0;
overflow: auto;
padding: 3em;
position: absolute;
right: 0;
text-align: center;
top: 0;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
}
@media (min-width: 992px) {
.login-page
{
background-image: url('img600.jpg');
background-repeat: no-repeat;
bottom: 0;
color: black;
left: 0;
overflow: auto;
padding: 3em;
position: absolute;
right: 0;
text-align: center;
top: 0;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
}
@media (min-width: 1200px) {
.login-page
{
background-image: url('img1000.jpg');
background-repeat: no-repeat;
bottom: 0;
color: black;
left: 0;
overflow: auto;
padding: 3em;
position: absolute;
right: 0;
text-align: center;
top: 0;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
}
Dessa forma, um dispositivo com resolução menor que 768px irá utilizar a img200.jpg, e assim por diante. Se você observar, o Bootstrao já possui media queries, podendo até customizar as resoluções.