Scribd
Upload
29 views

WD Code

The document is an HTML template for a gym website. It includes sections for the navbar, a carousel with images and text promoting the gym, descriptions of bodybuilding and muscle building classes, an "About" section with details on the gym's experience and awards, and features highlighting progression tracking, variety of workout classes and customized meal plans. It aims to showcase the gym's services and encourage people to join.

Uploaded by

Luv
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
29 views

WD Code

The document is an HTML template for a gym website. It includes sections for the navbar, a carousel with images and text promoting the gym, descriptions of bodybuilding and muscle building classes, an "About" section with details on the gym's experience and awards, and features highlighting progression tracking, variety of workout classes and customized meal plans. It aims to showcase the gym's services and encourage people to join.

Uploaded by

Luv
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 29

<!

DOCTYPE html>

<html lang="en">

<head>

<meta charset="utf-8">

<title>Gymnast - Gym Website Template</title>

<meta content="width=device-width, initial-scale=1.0" name="viewport">

<meta content="Free Website Template" name="keywords">

<meta content="Free Website Template" name="description">

<!-- Favicon -->

<link href="img/favicon.ico" rel="icon">

<!-- Font Awesome -->

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css"
rel="stylesheet">

<!-- Flaticon Font -->

<link href="lib/flaticon/font/flaticon.css" rel="stylesheet">

<!-- Customized Bootstrap Stylesheet -->

<link href="css/style.min.css" rel="stylesheet">

</head>

<body class="bg-white">

<!-- Navbar Start -->

<div class="container-fluid p-0 nav-bar">

<nav class="navbar navbar-expand-lg bg-none navbar-dark py-3">

<a href="" class="navbar-brand">

<img src="pictures wd/WhatsApp_Image_2023-11-


15_at_12.41.06_564dafdd-removebg.png" width="256" height"252" alt=""t=""/>

</a>
<button type="button" class="navbar-toggler" data-toggle="collapse" data-
target="#navbarCollapse">

<span class="navbar-toggler-icon"></span>

</button>

<div class="collapse navbar-collapse justify-content-between" id="navbarCollapse">

<div class="navbar-nav ml-auto p-4 bg-secondary">

<a href="index.html" class="nav-item nav-link active">Home</a>

<a href="about.html" class="nav-item nav-link">About Us</a>

<a href="feature.html" class="nav-item nav-link">Our Features</a>

<a href="class.html" class="nav-item nav-link">Classes</a>

<div class="nav-item dropdown">

<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">Apparel</a>

<div class="dropdown-menu text-capitalize">

<a href="men.html" class="dropdown-item">Men's</a>

<a href="women1.html" class="dropdown-item">Women's</a>

<a href="ac.html" class="dropdown-


item">Accessories</a>

</div>

</div>

<a href="contact.html" class="nav-item nav-link">Contact</a>

</div>

</div>

</nav>

</div>

<!-- Navbar End -->

<!-- Carousel Start -->

<div class="container-fluid p-0">

<div id="blog-carousel" class="carousel slide" data-ride="carousel">

<div class="carousel-inner">

<div class="carousel-item active">

<img class="w-100" src="img/carousel-1.jpg" alt="Image">


<div class="carousel-caption d-flex flex-column align-items-center justify-content-center">

<h3 class="text-primary text-capitalize m-0">Gym & Fitness Center</h3>

<h2 class="display-2 m-0 mt-2 mt-md-4 text-white font-weight-bold text-


capitalize">Best Gym In Town</h2>

<a href="" class="btn btn-lg btn-outline-light mt-3 mt-md-5 py-md-3 px-md-5">Join Us


Now</a>

</div>

</div>

<div class="carousel-item">

<img class="w-100" src="img/carousel-2.jpg" alt="Image">

<div class="carousel-caption d-flex flex-column align-items-center justify-content-center">

<h3 class="text-primary text-capitalize m-0">Gym & Fitness Center</h3>

<h2 class="display-2 m-0 mt-2 mt-md-4 text-white font-weight-bold text-capitalize">Get


Body In Shape</h2>

<a href="" class="btn btn-lg btn-outline-light mt-3 mt-md-5 py-md-3 px-md-5">Join Us


Now</a>

</div>

</div>

</div>

<a class="carousel-control-prev" href="#blog-carousel" data-slide="prev">

<span class="carousel-control-prev-icon"></span>

