TORZ commited on
Commit
3ea85b1
·
verified ·
1 Parent(s): 160b69d

Add 1 files

Browse files
Files changed (1) hide show
  1. index.html +29 -19
index.html CHANGED
@@ -62,6 +62,18 @@
62
  transform: translateY(-2px);
63
  box-shadow: 0 5px 15px rgba(233, 69, 96, 0.3);
64
  }
 
 
 
 
 
 
 
 
 
 
 
 
65
  </style>
66
  </head>
67
  <body class="text-gray-800">
@@ -71,7 +83,9 @@
71
  <div class="flex justify-between h-16">
72
  <div class="flex items-center">
73
  <div class="flex-shrink-0 flex items-center">
74
- <i class="fas fa-fire text-2xl text-red-500 mr-2"></i>
 
 
75
  <span class="text-xl font-bold text-gray-900">LAVA YOGA</span>
76
  </div>
77
  </div>
@@ -113,7 +127,7 @@
113
  </div>
114
  </div>
115
  <div class="md:w-1/2 flex justify-center">
116
- <img src="https://images.unsplash.com/photo-1545205597-3d9d02c29597?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Man doing yoga" class="rounded-lg shadow-xl w-full max-w-md">
117
  </div>
118
  </div>
119
  </div>
@@ -155,7 +169,7 @@
155
  <!-- Program 1 -->
156
  <div class="bg-white rounded-xl shadow-md overflow-hidden course-card">
157
  <div class="h-48 bg-gradient-to-r from-red-500 to-orange-500 flex items-center justify-center">
158
- <i class="fas fa-fire text-white text-6xl"></i>
159
  </div>
160
  <div class="p-6">
161
  <div class="flex justify-between items-start mb-4">
@@ -179,7 +193,7 @@
179
  <!-- Program 2 -->
180
  <div class="bg-white rounded-xl shadow-md overflow-hidden course-card">
181
  <div class="h-48 bg-gradient-to-r from-orange-500 to-amber-500 flex items-center justify-center">
182
- <i class="fas fa-bolt text-white text-6xl"></i>
183
  </div>
184
  <div class="p-6">
185
  <div class="flex justify-between items-start mb-4">
@@ -203,7 +217,7 @@
203
  <!-- Program 3 -->
204
  <div class="bg-white rounded-xl shadow-md overflow-hidden course-card">
205
  <div class="h-48 bg-gradient-to-r from-amber-500 to-yellow-500 flex items-center justify-center">
206
- <i class="fas fa-dumbbell text-white text-6xl"></i>
207
  </div>
208
  <div class="p-6">
209
  <div class="flex justify-between items-start mb-4">
@@ -245,7 +259,7 @@
245
  <!-- Product 1 -->
246
  <div class="bg-gray-50 rounded-xl overflow-hidden shadow-sm">
247
  <div class="h-64 bg-gray-200 flex items-center justify-center">
248
- <i class="fas fa-mattress-pillow text-6xl text-gray-400"></i>
249
  </div>
250
  <div class="p-6">
251
  <h3 class="text-xl font-bold mb-2">Primal Mat</h3>
@@ -262,7 +276,7 @@
262
  <!-- Product 2 -->
263
  <div class="bg-gray-50 rounded-xl overflow-hidden shadow-sm">
264
  <div class="h-64 bg-gray-200 flex items-center justify-center">
265
- <i class="fas fa-spa text-6xl text-gray-400"></i>
266
  </div>
267
  <div class="p-6">
268
  <h3 class="text-xl font-bold mb-2">TestoBlend Oil</h3>
@@ -279,7 +293,7 @@
279
  <!-- Product 3 -->
280
  <div class="bg-gray-50 rounded-xl overflow-hidden shadow-sm">
281
  <div class="h-64 bg-gray-200 flex items-center justify-center">
282
- <i class="fas fa-book text-6xl text-gray-400"></i>
283
  </div>
284
  <div class="p-6">
285
  <h3 class="text-xl font-bold mb-2">The Lava Codex</h3>
@@ -314,9 +328,7 @@
314
  <!-- Testimonial 1 -->
315
  <div class="bg-gray-800 rounded-xl p-6 testimonial-card">
316
  <div class="flex items-center mb-4">
317
- <div class="w-12 h-12 rounded-full bg-gray-700 flex items-center justify-center mr-4">
318
- <i class="fas fa-user text-xl text-gray-400"></i>
319
- </div>
320
  <div>
