Hoe centreer ik de items van mijn menu, met behoud van achtergrondkleur over de hele breedte?

/*MAIN MENU */
nav ul {list-style:none; background-color:#c3e1fb;}
nav ul:after {content: ‘.’; clear: both; visibility: hidden; display: block; height:0px;}

nav ul li {float:left; position:relative; line-height: 30px; padding-left:2px; padding-right:2px}
nav ul li a {color:#05334d; text-decoration:none; text-align:center; padding: 20px 27px 20px; font-size:20px;}
nav ul li:hover > a {font-weight:bold}

De float:left; in je nav ul/li egt op dit moment dat het geheel naar links moet.
Dat zul je dus aan moeten passen.

Toegevoegd na 31 seconden:
*zegt op dit moment moet er staan

Toegevoegd na 7 minuten:
Good practice is het structureren als volgt, al wordt het daar wel wat langer van.

/*MAIN MENU */
nav ul {
list-style: none;
background-color: #c3e1fb;
}
nav ul:after {
content: ‘.’;
clear: both;
visibility: hidden;
display: block;
height:0px;
}

nav ul li {
float:left;
position:relative;
line-height: 30px;
padding-left:2px;
padding-right:2px
}

nav ul li a {
color:#05334d;
text-decoration:none;
text-align:center;
padding: 20px 27px 20px;
font-size:20px;
}

nav ul li:hover > a {
font-weight:bold
}