Porque em certa parte do código não aparece o que está no código e inclusive aparece no console?

Estou seguindo a apostila de desenvolvimento web da Caelum e estava tudo indo bem, porém agora deu problema, pois não aparece a imagem do produto e descrição, vou postar o código aqui abaixo caso alguém possa me ajudar a entender essa coisa louca.

HTML

<!DOCTYPE html>
<html>
 <head>
 		<title>Mirror Fashion</title>
 		<meta charset="UTF-8"/>
 		<link rel="stylesheet" href="assets/estilo/estilo.css" />
 </head>

 <body>
  <header class="container">
  	<!--<h1><img src="assets/imagens/logo.png" alt="Logo da Mirror Fashion"/></h1>-->

  <p class="sacola">
  	Nenhum item na sacola de compras
  </p>

  <nav class="menu-opcoes">
  	<ul>
  		<li><a href="../">Sua Conta</a></li>
  		<li><a href="../">Lista de Desejos</a></li>
  		<li><a href="../">Cartão Fidelidade</a></li>
  		<li><a href="sobre.html" target="_blank">Sobre</a></li>
  		<li><a href="../">Ajuda</a></li>
  	</ul>
  </nav>	
  </header>

  <div class="container destaque">
    <section class="busca">
      <h2>Busca</h2>

      <form>
        <input type+"search">
        <button>Buscar</button>
      </form>
    </section>
    <!--Fim Busca-->

    <section class="menu-departamentos">
      <h2>Departamentos</h2>

      <nav>
        <ul style="list-style-type:none;">
          <li><a href="#">Blusas e Camisas</a></li>
          <li><a href="#">Calças</a></li>
          <li><a href="#">Saias</a></li>
          <li><a href="#">Vestidos</a></li>
          <li><a href="#">Sapatos</a></li>
          <li><a href="#">Bolsas e Carteiras<a/></li>
          <li><a href="#">Acessórios</a></li>

        </ul>
      </nav>
    </section>
    <!--Fim menu departamento-->

    <section class="banner-destaque">
      <figure>
        <img src="assets/imagens/destaque-home.png" alt="Promoção: Big City Night" />
      </figure>
    </section>
    <!--Fim banner destaque-->
  </div>
  <!--Fim .container .destaque-->

  <div class="container paineis">
    <!--Os painéis de novidades e mais vendidos entrarão aqui dentro-->
    <section class="painel novidades">
      <h2>Novidades</h2>
      <ol>
        <li>
          <a href="produto.html">
            <figure>
              <img src="assets/imagens/produtos/miniatura1.png" alt="Fuzz Cardigan por R$ 129,90" />
              <figcaption>Fuzz Cardigan por R$ 129,90</figcaption>
            </figure>
          </a>
       </li>
      </ol>
    </section>
 	</div>	
  <!--Fim container painéis-->
 </body>

</html>

CSS

body {
	margin:0;
	padding:0;
	color:#333333;
	font-family:Lucida Arial, Sans Unicode, Lucida Grande, Sans-Serif ;
}
h2 {
	margin-top:60px;
    margin:auto;
	width:940px;
}
figure {
	
	text-align:center;
	padding:15px;
	margin:30px;
	

}
figcaption {
	font-style:italic;
	margin-top:10px;
}
#centro-distribuicao {
	position:relative;
	margin-left:auto;
	margin-right:auto;
	width:550px;

	
}
#familia-pelho {
    margin-left:auto;
	margin-right:200px;
	width:300px;
	float:right;

	
}
.sacola {
	background-image: url(../imagens/sacola.png);
	background-repeat:no-repeat;
	background-position:top right;
	position:absolute;
	top:0;
	right:0;
	padding-top:8px;
	font-size:14px;
	padding-right:35px;
	text-align:right;
	width:140px;
}
.menu-opcoes {
	position:absolute;
	bottom:0;
	right:0;


}
.menu-opcoes ul {
	font-size:15px;
}
.menu-opcoes a {
	color:#003366;
	text-decoration:none;
	cursor:pointer;

}
.menu-opcoes ul li{
	display:inline;
	margin-left:20px;
}
.container {
	margin:auto;
	width:940px;

}
header {
	position:relative;
}
p {
	margin:auto;
	width:940px;
	margin-top:20px;
	margin-bottom:20px;
}
a {
	text-decoration:none;
	cursor:pointer;
	font-weight:bold;
}
.rodape {
	position:relative;
	margin-left:195px;
	margin-top:50px;

}
#diferenciais {
	margin-bottom:20px;
}
.busca,
.menu-departamentos {
	background-color:#DCDCDC;
	font-weight:bold;
	text-transform:uppercase;
	margin-right:10px;
	width:230px;
	float:left;
}
.busca h2,
.busca form,
.menu-departamentos h2 {
margin:10px
}
.menu-departamentos li {
	background-color:white;
	margin-bottom:1px;
	padding:5px 10px;
}
.menu-departamentos a {
	color:#333;
	text-decoration:none;
}
.menu-departamentos {
	clear:left;
}
.busca input[type=search]  {
	width:170px;
	position:relative;
}
.destaque {
	margin-top:10px;

}
.menu-departamentos {
	margin-top:10px;
	padding-bottom:10px;

}
.banner-destaque {
	position:absolute;
	float:right;
	margin-top:-45px;
	margin-left:200px;
	margin-bottom:400px;
}
.painel {
	margin:10px;
	padding:10px;
	width:445px;
}
.novidades {
	float:left;
}
.painel li {
	display:inline-block;
	vertical-align:top;
	width:140px;
}