Consegui executar como o professor Pedro orientou, sobre o bloco de benefícios, mas por pura curiosidade tentei colocar a imagem "benefícios" a esquerda e a lista a direita e não consegui. ( no curso ensinam por a imagem a direita e a lista a esquerda). como seria a aplicação do css nesse caso? obrigado pelo atenção.
hoje, com a Alura e o Google Gemini
Olá, Alexandre!
Muito interessante sua dúvida!! Para inverter a ordem, basta você trocar a tag IMG e a tag UL de lugar, assim, a div de benefícios será preenchida primeiro com a imagem à esquerda, e depois com a lista à direita
Troque isso:
<div class="beneficios">
<h3 class="título-centralizado">Benefícios</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 src="beneficios.jpg" class="imagembeneficios">
</div>
Por isso:
<div class="beneficios">
<h3 class="título-centralizado">Benefícios</h3>
<img src="beneficios.jpg" class="imagembeneficios">
<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>
</div>
Valeu pela dica!