Menu Bar in Center?

Hi there

I can’t center my menu bar in MH Cicero Lite

The css looks like this, how do I center it without getting a vertical menu?

Thanks

/***** Navigation *****/

.main-nav { float: inline-block; text-align: center; }
.main-nav ul li { float: left; position: relative; display: block; }
.main-nav ul li:hover, .main-nav ul .current-menu-item { background: #2ecc71; }
.main-nav ul li a { display: block; font-size: 13px; color: #fff; font-weight: 700; line-height: normal; padding: 16px 20px; text-transform: uppercase; }
.main-nav ul li:hover > ul { display: block; background: #2ecc71; z-index: 9999; }
.main-nav ul ul { display: none; position: absolute; padding: 0; }
.main-nav ul ul li { width: 160px; margin: 0; text-align: left; }
.main-nav ul ul li a { padding: 10px; }
.main-nav ul ul ul { left: 100%; top: 0; }
.menu-notice { display: inline-block; height: 34px; line-height: 34px; padding: 5px 20px; }
.menu-notice a { color: #fff; text-decoration: underline; }
.slicknav_menu { display: none; }