I'm still not sure what exactly is the problem. But I guess you wanna display you hover-boxes a bit more centered over the navigation bar. So is this what you are looking for?:
I modified your css:
#container{
position: absolute;
top: 50%;
left: 0;
width: 100%;
}
.leistungen{
.leistung{
width: 33.33%;
position:relative;
float: left;
background-color: #323a98;
color: #fff;
.infos{
display:none;
}
&:hover{
height: 100%;
.infos{
display:block;
position:absolute;
top:-30px;
left:-50px;
background-color:#323a98;
z-index:10;
}
}
}
}
I gave the hover boxes an absolute position and the parent div a relative, so I could add negative distances to move them a bit up and left. I had to give them a backgroundcolor too and a z-index to hide what's under the hover boxes.
EDIT
http://jsfiddle.net/MYpzD/4/ In this fiddle a new width and a border and a padding for the text is added.