</a>

<a class="carousel-control-next" href="#blog-carousel" data-slide="next">

<span class="carousel-control-next-icon"></span>

</a>

</div>

</div>

<!-- Carousel End -->

<!-- Gym Class Start -->

<div class="container gym-class mb-5">


<div class="row px-3">

<div class="col-md-6 p-0">

<div class="gym-class-box d-flex flex-column align-items-end justify-content-center bg-


primary text-right text-white py-5 px-5">

<i class="flaticon-six-pack"></i>

<h3 class="display-4 mb-3 text-white font-weight-bold">Body Building</h3>

<p>&nbsp; &nbsp; Body building, a regimen of exercises designed to enhance the human
body's muscular development and promote general health and fitness. As a competitive activity,
bodybuilding aims to display in artistic fashion pronounced muscle mass, symmetry, and definition
for overall aesthetic effect.&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</p>

<a href="" class="btn btn-lg btn-outline-light mt-4 px-4">Join Now</a>

</div>

</div>

<div class="col-md-6 p-0">

<div class="gym-class-box d-flex flex-column align-items-start justify-content-center bg-


secondary text-left text-white py-5 px-5">

<i class="flaticon-bodybuilding"></i>

<h3 class="display-4 mb-3 text-white font-weight-bold">Muscle Building</h3>

<p>&nbsp; &nbsp; This process of increasing your muscle mass is known as muscle
hypertrophy, and it's a primary goal of resistance training. The muscle building process is driven by
several factors, including hormones like testosterone and growth hormone, as well as the availability
of amino acids and other nutrients.&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; &nbsp;

</p>

<a href="" class="btn btn-lg btn-outline-light mt-4 px-4">Join Now</a>

</div>

</div>

</div>

</div>

<!-- Gym Class End -->

<!-- About Start -->

<div class="container py-5">


<div class="row align-items-center">

<div class="col-lg-6">

<img class="img-fluid mb-4 mb-lg-0" src="img/bf/web24.jpg" alt="Image">

</div>

<div class="col-lg-6">

<h2 class="display-4 font-weight-bold mb-4">10 Years Experience</h2>

<p>Welcome to Athlechic - Your Certified Fitness Haven!&nbsp;</p>

<div class="row py-2">

<div class="col-sm-6">

<i class="flaticon-barbell display-2 text-primary"></i>

<h4 class="font-weight-bold">Certified GYM Center</h4>

<p>Train with the best.Our gym is equipped with cutting-edge machines for a diverse
and effective workout.&nbsp;</p>

</div>

<div class="col-sm-6">

<i class="flaticon-medal display-2 text-primary"></i>

<h4 class="font-weight-bold">Award Winning</h4>

<p>&nbsp;Experience the Award-Winning Fitness Journey at&nbsp;Athlechic.</p>

</div>

</div>

<a href="" class="btn btn-lg px-4 btn-outline-primary">Learn More</a>

</div>

</div>

</div>

<!-- About End -->

<!-- Features Start -->

<div class="container-fluid my-5">

<div class="row">

<div class="col-lg-4 p-0">


<div class="d-flex align-items-center bg-secondary text-white px-5" style="min-height:
300px;">

<i class="flaticon-training display-3 text-primary mr-3"></i>

<div class="">

<h2 class="text-white mb-3">Progression</h2>

<p>&nbsp;📈Progress Tracking: Witness your achievements and celebrate milestones.

</p>

</div>

</div>

</div>

<div class="col-lg-4 p-0">

<div class="d-flex align-items-center bg-primary text-white px-5" style="min-height:


300px;">

<i class="flaticon-weightlifting display-3 text-secondary mr-3"></i>

<div class="">

<h2 class="text-white mb-3">Workout</h2>

<p>🤸 Variety of Classes: From high-intensity to mindful workouts, we have it all.&nbsp;

</p>

</div>

</div>

</div>

<div class="col-lg-4 p-0">

<div class="d-flex align-items-center bg-secondary text-white px-5" style="min-height:


300px;">

<i class="flaticon-treadmill display-3 text-primary mr-3"></i>

<div class="">

<h2 class="text-white mb-3">Nutrition</h2>

<p>&nbsp;🥗Customized Meal Plans: Nutrition guidance for a balanced lifestyle.

</p>

</div>
</div>

</div>

</div>

</div>

<!-- Features End -->

