-
Notifications
You must be signed in to change notification settings - Fork 0
/
contact.html
308 lines (258 loc) · 15.1 KB
/
contact.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
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
<!DOCTYPE html>
<html lang="es">
<head>
<title>Calviño & Ladanaj - arquitectos</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!----- viewport para apple device-width = ancho pantalla initial-scale es que inicia sin ningún zoom -->
<link rel="apple-touch-icon" href="assets/img/newmaterial/C&L3.png">
<!----- icono para apple y safari -->
<link rel="shortcut icon" type="image/x-icon" href="assets/img/newmaterial/CyL.ico">
<!-- Load Require CSS -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet">
<!-- iconos -->
<link href="assets/css/boxicon.min.css" rel="stylesheet">
<!-- tipo de letra -->
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Work+Sans:wght@400&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Ubuntu&display=swap" rel="stylesheet">
<!-- carga CSS -->
<link rel="stylesheet" href="assets/css/estilos.css">
</head>
<body>
<!-- Header -->
<nav id="main_nav" class="navbar navbar-expand-lg navbar-light bg-white shadow mt-3 p-0">
<!--navbar-expand-lg = envoltorio para que el navbar se estire en lg
navbar-light = texto negro de la letra
bg-white = fondo de color blanco
-->
<div class="container d-flex justify-content-between align-items-center">
<a class="navbar-brand h1 d-flex mt-3" href="index.html">
<!--navbar-brand = clase se utiliza para resaltar la marca o logotipo de su página-->
<img src ="assets/img/newmaterial/Logo.jpg" style="height: 50px; width: auto; border-radius: 50%; ">
<!-- bx bx-buildings = icono del logo de la web:
http://www.unisvg.com/icon-sets/bx/bx-buildings.html
https://boxicons.com/
-->
<p class="ps-3 pt-1"><span class="text-dark h4">CALVIÑO</span><span class="fw-light"> & </span><span class="text-dark h4">LADANAJ</span><br><span class="text-info d-flex justify-content-center h5">arquitectos</span></p></a>
<!-- boton de hamburguesa -->
<button class="navbar-toggler border-0"
type="button" data-bs-toggle="collapse"
data-bs-target="#navbar-toggler-success"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon">
</span>
</button>
<!------------------------------------------- Opciones del Menu -->
<div class="align-self-center collapse navbar-collapse flex-fill d-lg-flex justify-content-lg-between"
id="navbar-toggler-success">
<!-------collapse navbar-collapse= para agrupar y ocultar el contenido de la barra de navegación
por un punto de interrupción principal.
flex-fill = obliga a que todos los elementos tengan el mismo tamaño de ancho
d-lg-flex = utilidades para crear un contenedor flexbox y transforme los elementos secundarios
directos en elementos flexibles
-->
<div class="flex-fill mx-xl-5">
<!-- mx=para clases que establecen tanto *-lefty*-right-->
<ul class="nav navbar-nav d-flex justify-content-between mx-xl-5 text-center text-dark">
<!-- .navbar-nav para una navegación ligera y de altura completa
(incluida la compatibilidad con menús desplegables).-->
<li class="nav-item">
<a class="nav-link btn-outline-info px-2" href="index.html">Home</a>
<!-- px = padding y mx es el margin
rounded-pill =genera ese boton con bordes redondeados rounded-circle-->
</li>
<li class="nav-item">
<a class="nav-link btn-outline-info px-2" href="about.html">El Estudio</a>
</li>
<li class="nav-item">
<a class="nav-link btn-outline-info px-2" href="work.html">Portfolio</a>
</li>
<li class="nav-item">
<a class="nav-link btn-outline-info px-2" href="pricing.html">Honorarios</a>
</li>
<li class="nav-item">
<a class="nav-link btn-outline-info px-2" href="contact.html">Contáctenos</a>
</li>
</ul>
</div>
<!---------------------------------------------------------Fin de las opciones del menu
------------------------------------------------------------ Inicio de los iconos del menu-->
<div class="navbar align-self-center d-flex">
<a class="nav-link" href="config.html"><i class='bx bx-cog bx-sm bx-spin-hover text-dark'></i></a>
<a class="nav-link" href="user.html"><i class='bx bx-user-circle bx-sm bx-tada-hover text-dark'></i></a>
<!-- https://iconify.design/icon-sets/bx/-->
</div>
</div>
</div>
</nav>
<!-- Close Header -->
<!-- Start Banner Hero -->
<section class="container mt-3 py-4">
<div class="row">
<div class="col-lg-6 ">
<div class="contact-header">
<h1 class="h2 pb-3 text-info">Contactanos Online</h1>
</div>
<div class="contact-img">
<img src="./assets/img/newmaterial/croquis.png" class="img-fluid">
</div>
</div>
<div class="col-lg-6 ">
<form class="contact-form row mt-5" method="post" action="#" role="form">
<div class="col-lg-6 mb-4">
<div class="form-floating">
<input type="text" class="form-control form-control-lg light-300" id="floatingname" name="inputname" placeholder="Name">
<label for="floatingname light-300">Nombre</label>
</div>
</div><!-- End Input Name -->
<div class="col-lg-6 mb-4">
<div class="form-floating">
<input type="text" class="form-control form-control-lg light-300" id="floatingemail" name="inputemail" placeholder="Email">
<label for="floatingemail light-300">Email</label>
</div>
</div><!-- End Input Email -->
<div class="col-lg-6 mb-4">
<div class="form-floating">
<input type="text" class="form-control form-control-lg light-300" id="floatingphone" name="inputphone" placeholder="Phone">
<label for="floatingphone light-300">Teléfono</label>
</div>
</div><!-- End Input Phone -->
<div class="col-lg-6 mb-4">
<div class="form-floating">
<input type="text" class="form-control form-control-lg light-300" id="floatingcompany" name="inputcompany" placeholder="Company Name">
<label for="floatingcompany light-300">Empresa</label>
</div>
</div><!-- End Input Company Name -->
<div class="col-12">
<div class="form-floating mb-4">
<input type="text" class="form-control form-control-lg light-300" id="floatingsubject" name="inputsubject" placeholder="Subject">
<label for="floatingsubject light-300">Asunto</label>
</div>
</div><!-- End Input Subject -->
<div class="col-12">
<div class="form-floating mb-3">
<textarea class="form-control light-300" rows="8" placeholder="Message" id="floatingtextarea"></textarea>
<label for="floatingtextarea light-300">Mensaje</label>
</div>
</div><!-- End Textarea Message -->
<div class="col-md-12 col-12 m-auto text-end">
<button type="submit" class="btn btn-info rounded-pill px-md-5 px-4 py-2 radius-0 text-light light-300">Enviar Mensaje</button>
</div>
</form>
</div>
</div>
</section>
<!-- End Banner Hero -->
<!-- Start Footer -->
<footer class="bg-info pt-4">
<div class="container">
<div class="row">
<div class="col-lg-3 col-12 align-items-center">
<a class="navbar-brand " href="index.html">
<br><p class="d-flex justify-content-center"><img src ="assets/img/newmaterial/Logoblanco.png" style="height: 30px; width: auto;"></p>
<span class="d-flex justify-content-center text-light peqlo">CALVIÑO & LADANAJ</span><span class="text-light fst-italic d-flex justify-content-center peqloa">- arquitectos -</span>
</a>
</div>
<div class="col-lg-3 col-md-4 my-sm-0 ">
<h3 class="h4 pb-lg-2 text-light light-300">Contenido</h2>
<ul class="list-unstyled text-light light-300">
<li class="pb-1">
<i class='bx-fw bx bx-label bx-xs'></i><a class="text-decoration-none text-light"
href="index.html">Home</a>
</li>
<li class="pb-1">
<i class='bx-fw bx bx-label bx-xs'></i><a class="text-decoration-none text-light py-1"
href="about.html">El Estudio</a>
</li>
<li class="pb-1">
<i class='bx-fw bx bx-label bx-xs'></i><a class="text-decoration-none text-light py-1"
href="work.html">Portfolio</a>
</li>
<li class="pb-1">
<i class='bx-fw bx bx-label bx-xs'></i></i><a class="text-decoration-none text-light py-1"
href="pricing.html">Honorarios</a>
</li>
<li class="pb-1">
<i class='bx-fw bx bx-label bx-xs'></i><a class="text-decoration-none text-light py-1"
href="#">Contáctenos</a>
</li>
</ul>
</div>
<div class="col-lg-3 col-md-4 my-sm-0 ">
<h2 class="h4 pb-lg-2 text-light light-300">Nuestros Servicios</h2>
<ul class="list-unstyled text-light light-300">
<li class="pb-1">
<i class='bx-fw bx bx-label bx-xs'></i><a class="text-decoration-none text-light py-1"
href="#">Proyecto y Dirección</a>
</li>
<li class="pb-1">
<i class='bx-fw bx bx-label bx-xs'></i><a class="text-decoration-none text-light py-1"
href="#">Desarrollos</a>
</li>
<li class="pb-1">
<i class='bx-fw bx bx-label bx-xs'></i><a class="text-decoration-none text-light py-1"
href="#">Imágenes 3d</a>
</li>
</ul>
</div>
<div class="col-lg-3 col-md-4 my-sm-0 ">
<h2 class="h4 pb-lg-2 text-light light-300">Encontranos en:</h2>
<ul class="list-unstyled text-light light-300">
<li class="pb-1">
<i class='bx-fw bx bx-phone bx-xs'></i><a class="text-decoration-none text-light py-1"
href="tel:010-020-0340">2235795724-2235795854</a>
</li>
<li class="pb-1">
<i class='bx-fw bx bx-mail-send bx-xs'></i><a class="text-decoration-none text-light py-1"
href="mailto:[email protected]">[email protected]</a>
</li>
</ul>
<p class="text-light my-0 py-0">
+ seguinos en las redes sociales:
</p>
<ul class="list-inline footer-icons pt-2 light-300">
<li class="list-inline-item m-0">
<a class="text-light" target="_blank" href="https://www.facebook.com/CalvinoLadanaj">
<i class='bx bxl-facebook-square bx-md'></i>
</a>
</li>
<li class="list-inline-item m-0">
<a class="text-light" target="_blank" href="https://www.instagram.com/calvinoladanajarq/">
<i class='bx bxl-instagram-alt bx-md'></i>
</a>
</li>
<li class="list-inline-item m-0">
<a class="text-light" target="_blank" href="https://wa.me/542235795724?text=Hola,%20deseo%20contactarlos%20por%20un%20trabajo.%20Gracias">
<i class='bx bxl-whatsapp bx-md'></i>
</a>
</li>
</ul>
</div>
</div>
</div>
<div class="w-100 bg-light py-3">
<div class="container">
<div class="row pt-2">
<div class="col-lg-6 col-sm-12">
<p class="text-lg-start text-center text-dark light-300">
© Copyright 2021 Calviño & Ladanaj arquitectos. Todos los derechos reservados.
</p>
</div>
<div class="col-lg-6 col-sm-12">
<p class="text-lg-end text-center text-dark light-300">
Diseñado por <a rel="sponsored" class="text-decoration-none text-muted"
href="https://cursophp.com.ar/" target="_blank"><strong>CAC FullStack, en colaboración con Francisco José Calviño #2104</strong></a>
</p>
</div>
</div>
</div>
</div>
</footer>
<!-- End Footer -->
<!-- Bootstrap -->
<script src="assets/js/bootstrap.bundle.min.js"></script>
</body>
</html>