-
Notifications
You must be signed in to change notification settings - Fork 4
/
Home.html
198 lines (187 loc) · 14.1 KB
/
Home.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
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="index.css">
<script src="https://kit.fontawesome.com/7e84930048.js" crossorigin="anonymous"></script>
<title>Home</title>
</head>
<body>
<header>
<nav class="navbar navbar-expand-lg navbar-light navbar-yellow bg-gradient shadow">
<div class="container">
<img src="./imagenes/logo.png" class="d-inline-block mx-3" height=25 alt="Aquí va el logo de la pag">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item px-2">
<a class="nav-link" aria-current="page" href="#">Inicio</a>
</li>
<li class="nav-item px-2">
<a class="nav-link" href="./contacto.html">Contacto</a>
</li>
<li class="nav-item px-2">
<a class="nav-link" href="/Aboutus.html">Sobre nosotros</a>
</li>
</ul>
<div class="d-flex">
<a class="btn btn-brown mx-2" data-bs-toggle="modal" data-bs-target="#exampleModal">Suscribirse</a>
<a class="btn btn-brown" href="/login.html">Log in</a>
</div>
</div>
</div>
</nav>
</header>
<br class="br"><br class="br"><br class="br"><br class="br"><br class="br">
<div class="efecto-hoja container-fluid">
<br><br><br>
<div class="d-flex justify-content-around primera-vista">
<h1 id="left-text-style">Conocé aca los mejores lugares para salir este fin de semana con tu familia.</h1>
<img class=" cascada-del-rio-noque" src="./img/cascada xD.jpg" alt="cascada-del-rio-noque">
</div>
<div class="container-fluid d-flex justify-content-center py-5">
<a class="btn btn-outline-success" href="/Galeria.html">Ver Senderos</a>
</div>
<p class="fs-3 text-center font-bold">En esta pagina encontraras todo lo referido a trekking senderismo y caminatas de tucuman, con sus horarios y
dificultades, ubicacones y más!</p>
<table class="table">
<thead>
<tr>
<th scope="col">Senderos</th>
<th scope="col">dificultad</th>
<th scope="col">Duración</th>
<th scope="col">como llegar</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row"><a href="/post3.html"><div class="d-flex justify-content-between">Cascada de los Alisos <img class="cascadas-imagenes alisos-XD"
src="./img/cascada de los alisos xD.jpg" alt="cascada-alisos"></div></a></th>
<td class="pt-5"><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-regular fa-star"></i><i class="fa-regular fa-star"></i></td>
<td class="pt-5">2Hr 30M</td>
<td class="pt-5"><i class="fa-solid fa-person-walking fs-1 px-2"></i><i class="fa-solid fa-bicycle fs-1"></i></td>
</tr>
<tr>
<th scope="row"><a href="/post4.html"><div class="d-flex justify-content-between"> Cascada aguas hiquitas <img class="cascadas-imagenes"
src="./img/images/aguas_chiquitas.jpg" alt="aguas-chiquitas"></div></a></th>
<td class="pt-5"><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-regular fa-star"></i></td>
<td class="pt-5">2Hr</td>
<td class="pt-5"><i class="fa-solid fa-person-walking fs-1 px-2"></i></td>
</tr>
<tr>
<th scope="row"><a href="/post1.html"><div class="d-flex justify-content-between">Cascada huaicondo <img class="cascadas-imagenes"
src="./img/images/huaico hondo.jpg" alt="aguas-chiquitas"></div></a></th>
<td class="pt-5"><i class="fa-solid fa-star"></i><i class="fa-regular fa-star"></i><i class="fa-regular fa-star"></i><i class="fa-regular fa-star"></i><i class="fa-regular fa-star"></i></td>
<td class="pt-5">1Hr</td>
<td class="pt-5"><i class="fa-solid fa-person-walking fs-1 px-2"></i><i class="fa-solid fa-bicycle fs-1"></i></td>
</tr>
<tr>
<th scope="row"><a href="/post6.html"><div class="d-flex justify-content-between">Cascada la ciénaga <img class="cascadas-imagenes"
src="./img/images/la_cienaga.jpg" alt="aguas-chiquitas"></div></a></th>
<td class="pt-5"><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i></td>
<td class="pt-5">3Hr 30M</td>
<td class="pt-5"><i class="fa-solid fa-person-walking fs-1 px-2"></i><i class="fa-solid fa-bicycle fs-1"></i><i class="fa-solid fa-car fs-1 px-2"></i></td>
</tr>
<tr>
<th scope="row"><a href="/post2.html"><div class="d-flex justify-content-between">Cascada los pizarros <img class="cascadas-imagenes"
src="./img/images/los_pizarros.jpg" alt="aguas-chiquitas"></div></a></th>
<td class="pt-5"><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-regular fa-star"></i><i class="fa-regular fa-star"></i></td>
<td class="pt-5">1Hr 30M</td>
<td class="pt-5"><i class="fa-solid fa-person-walking fs-1 px-2"></i></td>
</tr>
<tr>
<th scope="row"><a href="/post5.html"><div class="d-flex justify-content-between">Cascada quebrada portugués<img class="cascadas-imagenes"
src="./img/images/quebrada_portugues.jpg" alt="aguas-chiquitas"></div></a></th>
<td class="pt-5"><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-regular fa-star"></i><i class="fa-regular fa-star"></i><i class="fa-regular fa-star"></i></td>
<td class="pt-5">2Hr 30M</td>
<td class="pt-5"><i class="fa-solid fa-person-walking fs-1 px-2"></i><i class="fa-solid fa-bicycle fs-1"></i><i class="fa-solid fa-car fs-1 px-2"></i></td>
</tr>
</tbody>
</table>
</div>
<br><br><br>
<footer class="footer-yellow bg-gradient p-3">
<div class="container">
<div class="row align-items-center justify-content-center">
<div class="col-md-4 col-12 text-center">
<img src="./imagenes/logo.png" height=25 alt="Aquí va el logo de la pag">
</div>
<div class="my-2 my-md-0 col-md-4 text-center">
<div class="d-flex justify-content-center">
<a href="#" class="link-rrss">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor"
class="bi bi-facebook" viewBox="0 0 16 16">
<path
d="M16 8.049c0-4.446-3.582-8.05-8-8.05C3.58 0-.002 3.603-.002 8.05c0 4.017 2.926 7.347 6.75 7.951v-5.625h-2.03V8.05H6.75V6.275c0-2.017 1.195-3.131 3.022-3.131.876 0 1.791.157 1.791.157v1.98h-1.009c-.993 0-1.303.621-1.303 1.258v1.51h2.218l-.354 2.326H9.25V16c3.824-.604 6.75-3.934 6.75-7.951z" />
</svg>
</a>
<a href="#" class="link-rrss d-inline-block mx-3">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor"
class="bi bi-twitter" viewBox="0 0 16 16">
<path
d="M5.026 15c6.038 0 9.341-5.003 9.341-9.334 0-.14 0-.282-.006-.422A6.685 6.685 0 0 0 16 3.542a6.658 6.658 0 0 1-1.889.518 3.301 3.301 0 0 0 1.447-1.817 6.533 6.533 0 0 1-2.087.793A3.286 3.286 0 0 0 7.875 6.03a9.325 9.325 0 0 1-6.767-3.429 3.289 3.289 0 0 0 1.018 4.382A3.323 3.323 0 0 1 .64 6.575v.045a3.288 3.288 0 0 0 2.632 3.218 3.203 3.203 0 0 1-.865.115 3.23 3.23 0 0 1-.614-.057 3.283 3.283 0 0 0 3.067 2.277A6.588 6.588 0 0 1 .78 13.58a6.32 6.32 0 0 1-.78-.045A9.344 9.344 0 0 0 5.026 15z" />
</svg>
</a>
<a href="#" class="link-rrss">
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="currentColor"
class="bi bi-instagram" viewBox="0 0 16 16">
<path
d="M8 0C5.829 0 5.556.01 4.703.048 3.85.088 3.269.222 2.76.42a3.917 3.917 0 0 0-1.417.923A3.927 3.927 0 0 0 .42 2.76C.222 3.268.087 3.85.048 4.7.01 5.555 0 5.827 0 8.001c0 2.172.01 2.444.048 3.297.04.852.174 1.433.372 1.942.205.526.478.972.923 1.417.444.445.89.719 1.416.923.51.198 1.09.333 1.942.372C5.555 15.99 5.827 16 8 16s2.444-.01 3.298-.048c.851-.04 1.434-.174 1.943-.372a3.916 3.916 0 0 0 1.416-.923c.445-.445.718-.891.923-1.417.197-.509.332-1.09.372-1.942C15.99 10.445 16 10.173 16 8s-.01-2.445-.048-3.299c-.04-.851-.175-1.433-.372-1.941a3.926 3.926 0 0 0-.923-1.417A3.911 3.911 0 0 0 13.24.42c-.51-.198-1.092-.333-1.943-.372C10.443.01 10.172 0 7.998 0h.003zm-.717 1.442h.718c2.136 0 2.389.007 3.232.046.78.035 1.204.166 1.486.275.373.145.64.319.92.599.28.28.453.546.598.92.11.281.24.705.275 1.485.039.843.047 1.096.047 3.231s-.008 2.389-.047 3.232c-.035.78-.166 1.203-.275 1.485a2.47 2.47 0 0 1-.599.919c-.28.28-.546.453-.92.598-.28.11-.704.24-1.485.276-.843.038-1.096.047-3.232.047s-2.39-.009-3.233-.047c-.78-.036-1.203-.166-1.485-.276a2.478 2.478 0 0 1-.92-.598 2.48 2.48 0 0 1-.6-.92c-.109-.281-.24-.705-.275-1.485-.038-.843-.046-1.096-.046-3.233 0-2.136.008-2.388.046-3.231.036-.78.166-1.204.276-1.486.145-.373.319-.64.599-.92.28-.28.546-.453.92-.598.282-.11.705-.24 1.485-.276.738-.034 1.024-.044 2.515-.045v.002zm4.988 1.328a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92zm-4.27 1.122a4.109 4.109 0 1 0 0 8.217 4.109 4.109 0 0 0 0-8.217zm0 1.441a2.667 2.667 0 1 1 0 5.334 2.667 2.667 0 0 1 0-5.334z" />
</svg>
</a>
</div>
</div>
<div class="col-md-4 text-center">
© 2022
</div>
</div>
</div>
</footer>
<!-- MODAL SUBSCRPCION -->
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content shadow">
<div class="modal-header">
<h5 class="modal-title text-success" id="exampleModalLabel">¡Suscribite!</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="nombre">Nombre:</label>
<input type="text" class="form-control" id="nombre">
</div>
<div class="form-group">
<label for="apellido">Apellido:</label>
<input type="text" class="form-control" id="apellido">
</div>
<div class="form-group">
<label for="email">Email:</label>
<input type="email" class="form-control" id="email">
<div id="passwordHelpBlock" class="form-text">
Todas las novedades llegarán a este correo
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-success" data-bs-dismiss="modal">Salir</button>
<button type="button" class="btn btn-success">Confirmar suscripción</button>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
crossorigin="anonymous"></script>
</body>
</html>