<!-- GYM Feature Start -->

<div class="container feature pt-5">

<div class="d-flex flex-column text-center mb-5">

<h4 class="text-primary font-weight-bold">Why Choose Us?</h4>

<h4 class="display-4 font-weight-bold">Benifits of Joining Our GYM</h4>

</div>

<div class="row">

<div class="col-md-6 mb-5">

<div class="row align-items-center">

<div class="col-sm-5">

<img class="img-fluid mb-3 mb-sm-0" src="img/feature-1.jpg" alt="Image">

<i class="flaticon-barbell"></i>

</div>

<div class="col-sm-7">

<h4 class="font-weight-bold">Videos Instruction</h4>

<p>At Athlechic, we bring your workouts to life through engaging video


instructions.&nbsp;</p>

</div>

</div>

</div>

<div class="col-md-6 mb-5">

<div class="row align-items-center">

<div class="col-sm-5">

<img class="img-fluid mb-3 mb-sm-0" src="img/feature-2.jpg" alt="Image">


<i class="flaticon-training"></i>

</div>

<div class="col-sm-7">

<h4 class="font-weight-bold">Training Calendar</h4>

<p>Stay on track with our comprehensive training calendar. &nbsp;</p>

</div>

</div>

</div>

<div class="col-md-6 mb-5">

<div class="row align-items-center">

<div class="col-sm-5">

<img class="img-fluid mb-3 mb-sm-0" src="img/feature-3.jpg" alt="Image">

<i class="flaticon-trends"></i>

</div>

<div class="col-sm-7">

<h4 class="font-weight-bold">Free Apps & WiFi</h4>

<p>&nbsp;Enjoy seamless connectivity with our gym-wide WiFi.</p>

</div>

</div>

</div>

<div class="col-md-6 mb-5">

<div class="row align-items-center">

<div class="col-sm-5">

<img class="img-fluid mb-3 mb-sm-0" src="img/feature-4.jpg" alt="Image">

<i class="flaticon-support"></i>

</div>

<div class="col-sm-7">

<h4 class="font-weight-bold">Community Support</h4>

<p>&nbsp;Join our vibrant fitness community that celebrates every triumph.</p>

</div>

</div>
</div>

</div>

</div>

<!-- GYM Feature End -->

<!-- Subscribe Start -->

<div class="subscribe container-fluid my-5 py-5 text-center">

<h4 class="display-4 text-white font-weight-bold mt-5 mb-3">Subscribe Our Newsletter</h4>

<p class="text-white mb-4">Subscribe and get Our latest article in your inbox</p>

<form class="form-inline justify-content-center mb-5">

<div class="input-group">

<input type="text" class="form-control-lg" placeholder="Your Email">

<div class="input-group-append">

<button class="btn btn-primary" type="submit">Subscribe</button>

</div>

</div>

</form>

</div>

<!-- Subscribe End -->

<!-- Class Timetable Start -->

<div class="container gym-feature py-5">

<div class="d-flex flex-column text-center mb-5">

<h4 class="text-primary font-weight-bold">Class Timetable</h4>

<h4 class="display-4 font-weight-bold">Working Hours and Class Time</h4>

</div>

<div class="tab-class">

<ul class="nav nav-pills justify-content-center mb-4">

<li class="nav-item">
<a class="nav-link active" data-toggle="pill" href="#class-all">All Classes</a>

</li>

<li class="nav-item">

<a class="nav-link" data-toggle="pill" href="#class-cardio">Cardio</a>

</li>

<li class="nav-item">

<a class="nav-link" data-toggle="pill" href="#class-crossfit">Crossfit</a>

</li>

<li class="nav-item">

<a class="nav-link" data-toggle="pill" href="#class-powerlifting">Powerlifting</a>

</li>

</ul>

<div class="tab-content">

<div id="class-all" class="container tab-pane p-0 active">

<div class="table-responsive">

<table class="table table-bordered table-lg m-0">

<thead class="bg-secondary text-white text-center">

<tr>

<th>Time</th>

<th>Monday</th>

<th>Tuesday</th>

<th>Wednesday</th>

<th>Thursday</th>

<th>Friday</th>

<th>Saturday</th>

<th>Sunday</th>

</tr>

</thead>

<tbody class="text-center">

<tr>

<th class="bg-secondary text-white align-middle">6.00am - 8.00am</th>


