Skip to content

Commit 154d7ce

Browse files
authored
Add files via upload
1 parent 31b3e33 commit 154d7ce

19 files changed

+739
-0
lines changed

about_us.html

Lines changed: 214 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,214 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>About Us | TravelBloom</title>
6+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
7+
<style>
8+
* {
9+
margin: 0;
10+
padding: 0;
11+
box-sizing: border-box;
12+
font-family: 'Arial', sans-serif;
13+
}
14+
15+
body {
16+
color: white;
17+
background: transparent;
18+
}
19+
20+
.background-blur {
21+
position: fixed;
22+
top: 0;
23+
left: 0;
24+
width: 100%;
25+
height: 100%;
26+
background-image: url('aboutus.jpg'); /* Replace with actual background */
27+
background-size: cover;
28+
background-position: center;
29+
filter: blur(8px);
30+
z-index: -1;
31+
}
32+
33+
nav {
34+
display: flex;
35+
justify-content: space-between;
36+
align-items: center;
37+
background: rgba(0, 0, 0, 0.6);
38+
padding: 15px 30px;
39+
}
40+
41+
.logo {
42+
font-size: 24px;
43+
font-weight: bold;
44+
}
45+
46+
.nav-links a {
47+
margin: 0 15px;
48+
color: white;
49+
text-decoration: none;
50+
}
51+
52+
.about-section {
53+
padding: 100px 50px 50px 50px;
54+
max-width: 1000px;
55+
margin: auto;
56+
}
57+
58+
.about-section h1 {
59+
font-size: 48px;
60+
margin-bottom: 30px;
61+
}
62+
63+
.about-section p {
64+
font-size: 20px;
65+
line-height: 1.7;
66+
margin-bottom: 30px;
67+
}
68+
69+
.highlight {
70+
font-weight: bold;
71+
color: #ffeb3b;
72+
}
73+
74+
.team-section {
75+
margin-top: 60px;
76+
}
77+
78+
.team-section h2 {
79+
font-size: 36px;
80+
margin-bottom: 30px;
81+
}
82+
83+
.team-cards {
84+
display: flex;
85+
flex-wrap: wrap;
86+
gap: 30px;
87+
}
88+
89+
.team-member {
90+
background: rgba(0, 0, 0, 0.5);
91+
border-radius: 10px;
92+
padding: 20px;
93+
flex: 1 1 250px;
94+
max-width: 300px;
95+
text-align: center;
96+
transition: transform 0.3s ease;
97+
}
98+
99+
.team-member:hover {
100+
transform: scale(1.05);
101+
}
102+
103+
.team-member h3 {
104+
margin: 10px 0 5px;
105+
font-size: 22px;
106+
}
107+
108+
.team-member p {
109+
font-size: 16px;
110+
margin-bottom: 10px;
111+
}
112+
113+
.team-member .role {
114+
background-color: #3949ab;
115+
color: white;
116+
padding: 6px 12px;
117+
border-radius: 20px;
118+
display: inline-block;
119+
font-size: 14px;
120+
}
121+
122+
.social-icons {
123+
position: absolute;
124+
top: 40%;
125+
left: 20px;
126+
display: flex;
127+
flex-direction: column;
128+
gap: 20px;
129+
}
130+
131+
.social-icons a {
132+
font-size: 20px;
133+
transition: transform 0.3s ease;
134+
}
135+
136+
.social-icons a:hover {
137+
transform: scale(1.3);
138+
}
139+
140+
.fab.fa-twitter {
141+
color: #1DA1F2;
142+
}
143+
144+
.fab.fa-facebook-f {
145+
color: #1877F2;
146+
}
147+
148+
.fab.fa-instagram {
149+
color: #C13584;
150+
}
151+
152+
.fab.fa-youtube {
153+
color: #FF0000;
154+
}
155+
</style>
156+
</head>
157+
<body>
158+
159+
<div class="background-blur"></div>
160+
161+
<!-- Navbar -->
162+
<nav>
163+
<div class="logo">TravelBloom</div>
164+
<div class="nav-links">
165+
<a href="travel_recommendation.html">Home</a>
166+
<a href="about_us.html">About Us</a>
167+
<a href="contact_us.html">Contact Us</a>
168+
</div>
169+
</nav>
170+
171+
<!-- Social Media Icons -->
172+
<div class="social-icons">
173+
<a href="https://twitter.com"><i class="fab fa-twitter"></i></a>
174+
<a href="https://facebook.com"><i class="fab fa-facebook-f"></i></a>
175+
<a href="https://instagram.com"><i class="fab fa-instagram"></i></a>
176+
<a href="https://youtube.com"><i class="fab fa-youtube"></i></a>
177+
</div>
178+
179+
<!-- About Section -->
180+
<div class="about-section">
181+
<h1>ABOUT US</h1>
182+
<p>
183+
Welcome to <span class="highlight">Our Company!</span> We are a team of passionate individuals dedicated to providing excellent services/products to our customers.
184+
Our mission is to <span class="highlight">provide the best experience</span> for people traveling to different destinations around the world.
185+
Our values include integrity, innovation, customer satisfaction, and teamwork.
186+
We believe in <span class="highlight">putting our customers first</span> and <span class="highlight">working together</span> to achieve our goals.
187+
<br><br>
188+
Feel free to explore our website to learn more about what we offer!
189+
</p>
190+
191+
<!-- Team Section -->
192+
<div class="team-section">
193+
<h2>Our Team</h2>
194+
<div class="team-cards">
195+
<div class="team-member">
196+
<h3>John Doe</h3>
197+
<p>John is responsible for...</p>
198+
<div class="role">CEO</div>
199+
</div>
200+
<div class="team-member">
201+
<h3>Celina Thomas</h3>
202+
<p>Celina Thomas is responsible for...</p>
203+
<div class="role">Team Lead</div>
204+
</div>
205+
<div class="team-member">
206+
<h3>Mike Tysen</h3>
207+
<p>Mike Tysen is responsible for...</p>
208+
<div class="role">Delivery Head</div>
209+
</div>
210+
</div>
211+
</div>
212+
</div>
213+
</body>
214+
</html>

aboutus.jpg

71 KB
Loading

0 commit comments

Comments
 (0)