<!doctype html>
<html lang="pt-br">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>CENTRAL DE REDIRECIONAMENTO Netshoes</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<header>
<h1>
<strong
>Redirecionamento para os canais oficiais da Netshoes com promoções
exclusivas!</strong
>
</h1>
<img src="netshoes-logo.webp" class="logo" alt="Logo netshoes" />
</header>
<main>
<div class="container">
<div class="imagem-lateral">
<img
src="atleta1.jpg"
class="imagem-lateral esquerda"
alt="Imagem de Atleta 1"
/>
</div>
<div class="links">
<a
href="https://www.netshoes.com.br/busca?nsCat=Natural&q=tenis&mi=hm_desk_ccName__tj_gen_tenis&psn=Banner_Tarja&sort=best-sellers&genero=feminino&promocoes=exclusivonetshoes-desktop&promocoes=ultimas-pecas-desktop&departamento=running"
class="link-button"
target="_blank"
rel="noopener"
>
Promoção em Tênis De Corrida
</a>
<a
href="https://www.netshoes.com.br/p/tenis-adidas-advantage-base-20-feminino-FBA-82CL-058?sellerId=9702"
class="link-button"
target="_blank"
rel="noopener"
>
Promoção Adidas Advantage
</a>
<a
href="https://www.netshoes.com.br/"
class="link-button"
target="_blank"
rel="noopener"
>
Site Oficial
</a>
<a
href="https://www.instagram.com/netshoes/"
class="link-button"
target="_blank"
rel="noopener"
>
<img src="ig-logo.webp" alt="Instagram" class="ig-logo" />
</a>
</div>
<div class="imagem-lateral">
<img
src="atleta2.jpg"
class="imagem-lateral direita"
alt="Imagem de Atleta 2"
/>
</div>
</div>
</main>
<footer>
<p>Desenvolvido por:<strong>Luiz "Shiro"</strong></p>
<a
href="https://github.com/yShiroLuizC"
class="ghl"
target="_blank"
rel="noopener"
>GitHub</a
>
</footer>
</body>
</html>
body{
background-color: indigo;
color : white;
font-family: Arial, sans-serif;
margin-bottom: 500px;
text-align: center;
position: relative;
overflow-x: hidden;
}
header {
font-family: Arial, sans-serif;
padding: 2rem 0;
}
.logo{
border-radius: 43%;
width: 150px;
height: 150px;
object-fit: cover;
display: block;
margin: 0 auto 1rem;
}
.container {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
max-width: 1200px;
margin: 40px auto;
padding: 0 20px;
box-sizing: border-box;
}
.imagem-lateral {
flex: 1;
display: flex;
min-width: 0;
width: 100%;
max-width: 580px;
height: auto;
border-radius: 12px;
object-fit: cover;
}
.links {
display: flex;
flex-direction: column;
gap: 15px;
align-items: center;
padding: 0 30px;
flex-shrink: 0;
}
.link-button {
display: inline-block;
width: 100%;
max-width: 200px;
padding: 15px 25px;
background-color: #5a2d82;
color: #ffffff;
text-decoration: none;
text-align: center;
border-radius: 8px;
font-family: Arial, sans-serif;
font-weight: bold;
font-size: 16px;
transition: background-color 0.3s ease, transform 0.2s ease;
}
.link-button:hover {
background-color: #452266;
transform: scale(1.02);
}
.ig-logo {
width: 30px;
height: 30px;
margin-left: 10px;
}
.ghl {
color: #ffffff;
font-family: Arial, sans-serif;
font-weight: bold;
}
@media (max-width: 738px) {
.container {
flex-direction: column;
gap: 30px;
}
.imagem-lateral {
justify-content: center !important;
}
}
footer {
text-align: right;
}
