Icone de usuario não apareceu | HTML5 e CSS3 II: Turbinando as suas páginas

Segui todos os passos do vídeo mas no fim meu ícone de usuário não apareceu. Fiz uma revisão no css e html e não consegui identificar o erro.

Segue HTML:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>João da Silva - Contato</title>
        <link rel="icon" href="imagens/favicon.png">
        <link rel="stylesheet" href="css/reset.css">
        <link rel="stylesheet" href="css/site.css">
        <link rel="stylesheet" href="css/contato.css">
        <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Crimson+Text:400,400italic,600">
        <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans+Condensed:700">
    </head>
    <body>
        <main>
            <h1 class="titulo-principal">Contato</h1>
            <div class="container">
            <form>
                <fieldset>
                    <legend>Dados pessoais:</legend>
                    <label type="nome">Nome</label>
                    <p>
                    <input id="nome" placeholder="Seu nome aqui" type="text" name="nome-contato" required pattern="[A-Za-z ']{4,}" autofocus title="O nome precisa ter pelo menos 4 caracteres">
                    <p>
                    <label type="email" >email</label>
                    <p>
                    <input id="email" placeholder="Seu email" type="email" required>
                </fieldset>
                   <p>
                <fieldset>
                        <legend><strong>Pergunta:</strong></legend>
                        <label>
                        <input type="radio" name="assunto" value="consultoria">
                        Consultoria
                       </label>

                       <label>
                        <input type="radio" name="assunto" value="blog">
                        Blog
                       </label>

                        <label>
                        <input type="radio" name="assunto" value="pagamentos">
                        Pagamentos
                       </label>

                        <fieldset>
                        <input type="radio" name="assunto" value="Outro" id="outro">
                        <label for="outro">
                            Outro
                        </label>
                        <input type="text" name="outro-assunto">
                    </fieldset>
                       <p>
                       <label for="msg"><strong>Mensagem:</strong></label>
                        <p>
                        <textarea id="msg" name="mensagem" cols="100" rows="20" placeholder="Digite aqui sua mensagem" required></textarea>
                       <button type="submit">Enviar</button>
                </fieldset>
            </form>    
            </div>
        </main>
        <img src="imagens/eu.jpg" alt="Minha foto" class="minha-foto">
        <aside class="navegacao-site">
            <h1>João da Silva</h1>
            <nav>
                <ul>
                    <li><a href="index.html">Home</a></li>
                    <li><a href="portfolio.html">Portfolio</a></li>
                    <li><a href="bio.html">Sobre mim</a></li>
                    <li><a href="blog.html">Blog</a></li>
                    <li><a href="contato.html">Contato</a></li>
                </ul>
            </nav>
            <ul class="icones-redes-sociais">
                <li>
                    <a href="https://github.com/joaodasilva" class="github" data-tooltip="Veja meus projetos opensource">
                        Github
                    </a>
                </li>
                <li>
                    <a href="https://twitter.com/joaodasilva" class="twitter" data-tooltip="Siga-me no Twitter">
                        Twitter
                    </a>
                </li>
                <li>
                    <a href="https://br.linkedin.com/pub/joão-da-silva/32/4/508" class="linkedin" data-tooltip="Veja meu currículo">
                        LinkedIn
                    </a>
                </li>
            </ul>
        </aside>
        <footer class="rodape-pagina">
            &copy; João da Silva 2014
        </footer>
    </body>
</html>

CSS:

legend,
label[for="mensagem"] {
    font-weight: bold;
    margin-top: 1em;
}

label[for] {
    display: block;
}

input[type="text"],
input[type="email"],
textarea {
    font-family: inherit;
    font-size: 100%;
    padding: .25em .5em;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #ccc;
}

fieldset > fieldset {
    display: inline;
}

label[for="outro"] {
    display: inline;
}

input[name="outro-assunto"] {
    width: auto;
}

input:focus,
textarea:focus {
    background-color: #FFD;
}

input:invalid {
    box-shadow: 0 0 3px red;
}

button {
    border: 0;
    padding: .5em 1em;
    font-family: "Open Sans Condensed", sans-serif;
    background-color: #3C1D3D;
    color: white;
    font-size: 1.2em;
    margin-left: auto;
    margin-top: 1em;
}

button:hover,
button:focus {
    background-color: #8C1D3D;
}

}
label[for="outro"] {
    display: inline;
}
input[name="outro-assunto"] {
    width: auto;
}
input[value="Outro"] ~ input {
    display: none;
}
input[value="Outro"]:checked ~ input {
    display: inline;
}


label[for="nome"] {
    position: relative;
}

label[for="nome"]:after {
    content: "";
    background-color: #666;
    background-repeat: no-repeat;
    background-image: url(../imagens/usuario.png);
    background-size: 50% 50%;
    background-position: center;
    width: 2em;
    height: 2em;
    position: absolute;
    top: 100%;
    left: 0;      
}

#nome {
    width: calc(100% - 2em);
    position: relative;
    left: 2em;    
}

Mergulhe em programação