<td><h5>Cardio</h5>John Deo</td>

<td></td>

<td><h5>Crossfit</h5>Adam Phillips</td>

<td></td>

<td><h5>Power Lifting</h5>James Alien</td>

<td></td>

<td><h5>Cardio</h5>John Deo</td>

</tr>

<tr>

<th class="bg-secondary text-white align-middle">10.00am - 12.00am</th>

<td></td>

<td><h5>Power Lifting</h5>James Alien</td>

<td></td>

<td><h5>Cardio</h5>John Deo</td>

<td></td>

<td><h5>Crossfit</h5>Adam Phillips</td>

<td></td>

</tr>

<tr>

<th class="bg-secondary text-white align-middle">5.00pm - 7.00pm</th>

<td><h5>Crossfit</h5>Adam Phillips</td>

<td></td>

<td><h5>Power Lifting</h5>James Alien</td>

<td></td>

<td><h5>Cardio</h5>John Deo</td>

<td></td>

<td><h5>Crossfit</h5>Adam Phillips</td>

</tr>

<tr>

<th class="bg-secondary text-white align-middle">7.00pm - 9.00pm</th>

<td></td>
<td><h5>Cardio</h5>John Deo</td>

<td></td>

<td><h5>Crossfit</h5>Adam Phillips</td>

<td></td>

<td><h5>Power Lifting</h5>James Alien</td>

<td></td>

</tr>

</tbody>

</table>

</div>

</div>

<div id="class-cardio" class="container tab-pane fade p-0">

<div class="table-responsive">

<table class="table table-bordered table-lg m-0">

<thead class="bg-secondary text-white text-center">

<tr>

<th>Time</th>

<th>Monday</th>

<th>Tuesday</th>

<th>Wednesday</th>

<th>Thursday</th>

<th>Friday</th>

<th>Saturday</th>

<th>Sunday</th>

</tr>

</thead>

<tbody class="text-center">

<tr>

<th class="bg-secondary text-white align-middle">6.00am - 8.00am</th>

<td class="bg-primary text-white"><h5 class="text-white">Cardio</h5>John


Deo</td>
<td></td>

<td><h5>Crossfit</h5>Adam Phillips</td>

<td></td>

<td><h5>Power Lifting</h5>James Alien</td>

<td></td>

<td class="bg-primary text-white"><h5 class="text-white">Cardio</h5>John


Deo</td>

</tr>

<tr>

<th class="bg-secondary text-white align-middle">10.00am - 12.00am</th>

<td></td>

<td><h5>Power Lifting</h5>James Alien</td>

<td></td>

<td class="bg-primary text-white"><h5 class="text-white">Cardio</h5>John


Deo</td>

<td></td>

<td><h5>Crossfit</h5>Adam Phillips</td>

<td></td>

</tr>

<tr>

<th class="bg-secondary text-white align-middle">5.00pm - 7.00pm</th>

<td><h5>Crossfit</h5>Adam Phillips</td>

<td></td>

<td><h5>Power Lifting</h5>James Alien</td>

<td></td>

<td class="bg-primary text-white"><h5 class="text-white">Cardio</h5>John


Deo</td>

<td></td>

<td><h5>Crossfit</h5>Adam Phillips</td>

</tr>

<tr>

<th class="bg-secondary text-white align-middle">7.00pm - 9.00pm</th>


<td></td>

<td class="bg-primary text-white"><h5 class="text-white">Cardio</h5>John


Deo</td>

<td></td>

<td><h5>Crossfit</h5>Adam Phillips</td>

<td></td>

<td><h5>Power Lifting</h5>James Alien</td>

<td></td>

</tr>

</tbody>

</table>

</div>

</div>

<div id="class-crossfit" class="container tab-pane fade p-0">

<div class="table-responsive">

<table class="table table-bordered table-lg m-0">

<thead class="bg-secondary text-white text-center">

<tr>

<th>Time</th>

<th>Monday</th>

<th>Tuesday</th>

<th>Wednesday</th>

<th>Thursday</th>

<th>Friday</th>

<th>Saturday</th>

<th>Sunday</th>

</tr>

</thead>

<tbody class="text-center">

<tr>

<th class="bg-secondary text-white align-middle">6.00am - 8.00am</th>


<td><h5>Cardio</h5>John Deo</td>

<td></td>

