Avere un doctype, con l'indirizzo della dtd, serve a dire al browser: usa questo linguaggio di marcatura le cui regole sono definite a quell'indirizzo. Serve a ridurre i margini di interpretazione del browser (ogni browser interpreta e rielabora a proprio modo) e ad avere risultati più affidabili.
L'html5 non è ancora pienamente supportato e va anche bene usare html 4.1 o xhtml.

Venendo al problema, inserisci un div che contenga tutti gli altri e a quello assegna un position:relative:

codice:
#wrapper {
position:relative
}
cambia per .languagebar il posizionamento da relativo ad assoluto e inserisci lì lo z-index
codice:
.languagebar {
    position: absolute;
    width:100%;
    height: 40px;
    top:0;
    left:0;
    background-image: url('images/barra_language.png');
    background-repeat: repeat-x;
    opacity: 0.5;
    z-index:300
}
passa anche la pagina al validatore del w3c perché presenta altri errori (un tag a non può contenere un div, dai piuttosto al link un display:block e le dimensioni volute - ma poiché è preferibile non avere un link vuoto, metti al suo interno direttamente l'immagine che usi come sfondo e non sarà necessario neanche il display block e lo specificarne le dimensioni)