321
  <h4 class="font-bold">Michael T.</h4>
322
  <div class="flex text-yellow-400">
@@ -337,9 +349,7 @@
337
  <!-- Testimonial 2 -->
338
  <div class="bg-gray-800 rounded-xl p-6 testimonial-card">
339
  <div class="flex items-center mb-4">
340
- <div class="w-12 h-12 rounded-full bg-gray-700 flex items-center justify-center mr-4">
341
- <i class="fas fa-user text-xl text-gray-400"></i>
342
- </div>
343
  <div>
344
  <h4 class="font-bold">David R.</h4>
345
  <div class="flex text-yellow-400">
@@ -360,9 +370,7 @@
360
  <!-- Testimonial 3 -->
361
  <div class="bg-gray-800 rounded-xl p-6 testimonial-card">
362
  <div class="flex items-center mb-4">
363
- <div class="w-12 h-12 rounded-full bg-gray-700 flex items-center justify-center mr-4">
364
- <i class="fas fa-user text-xl text-gray-400"></i>
365
- </div>
366
  <div>
367
  <h4 class="font-bold">James K.</h4>
368
  <div class="flex text-yellow-400">
@@ -388,7 +396,7 @@
388
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
389
  <div class="md:flex md:items-center md:space-x-12">
390
  <div class="md:w-1/2 mb-10 md:mb-0">
391
- <img src="https://images.unsplash.com/photo-1545389336-cf090694435e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1364&q=80" alt="Founder" class="rounded-lg shadow-lg w-full">
392
  </div>
393
  <div class="md:w-1/2">
394
  <h2 class="text-3xl md:text-4xl font-bold mb-6">Our <span class="text-red-500">Philosophy</span></h2>
@@ -508,7 +516,9 @@
508
  <div class="grid md:grid-cols-4 gap-8">
509
  <div>
510
  <div class="flex items-center mb-4">
511
- <i class="fas fa-fire text-2xl text-red-500 mr-2"></i>
 
 
512
  <span class="text-xl font-bold">LAVA YOGA</span>
513
  </div>
514
  <p class="text-gray-400">Testosterone-optimizing yoga programs designed specifically for men.</p>
 
62
  transform: translateY(-2px);
63
  box-shadow: 0 5px 15px rgba(233, 69, 96, 0.3);
64
  }
65
+
66
+ .masculine-icon {
67
+ color: #e94560;
68
+ background-color: rgba(233, 69, 96, 0.1);
69
+ border-radius: 50%;
70
+ padding: 12px;
71
+ width: 48px;
72
+ height: 48px;
73
+ display: flex;
74
+ align-items: center;
75
+ justify-content: center;
76
+ }
77
  </style>
78
  </head>
79
  <body class="text-gray-800">
 
83
  <div class="flex justify-between h-16">
84
  <div class="flex items-center">
85
  <div class="flex-shrink-0 flex items-center">
86
+ <div class="masculine-icon mr-3">
87
+ <i class="fas fa-fire text-xl"></i>
88
+ </div>
89
  <span class="text-xl font-bold text-gray-900">LAVA YOGA</span>
90
  </div>
91
  </div>
 
127
  </div>
128
  </div>
129
  <div class="md:w-1/2 flex justify-center">
130
+ <img src="https://images.unsplash.com/photo-1544367567-0f2fcb009e0b?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1520&q=80" alt="Man doing yoga" class="rounded-lg shadow-xl w-full max-w-md">
131
  </div>
132
  </div>
133
  </div>
 
169
  <!-- Program 1 -->
170
  <div class="bg-white rounded-xl shadow-md overflow-hidden course-card">
171
  <div class="h-48 bg-gradient-to-r from-red-500 to-orange-500 flex items-center justify-center">
172
+ <img src="https://images.unsplash.com/photo-1571019613454-1cb2f99b2d8b?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Man doing beginner yoga" class="w-full h-full object-cover">
173
  </div>
174
  <div class="p-6">
175
  <div class="flex justify-between items-start mb-4">
 
193
  <!-- Program 2 -->
194
  <div class="bg-white rounded-xl shadow-md overflow-hidden course-card">
195
  <div class="h-48 bg-gradient-to-r from-orange-500 to-amber-500 flex items-center justify-center">
196
+ <img src="https://images.unsplash.com/photo-1545205597-3d9d02c29597?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Man doing intermediate yoga" class="w-full h-full object-cover">
197
  </div>
