Центрировать контент в навигационной панели Weebly

Поэтому я выбрал базовую тему в Weebly и полностью менял ее своими CSS и HTML. Я пытаюсь изменить горизонтальную панель навигации. Сама панель сосредоточена, но текст внутри панели, в котором перечислены страницы (дома, видео, дизайн, резюме и т.д.), Нет. Ниже я включил CSS, ответственный за панель навигации. Спасибо за помощь!

#nav-wrap .container {
clear: both;
overflow: hidden;
position: relative;
}

#nav-wrap .container {
background:url(nav-bg-light.jpg) repeat-x top;
height:45px;
}

#nav-wrap .container ul {
list-style: none;
}

#nav-wrap .container ul li {
list-style: none;
float: left;
background:url(nav-saperator-light.jpg) no-repeat right;
padding-right:2px;
}

#nav-wrap .container ul > li:first-child a,
#nav-wrap .container ul > li:first-child a:hover,
#nav-wrap .container ul span:first-child li a,
#nav-wrap .container ul span:first-child li a:hover{
border-radius:5px 0px 0px 5px;
}

#nav-wrap .container ul li a {
float: left;
display: block;
font-family: 'Rosario', sans-serif;
color: #262626;
padding: 0px 30px;
border: 0;
outline: 0;
list-style-type: none;
font-size: 14px;
line-height:45px;
text-shadow: 0px -1px 0px #fff;
}

#nav-wrap .container ul li:hover {
background:url(nav-saperator-hover-light.jpg) no-repeat right;
}

#nav-wrap .container ul li a:hover {
background:url(nav-bg-hover-light.jpg) repeat-x top ;
}

#nav-wrap .container ul li:active {
background:url(nav-saperator-active-light.jpg) no-repeat right;
}

#nav-wrap .container ul li a:active {
background:url(nav-bg-active-light.jpg) repeat-x top ;
}

#nav-wrap .container ul li#active {
background:url(nav-saperator-current-light.jpg) no-repeat right;
}

#nav-wrap .container ul li#active a {
background:url(nav-bg-current-light.jpg) repeat-x top ;
}