generated from Code-Institute-Org/gitpod-full-template
-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathcontact.html
151 lines (145 loc) · 8.41 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="keywords" content="Virtual Reality, Augmented Reality, VR training, immersive learning">
<meta name="description" content="VR, AR and immersive learning provider in London">
<title>Train in XR - Experts in VR and AR Learning Innovation</title>
<link rel="icon" type="image/x-icon" href="assets/favicon/favicon.ico">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css"
integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous"/>
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body>
<!-- header and navigation section -->
<header>
<nav class="navbar">
<a href="index.html">
<img src="./assets/images/txr_logo.svg" alt="Train in XR main logo" class="logo" aria-label="Train in XR logo">
</a>
<button class="hamburger-icon" id="hamburger" aria-label="menu">
<i class="fas fa-bars"></i>
</button>
<ul class="navbar-ul" id="navbar-ul">
<li><a href="services.html">Our Services</a></li>
<li><a href="about.html">About Us</a></li>
<li><a href="contact.html">Contact Us</a></li>
<li><a href="contact.html" class="link-demo">Book a demo</a></li>
</ul>
<a href="login.html" class="link-login">Client Login</a>
</nav>
</header>
<!-- contact us page hero section -->
<section>
<div class="contact-bg">
<div class="page-container">
<h1 class="page-intro">Contacting us is easy!</h1>
</div>
</div>
</section>
<!-- contact us page intro section -->
<section>
<div class="solutions-intro">
<h2>Get in touch with the right people at TXR.</h2>
<h3>Book a demo. Schedule a meeting. Inquire about partnerships. Don't hesitate to reach out and let us know how we can help you.</h3>
<p>Email a member of our Advisory, Sales, Finance, Technical Support or Recruitment team by completing the form below.</p>
</div>
</section>
<!-- contact us page form section -->
<section class="contact_form-section">
<div class="contact_form-container">
<h3>Please enter your contact details and a short message below.</h3>
<p>You can also choose to <span class="book-demo-color">book a demo</span> or be routed to a specific department. We will try to answer your query within the day.
Alternatively, you can call our customer service team on +44 020 1234 5678 between 9AM to 5PM.</p>
<form action="thankyou.html" method="get" class="contact-form">
<label for="fname">First Name</label>
<input class="contact-input" id="fname" type="text" name="first_name" placeholder="Enter your first name" required>
<label for="lname">Last Name</label>
<input class="contact-input" id="lname" type="text" name="last_name" placeholder="Enter your last name" required>
<label for="company">Company</label>
<input class="contact-input" id="company" type="text" name="company_name" placeholder="Enter your company name" required>
<label for="email">Work Email</label>
<input class="contact-input" id="email" type="email" name="email_address" placeholder="Enter your email address" required>
<label for="phone">Phone Number</label>
<input class="contact-input" id="phone" type="number" name="phone_number" placeholder="Enter your phone number" required>
<label for="book-demo" class="book-demo-color">Book a demo</label>
<select id="book-demo">
<option value="vr-demo">Virtual Reality demo</option>
<option value="ar-demo">Augmented Reality demo</option>
</select>
<label for="txr-team">Which of our team members would you like to contact?</label>
<select id="txr-team">
<option value="advisory">Advisory</option>
<option value="sales">Sales</option>
<option value="finance">Finance</option>
<option value="technical_support">Technical Support</option>
<option value="recruitment">Recruitment</option>
</select>
<label for="message">Tell us how we can help your business</label>
<textarea id="message" rows="3" cols="80" name="message" placeholder="Enter your message" required></textarea>
<input class="btn-large" type="submit" value="Send Message">
</form>
<p><i>By completing this form, you agree to our Terms & Privacy Policy.</i></p>
</div>
</section>
<!-- contact us page map section -->
<section>
<h2 class="map-header">Here's how to easily find us</h2>
<div class="map">
<div>
<iframe class="responsive-map" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2378.7450446789317!2d-2.9735263842676383!3d53.40150047999061!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x487b21b64678d9e5%3A0xddda578d5b795ae7!2sThe%20Immersive%20Learning%20Studio!5e0!3m2!1sen!2suk!4v1639110585284!5m2!1sen!2suk"
style="border:0;" allowfullscreen="" loading="lazy">
</iframe>
</div>
</div>
</section>
<!-- footer section -->
<footer class="footer">
<div class="footer-container">
<div class="footer-about">
<a href="index.html">
<img src="./assets/images/txr_logo_footer.svg" class="footer-logo" alt="Train in XR logo">
</a>
<div>
<p>
We are a team of software developers, 3D modellers and learning professionals.
We're here to help solve your workforce training challenges through learning innovation.
</p>
</div>
<div class="social-networks">
<a href="https://uk.linkedin.com/" target="_blank" rel="noopener" aria-label="link to LinkedIn"><i class="fab fa-linkedin-in"></i></a>
<a href="https://twitter.com/" target="_blank" rel="noopener" aria-label="link to Twitter"><i class="fab fa-twitter"></i></a>
<a href="https://en-gb.facebook.com/" target="_blank" rel="noopener" aria-label="link to Facebook"><i class="fab fa-facebook-f"></i></a>
<a href="https://www.instagram.com/?hl=en" target="_blank" rel="noopener" aria-label="link to Instagram"><i class="fab fa-instagram"></i></a>
<a href="https://www.youtube.com/" target="_blank" rel="noopener" aria-label="link to YouTube"><i class="fab fa-youtube"></i></a>
</div>
</div>
<div class="footer-services">
<h3>Services</h3>
<div>
<ul>
<li><a href="services.html">Advisory Consulting</a></li>
<li><a href="services.html">Learning & Development Transformation</a></li>
<li><a href="services.html">Virtual Reality</a></li>
<li><a href="services.html">Augmented Reality</a></li>
</ul>
</div>
</div>
<div class="footer-contact">
<h3>Address</h3>
<div>
<ul>
<li><i class="fas fa-map-marker-alt"></i> 123 Excel Street, London, EC2A 1BN, UK</li>
<li><i class="fas fa-phone"></i> +44 020 1234 5678</li>
<li><a href="mailto:info@txr.com" target="_blank"><i class="fas fa-at"></i> info@txr.com</a></li>
</ul>
<p class="copyright"><i>Copyright © Joy Zadan (2021)</i></p>
</div>
</div>
</div>
</footer>
<script src="assets/js/script.js"></script>
</body>
</html>