Untitled
unknown
plain_text
10 months ago
8.5 kB
11
Indexable
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Meet Our Coaches</title>
<style>
body {
background-color: #0d1117;
font-family: Arial, sans-serif;
color: white;
text-align: center;
padding: 30px;
}
h2 {
font-size: 2.5rem;
}
h2 span {
color: red;
}
p {
color: #ccc;
}
.coach-container {
display: flex;
justify-content: center;
gap: 40px;
margin-top: 40px;
flex-wrap: wrap;
}
.coach-card {
background: #111;
padding: 20px;
border-radius: 15px;
text-align: center;
transition: transform 0.3s;
width: 220px;
}
.coach-card:hover {
transform: scale(1.05);
cursor: pointer;
}
.coach-card img {
width: 180px;
height: 180px;
border-radius: 50%;
border: 3px solid red;
object-fit: cover;
}
.coach-card h3 {
margin: 15px 0 5px;
font-size: 1.2rem;
}
.coach-card p {
color: red;
font-size: 0.9rem;
}
a {
text-decoration: none;
color: inherit;
}
</style>
</head>
<body>
<h2>Meet Our <span>Coaches</span></h2>
<p>Expert trainers dedicated to helping you achieve your fitness goals</p>
<div class="coach-container">
<!-- Coach 1 -->
<a href="mike.html">
<div class="coach-card">
<img src="mike.jpg" alt="Mike Johnson">
<h3>Mike Johnson</h3>
<p>Strength & Conditioning</p>
</div>
</a>
<!-- Coach 2 -->
<a href="sarah.html">
<div class="coach-card">
<img src="sarah.jpg" alt="Sarah Williams">
<h3>Sarah Williams</h3>
<p>Yoga & Pilates</p>
</div>
</a>
<!-- Coach 3 -->
<a href="david.html">
<div class="coach-card">
<img src="david.jpg" alt="David Rodriguez">
<h3>David Rodriguez</h3>
<p>CrossFit & HIIT</p>
</div>
</a>
</div>
</body>
</html>
}
}
}
}
}
}
}
}
}
}
}Editor is loading...
Leave a Comment