HTML
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Meow Coffee</title>
<link rel="stylesheet" type="text/css" href="reset.css">
<link rel="stylesheet" type="text/css" href="style_projeto.css">
</head>
<body>
<header>
<h1><img id="imglogo" src="logo.png"></h1>
<nav>
<ul>
<li><a href="index_projeto.html">Home</a></li>
<li><a href="produtos_projeto.html">Produtos</a></li>
<li><a href="contato_projeto.html">Contato</a></li>
</ul>
</nav>
</header>
<main>
<img id="imggrao" src="grao.png">
<img id="imgcafe" src="cafe.png">
<div id="divisao1">
<p>"se você não sabe por onde começar, comece pelo café."</p>
<hr size="1" width="50%" align="center">
</div>
<div id="divisao2">
<img id="imgcafeleite" src="cafeleite.png">
<h2>Sobre o café</h2>
<p class="paragrafo1">O café é uma bebida apreciada em todo o mundo, sendo conhecida principalmente pelo seu <strong>poder estimulante</strong>. O cafeeiro é uma planta que produz um fruto do qual se extraem sementes que são usadas na fabricação do café. Ele faz parte da família Rubiaceae, mais precisamente do gênero Coffea. Existem diferentes espécies de café, porém a mais importante economicamente é a <em><strong>Coffea arabica</em></strong>, a qual representa cerca de 70% da produção mundial.</p>
<br>
<p class="paragrafo1">O café arábica, como é chamada a espécie Coffea arabica, destaca-se por ser um arbusto grande, o qual pode atingir cerca de quatro metros. As folhas dessa planta apresentam formato ovalado ou sublanceolado, cor verde-escura e bordos ondulados. As flores estão agrupadas em inflorescências. Os frutos do cafeeiro possuem coloração vermelha ou amarela e formato oval. No interior do fruto são observadas, normalmente, duas sementes achatadas.</p>
<br>
<p class="paragrafo1">O café é uma bebida produzida atualmente a partir da infusão dos grãos produzidos pelo cafeeiro. Para fazer a bebida, usamos a semente torrada, a qual é comercializada na forma de grãos ou então já moída. Essa bebida é conhecida pelo seu papel estimulante, efeito associado à cafeína. Além da cafeína, o café é <strong> rico em antioxidantes</strong> rico em antioxidantes e outras substâncias biologicamente ativas, o que faz com que seu consumo seja benéfico em muitas situações.</p>
</div>
<div id="linha">
<hr size="1" width="100%" align="center">
</div>
</main>
<footer>
<img id="logofooter" src="logo_imagem.png">
<p class="copyright">© Copyright Meow Coffee - 2022</p>
</footer>
</body>
</html>CSS
header {
padding: 30px 0 0 0;
}
#imglogo {
position: relative;
left: 300px;
width: 200px;
}
nav {
position: absolute;
top: 125px;
right: 300px;
}
nav li {
display: inline;
padding: 0 15px;
}
nav a {
text-transform: lowercase;
color: #000000;
font: normal 18px Georgia;
letter-spacing: 3px;
text-decoration: none;
}
nav a:hover {
color: darkgoldenrod;
}
#imggrao {
width: 49%;
padding: 10px 8px;
}
#imgcafe {
width: 49%;
padding: 10px 0;
}
#divisao1 {
padding: 50px 0;
text-align: center;
font: normal 20px Georgia;
font-style: italic;
}
#imgcafeleite {
width: 35%;
float: right;
padding: 5px 90px;
}
h2 {
font: normal 20px Georgia;
font-weight: bold;
text-transform: lowercase;
line-height: 30px;
padding: 20px 50px;
}
.paragrafo1 {
font: normal 16px Georgia;
line-height: 32px;
padding: 5px 50px;
}
strong {
font-weight: bold;
}
em strong {
font-style: italic;
}
#linha {
padding: 50px;
}
footer {
background: #CCCCCC;
text-align: center;
}
#logofooter {
width: 110px;
}
.copyright {
font: normal 13px Arial;
font-style: italic;
padding: 0 0 10px 0;
}