parent
be5575b1fd
commit
171dec2de4
|
|
@ -0,0 +1,357 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Contatos / iTGuys</title>
|
||||
|
||||
<link rel="stylesheet" href="./Css/page/Contatos/contatos.css">
|
||||
<link rel="icon" type="image/x-icon" href="./Acessts/Imagens/iT_Guys/logo1.png">
|
||||
|
||||
</head>
|
||||
|
||||
|
||||
<body>
|
||||
|
||||
<!-- Bloco focado para os iconis das redes sociais, tendo links para sites externos -->
|
||||
|
||||
<!--Fechamento para os iconis da redes socias -->
|
||||
|
||||
<!--Nav focado na barra de menu do usuario que possui links para cada uma das áreas internas do site-->
|
||||
<header class="Bloco_1">
|
||||
<div class="icon1">
|
||||
<a href="https://www.facebook.com/itguysconsultoria/about">
|
||||
<img src="./Acessts/Imagens/Iconis/facebook.png" alt="" class="icon2">
|
||||
</a>
|
||||
<a href="https://www.instagram.com/itguys.ti/">
|
||||
<img src="./Acessts/Imagens/Iconis/instagram.png" alt="" class="icon2">
|
||||
</a>
|
||||
|
||||
<a href="https://br.linkedin.com/company/itguysconsultoria">
|
||||
<img src="./Acessts/Imagens/Iconis/linkedin.png" alt="" class="icon2">
|
||||
</a>
|
||||
|
||||
<a href="">
|
||||
<img src="./Acessts/Imagens/Iconis/o-email.png" alt="" class="icon2">
|
||||
</a>
|
||||
|
||||
<a href="https://api.whatsapp.com/send?phone=5521966344698">
|
||||
<img src="./Acessts/Imagens/Iconis/whatsapp (1).png" alt="" class="icon2">
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
</header>
|
||||
|
||||
|
||||
<!--Menu principal-->
|
||||
|
||||
<nav class="Bloco_nav_1" id="bloco" >
|
||||
|
||||
<a href="./index.html"><img class="Logo" src="./Acessts/Imagens/iT_Guys/logo_340x100.png" alt=""></a>
|
||||
|
||||
<div class="Bloco_nav_2">
|
||||
|
||||
<a href="./Sobre.html">
|
||||
<p class="nav_bloco_iten">Sobre</p>
|
||||
</a>
|
||||
<a href="./Serviços.html">
|
||||
<p class="nav_bloco_iten">Serviços</p>
|
||||
</a>
|
||||
<a href="./Contatos.html">
|
||||
<p class="Contato nav_bloco_iten ">Agende uma consultoria</p>
|
||||
</a>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!--
|
||||
<div class="Botao1">
|
||||
<a href="./login.html">
|
||||
<button>Login</button>
|
||||
</a>
|
||||
</div>
|
||||
-->
|
||||
|
||||
|
||||
</nav>
|
||||
<script>
|
||||
|
||||
var menu = window.document.getElementById('bloco');
|
||||
|
||||
window.addEventListener('scroll', function() {
|
||||
// Verifica se o scroll vertical é maior que zero
|
||||
if (window.pageYOffset > 0) {
|
||||
|
||||
menu.style.position ='sticky'
|
||||
menu.style.top ='0'
|
||||
|
||||
|
||||
} else {
|
||||
menu.style.position ='absolute'
|
||||
menu.style.top ='8vh'
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<!--Fechamento do Segundo Header-->
|
||||
|
||||
|
||||
<!--Abertura do Main com todas as principas caracteristicas unicas do pagina home, trazendo um agrupamento em sections as proprias funcionalidades da pagina.-->
|
||||
|
||||
<main>
|
||||
|
||||
|
||||
|
||||
<article class="capitulo_1">
|
||||
|
||||
<section class="coluna_2">
|
||||
|
||||
<iframe
|
||||
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3675.326037750306!2d-43.568575725438855!3d-22.9013421792589!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x9be3fb83713bb3%3A0x377c13ebbf176ebc!2sRua%20Tenente%20Ronald%20Santoro%2C%20183%20-%20Campo%20Grande%2C%20Rio%20de%20Janeiro%20-%20RJ%2C%2023080-270!5e0!3m2!1spt-BR!2sbr!4v1718901373199!5m2!1spt-BR!2sbr"
|
||||
width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"
|
||||
referrerpolicy="no-referrer-when-downgrade">
|
||||
</iframe>
|
||||
|
||||
</section>
|
||||
|
||||
<section class="coluna_1">
|
||||
|
||||
<img src="./Acessts/Imagens/Iconis/pin-de-localizacao.png" alt="">
|
||||
|
||||
</section>
|
||||
|
||||
</article>
|
||||
|
||||
<article class="capitulo_2">
|
||||
|
||||
<section class="coluna_1">
|
||||
|
||||
<div class="painel_1">
|
||||
<h2 class="titulo">Funcionamento</h2>
|
||||
<p class="texto_complementar">Segunda á Sexta 09h ás 18h</p>
|
||||
</div>
|
||||
<div class="painel_2">
|
||||
<h2 class="titulo">Endereço</h2>
|
||||
<p class="texto_complementar">Rua Tenente Ronald Santoro, 183 - Campo Grande</p>
|
||||
</div>
|
||||
<div class="painel_3">
|
||||
<h2 class="titulo">Contato</h2>
|
||||
<p class="texto_complementar">Telefone (21) 96634-4698 <br>
|
||||
E-mail:comercial@itguys.com.br</p>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<section class="coluna_2_email">
|
||||
|
||||
<div class="sub_coluna_1">
|
||||
<h2>Fale com nossa consultoria de Ti e transforme seu negocio</h2>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="sub_coluna_2">
|
||||
|
||||
<div class="particao_1">
|
||||
<img src="./Acessts/Imagens/pexels-karolina-grabowska-5239946.jpg" alt="">
|
||||
</div>
|
||||
|
||||
|
||||
<div class="particao_2">
|
||||
<form id="contactForm" action="enviar.php" method="post">
|
||||
|
||||
<div class="formulario_1">
|
||||
<div class="label_1">
|
||||
<label for="name">Name</label>
|
||||
</div>
|
||||
<div class="input_1">
|
||||
<input type="text" name="nome" id="name" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="formulario_2">
|
||||
<div class="label_2">
|
||||
<label for="email">Email</label>
|
||||
</div>
|
||||
<div class="input_2">
|
||||
<input type="email" name="email" id="email" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="formulario_3">
|
||||
<div class="label_3">
|
||||
<label for="mensagem">Envie sua mensagem</label>
|
||||
</div>
|
||||
<div class="input_3">
|
||||
<textarea name="mensagem" id="mensagem" required></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit">Enviar</button>
|
||||
</form>
|
||||
|
||||
<div id="responsePopup" class="popup">
|
||||
<div class="popup-content">
|
||||
<span class="closeBtn">×</span>
|
||||
<div id="responseContainer"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="./js/page/Contatos/pop_up_enviar.js"></script>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
</article>
|
||||
|
||||
</main>
|
||||
|
||||
<!--Fechamento do main-->
|
||||
|
||||
<!--Rodapé focado na finalização da página tendo caminhos que ainda precisam ser decididos, além da logo da empresa e caminhos para todas as redes socias da propria empresa-->
|
||||
|
||||
<footer class="Bloco_Rodape1">
|
||||
|
||||
<div class="Coluna_Rod_1">
|
||||
<div class="sub_coluna_Rod_1_1">
|
||||
|
||||
<img src="./Acessts/Imagens/iT_Guys/Logo_itGuys - Copia.png" alt="">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="sub_coluna_Rod_1_2">
|
||||
<div class="icon1_rod">
|
||||
<a href="https://www.facebook.com/itguysconsultoria/about">
|
||||
<img src="./Acessts/Imagens/Iconis/facebook.png" alt="" class="icon2_rod">
|
||||
</a>
|
||||
|
||||
<a href="https://www.instagram.com/itguys.ti/">
|
||||
<img src="./Acessts/Imagens/Iconis/instagram.png" alt="" class="icon2_rod">
|
||||
</a>
|
||||
|
||||
<a href="https://br.linkedin.com/company/itguysconsultoria">
|
||||
<img src="./Acessts/Imagens/Iconis/linkedin.png" alt="" class="icon2_rod">
|
||||
</a>
|
||||
|
||||
<a href="">
|
||||
<img src="./Acessts/Imagens/Iconis/o-email.png" alt="" class="icon2_rod">
|
||||
</a>
|
||||
|
||||
<a href="https://api.whatsapp.com/send?phone=5521966344698">
|
||||
<img src="./Acessts/Imagens/Iconis/whatsapp (1).png" alt="" class="icon2_rod">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p>A IT Guys possui a expertise necessária para criar uma solução capaz de atender a sua necessidade.</p>
|
||||
</div>
|
||||
|
||||
<div class="Coluna_Rod_2">
|
||||
<div class="sub_coluna_Rod_2_1">
|
||||
<div>
|
||||
<div>
|
||||
<h2>Titulo</h2>
|
||||
<ul>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="Coluna_Rod_3">
|
||||
<div class="sub_coluna_Rod_3_1">
|
||||
<div>
|
||||
<h2>Titulo</h2>
|
||||
<ul>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="Coluna_Rod_4">
|
||||
<div class="sub_coluna_Rod_4_1">
|
||||
<div>
|
||||
<h2>Titulo</h2>
|
||||
<ul>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
<a href="">
|
||||
<li>Opição_1</li>
|
||||
</a>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</footer>
|
||||
|
||||
<footer class="Bloco_Rodape2">
|
||||
|
||||
<h2>2024 ItGuys. Todos os direitos reservados</h2>
|
||||
|
||||
</footer>
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in New Issue