120 lines
4.6 KiB
HTML
120 lines
4.6 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="es">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<link rel="stylesheet" href="../CSS/main.css">
|
||
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
|
||
|
|
<script src="../JS/index.js"></script>
|
||
|
|
<title>La Forja Dorada</title>
|
||
|
|
</head>
|
||
|
|
<body onload="cargado(), validarFormulario()">
|
||
|
|
<header class="grid-cabeza-container">
|
||
|
|
<div class="grid-cabeza-logo">
|
||
|
|
<img src="..\RECURSOS\Logo\LogoForjaDorada200x160.png" alt="">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<ul class="barraInicio">
|
||
|
|
<li class="itemBarra">
|
||
|
|
<a href="index.html" class="enlacePaginas"><b>INICIO</b></a>
|
||
|
|
|
||
|
|
</li>
|
||
|
|
<li class="itemBarra">
|
||
|
|
<a href="Productos.html" class="enlacePaginas"><b>PRODUCTOS</b></a>
|
||
|
|
</li>
|
||
|
|
<li class="itemBarra">
|
||
|
|
<a href="Servicios.html" class="enlacePaginas"><b>SERVICIOS</b></a>
|
||
|
|
|
||
|
|
</li>
|
||
|
|
<li class="itemBarra">
|
||
|
|
<a href="Eventos.html" class="enlacePaginas"><b>EVENTOS</b></a>
|
||
|
|
|
||
|
|
</li>
|
||
|
|
<li class="itemBarra">
|
||
|
|
<a href="Contactos.html" class="enlacePaginas"><b>CONTACTO</b></a>
|
||
|
|
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
|
||
|
|
<button class="btn-up" id="botonArriba">
|
||
|
|
<i class="fa-solid fa-arrow-up"></i>
|
||
|
|
</button>
|
||
|
|
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<div class="titulo-contacto" id="articulo-cont">
|
||
|
|
<h2 class="titulo-inicio">
|
||
|
|
CONTACTO
|
||
|
|
</h2>
|
||
|
|
</div>
|
||
|
|
<section class="cuerpo-contacto">
|
||
|
|
<article class="articulo-contacto">
|
||
|
|
<figure class="img-contacto">
|
||
|
|
<img src="..\RECURSOS\Contacto\cartacontacto300.jpg" alt="imagencontacto">
|
||
|
|
</figure>
|
||
|
|
<h3 class="titulos-h3">
|
||
|
|
<span class="titulosh3-esp">
|
||
|
|
¡Ponte en contacto con nosotros!
|
||
|
|
</span>
|
||
|
|
</h3>
|
||
|
|
<p>
|
||
|
|
Puedes contactar con nosotros solicitando más información,
|
||
|
|
para encargarnos algún producto/servicio o para enterarte
|
||
|
|
sobre el funcionamiento de los próximos eventos. Para ello,
|
||
|
|
completa y envía el formulario que encontrarás a continuación:
|
||
|
|
</p>
|
||
|
|
</article>
|
||
|
|
<div class="formulario-contacto">
|
||
|
|
<h2>Contacta con La Forja</h2>
|
||
|
|
<form action="https://formsubmit.co/7e360d9cc9ca04dfaa14e5a35e53cf18" method="POST" id="formularioContacto">
|
||
|
|
<label for="name">Nombre:</label>
|
||
|
|
<input type="text" name="name" >
|
||
|
|
|
||
|
|
<label for="mail">
|
||
|
|
<span>Correo Electrónico:</span>
|
||
|
|
<input type="email" name="mail" id="mailForm" >
|
||
|
|
<span class="error" aria-live="polite" id="mailErrorArea"></span>
|
||
|
|
</label>
|
||
|
|
<label for="subject">Asunto:</label>
|
||
|
|
<input type="text" name="subject" id="formSubject">
|
||
|
|
|
||
|
|
<label for="comentarios">Comentarios:</label>
|
||
|
|
<textarea name="comments" id="formComment" cols="30" rows="10"></textarea>
|
||
|
|
<button type="button" class="boton-enviar-form" id="enviarForm">Enviar</button>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<footer class="pie-forja">
|
||
|
|
<nav class="contenedor-listas-pie">
|
||
|
|
<ul class="lista-pie-forja">
|
||
|
|
<li class="cabeza-lista-pie">Redes Sociales</li>
|
||
|
|
<li class="item-lista-pie">
|
||
|
|
<a href="https://instagram.com/arkantthos?utm_source=qr" target="_blank">
|
||
|
|
Instagram
|
||
|
|
</a>
|
||
|
|
</li>
|
||
|
|
<li class="item-lista-pie">Facebook</li>
|
||
|
|
<li class="item-lista-pie">
|
||
|
|
<a href="https://www.ebay.es/usr/thegoldenforge" target="_blank">Ebay</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
<ul class="lista-pie-forja">
|
||
|
|
<li class="cabeza-lista-pie">Documentación de Interés</li>
|
||
|
|
<li class="item-lista-pie">
|
||
|
|
<a href="../HTML/PoliticaDatos.html">Política de Privacidad</a>
|
||
|
|
</li>
|
||
|
|
<li class="item-lista-pie">
|
||
|
|
<a href="../HTML/Galletas.html">Gestión de Cookies</a>
|
||
|
|
</li>
|
||
|
|
<li class="item-lista-pie">
|
||
|
|
<a href="../HTML/AvisosLegales.html">Avisos Legales</a>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</nav>
|
||
|
|
</footer>
|
||
|
|
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|