Boa tarde pessoal, usei os mesmos modelos da página da aula para criar uma página alternativa. O que vocês acham? Vou tentar já iniciar um formulário...Abraço a todos.. Segue o código.
<head>
<meta charset="UTF-8">
<title class="tit-princip-central">ASSM Serviços e Consultoria</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<h1 class="titulo-principal">ASSM SERVIÇOS E CONSULTORIA</h1>
</header>
<img id="banner" src="banner.jpg">
<div class="principal">
<h2 class="titulo-centralizado">Sobre a ASSM Serviços e Consultoria</h2>
<p>Localizada na cidade de São Paulo a <strong>ASSM Serviços e Consultoria</strong> traz para o mercado o que há de melhor serviços para otimização de processos de instalação eletrica residencial utilizando ferramentas que garantem otimização de materiais e de tempo na instalação. </p>
<p>Fundada em 2018, a ASSM já é desempenhou papel importante na melhoria de processos de instalação eletrica em residências na cidade de São Paulo conquistando novos clientes a cada dia.</p>
<p id="missao" ><em>Nossa missão é: <strong>"Proporcionar 100% de satisfação do cliente com 0% de perdas e 0% de Eventos de Segurança ou Qualidade aos nossos clientes".</strong></em></p>
<p>Oferecemos profissionais experientes e antenados às mudanças no mundo da prestação de serviço em instalação eletrica residêncial. O atendimento possui padrão de excelência e agilidade, garantindo qualidade e satisfação dos nossos clientes.</p>
</div>
<div class="beneficios">
<h3 class="titulo-centralizado">Beneficios</h3>
<ul>
<li class="itens"><strong><a href="produtos.html">Produtos</strong></li>
<li class="itens"><strong>Serviços</strong></li>
<li class="itens"><strong>Contatos</strong></li>
<li class="itens"><strong>Biblioteca Suporte</strong></li>
</ul>
<img src="electrician-1080573_1920.jpg" class="imagembeneficios">
</div>
</body>
head {
} .tit-princip-central { text-align: center; }
header { background: #CCCCCC; padding: 20px 0; }
}
body {
}
#banner { width:100%; height: 75%; }
.principal { background: #CCCCCC; padding: 30px; } .titulo-principal { padding-left: 20px; } .titulo-centralizado { text-align: center }
p { text-align: center; }
#missao { font-size:20px }
em strong { color: #FF0000; }
.itens { font-size:20px; font-style: italic;
}
.beneficios { background: #FFFFFFF; padding: 20px; }
ul { display: inline-block; vertical-align: top; width:20%; margin-right: 15%;
}
.imagembeneficios { width: 50%; height: 80%; }
</head>
<body>
<header>
<div class="caixa">
<h1><img src="electrician-3946810_640.jpg"></h1>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="produtos.html">Produtos</a></li>
<li><a href="servicos.html">Serviços</a></li>
<li><a href="contatos.html">Contato</a></li>
</ul>
</nav>
</div>
</header>
<main>
<ul class="produtos">
<li>
<h2>Instalações</h2>
<img src="power-failure-7557626_640.png">
<p class="detalhe-descricao">Dimensionamento, Projetos de Instalaçãoes eletricas.</p>
<p class="detalhe">Orçamentos on line</p>
</li>
<li>
<h2>Desenvolvimento</h2>
<img src="mobile-2795310_640.png">
<p class="detalhe-descricao">Desenvolvimento aplicativos de controle de demanda eletrica</p>
<p class="detalhe">Análise de falhas</p>
</li>
<li>
<h2>Retrofit</h2>
<img src="brainstorming-6610965_640.png">
<p class="detalhe-descricao">Modernização de paineis elétricos e redimensionamento componentes</p>
<p class="detalhe">Economia de energia</p>
</li>
</ul>
</main>
<footer>
<img src="computer-3655479_640.png">
<p class="copyright">© Copyright ASSM Serviços e Consultoria - 2022
</footer>
</body>