JetlagStudio on "Issue with stylizing a custom widget area"

Hi,

I am facing this issue:

I created a custom widget area in my functions.php file and then I called the widget in the header.php file:

Finally, I stylized the widget in the custom.css area:

.lang-item {

    position: relative;

    display: inline;

    top: 10px;

    left: 50%;

Right now the flags are in the middle of the page. I am trying to place them on top of the logo.

For some reason, when I place the flags in the middle of the page, they stay in the middle, as they should, but when I am trying to change the "left" attribute to 30%, the flags change position according to the width of the browser, as shown in the caption below:

http://img255.imageshack.us/img255/9340/51185452.jpg

How is it possible to make the flags stay on top of the logo no matter what?

Any suggestions are appreciated,

http://www.opensolution.gr

PS. The translation plugin that I am using is Polylang.