Meu texto não some e nem minha imagem fica certa

Boa noite, Algo de errado está acontecendo. Quando vou no navegador para conferir meu código, minha imagem fica na diagonal da escrita, ou seja, ela não some e nem minha imagem fica centralizada. HTML

  <aside>
            <nav>
                <h1>João da Silva</h1>
                <ul>
                    <li><a class="navegacao" href="index.html">Home</a></li>
                    <li><a class="navegacao" href="portfolio.html">Portfolio</a></li>
                    <li><a class="navegacao" href="bio.html">Sobre Mim</a></li>
                    <li><a class="navegacao" href="blog.html">Blog</a></li>
                    <li><a class="navegacao" href="contato.html">Contato</a></li>
                </ul>
                <div>
                    <ul class="icones-socias">
                        <li><a class="github" href="https://github.com/git-joaodasilva">
                            </a>Github</li>

                        <li><a class="twitter" href="https://twitter.com/twitter-joaodasilva"> 
                            </a>Twitter</li>

                        <li><a class="linkedin" href="https://br.linkedin.com/pub/linkedin-joao-da-silva/32/4/508">
                            </a>Linkedin</li>
                    </ul>
                </div>
            </nav>
        </aside>

CSS

body {
    font-family:"Crimson Text", "Times New Roman", serif;
    background-color: #F2FFFC;
    font-size: 120%;
    line-height: 1.5;
}

 .titulo-principal {

    text-align: center;
    color: #FFF;
    background-color: #851944;
    padding: 25px;
    border-bottom: 10px solid #000;
    font-size: 60px;

}

h2, h1 {
    font-family: "Open Sans Condensed", "Arial", sans-serif;

}

p {
    text-align: justify;
    margin: 20px 0;
}

 .link-principal{

    color:  #851944;
}

aside {

    background-color: #3C1D3D;
    color:#F2FFFC;
    padding: 20px;
    text-align: center;

}

#cor-de-fundo{

    background-color: #000;
    color: #F2FFFC;
    padding: 20px;
}

nav a {

    color: #F2FFFC;

}

.navegacao {

    color: inherit;
    font-family: "Open Sans Condensed", sans-serif;
    text-decoration: none;
    text-transform: lowercase;

}

blockquote {

    background-color: #D9E5E3;
    margin: 20px 40px;
    padding: 20px;
    border: 10px solid #C2CCCA;
    width: 250px;
    box-sizing:border-box;

}

.divisao-principal {

    width: 720px;
    margin-right: auto;
    margin-left: auto;
    padding: 30px;
}

aside h1 {
    font-size: 30px;
    margin-bottom: 25px;
}

h2 {

    font-size: 30px;
}

strong {

    font-weight: bold;
}

em {

    font-weight: italic;
}


.icones-socias a {
    width: 40px;
    height: 40px;
    display:inline-block;
    text-indent:-9999px;
}

.github {

    background-image: url(github.png);
}

.twitter {

    background-image: url(twitter.png);
}

.linkedin {

    background-image: url(linkedin.png);
}

article {

     padding-bottom: 30px;
    border-bottom: 1px solid #ccc;
    margin-bottom: 20px;
}

.link-leia {

    font-size: 24px;
    padding: 8px;
    margin: 16px;
    display:block;
    text-align: center;
    background-color: grey;
}

h1 {

    text-transform: uppercase;
}