<td class="bg-primary text-white"><h5 class="text-white">Crossfit</h5>Adam


Phillips</td>

<td></td>

<td><h5>Power Lifting</h5>James Alien</td>

<td></td>

<td><h5>Cardio</h5>John Deo</td>

</tr>

<tr>

<th class="bg-secondary text-white align-middle">10.00am - 12.00am</th>

<td></td>

<td><h5>Power Lifting</h5>James Alien</td>

<td></td>

<td><h5>Cardio</h5>John Deo</td>

<td></td>

<td class="bg-primary text-white"><h5 class="text-white">Crossfit</h5>Adam


Phillips</td>

<td></td>

</tr>

<tr>

<th class="bg-secondary text-white align-middle">5.00pm - 7.00pm</th>

<td class="bg-primary text-white"><h5 class="text-white">Crossfit</h5>Adam


Phillips</td>

<td></td>

<td><h5>Power Lifting</h5>James Alien</td>

<td></td>

<td><h5>Cardio</h5>John Deo</td>

<td></td>

<td class="bg-primary text-white"><h5 class="text-white">Crossfit</h5>Adam


Phillips</td>

</tr>
<tr>

<th class="bg-secondary text-white align-middle">7.00pm - 9.00pm</th>

<td></td>

<td><h5>Cardio</h5>John Deo</td>

<td></td>

<td class="bg-primary text-white"><h5 class="text-white">Crossfit</h5>Adam


Phillips</td>

<td></td>

<td><h5>Power Lifting</h5>James Alien</td>

<td></td>

</tr>

</tbody>

</table>

</div>

</div>

<div id="class-powerlifting" class="container tab-pane fade p-0">

<div class="table-responsive">

<table class="table table-bordered table-lg m-0">

<thead class="bg-secondary text-white text-center">

<tr>

<th>Time</th>

<th>Monday</th>

<th>Tuesday</th>

<th>Wednesday</th>

<th>Thursday</th>

<th>Friday</th>

<th>Saturday</th>

<th>Sunday</th>

</tr>

</thead>

<tbody class="text-center">
<tr>

<th class="bg-secondary text-white align-middle">6.00am - 8.00am</th>

<td><h5>Cardio</h5>John Deo</td>

<td></td>

<td><h5>Crossfit</h5>Adam Phillips</td>

<td></td>

<td class="bg-primary text-white"><h5 class="text-white">Power


Lifting</h5>James Alien</td>

<td></td>

<td><h5>Cardio</h5>John Deo</td>

</tr>

<tr>

<th class="bg-secondary text-white align-middle">10.00am - 12.00am</th>

<td></td>

<td class="bg-primary text-white"><h5 class="text-white">Power


Lifting</h5>James Alien</td>

<td></td>

<td><h5>Cardio</h5>John Deo</td>

<td></td>

<td><h5>Crossfit</h5>Adam Phillips</td>

<td></td>

</tr>

<tr>

<th class="bg-secondary text-white align-middle">5.00pm - 7.00pm</th>

<td><h5>Crossfit</h5>Adam Phillips</td>

<td></td>

<td class="bg-primary text-white"><h5 class="text-white">Power


Lifting</h5>James Alien</td>

<td></td>

<td><h5>Cardio</h5>John Deo</td>

<td></td>

<td><h5>Crossfit</h5>Adam Phillips</td>
</tr>

<tr>

<th class="bg-secondary text-white align-middle">7.00pm - 9.00pm</th>

<td></td>

<td><h5>Cardio</h5>John Deo</td>

<td></td>

<td><h5>Crossfit</h5>Adam Phillips</td>

<td></td>

<td class="bg-primary text-white"><h5 class="text-white">Power


Lifting</h5>James Alien</td>

<td></td>

</tr>

</tbody>

</table>

</div>

</div>

</div>

</div>

</div>

<!-- Class Timetable End -->

<!-- BMI Calculation Start -->

<div class="container-fluid position-relative bmi my-5">

<div class="container">

<div class="row px-3 align-items-center">

<div class="col-md-6">

<div class="pr-md-3 d-none d-md-block">

<h4 class="text-primary">Body Mass Index </h4>

<h4 class="display-4 text-white font-weight-bold mb-4">Whate is BMI?</h4>

<p class="m-0 text-white">&nbsp;BMI stands for Body Mass Index. It is a numerical


