Erro Visual Studio Code | HTML5 e CSS3 parte 4: avançando no CSS

Galera, esse é meu código da Home, porém o Visual Studio está acusando um erro (Aparece uma pequena bola azul na frente do nome do meu arquivo). Não consigo encontrar o erro. Alguém me ajuda.

<!DOCTYPE html>
<html lang="pt-br">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="../CSS/reset.css">
    <link rel="stylesheet" href="../CSS/style.css">
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap" rel="stylesheet">

    <title>Barbearia Alura</title>
  </head>
  <body>
    <header>
      <div class="caixa">
        <h1><img src="../Mídias/logo.png"/></h1>
        <nav>
          <ul>
            <li><a href="../HTML/home.html">Home</a></li>
            <li><a href="../HTML/produtos.html">Produtos</a></li>
            <li><a href="../HTML/contato.html">Contato</a></li>
          </ul>
        </nav>
      </div>   
    </header>
      <img class="banner" src="..//Mídias/banner.jpg">
    <main>
        <section class="principal">
          <h2 class="titulo_principal">Sobre a <strong>Barbearia Alura</strong></h2>

          <img class="utensilios" src="../Mídias/utensilios.jpg" alt="utensilios"/>

          <p>
            Localizada no coração da cidade a Barbearia Alura traz para o mercado o
            que há de melhor para o seu cabelo e barba. Fundada em 2019, a Barbearia
            Alura já é destaque na cidade e conquista novos clientes a cada dia.
          </p>

          <p id="missao">
            <em
              >Nossa missão é:
              <strong
                >"Proporcionar auto-estima e qualidade de vida aos clientes".</strong
              ></em
            >
          </p>

          <p>
            Oferecemos profissionais experientes e antenados às mudanças no mundo da
            moda. O atendimento possui padrão de excelência e agilidade, garantindo
            qualidade e satisfação dos nossos clientes.
          </p>
        </section>
        <section class="mapa">
          <h3 class="titulo_principal">Nosso Estabelecimento</h3>
          <p>Nosso estabelecimento está localizado no coração da cidade.</p>
          <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d7312.803216564936!2d-46.63365930664629!3d-23.589925627299955!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x94ce5a2b2ed7f3a1%3A0xab35da2f5ca62674!2sCaelum%20-%20Escola%20de%20Tecnologia!5e0!3m2!1spt-BR!2sbr!4v1609180595295!5m2!1spt-BR!2sbr" width="100%" height="450" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
        </section>
        <section class="beneficios">
          <h3 class="titulo_principal">Benefícios</h3>

          <div class="conteudo_beneficios">
          <ul class="lista_beneficios">
            <li class="itens">Atendimento aos Clientes </li>
            <li class="itens">Espaço diferenciado</li>
            <li class="itens">Localização</li>
            <li class="itens">Profissionais qualificados</li>
            <li class="itens">Pontualidade</li>
            <li class="itens">Limpeza</li>
          </ul><img class="imagem_beneficios" src="..//Mídias/beneficios.jpg">
         </div>
          <div class="video"><iframe width="560" height="315" src="https://www.youtube.com/embed/wcVVXUV0YUY" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
          </div>
          </section>

  </main>
    <footer>
      <img src="../Mídias/logo-branco.png"/>
      <p class="copyright">    &copy; Copyright Barbearia Alura - 2020</p>
    </footer>
  </body>
</html>

Olá Maciel, tudo bem?

Na tag img abaixo da tag header a referência para o banner.jpg esta com duas barras //, acredito que possa ser isso,

//Mídias

    </header>
      <img class="banner" src="..//Mídias/banner.jpg">

Se retirando as duas barras e o erro persistir, pode ser o caso de você testar depois sem os pontos à frente. Dê uma olhada nesta referência que fala mais sobre acessar pasta

HTML img: inserindo imagens em sua página

Explicação da referência com o caso e exemplo deles:

Se ela estiver contida dentro de uma pasta local, nós devemos referenciar a pasta também. Por exemplo, se minha página principal está contida na pasta projeto_html e dentro dela temos uma pasta chamada imagens, onde está a nossa imagem, utilizaremos a seguinte url:

<img src="imagens/imagem.jpg">

Agora digamos que temos uma pasta projeto_html onde dentro dela temos as pastas imagens e pages, onde a nossa página esta dentro da pasta pages e a imagem está dentro da pasta imagens. Dessa forma, utilizamos ../ para poder voltar uma pasta e assim entrar na pasta que queremos.

<img src="../imagens/imagem.jpg">

Outra referencia de explicação esta no StackOverFlow

Caminho acesso pastas

Um detalhe em que já tive problema nos códigos anteriormente, foi colocar o nome das pastas com acento ('), neste caso seria interessante testar colocar o nome da sua pasta sem acento como: "midia" ou "img".

Espero ter ajudado, Maciel

Até mais