198
  <div class="p-6">
199
  <div class="flex justify-between items-start mb-4">
 
217
  <!-- Program 3 -->
218
  <div class="bg-white rounded-xl shadow-md overflow-hidden course-card">
219
  <div class="h-48 bg-gradient-to-r from-amber-500 to-yellow-500 flex items-center justify-center">
220
+ <img src="https://images.unsplash.com/photo-1538805060514-97d67c7a1c70?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1374&q=80" alt="Man doing advanced yoga" class="w-full h-full object-cover">
221
  </div>
222
  <div class="p-6">
223
  <div class="flex justify-between items-start mb-4">
 
259
  <!-- Product 1 -->
260
  <div class="bg-gray-50 rounded-xl overflow-hidden shadow-sm">
261
  <div class="h-64 bg-gray-200 flex items-center justify-center">
262
+ <img src="https://images.unsplash.com/photo-1595079835353-a269f1a9e944?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Yoga mat" class="w-full h-full object-cover">
263
  </div>
264
  <div class="p-6">
265
  <h3 class="text-xl font-bold mb-2">Primal Mat</h3>
 
276
  <!-- Product 2 -->
277
  <div class="bg-gray-50 rounded-xl overflow-hidden shadow-sm">
278
  <div class="h-64 bg-gray-200 flex items-center justify-center">
279
+ <img src="https://images.unsplash.com/photo-1607619056574-7b8d3ee536b2?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Essential oils" class="w-full h-full object-cover">
280
  </div>
281
  <div class="p-6">
282
  <h3 class="text-xl font-bold mb-2">TestoBlend Oil</h3>
 
293
  <!-- Product 3 -->
294
  <div class="bg-gray-50 rounded-xl overflow-hidden shadow-sm">
295
  <div class="h-64 bg-gray-200 flex items-center justify-center">
296
+ <img src="https://images.unsplash.com/photo-1544947950-fa07a98d237f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="Book" class="w-full h-full object-cover">
297
  </div>
298
  <div class="p-6">
299
  <h3 class="text-xl font-bold mb-2">The Lava Codex</h3>
 
328
  <!-- Testimonial 1 -->
329
  <div class="bg-gray-800 rounded-xl p-6 testimonial-card">
330
  <div class="flex items-center mb-4">
331
+ <img src="https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1374&q=80" alt="Michael T." class="w-12 h-12 rounded-full object-cover mr-4">
 
 
332
  <div>
333
  <h4 class="font-bold">Michael T.</h4>
334
  <div class="flex text-yellow-400">
 
349
  <!-- Testimonial 2 -->
350
  <div class="bg-gray-800 rounded-xl p-6 testimonial-card">
351
  <div class="flex items-center mb-4">
352
+ <img src="https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1374&q=80" alt="David R." class="w-12 h-12 rounded-full object-cover mr-4">
 
 
353
  <div>
354
  <h4 class="font-bold">David R.</h4>
355
  <div class="flex text-yellow-400">
 
370
  <!-- Testimonial 3 -->
371
  <div class="bg-gray-800 rounded-xl p-6 testimonial-card">
372
  <div class="flex items-center mb-4">
373
+ <img src="https://images.unsplash.com/photo-1530268729831-4b0b9e170218?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80" alt="James K." class="w-12 h-12 rounded-full object-cover mr-4">
 
 
374
  <div>
375
  <h4 class="font-bold">James K.</h4>
376
  <div class="flex text-yellow-400">
 
396
  <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
397
  <div class="md:flex md:items-center md:space-x-12">
398
  <div class="md:w-1/2 mb-10 md:mb-0">
399
+ <img src="https://images.unsplash.com/photo-1583864697781-a880de37c988?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1374&q=80" alt="Founder" class="rounded-lg shadow-lg w-full">
400
  </div>
401
  <div class="md:w-1/2">
402
  <h2 class="text-3xl md:text-4xl font-bold mb-6">Our <span class="text-red-500">Philosophy</span></h2>
 
516
  <div class="grid md:grid-cols-4 gap-8">
517
  <div>
518
  <div class="flex items-center mb-4">
519
+ <div class="masculine-icon mr-3">
520
+ <i class="fas fa-fire text-xl"></i>
521
+ </div>
522
  <span class="text-xl font-bold">LAVA YOGA</span>
523
  </div>
524
  <p class="text-gray-400">Testosterone-optimizing yoga programs designed specifically for men.</p>