2 Pictures on the login page

Hello I have a problem with customizing the login page.
I have two pictures on the login page:
on the left: one picture,
and in the middle: the logo picture
Problem is: when I open the login page in another screen resolution these two pictures are too far away from each other
and when I minimize the page they are on each other, so that you can′t see the logo.

In the wp-login.php i have added “<div id=”picture”></div>

an in the login.css (/wp-admin/css):

#picture {

position: fixed;
overflow: hidden;
margin-left: 16%;
padding-bottom: 15px;
display: block;
clear: both;
width: 250px;
height: 20px;

background: url(../images/hoorican2.jpg ) top center;
}

the part with the logo is:

h1 a {

background: url(../images/logo-login.jpg ) no-repeat top center;
margin: 0 auto;
width: 326px;
height: 67px;
text-indent: -9999px;
overflow: hidden;
padding-bottom: 2px;
display: block;
clear: both;

}

How can I make these two pictures to “stick” in the same distance of each other even when I open the site in another resolution?

the url of the site is: https://fuckdas.com

thank you for your help!