Background image top corner right side

I’ve used Artisteer to create my theme. There is an option that adds a glare image on the top left side of the website. with abit of tweaking I have added an image to the right side as well.
Problem is in different resolution the right image changes its position and it only shows the best with 1280X1024….

how can I modify the css code so that it will be on the top corner right side independent of the resolution?
What I have done is placed it using the existing “left” property which is not the best solution I guess. tried diffrent properties such as right, background-position: top right and etc. none worked.
I have uploaded the screenshots which are self explanatory
1280X1024
1680X1050 (Not proper) – check right side

The Original Left Artisteer css code:
#art-page-background-glare-left

{
  position: absolute;
  width: 100%;
  height: 321px;
  left: 0;
  top: 0;
}

#art-page-background-glare-image-left
{
  background-image: url('images/page_gl.png');
  background-repeat: no-repeat;
  height: 321px;
  width: 400px;
  margin: 0;
}

The tweaked code for right side (Added code)

#art-page-background-glare-right
{
  position: absolute;
  width: 100%;
  height: 321px;
  left: 68%;
  top: 0;
}

#art-page-background-glare-image-right
{
  background-image: url('images/page_gl_right.png');
  background-repeat: no-repeat;
  height: 321px;
  width: 400px;
  margin: 0;
}