value of a person's weight in relation to their height. BMI is a widely used method to categorize
individuals into different weight status categories, helping assess whether a person has a healthy
body weight.</p>

</div>

</div>

<div class="col-md-6 bg-secondary py-5">

<div class="py-5 px-3">

<h1 class="mb-4 text-white">Calculate your BMI</h1>

<form>

<div class="form-row">

<div class="col form-group">

<input type="text" class="form-control form-control-lg bg-dark text-white"


placeholder="Weight (KG)">

</div>

<div class="col form-group">

<input type="text" class="form-control form-control-lg bg-dark text-white"


placeholder="Height (CM)">

</div>

</div>

<div class="form-row">

<div class="col form-group">

<input type="text" class="form-control form-control-lg bg-dark text-white"


placeholder="Age">

</div>

<div class="col form-group">

<select class="custom-select custom-select-lg bg-dark text-muted">

<option>Gender</option>

<option>Mal</option>

<option>Female</option>

</select>

</div>

</div>

<div class="form-row">
<div class="col">

<input type="button" class="btn btn-lg btn-block btn-dark border-light"

value="Calculate Now">

</div>

</div>

</form>

</div>

</div>

</div>

</div>

</div>

<!-- BMI Calculation End -->

<!-- Team Start -->

<div class="container pt-5 team">

<div class="d-flex flex-column text-center mb-5">

<h4 class="text-primary font-weight-bold">Our Trainers</h4>

<h4 class="display-4 font-weight-bold">Meet Our Expert Trainers</h4>

</div>

<div class="row">

<div class="col-lg-3 col-md-6 mb-5">

<div class="card border-0 bg-secondary text-center text-white">

<img class="card-img-top" src="img/New folder/1.jpg" alt="">

<div class="card-social d-flex align-items-center justify-content-center">

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-twitter"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-facebook-f"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-linkedin-in"></i></a>
<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:
40px; height: 40px;" href="#"><i class="fab fa-instagram"></i></a>

</div>

<div class="card-body bg-secondary">

<h4 class="card-title text-primary">Rohit</h4>

<p class="card-text">Trainer</p>

</div>

</div>

</div>

<div class="col-lg-3 col-md-6 mb-5">

<div class="card border-0 bg-secondary text-center text-white">

<img class="card-img-top" src="img/New folder/03.jpg" alt="">

<div class="card-social d-flex align-items-center justify-content-center">

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-twitter"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-facebook-f"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-linkedin-in"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-instagram"></i></a>

</div>

<div class="card-body bg-secondary">

<h4 class="card-title text-primary">Tanya&nbsp;</h4>

<p class="card-text">Trainer</p>

</div>

</div>

</div>

<div class="col-lg-3 col-md-6 mb-5">

<div class="card border-0 bg-secondary text-center text-white">

<img class="card-img-top" src="img/New folder/02.jpg" alt="">

<div class="card-social d-flex align-items-center justify-content-center">


<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:
40px; height: 40px;" href="#"><i class="fab fa-twitter"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-facebook-f"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-linkedin-in"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-instagram"></i></a>

</div>

<div class="card-body bg-secondary">

<h4 class="card-title text-primary">Ishaan</h4>

<p class="card-text">Trainer</p>

</div>

</div>

</div>

<div class="col-lg-3 col-md-6 mb-5">

<div class="card border-0 bg-secondary text-center text-white">

<img class="card-img-top" src="img/New folder/04.jpg" alt="">

<div class="card-social d-flex align-items-center justify-content-center">

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-twitter"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-facebook-f"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-linkedin-in"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width:


40px; height: 40px;" href="#"><i class="fab fa-instagram"></i></a>

</div>

<div class="card-body bg-secondary">

<h4 class="card-title text-primary">Priyanka</h4>

<p class="card-text">Trainer</p>

</div>

</div>

</div>
</div>

</div>

<!-- Team End -->

<!-- Testimonial Start -->

<div class="container-fluid position-relative testimonial my-5">

<div class="container">

<div class="row px-3 align-items-center">

<div class="col-md-6 bg-secondary">

<div class="d-flex align-items-center px-3" style="min-height: 450px;">

<div id="carouselId" class="carousel slide" data-ride="carousel">

<ol class="carousel-indicators">

<li data-target="#carouselId" data-slide-to="0" class="active"></li>

<li data-target="#carouselId" data-slide-to="1"></li>

<li data-target="#carouselId" data-slide-to="2"></li>

</ol>

<div class="carousel-inner" role="listbox">

<div class="carousel-item active">

<div class="d-flex align-items-center mb-4 text-white">

<img width="80" height="80" class="rounded-circle bg-dark p-2"


src="img/testimonial-1.jpg" alt="Image">

<div class="pl-4">

<h4 class="text-primary"> Aryan</h4>

<p class="m-0">Profession</p>

</div>

</div>

<div class="testimonial-text position-relative border bg-dark text-white mb-5 p-


4">

⭐⭐⭐⭐
"Great gym with a variety of workout options. The trainers are attentive and
provide excellent guidance. I appreciate the inclusion of yoga and other Indian fitness practices,
giving a holistic approach to health"

</div>

</div>

<div class="carousel-item">

<div class="d-flex align-items-center mb-4 text-white">

<img width="80" height="80" class="rounded-circle bg-dark p-2"


src="img/testimonial-2.jpg" alt="Image">

<div class="pl-4">

<h4 class="text-primary">Raj</h4>

<p class="m-0">Profession</p>

</div>

</div>

<div class="testimonial-text position-relative border bg-dark text-white mb-5 p-


4">

⭐⭐⭐⭐

"Absolutely loving my experience at this gym! The trainers are knowledgeable


and friendly, creating personalized workout plans that suit my fitness goals"

</div>

</div>

<div class="carousel-item">

<div class="d-flex align-items-center mb-4 text-white">

<img width="80" height="80" class="rounded-circle bg-dark p-2"


src="img/testimonial-3.jpg" alt="Image">

<div class="pl-4">

<h4 class="text-primary">Vikram</h4>

<p class="m-0">Profession</p>

</div>

</div>

<div class="testimonial-text position-relative border bg-dark text-white mb-5 p-


4">
⭐⭐⭐⭐⭐

"I've been a member of this gym for six months, and it's been an excellent
experience. The trainers are not only skilled but also friendly, creating a comfortable environment for
everyone"

</div>

</div>

</div>

</div>

</div>

</div>

<div class="col-md-6">

<div class="pl-md-3 d-none d-md-block">

<h4 class="text-primary">Testimonial</h4>

<h4 class="display-4 mb-4 text-white font-weight-bold">What Our Clients Say?</h4>

<p class="m-0 text-white">&nbsp;</p>

</div>

</div>

</div>

</div>

</div>

<!-- Testimonial End -->

<!-- Blog Start -->

<div class="container pt-5">

<div class="d-flex flex-column text-center mb-5">

<h4 class="text-primary font-weight-bold">Our Blog</h4>

<h4 class="display-4 font-weight-bold">Latest Article From Blog</h4>

</div>

<div class="row">

<div class="col-lg-6 mb-5 blog-item">


<img class="img-fluid mb-4" src="img/blog-1.jpg" alt="Image">

<div class="d-flex align-items-center mb-4">

<div class="d-flex flex-column align-items-center justify-content-center rounded-circle bg-


primary text-white" style="width: 80px; height: 80px;">

<small>01</small>

<strong class="text-uppercase m-0 text-white">Jan</strong>

<small>2022</small>

</div>

<div class="pl-3">

<h3 class="font-weight-bold">Nutrition Guidance for Optimal Results&nbsp;</h3>

<div class="d-flex">

<small class="mr-2 text-muted"><i class="fa fa-user"></i> Admin</small>

<small class="mr-2 text-muted"><i class="fa fa-folder"></i> Web Design</small>

<small class="mr-2 text-muted"><i class="fa fa-comments"></i> 15


Comments</small>

</div>

</div>

</div>

<p>&nbsp;</p>

<a class="btn btn-outline-primary mt-2 px-3" href="">Read More <i class="fa fa-angle-
right"></i></a>

</div>

<div class="col-lg-6 mb-5 blog-item">

<img class="img-fluid mb-4" src="img/blog-2.jpg" alt="Image">

<div class="d-flex align-items-center mb-4">

<div class="d-flex flex-column align-items-center justify-content-center rounded-circle bg-


primary text-white" style="width: 80px; height: 80px;">

<small>14</small>

<strong class="text-uppercase m-0 text-white">oct&nbsp;</strong>

<small>2023</small>

</div>

<div class="pl-3">
<h3 class="font-weight-bold">&nbsp;Bespoke Workout Plans</h3>

<div class="d-flex">

<small class="mr-2 text-muted"><i class="fa fa-user"></i> Admin</small>

<small class="mr-2 text-muted"><i class="fa fa-folder"></i> Web Design</small>

<small class="mr-2 text-muted"><i class="fa fa-comments"></i> 11


Comments</small>

</div>

</div>

</div>

<p>&nbsp;</p>

<a class="btn btn-outline-primary mt-2 px-3" href="">Read More <i class="fa fa-angle-
right"></i></a>

</div>

</div>

</div>

<!-- Blog End -->

<!-- Footer Start -->

<div class="footer container-fluid mt-5 py-5 px-sm-3 px-md-5 text-white">

<div class="row pt-5">

<div class="col-lg-3 col-md-6 mb-5">

<h4 class="text-primary mb-4">Get In Touch</h4>

<p><i class="fa fa-map-marker-alt mr-2"></i>123 Street kolkata, INDIA</p>

<p><i class="fa fa-phone-alt mr-2"></i>+916299863442</p>

<p><i class="fa fa-envelope mr-2"></i>[email protected]</p>

<div class="d-flex justify-content-start mt-4">

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width: 40px;


height: 40px;" href="#"><i class="fab fa-twitter"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width: 40px;


height: 40px;" href="#"><i class="fab fa-facebook-f"></i></a>

<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width: 40px;


height: 40px;" href="#"><i class="fab fa-linkedin-in"></i></a>
<a class="btn btn-outline-light rounded-circle text-center mr-2 px-0" style="width: 40px;
height: 40px;" href="#"><i class="fab fa-instagram"></i></a>

</div>

</div>

<div class="col-lg-3 col-md-6 mb-5">

<h4 class="text-primary mb-4">Quick Links</h4>

<div class="d-flex flex-column justify-content-start">

<a class="text-white mb-2" href="#"><i class="fa fa-angle-right mr-2"></i>Home</a>

<a class="text-white mb-2" href="#"><i class="fa fa-angle-right mr-2"></i>About Us</a>

<a class="text-white mb-2" href="#"><i class="fa fa-angle-right mr-2"></i>Our


Features</a>

<a class="text-white mb-2" href="#"><i class="fa fa-angle-right mr-2"></i>Classes</a>

<a class="text-white" href="#"><i class="fa fa-angle-right mr-2"></i>Contact Us</a>

</div>

</div>

<div class="col-lg-3 col-md-6 mb-5">

<h4 class="text-primary mb-4">Popular Links</h4>

<div class="d-flex flex-column justify-content-start">

<a class="text-white mb-2" href="#"><i class="fa fa-angle-right mr-2"></i>Home</a>

<a class="text-white mb-2" href="#"><i class="fa fa-angle-right mr-2"></i>About Us</a>

<a class="text-white mb-2" href="#"><i class="fa fa-angle-right mr-2"></i>Our


Features</a>

<a class="text-white mb-2" href="#"><i class="fa fa-angle-right mr-2"></i>Classes</a>

<a class="text-white" href="#"><i class="fa fa-angle-right mr-2"></i>Contact Us</a>

</div>

</div>

<div class="col-lg-3 col-md-6 mb-5">

<h4 class="text-primary mb-4">Opening Hours</h4>

<h5 class="text-white">Monday - Friday</h5>

<p>8.00 AM - 8.00 PM</p>

<h5 class="text-white">Saturday - Sunday</h5>

<p>2.00 PM - 8.00 PM</p>


</div>

</div>

<div class="container border-top border-dark pt-5">

<p class="m-0 text-center text-white">

<a class="text-white font-weight-bold" href="https://htmlcodex.com">&nbsp;</a> </p>

</div>

</div>

<!-- Footer End -->

<!-- Back to Top -->

<a href="#" class="btn btn-outline-primary back-to-top"><i class="fa fa-angle-double-up"></i></a>

<!-- JavaScript Libraries -->

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></
script>

<script src="lib/easing/easing.min.js"></script>

<script src="lib/waypoints/waypoints.min.js"></script>

<!-- Contact Javascript File -->

<script src="mail/jqBootstrapValidation.min.js"></script>

<script src="mail/contact.js"></script>

<!-- Template Javascript -->

<script src="js/main.js"></script>

</body>

</html>

You might also like