357 lines
9.7 KiB
HTML
357 lines
9.7 KiB
HTML
<!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> |