How can i center my navbar , cant seem to find where the prob is on my css and html?

.primary-header{ /*Main top header with navbar*/
    display: flex;
    
}

.primary-header img {  /*Logo properties*/
    width: 184px;
    height: 68px;
}

.topnav a{
    display: flex;
    justify-content: center;
    float: left;
    color: black;
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    text-align: center;
    padding: 14px 16px;
}

<header class = "primary-header">
    <div class="wrapper">
        <!--Logo top nav bar-->
        <img src ="images/Logo Completo.png" alt="logo1">
        <!--Nav Bar-->
        <div class="topnav" id="myTopnav">                  
            <a href="#home" class="active">Home</a>
            <a href="#blog">Blog</a>
            <a href="#biblioteca">Biblioteca</a>
            <a href="#gaming">Gaming</a>
            <a href="#about">Sobre Mi</a>
            <a href="#contacto">Contacto</a>
            <a href="javascript:void(0);" class="icon" onclick="myFunction()">
                <i class="fa fa-bars"></i>
                </a>
        </div>
    </div>  
</header>