Nav não alinha

Boa noite, tudo bom? Estou "clonando" uma pagina que achei para praticar, mas estou com um problema, não consigo alinhar os itens do nav com a "logo" lorem ipsulum. Ja mexi em tudo que achei que pudesse ajudar e não consigo nem mexer os itens do nav, alguem sabe onde estou errando?

 <header class="header">
        <div class="header-box">

            <img src="logotipo-do-sistema-generico_9569-167.jpg" class="header-content" width="50px">

            <nav>
                <ul class="lista">
                    <li><a href="index.html">Home</a></li>
                    <li><a href="#">Sobre</a></li>
                    <li><a href="#">Portfólio</a></li>
                    <li><a href="#">Para Investidores</a></li>
                    <li><a href="#">Contato</a></li>
                </ul>
            </nav>
        </div>
    </header>

CSS:

.header{
    background: #000000;
    margin: auto;


}

.header-box{
    width:100%;
    position: relative;
}

.header-content{


    width: 130px;
    display: inline-block;
    margin-left: 200px;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 0;
}

.lista {

    color: #FFFFFF;
    margin-right: 45px;

}

nav{

    position: absolute;
    top:20px;
    right: 0;

}

nav li{
    vertical-align:text-bottom;
    display: inline;
    padding: 0 15px 0 45px;

}

nav a{

    text-decoration: none;
    font-size: 18px;
    text-transform: uppercase;

}

nav a:link,a:visited{

    color: #FFFFFF;
}

nav a:hover{

    transition: 0.5ms;
    color:blue;
}