Centrer un beau header rollover... De chez Alsacréations !

Bonjour tout le monde,

Voila après une bonne heure sous photoshop, puis une bonne demi-heure à adapter un best-seller des tutos ALsacréations ("Une image réactive (rollover) sans javascript") j'en arrive maintenant à vouloir placer mon header en millieu de page et que si l'utilisateur à l'immense joie de disposer d'un écran 4500 pouces et bien qu'il reste quand même au millieu et que ça lui rajoute plutôt deux beaux espace vides de chaque coté !
J'espère que vous pourrez m'aider je pense ne vraiment pas être loin du bon code là où ça bloque c'est dans la syntaxe de positionnement :

#header {	/* "lien" sera notre conteneur, ici la balise div */
margin-left: auto;
margin-right: auto;
position:absolute;	/* placement de l'image-lien, à vous d'adapter */
top: 50px;
center: 50%;
width: 700px;
height: 200px;

Si vous avez besoin de plus de code c'est par ici => (http://www.witacity.com/header.html

bonjour, un peu trop de code peu-etre
le position absolute et ces coordonées de positionnement a enlevé tout simplement:

#header {	/* "lien" sera notre conteneur, ici la balise div */
margin-left: auto;
margin-right: auto;
height: 200px;
background: url(http://www.witacity.com/header_on.png) top center no-repeat;	/* placement de l'image 2 au second plan */
}

#header a {	/* définition du lien qui occupera toute la place du conteneur */
display: block;
width:100%;
height: 100%;
background: white url(http://www.witacity.com/header_off.png) top center no-repeat;	/* placement de l'image 1 au premier plan */
color: #000;

}

#header a:hover {	/* masquage de l'image1 au survol */
background: transparent none;
} 

++

Merci beaucoup c'est nikel maintenant !