Advertisement
Guest User

HTML

a guest
Feb 8th, 2019
96
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.97 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  6. <meta http-equiv="X-UA-Compatible" content="ie=edge">
  7. <title>Alpaso</title>
  8. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  9. <link rel="stylesheet" href="/css/estilos.css">
  10. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  11. <script src="js/script.js"></script>
  12. <script src="js/responsiveslides.js"></script>
  13. <script src="js/responsiveslides.min.js"></script>
  14. <link rel="stylesheet" href="css/responsiveslides.css">
  15. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css">
  16. <link rel="icon" type="image/png" href="img/logocomollegar.png" />
  17. <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
  18.  
  19. </head>
  20. <body>
  21. <header>
  22. <div class="cabecera">
  23. <img class="logohome" src="img/logoalpaso.png" alt="logo">
  24. <div class="hamburguesa"></div>
  25. <div class="textocabecera">
  26. <h1>Inicia tu Aventura</h1>
  27. <span><h2>─────</h2></span>
  28. <h2>Start your Adventure</h2>
  29. </div>
  30. </div>
  31. <nav>
  32. <div class="hamactivo"></div>
  33. <img class="logomenu" src="img/logoalpaso.png" alt="logo">
  34. <ul class="navegacionlinks">
  35.  
  36. <li><a href="#actividades">Actividades</a></li>
  37. <li><a href="#experiencia">Experiencias</a></li>
  38. <li><a href="#comollegar">Como Llegar</a></li>
  39. <li><a href="#contacto">Contacto y Consultas</a></li>
  40. <li><a href="#actividades">Activities</a></li>
  41. <li><a href="#experiencia">Experience</a></li>
  42. <li><a href="#comollegar">Location</a></li>
  43. <li><a href="#contacto">Contact and Queries</a></li>
  44.  
  45. </ul>
  46. <div class="logossociales">
  47. <ul>
  48. <a href="https://www.facebook.com/alpasoaventuracba" target="blank"><li><i class="fab fa-facebook-f"></i></li></a>
  49. <a href="https://www.instagram.com/alpasoaventura/" target="blank"><li><i class="fab fa-instagram"></i></li></a>
  50. <a href="https://www.youtube.com/channel/UCz0ZjeYtmMcZfRSmi_BVZpQ?view_as=subscriber" target="blank"><li><i class="fab fa-youtube"></i></li></a>
  51. </ul>
  52. </div>
  53. </nav>
  54. <div class="clearfix"></div>
  55. </div>
  56. </header>
  57.  
  58. <section id="actividades">
  59.  
  60. <div class="logoesquina">
  61. <img src="/img/logoalpaso.png">
  62. </div>
  63.  
  64. <div class="encabezado">
  65. <h2>ACTIVIDADES</h2>
  66. <span><h2>───────</h2></span>
  67. <span><h3>Activities</h3></span>
  68. </div>
  69. <div class="contenedoractividades">
  70. <div class="actividadesespañol">
  71. <h3>DÍA DE<br> CAMPO Y CABALGATAS</h3>
  72. <ul>
  73. <li>Paseos a caballo</li>
  74. <li>Senderismo</li>
  75. <li>Caminatas</li>
  76. <li>Huerta y Granja</li>
  77. <li>Juegos recreativos</li>
  78. <li>Gastronomía criolla y campestre</li>
  79. <li>Reconocimientde flora y fauna</li>
  80. <li>Descanso disfrute en el río San Pedro</li>
  81. </ul>
  82. </div>
  83. <div class="actividadesingles">
  84. <h3>DAY AT THE<br> COUNTRYSIDE AND HORSERIDING</h3>
  85. <ul>
  86. <li>Horseback riding</li>
  87. <li>Hiking</li>
  88. <li>Trekking</li>
  89. <li>Gardening and farm</li>
  90. <li>Recreational games</li>
  91. <li>Creole and country Cuisine</li>
  92. <li>Recognition of flora and fauna</li>
  93. <li>Leisure and enjoyment in the San Pedro River</li>
  94. </ul>
  95. </div>
  96. </div>
  97. <div class="vergaleria">
  98. <a href="#slideractividades"><h4>Ver <br>Experiencia</h4>
  99. <i class="fas fa-angle-down"></i>
  100. </a>
  101. <div class="clearfix"></div>
  102. </div>
  103. <div class="clearfix"></div>
  104. <div class="clearfix"></div>
  105. </section>
  106. <div class="clearfix"></div>
  107.  
  108. <section id="slideractividades" class="slideruno">
  109. <img src="img/logoalpaso.png" class="logoslideruno">
  110. <ul class="rslides">
  111. <li><img src="img/1.jpg" alt=""></li>
  112. <li><img src="img/2.jpg" alt=""></li>
  113. <li><img src="img/3.jpg" alt=""></li>
  114. <li><img src="img/5.jpg" alt=""></li>
  115. <li><img src="img/6.jpg" alt=""></li>
  116. <li><img src="img/7.jpg" alt=""></li>
  117. </ul>
  118. </section>
  119.  
  120. <section id="experiencia">
  121. <div class="logoesquina">
  122. <img src="/img/logoalpaso.png">
  123. </div>
  124. <div class="encabezado">
  125. <h2>Experiencia</h2>
  126. <span><h2>───────</h2></span>
  127. <span><h3>Experience</h3></span>
  128. </div>
  129. <P> Alpaso es encuentro, es conexión, es contacto con uno mismo, con la familia, con amigos, con colegas, con la naturaleza. Anclada en el corazón de las Sierras de Córdoba te abraza, con sus excelentes anfitriones que generan todas las condiciones para que disfrutes de una aventura diferente.
  130. Alpaso es una propuesta diferente, guiado por profesionales de excelencia, puedes disfrutar de:
  131. Cabalgatas con caballos preparados para que te acompañen en ésta travesía; Senderismo a través de ríos de agua cristalina, aire puro. Inspirando profundo, encuentras armonía y paz interior.</P>
  132. <P>Alpaso is encounter, connection, contact with oneself, with family, friends, colleagues, with nature. Anchored in the heart of the Sierras de Córdoba, it embraces you, with its excellent hosts who offer all the conditions for you to enjoy a different adventure.
  133. Alpaso is a different proposal, guided by professionals of excellence. You can enjoy:
  134. Horseback riding with horses prepared to accompany you in this journey; hiking through crystal rivers, fresh air. Breathing in deeply, you can find harmony and inner peace.</P>
  135. <div class="vergaleria">
  136. <a href="#sliderexperiencia"><h4>Ver <br>Experiencia</h4>
  137. <i class="fas fa-angle-down"></i>
  138. </a>
  139. <div class="clearfix"></div>
  140. </div>
  141. <div class="clearfix"></div>
  142. <div class="clearfix"></div>
  143. </section>
  144.  
  145. <section id="sliderexperiencia" class="slideruno">
  146. <img src="img/logoalpaso.png" class="logoslideruno">
  147. <ul class="rslides">
  148. <li><img src="img/8.jpg" alt=""></li>
  149. <li><img src="img/9.jpg" alt=""></li>
  150. <li><img src="img/10.jpg" alt=""></li>
  151. <li><img src="img/11.jpg" alt=""></li>
  152. <li><img src="img/12.jpg" alt=""></li>
  153. <li><img src="img/13.jpg" alt=""></li>
  154. <li><img src="img/14.jpg" alt=""></li>
  155. <li><img src="img/15.jpg" alt=""></li>
  156. <li><img src="img/16.jpg" alt=""></li>
  157. <li><img src="img/17.jpg" alt=""></li>
  158. <li><img src="img/18.jpg" alt=""></li>
  159. <li><img src="img/19.jpg" alt=""></li>
  160. </ul>
  161. </section>
  162.  
  163. <section id="comollegar">
  164. <div class="logoesquina">
  165. <img src="/img/logoalpaso.png">
  166. </div>
  167. <div class="clearfix"></div>
  168. <div class="clearfix"></div>
  169.  
  170. <div class="encabezado">
  171. <h2>Cómo llegar</h2>
  172. <span><h2>───────</h2></span>
  173. <span><h3>Location</h3></span>
  174. </div>
  175. <div class="comollegarcolumnas">
  176. <div class="textocomollegar">
  177. <p> El lugar se encuentra enclavado a orillas de Río San Pedro a 7 km de San Clemente en el Valle de Paravachasca.
  178. San Clemente se encuentra a 1h 30 min (76 km) de la ciudad de Córdoba</p>
  179. <p>The place is located on the San Pedro River banks 7 km away from San Clemente in the Paravachasca Valley.
  180. San Clemente is located at 1h 30 min (76 km) from the city of Córdoba.</p>
  181. </div>
  182. <div class="clearfix"></div>
  183. <div class="mapagoogle">
  184. <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2890.450986978471!2d-64.63100868514107!3d-31.70793498130802!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x0!2zMzHCsDQyJzI4LjYiUyA2NMKwMzcnNDMuOCJX!5e1!3m2!1ses-419!2sar!4v1547557578357" width="100%" height="100%" frameborder="0" style="border:0" allowfullscreen></iframe>
  185. </div>
  186. </div>
  187. </section>
  188.  
  189. <section id="contacto">
  190. <div class="logoesquina">
  191. <img src="/img/logoalpaso.png">
  192. </div>
  193. <img src="img/logoalpaso.png" class="logoslideruno">
  194.  
  195. <div class="columnascontacto">
  196. <div class="encabezado">
  197. <h2>Contacto y <br>consultas</h2>
  198. <span><h2>──────</h2></span>
  199. <span><h3>Contact and Queries</h3></span>
  200. </div>
  201. <div class="clearfix"></div>
  202. <form class="formulario needs-validation">
  203. <div class="formuno">
  204. <label>Nombre y Apellido / Name and Last Name:</label><br>
  205. <input id="nombre" type="text" name="nombre" required>
  206. <br>
  207. <label>Correo Electronico / Email:</label><br>
  208. <input id="email" type="email" name="email" id="email" required>
  209. <br>
  210. <label>Telefono / Phone:</label><br>
  211. <input id="telefono" type="tel" name="telefono" required>
  212. <br>
  213. </div>
  214. <div class="formdos">
  215. <label>Mensaje / Message:</label><br>
  216. <textarea id="mensaje" name="mensaje" id="mensaje" cols="30" rows="10" required></textarea>
  217. <br>
  218. <input class="boton" type="submit" value="Enviar / Send">
  219. </div>
  220. <div class="clearfix"></div>
  221. <div class="matriculas">
  222. <h2>Prestadores de Turismo Alternativo de la Provincia de Córdoba Ley 8801/99</h2>
  223. <div class="textomatriculas">
  224. <h3>Maglione Silvia del Valle <span>Resolución 383/18</span></h3>
  225. <h3>Celoria Jose Luis <span>Resolución 386/18</span></h3>
  226. <h3>Weller Fernando Mauricio <span>Resolución 012/19</span></h3>
  227. <h3>Sosa Enrique <span>Resolución 013/19</span></h3>
  228. </div>
  229. <div class="telefonoscolum">
  230. <i class="fab fa-whatsapp"></i>
  231. <h3>&nbsp+54&nbsp9&nbsp351&nbsp5312040&nbsp/&nbsp+54&nbsp9&nbsp351&nbsp6624403</h3>
  232. </div>
  233. </div>
  234. </form>
  235. </div>
  236. <div class="clearfix"></div>
  237.  
  238. <div class="clearfix"></div>
  239.  
  240. </section>
  241. <section class="redesfix">
  242. <div class="logossociales">
  243. <ul>
  244. <a href="https://www.facebook.com/alpasoaventuracba" target="blank"><li><i class="fab fa-facebook-f"></i></li></a>
  245. <a href="https://www.instagram.com/alpasoaventura/" target="blank"><li><i class="fab fa-instagram"></i></li></a>
  246. <a href="https://www.youtube.com/channel/UCz0ZjeYtmMcZfRSmi_BVZpQ?view_as=subscriber" target="blank"><li><i class="fab fa-youtube"></i></li></a>
  247. </ul>
  248. </div>
  249.  
  250. </section>
  251.  
  252. <footer>
  253.  
  254. <h3>Desarrollado por <span>Aybrand</span></h3>
  255. </footer>
  256. </body>
  257. <script>
  258. $(function() {
  259. $(".rslides").responsiveSlides();
  260. });
  261. </script>
  262.  
  263. <script>
  264. $(".rslides").responsiveSlides({
  265. auto: true, // Boolean: Animate automatically, true or false
  266. speed: 500, // Integer: Speed of the transition, in milliseconds
  267. timeout: 4000, // Integer: Time between slide transitions, in milliseconds
  268. pager: false, // Boolean: Show pager, true or false
  269. nav: true, // Boolean: Show navigation, true or false
  270. random: false, // Boolean: Randomize the order of the slides, true or false
  271. pause: false, // Boolean: Pause on hover, true or false
  272. pauseControls: true, // Boolean: Pause when hovering controls, true or false
  273. prevText: "<", // String: Text for the "previous" button
  274. nextText: ">", // String: Text for the "next" button
  275. maxwidth: "", // Integer: Max-width of the slideshow, in pixels
  276. navContainer: "", // Selector: Where controls should be appended to, default is after the 'ul'
  277. manualControls: "", // Selector: Declare custom pager navigation
  278. namespace: "rslides", // String: Change the default namespace used
  279. before: function(){}, // Function: Before callback
  280. after: function(){} // Function: After callback
  281. });
  282. </script>
  283. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement