Erro " Do not empty rulesets " | HTML e CSS | Alura

Olá, boa noite.

Estou fazendo o site da barbearia alura como visto em aula, porem ao colocar o class beneficios, aparece o erro " Do not empty rulesets " gostaria de saber como posso resolver.

Segue abaixo linhas de codigo:

HTML:

<body>
    <header>
        <div class="caixa">
            <h1>
                <img src="logo.png" alt="logo-barbearia">
            </h1>
            <nav>
                <ul>
                    <li><a href="barbeariaalura.html">Home</a></li>
                    <li><a href="">Produtos</a></li>
                    <li><a href="">Contatos</a></li>
                </ul>
            </nav>
        </div>
     </header>


    <img id= "banner" src= "banner.jpg">

    <div class="principal">

        <h2 id="titulo">
            Sobre a barbearia Alura
        </h2>

            <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>
                Nossa missão é: "Proporcionar auto-estima e qualidade de vida aos clientes"
            </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>

    </div>
        <div class="beneficios">

                <h3>Beneficios</h3>

                <ul>
                    <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>
                </ul>
                <img class="imagembeneficios" src="beneficios.jpg">
        </div>   
</body>
        <div class="rodape">
          <footer> 
            <img class="logo-branco" src="logo-branco.png" alt="logo-rodape">
          </footer>
       </div>

Css:

header{ background-color: #CCCCCC; }

.caixa{ position: relative; width: 940px; margin: 0 auto; }

nav{ position:absolute; top: 110px; right: 0px; }

nav li{ display: inline; margin: 0 0 0 15px;

}

nav a{ text-transform: uppercase; color: black; font-weight: bold; font-size: 22px; text-decoration: none; }

#banner{ width: 100%; padding-top: 5px;

}

.principal{ padding: 20px; font-family: cursive; font-size: 20px; text-align: center;

}

#titulo{ font-size: 40px; font-weight: bold; padding: 20px;

}

.beneficios{

}

.itens{ display: inline-block; vertical-align: top; width: 20%; margin-right: 15%;

}

.imagembeneficios{ width: 50%; }

footer{ background-color: #CCCCCC;

} .logo-branco{ text-align: center; }

Mergulhe em programação