-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcontato.html
124 lines (118 loc) · 9.39 KB
/
contato.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contato</title>
<link rel="stylesheet" href="./style/style.css">
<meta name="description" content="Barbearia Corte Nobre.">
<link rel="icon" href="./img/pagina-inicial/bigode.svg" type="image/svg+xml">
</head>
<body>
<header class="header" id="home">
<div class="header-container">
<div class="logo">
<a href="./index.html"><img src="./img/logo.png" alt="Logo" width="349" height="284"></a>
</div>
<nav class="nav">
<ul class="botao-menu">
<li><a href="./orcamento.html">Orçamento</a></li>
<li><a href="./galeria.html">Galeria</a></li>
<li><a href="./sobre.html">Sobre</a></li>
<li><a href="./contato.html">Contato</a></li>
</ul>
</nav>
</div>
</header>
<main class="main-contato">
<div class="contato-container">
<div class="titulo-do-contato">
<h1 class="fadeInLeft" data-anime="400">Contatos.</h1>
<h2 class="fadeInLeft" data-anime="800">Respostas das 10h às 22h.</h2>
</div>
<div class="contatos">
<section class="contato-dados">
<h1 class="fadeInUp" data-anime="800">Nos mande uma Mensagem</h1>
<address class="endereco">
<p>Rua Ari Leão, 86</p>
<p>Rio de Janeiro - RJ</p>
<p>21044020</p>
</address>
<div class="contato">
<a href="mailto:[email protected]">Email</a>
<a target="_blank" href="https://api.whatsapp.com">WhatsApp</a>
<a target="_blank" href="tel:+5521999999999">Contato</a>
</div>
<div class="contato-redes">
<a target="_blank" href="https://www.instagram.com">
<svg width="32" height="32" xmlns="http://www.w3.org/2000/svg" fill="#a2a2a2">
<path
d="M16 0c-4.347 0-4.89.02-6.596.096C7.7.176 6.54.444 5.52.84a7.835 7.835 0 0 0-2.835 1.845A7.807 7.807 0 0 0 .84 5.52C.444 6.54.175 7.7.096 9.404.016 11.111 0 11.654 0 16c0 4.347.02 4.89.096 6.596.08 1.703.348 2.864.744 3.884a7.847 7.847 0 0 0 1.845 2.835A7.825 7.825 0 0 0 5.52 31.16c1.021.395 2.181.665 3.884.744 1.707.08 2.25.096 6.596.096 4.347 0 4.89-.02 6.596-.096 1.703-.08 2.864-.35 3.884-.744a7.864 7.864 0 0 0 2.835-1.845 7.814 7.814 0 0 0 1.845-2.835c.395-1.02.665-2.181.744-3.884.08-1.707.096-2.25.096-6.596 0-4.347-.02-4.89-.096-6.596-.08-1.703-.35-2.865-.744-3.884a7.853 7.853 0 0 0-1.845-2.835A7.796 7.796 0 0 0 26.48.84C25.46.444 24.299.175 22.596.096 20.889.016 20.346 0 16 0Zm0 2.88c4.27 0 4.78.021 6.467.095 1.56.073 2.406.332 2.969.553.75.29 1.28.636 1.843 1.195.558.56.905 1.092 1.194 1.841.219.563.48 1.41.551 2.97.076 1.687.093 2.194.093 6.466s-.02 4.78-.098 6.467c-.082 1.56-.342 2.406-.562 2.969-.298.75-.638 1.28-1.198 1.843a4.992 4.992 0 0 1-1.84 1.194c-.56.219-1.42.48-2.98.551-1.699.076-2.199.093-6.479.093-4.281 0-4.781-.02-6.479-.098-1.561-.082-2.421-.342-2.981-.562-.759-.298-1.28-.638-1.839-1.198a4.859 4.859 0 0 1-1.2-1.84c-.22-.56-.478-1.42-.56-2.98-.06-1.68-.081-2.199-.081-6.459 0-4.261.021-4.781.081-6.481.082-1.56.34-2.419.56-2.979.28-.76.639-1.28 1.2-1.841C5.22 4.12 5.741 3.76 6.5 3.48 7.06 3.26 7.901 3 9.461 2.92c1.7-.06 2.2-.08 6.479-.08l.06.04Zm0 4.904A8.215 8.215 0 0 0 7.784 16c0 4.54 3.68 8.216 8.216 8.216 4.54 0 8.216-3.68 8.216-8.216 0-4.54-3.68-8.216-8.216-8.216Zm0 13.55A5.332 5.332 0 0 1 10.667 16 5.332 5.332 0 0 1 16 10.667 5.332 5.332 0 0 1 21.333 16 5.332 5.332 0 0 1 16 21.333ZM26.461 7.46c0 1.06-.861 1.92-1.92 1.92-1.06 0-1.92-.861-1.92-1.92a1.921 1.921 0 0 1 3.84 0Z" />
</svg>
</a>
<a target="_blank" href="https://www.facebook.com"><svg width="32" height="32"
xmlns="http://www.w3.org/2000/svg" fill="#a2a2a2">
<path
d="M32 16.098c0-8.836-7.164-16-16-16s-16 7.164-16 16c0 7.986 5.85 14.605 13.5 15.805v-11.18H9.437v-4.627H13.5v-3.522c0-4.01 2.39-6.226 6.044-6.226 1.75 0 3.581.314 3.581.314v3.937h-2.018c-1.988 0-2.608 1.233-2.608 2.499v3h4.437l-.71 4.626H18.5v11.18C26.149 30.703 32 24.083 32 16.098Z" />
</svg></a>
</div>
</section>
<section class="contato-formulario">
<form class="form" action="https://api.sheetmonkey.io/form/58UUSyNjo15oDQs8yZf2S2" method="post">
<div class="form-nome">
<label for="Nome">Nome Completo</label>
<input name="Nome" type="text" placeholder="Seu nome">
</div>
<div class="form-numero">
<label for="Número">Número</label>
<input name="Número" type="number" placeholder="21999999999">
</div>
<div class="form-horario">
<label for="Horário">Horário</label>
<input name="Horário" type="text" placeholder="MANHÃ, TARDE OU NOITE">
</div>
<div class="form-pedido">
<label for="Mensagem">Mensagem</label>
<textarea rows="4" name="Mensagem" placeholder="Nos deixe sua mensagem"></textarea>
</div>
<button type="" class="form-botao">ENVIAR MENSAGEM</button>
</form>
</section>
</div>
</div>
</main>
<footer class="footer">
<section class="footer-container">
<div class="footer-icon-cel">
<img src="./img/contato/phone-branco.svg" alt="">
</div>
<div class="footer-endereco">
<p>Rua Ari Leão, 86</p>
<p>Rio de Janeiro - RJ</p>
<p>21044020</p>
</div>
<address class="footer-contato">
<a href="mailto:[email protected]">[email protected]</a>
<a target="_blank" href="tel:+5521999999999">(21) 99999-9999</a>
</address>
<div class=" footer-redes">
<a class="icon-instagram" target="_blank" href="https://www.instagram.com"><svg width="32" height="32"
xmlns="http://www.w3.org/2000/svg" fill="#a2a2a2">
<path
d="M16 0c-4.347 0-4.89.02-6.596.096C7.7.176 6.54.444 5.52.84a7.835 7.835 0 0 0-2.835 1.845A7.807 7.807 0 0 0 .84 5.52C.444 6.54.175 7.7.096 9.404.016 11.111 0 11.654 0 16c0 4.347.02 4.89.096 6.596.08 1.703.348 2.864.744 3.884a7.847 7.847 0 0 0 1.845 2.835A7.825 7.825 0 0 0 5.52 31.16c1.021.395 2.181.665 3.884.744 1.707.08 2.25.096 6.596.096 4.347 0 4.89-.02 6.596-.096 1.703-.08 2.864-.35 3.884-.744a7.864 7.864 0 0 0 2.835-1.845 7.814 7.814 0 0 0 1.845-2.835c.395-1.02.665-2.181.744-3.884.08-1.707.096-2.25.096-6.596 0-4.347-.02-4.89-.096-6.596-.08-1.703-.35-2.865-.744-3.884a7.853 7.853 0 0 0-1.845-2.835A7.796 7.796 0 0 0 26.48.84C25.46.444 24.299.175 22.596.096 20.889.016 20.346 0 16 0Zm0 2.88c4.27 0 4.78.021 6.467.095 1.56.073 2.406.332 2.969.553.75.29 1.28.636 1.843 1.195.558.56.905 1.092 1.194 1.841.219.563.48 1.41.551 2.97.076 1.687.093 2.194.093 6.466s-.02 4.78-.098 6.467c-.082 1.56-.342 2.406-.562 2.969-.298.75-.638 1.28-1.198 1.843a4.992 4.992 0 0 1-1.84 1.194c-.56.219-1.42.48-2.98.551-1.699.076-2.199.093-6.479.093-4.281 0-4.781-.02-6.479-.098-1.561-.082-2.421-.342-2.981-.562-.759-.298-1.28-.638-1.839-1.198a4.859 4.859 0 0 1-1.2-1.84c-.22-.56-.478-1.42-.56-2.98-.06-1.68-.081-2.199-.081-6.459 0-4.261.021-4.781.081-6.481.082-1.56.34-2.419.56-2.979.28-.76.639-1.28 1.2-1.841C5.22 4.12 5.741 3.76 6.5 3.48 7.06 3.26 7.901 3 9.461 2.92c1.7-.06 2.2-.08 6.479-.08l.06.04Zm0 4.904A8.215 8.215 0 0 0 7.784 16c0 4.54 3.68 8.216 8.216 8.216 4.54 0 8.216-3.68 8.216-8.216 0-4.54-3.68-8.216-8.216-8.216Zm0 13.55A5.332 5.332 0 0 1 10.667 16 5.332 5.332 0 0 1 16 10.667 5.332 5.332 0 0 1 21.333 16 5.332 5.332 0 0 1 16 21.333ZM26.461 7.46c0 1.06-.861 1.92-1.92 1.92-1.06 0-1.92-.861-1.92-1.92a1.921 1.921 0 0 1 3.84 0Z" />
</svg>
</a>
<a class="icon-facebook" target="_blank" href="https://www.facebook.com"><svg width="32" height="32"
xmlns="http://www.w3.org/2000/svg" fill="#a2a2a2">
<path
d="M32 16.098c0-8.836-7.164-16-16-16s-16 7.164-16 16c0 7.986 5.85 14.605 13.5 15.805v-11.18H9.437v-4.627H13.5v-3.522c0-4.01 2.39-6.226 6.044-6.226 1.75 0 3.581.314 3.581.314v3.937h-2.018c-1.988 0-2.608 1.233-2.608 2.499v3h4.437l-.71 4.626H18.5v11.18C26.149 30.703 32 24.083 32 16.098Z" />
</svg>
</a>
</div>
</section>
<p class="footer-direitos">© 2024 Barbearia Corte Nobre. Todos os direitos reservados.</p>
</footer>
<script src="./js/plugins/simple-anime.js"></script>
<script src="./js/script.js"></script>
</body>
</html>