-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
127 lines (114 loc) · 5.68 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Home | businesslanguages</title>
<link rel="icon" type="image/png" sizes="16x16" href="./images/favicon-logo.png">
<link rel="stylesheet" href="./styles/index.css">
<link href='https://fonts.googleapis.com/css?family=Noto Serif' rel='stylesheet'>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
</head>
<body>
<header>
<div class="header-content">
<img src="./images/logo.webp" width="76px" height="72px">
<img src="./images/logo-title.webp" width="103px" height="58px">
<nav class="navbar">
<ul>
<li><a href="Home">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact Us</a></li>
</ul>
</nav>
</div>
</header>
<main>
<div class="hero-container">
<h1>English for Business Success</h1>
<p>join our vibrant community and begin your language learning journey.</p>
<button>Contact Us</button>
<hr>
</div>
<div class="content-container">
<div class="video-container">
<iframe width="100%" height="100%" src="https://www.youtube.com/embed/adXj8sz4ozU?si=8SHRWN0HZz767e9u" title="YouTube video player" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
</div>
<div class="form-container">
<h1>Contact Us!</h1>
<!--Contact detail form for users to send messages to the business.-->
<form class="form-contact" action="#" method="get">
<!--Name field with a label-->
<table>
<tr>
<td>Name</td>
<td><input type="text" id="name" name="name" minlength= "1" title="Please enter in a valid name." placeholder="e.g. John Doe" required></td>
</tr>
<tr>
<td>E-Mail:</td>
<td><input type="email" id="email" name="email" title="please enter a valid email: you@example.com" placeholder="you@example.com" required></td>
</tr>
<tr>
<td>Business Website:</td>
<td><input type="url" id="business-website" name="business-website" pattern="http(s?)(:\/\/)((www.)?)(([^.]+)\.)?([a-zA-z0-9\-_]+)(.com|.net|.gov|.org|.in)(\/[^\s]*)?" title="please enter a valid url: https://www.yourbusiness.com" placeholder="https://www.yourbusiness.com" required></td>
</tr>
<tr>
<td>Subject:</td>
<td><input type="text" id="subject" name="subject" placeholder="topic"></td>
</tr>
<tr>
<td>Your Message:</td>
<td><textarea placeholder="Type your message here..."></textarea></td>
</tr>
<tr>
<td><button type="submit">Submit</button></td>
</tr>
</table>
</form>
<div class="contact-card">
<table>
<tr>
<td><h3>Visit Us</h3></td>
<td><p>Adress 1</p></td>
<td><p>Adress 2</p></td>
</tr>
<tr>
<td><h3>Email</h3></td>
<td><p>info@placeholder.de</p></td>
</tr>
<tr>
<td><h3>Phone</h3></td>
<td><p>+ XX XXXXXXXXXX</p></td>
</tr>
<tr>
<td><h3>Opening Hours</h3></td>
<td><p>M-F: 9:00AM-6:00PM</p></td>
<td></td>
</tr>
</table>
</div>
<div class="map-container">
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d5299.62989237724!2d10.849799!3d48.38329100000001!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x479ebcdc0a913c13%3A0xc251e675dd293f06!2sDr.-D%C3%BCrrwanger-Stra%C3%9Fe%2015F%2C%2086156%20Augsburg%2C%20Germany!5e0!3m2!1sen!2sus!4v1715632174435!5m2!1sen!2sus" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
</div>
</div>
</main>
<footer>
<div class="footer-container">
<a href="index.html">Home</a>
<a href="about.html">About us</a>
<a href="team.html">Our team</a>
<a href="online-training.html">Online trainings</a>
<a href="language-training.html">Language trainings</a>
<a href="translations.html">Translations</a>
<a href="business-and-guiness.html">Business & Guiness</a>
<a href="webseries.html">Webseries</a>
<a href="language-holidays.html">Language holidays</a>
<a href="contact.html">Contact us</a>
</div>
</footer>
</body>
</html>