HTML红色欧美形式健身房私教课程网页模板代码



如需定制开发(网站开发、二次开发)在线咨询,请点击>> QQ:753511799

8 30 11



模板描述:红色 欧美形式 健身房私教课程。整站宽屏满屏展示效果。鼠标移动在图片区域或者文字区域上有放大效果和展开效果。最底部部分带有自动反动和滚动效果,适用健身房私教课程等行业。同时兼容手机端和电脑网页端。

代码结构

1. 引入CSS

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

2. 引入JS

<script src="assets/vendor/jquery/jquery.min.js"></script>
<script src="assets/vendor/jquery/popper.min.js"></script>
<script src="assets/vendor/bootstrap/js/bootstrap.min.js"></script>
<script src="assets/js/owl.carousel.min.js"></script>
<script src="assets/vendor/jquery-easing/jquery.easing.min.js"></script>
<script src="assets/js/waypoints.min.js"></script>
<script src="assets/js/jquery.counterup.min.js"></script>
<script src="assets/js/TweenMax.min.js"></script>
<script src="assets/js/typed.min.js"></script>
<script src="assets/js/venobox.min.js"></script>
<script src="assets/js/wow.min.js"></script>
<script src="assets/js/aos.js"></script>
<script src="assets/js/jquery.paroller.min.js"></script>
<script src="assets/js/jquery.meanmenu.min.js"></script>
<script src="assets/js/custom.js"></script>

3. HTML代码

    <!-- Pre Loader Area start -->
    <div id="preloader">
        <div class="loader"></div>
    </div>
    <!-- Pre Loader Area End -->
    <!-- Menu Area Start -->
    <section class="menu-section-area padding-zero">
        <!-- Navigation -->
        <nav class="navbar navbar-expand-lg navbar-dark fixed-top d-none d-sm-none d-md-block d-lg-block d-xl-block" id="mainNav">
            <div class="container">
                <a class="navbar-brand" href="index.html"><img src="assets/img/gym-logo.png" alt="gym logo"></a>
                <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
                    <i class="fas fa-bars"></i>
                </button>
                <div class="collapse navbar-collapse" id="navbarResponsive">
                    <ul class="navbar-nav text-uppercase ml-auto">
                        <li class="nav-item">
                            <a class="nav-link" href="index.html">Home</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="about.html">About</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="classes.html">Classes</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="trainers.html">Trainers</a>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" data-toggle="dropdown">Gallery<i class="fas fa-angle-down"></i></a>
                            <ul class="dropdown-menu">
                                <li><a href="gallery.html">Masonry Gallery</a></li>
                                <li><a href="gallery-2.html">Grid Gallery</a></li>
                            </ul>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" data-toggle="dropdown">Pages<i class="fas fa-angle-down"></i></a>
                            <ul class="dropdown-menu">
                                <li><a href="calculate-bmi.html">BMI Calculator Page</a></li>
                                <li><a href="pricing-table.html">Pricing Table Page</a></li>
                                <li><a href="blog.html">Blog Page</a></li>
                                <li><a href="single-blog.html">Single Blog Page</a></li>
                                <li><a href="404.html">404 Page</a></li>
                            </ul>
                        </li>
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" data-toggle="dropdown">Blog<i class="fas fa-angle-down"></i></a>
                            <ul class="dropdown-menu">
                                <li><a href="blog.html">Blog</a></li>
                                <li><a href="single-blog.html">Single Blog</a></li>
                            </ul>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="contact.html">Contact</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link text-uppercase section-button btn btn-effect" href="pricing-table.html">Become a Member</a>
                        </li>
                    </ul>
                </div>
            </div>
        </nav>
        <!-- Navigation -->
        <!-- Mobile Menu Start -->
        <nav class="mobile_menu hidden d-none">
            <a href="index.html"><img class="mobile-logo" src="assets/img/gym-logo.png" alt="Gym"></a>
            <ul class="nav navbar-nav navbar-right menu">
                <li class="nav-item active">
                    <a class="nav-link" href="index.html">Home</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="about.html">About</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="classes.html">Classes</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="trainers.html">Trainers</a>
                </li>
                <li class="dropdown">
                    <a>Gallery</a>
                    <ul class="sub_menu">
                        <li><a href="gallery.html">Masonry Gallery</a></li>
                        <li><a href="gallery-2.html">Grid Gallery</a></li>
                    </ul>
                </li>
                <li class="dropdown">
                    <a>Pages</a>
                    <ul class="sub_menu">
                        <li><a href="calculate-bmi.html">BMI Calculator Page</a></li>
                        <li><a href="pricing-table.html">Pricing Table Page</a></li>
                        <li><a href="blog.html">Blog Page</a></li>
                        <li><a href="single-blog.html">Single Blog Page</a></li>
                        <li><a href="404.html">404 Page</a></li>
                    </ul>
                </li>
                <li class="dropdown">
                    <a>Blog</a>
                    <ul class="sub_menu">
                        <li><a href="blog.html">Blog</a></li>
                        <li><a href="single-blog.html">Single Blog</a></li>
                    </ul>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="contact.html">Contact</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link section-button btn btn-effect text-uppercase font-14 para-color" href="pricing-table.html">Become a Member</a>
                </li>
            </ul>
        </nav>
        <!-- Mobile Menu End -->
    </section>
    <!-- Menu Area End -->
    <!-- Header Start -->
    <header class="home-banner-area">
        <div id="planet-2" class="planet layer-2"></div>
        <div class="container">
          <div class="header-caption text-left">
            <h6 class="text-uppercase wow fadeInUp" data-wow-duration="1.0s" data-wow-delay=".4s">Fitness For Life</h6>
            <h1 class="header-caption-heading cd-headline clip is-full-width wow fadeInUp" data-wow-duration="1.10s" data-wow-delay=".4s">Be Ready For Focus Your
                <span id="typed-strings">
                    <b>Fitness</b>
                    <b>Gym</b>
                    <b>Strength</b>
                    <b>Weight</b>
                </span>
                <span id="typed"></span>
            </h1>
            <p class="wow fadeInUp" data-wow-duration="1.0s" data-wow-delay=".4s">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
                eirmod tempor invidunt ut labore et dolore magna tempor invidunt ut </p>
              <div class="header-button-wrap">
                  <a class="btn section-button btn-effect" href="about.html">Get Started</a>
                  <!-- Button trigger Video -->
                  <a class="video-btn venobox" data-vbtype="video" data-autoplay="true" href="#">
                      <i class="fas fa-play"></i>
                  </a>
              </div>
          </div>
        </div>
    </header>
    <!-- Header End -->
    <!-- Choose Your Programme Area Start -->
    <section class="choose-program-area">
        <div class="container">
              <div class="row">
                <div class="col-sm-12 text-center">
                  <h2 class="section-heading">Choose Your Programme</h2>
                  <img class="heading-divider" src="assets/img/divider.png" alt="divider">
                  <h3 class="section-subheading wow fadeInUp" data-wow-duration="1.2s" data-wow-delay=".1s">Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum. </h3>
                </div>
              </div>
              <div class="row">
              <!-- single program start-->
                <div class="col-sm-6 col-md-6 col-lg-3">
                    <div class="single-program wow fadeInUp" data-wow-duration="1.2s" data-wow-delay=".1s">
                      <span class="program-icon">
                        <i class="flaticon-clipboard"></i>
                      </span>
                      <h4 class="programme-heading">Fitness Training</h4>
                      <p>Integer iaculis nec ipsum nec imperdiet. Duis posuere, quam id porttitor accumsan, lacus lorem </p>
                      <a href="classes.html" class="program-arrow-btn">
                        <i class="flaticon-arrow-pointing-to-right"></i>
                      </a>
                    </div>
                </div>
              <!-- single program end-->
              <!-- single program start-->
                <div class="col-sm-6 col-md-6 col-lg-3">
                    <div class="single-program wow fadeInUp" data-wow-duration="1.2s" data-wow-delay=".2s">
                      <span class="program-icon">
                          <i class="flaticon-group-of-men-running"></i>
                      </span>
                      <h4 class="programme-heading">Group Fitness</h4>
                      <p>Integer iaculis nec ipsum nec imperdiet. Duis posuere, quam id porttitor accumsan, lacus lorem </p>
                      <a href="classes.html" class="program-arrow-btn">
                        <i class="flaticon-arrow-pointing-to-right"></i>
                      </a>
                    </div>
                </div>
              <!-- single program end-->
              <!-- single program start-->
                <div class="col-sm-6 col-md-6 col-lg-3">
                    <div class="single-program wow fadeInUp" data-wow-duration="1.2s" data-wow-delay=".3s">
                      <span class="program-icon">
                        <i class="flaticon-weightlifting"></i>
                      </span>
                      <h4 class="programme-heading">Personal Trainer</h4>
                      <p>Integer iaculis nec ipsum nec imperdiet. Duis posuere, quam id porttitor accumsan, lacus lorem </p>
                      <a href="classes.html" class="program-arrow-btn">
                        <i class="flaticon-arrow-pointing-to-right"></i>
                      </a>
                    </div>
                </div>
              <!-- single program end-->
              <!-- single program start-->
                <div class="col-sm-6 col-md-6 col-lg-3">
                    <div class="single-program wow fadeInUp" data-wow-duration="1.2s" data-wow-delay=".4s">
                      <span class="program-icon">
                        <i class="flaticon-exercise"></i>
                      </span>
                      <h4 class="programme-heading">Cardio Program</h4>
                      <p>Integer iaculis nec ipsum nec imperdiet. Duis posuere, quam id porttitor accumsan, lacus lorem </p>
                      <a href="classes.html" class="program-arrow-btn">
                        <i class="flaticon-arrow-pointing-to-right"></i>
                      </a>
                    </div>
                </div>
              <!-- single program end-->
              </div>
        </div>
    </section>
    <!-- Choose Your Programme Area End -->
    <!-- About Us Area Start -->
    <section class="about-us-area">
        <div class="container">
            <!-- Row Start-->
              <div class="row">
                <!-- Video Side Start-->
                  <div class="col-12 col-sm-12 col-md-6">
                      <div class="video-side">
                          <img src="assets/img/video-side-bg.png" alt="video bg" class="text-right paroller" >
                      <!-- About Video Button box Start-->
                          <div class="about-video-box" data-aos="fade-right">
                              <!-- Button trigger Video -->
                              <a class="video-btn venobox" data-vbtype="video" data-autoplay="true" href="#">
                                  <i class="fas fa-play"></i>
                              </a>
                          </div>
                      <!-- About Video Button box End-->
                      </div>
                  </div>
                  <!-- Video Side End-->
                  <!--  Content Side Start-->
                  <div class="col-12 col-sm-12 col-md-6 text-left">
                      <div class="about-content-wrap">
                          <h2 class="section-heading dark">About Us</h2>
                          <h3 class="section-subheading dark">Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies </h3>
                          <h3 class="section-subheading dark">Integer iaculis nec ipsum nec imperdiet. Duis posuere, quam id porttitor accumsan, lacus lorem efficitur enim, ac fermentum felis leo vel urna. Nulla facilisi. Etiam vestibulum convallis laoreet. Praesent fermentum vulputate sapien quis rutrum.</h3>
                          <a href="about.html" class="btn round-button">- Find Out More</a>
                      </div>
                  </div>
                  <!--  Content Side End-->
              </div>
            <!-- Row End-->
            <!-- Counter Row Start-->
              <div class="row counter-area">
                <!-- Single Counter-->
                <div class="col-sm-3">
                  <div class="about-counter text-center wow fadeInLeft" data-wow-duration="1.2s" data-wow-delay=".5s">
                    <div class="counter-icon"><i class="flaticon-clock"></i></div>
                    <div class="counter-number"><span class="counter">964</span> + </div>
                    <div class="counter-content">Working Hour</div>
                  </div>
                </div>
                <!-- Single Counter-->
                <!-- Single Counter-->
                <div class="col-sm-3">
                  <div class="about-counter text-center wow fadeInLeft" data-wow-duration="1.3s" data-wow-delay=".5s">
                      <div class="counter-icon"><i class="flaticon-heart"></i></div>
                    <div class="counter-number"><span class="counter">453</span> + </div>
                    <div class="counter-content">Happy Clients</div>
                  </div>
                </div>
                <!-- Single Counter-->
                <!-- Single Counter-->
                <div class="col-sm-3">
                  <div class="about-counter text-center wow fadeInLeft" data-wow-duration="1.4s" data-wow-delay=".6s">
                      <div class="counter-icon"><i class="flaticon-like"></i></div>
                    <div class="counter-number"><span class="counter">764</span> + </div>
                    <div class="counter-content">Success Stories</div>
                  </div>
                </div>
                <!-- Single Counter-->
                <!-- Single Counter-->
                <div class="col-sm-3">
                  <div class="about-counter text-center wow fadeInLeft" data-wow-duration="1.5s" data-wow-delay=".7s">
                      <div class="counter-icon"><i class="flaticon-gym-1"></i></div>
                    <div class="counter-number"><span class="counter">956</span> + </div>
                    <div class="counter-content">Perfect Bodies</div>
                  </div>
                </div>
                <!-- Single Counter-->
              </div>
            <!-- Counter Row End-->
        </div>
    </section>
    <!-- About Us Area End -->
    <!-- Our Our Classes Area Start -->
    <section class="our-classes">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <h2 class="section-heading">Our Classes</h2>
                    <img class="heading-divider" src="assets/img/divider.png" alt="divider">
                    <h3 class="section-subheading wow fadeInUp" data-wow-duration="1.2s" data-wow-delay=".1s">Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum. </h3>
                </div>
            </div>
            <div class="row">
                <div class="all-classes-slider owl-carousel">
                    <!-- single trainer start-->
                    <div class="item">
                        <div class="single-class-box">
                            <div class="class-img">
                                <img src="assets/img/our-classes-img/1.jpg" alt="class img">
                                <p class="class-fees"><span>100$</span></p>
                            </div>
                            <div class="single-class-content">
                                <a href="classes.html"><h4 class="text-uppercase">FITNEss</h4></a>
                                <p>Nam at vulputate velit. Integer sagittis dolor non ligula finibus, sit amet varius nunc maximus. </p>
                                <a href="classes.html" class="btn round-button">- Learn More</a>
                            </div>
                        </div>
                    </div>
                    <!-- single trainer end-->
                    <!-- single trainer start-->
                    <div class="item">
                        <div class="single-class-box">
                            <div class="class-img">
                                <img src="assets/img/our-classes-img/2.jpg" alt="class img">
                                <p class="class-fees"><span>100$</span></p>
                            </div>
                            <div class="single-class-content">
                                <a href="classes.html"><h4 class="text-uppercase">Strength Trainning </h4></a>
                                <p>Nam at vulputate velit. Integer sagittis dolor non ligula finibus, sit amet varius nunc maximus. </p>
                                <a href="classes.html" class="btn round-button">- Learn More</a>
                            </div>
                        </div>
                    </div>
                    <!-- single trainer end-->
                    <!-- single trainer start-->
                    <div class="item">
                        <div class="single-class-box">
                            <div class="class-img">
                                <img src="assets/img/our-classes-img/3.jpg" alt="class img">
                                <p class="class-fees"><span>100$</span></p>
                            </div>
                            <div class="single-class-content">
                                <a href="classes.html"><h4 class="text-uppercase">Power Yoga</h4></a>
                                <p>Nam at vulputate velit. Integer sagittis dolor non ligula finibus, sit amet varius nunc maximus. </p>
                                <a href="classes.html" class="btn round-button">- Learn More</a>
                            </div>
                        </div>
                    </div>
                    <!-- single trainer end-->
                </div>
                <div class="all_classes_slide_nav">
                    <span class="testi_prev"><i class="flaticon-previous"></i></span>
                    <span class="testi_next"><i class="flaticon-next"></i></span>
                </div>
            </div>
        </div>
    </section>
    <!-- Our Our Classes Area End -->
    <!-- Our Class Schedule Area Start -->
    <section class="class-schedule-area">
      <div class="section-overlay">
          <div class="container">
              <div class="row">
                  <div class="col-lg-12 text-center">
                      <h2 class="section-heading dark">Class Schedule</h2>
                      <img class="heading-divider" src="assets/img/divider.png" alt="divider">
                      <h3 class="section-subheading dark wow fadeInUp" data-wow-duration="1.2s" data-wow-delay=".1s">Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum. </h3>
                  </div>
              </div>
              <div class="row">
                  <!-- Class Schedule Tab Start-->
                  <div class="col-sm-12">
                      <div class="class-schedule-tab-area">
                          <nav>
                              <div class="nav nav-tabs nav-fill" id="nav-tab" role="tablist">
                                  <a class="nav-item nav-link active" id="monday" data-toggle="tab" href="#nav-monday" role="tab" aria-selected="true">Monday</a>
                                  <a class="nav-item nav-link" id="tuesday" data-toggle="tab" href="#nav-tuesday" role="tab" aria-selected="false">Tuesday</a>
                                  <a class="nav-item nav-link" id="wednesday" data-toggle="tab" href="#nav-wednesday" role="tab" aria-selected="false">Wednesday</a>
                                  <a class="nav-item nav-link" id="thursday" data-toggle="tab" href="#nav-thursday" role="tab" aria-selected="false">Thursday</a>
                                  <a class="nav-item nav-link" id="friday" data-toggle="tab" href="#nav-friday" role="tab" aria-selected="false">Friday</a>
                                  <a class="nav-item nav-link" id="saturday" data-toggle="tab" href="#nav-saturday" role="tab" aria-selected="false">Saturday</a>
                                  <a class="nav-item nav-link" id="sunday" data-toggle="tab" href="#nav-sunday" role="tab" aria-selected="false">Sunday</a>
                              </div>
                          </nav>
                          <div class="tab-content" id="nav-tabContent">
                              <div class="tab-pane fade show active" id="nav-monday" role="tabpanel" aria-labelledby="monday">
                                  <table class="table">
                                      <tbody>
                                      <tr>
                                          <td>Fitness</td>
                                          <td>9:00am - 12.00pm</td>
                                          <td>Marry Smith</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Strength Trainning</td>
                                          <td>10:00am - 12.00pm</td>
                                          <td>Petter Jone</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Gym</td>
                                          <td>12:00am - 2.00pm</td>
                                          <td>Jessy Reo</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Running</td>
                                          <td>05:00pm - 7.00pm</td>
                                          <td>Zara Keron</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Weight Lose</td>
                                          <td>08:00pm - 10.00pm</td>
                                          <td>Jack Sparrow</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      </tbody>
                                  </table>
                              </div>
                              <div class="tab-pane fade" id="nav-tuesday" role="tabpanel" aria-labelledby="tuesday">
                                  <table class="table">
                                      <tbody>
                                      <tr>
                                          <td>Fitness</td>
                                          <td>9:00am - 12.00pm</td>
                                          <td>Marry Smith</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Strength Trainning</td>
                                          <td>10:00am - 12.00pm</td>
                                          <td>Petter Jone</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Gym</td>
                                          <td>12:00am - 2.00pm</td>
                                          <td>Jessy Reo</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Running</td>
                                          <td>05:00pm - 7.00pm</td>
                                          <td>Zara Keron</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Weight Lose</td>
                                          <td>08:00pm - 10.00pm</td>
                                          <td>Jack Sparrow</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      </tbody>
                                  </table>
                              </div>
                              <div class="tab-pane fade" id="nav-wednesday" role="tabpanel" aria-labelledby="wednesday">
                                  <table class="table">
                                      <tbody>
                                      <tr>
                                          <td>Fitness</td>
                                          <td>9:00am - 12.00pm</td>
                                          <td>Marry Smith</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Strength Trainning</td>
                                          <td>10:00am - 12.00pm</td>
                                          <td>Petter Jone</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Gym</td>
                                          <td>12:00am - 2.00pm</td>
                                          <td>Jessy Reo</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Running</td>
                                          <td>05:00pm - 7.00pm</td>
                                          <td>Zara Keron</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Weight Lose</td>
                                          <td>08:00pm - 10.00pm</td>
                                          <td>Jack Sparrow</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      </tbody>
                                  </table>
                              </div>
                              <div class="tab-pane fade" id="nav-thursday" role="tabpanel" aria-labelledby="thursday">
                                  <table class="table">
                                      <tbody>
                                      <tr>
                                          <td>Fitness</td>
                                          <td>9:00am - 12.00pm</td>
                                          <td>Marry Smith</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Strength Trainning</td>
                                          <td>10:00am - 12.00pm</td>
                                          <td>Petter Jone</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Gym</td>
                                          <td>12:00am - 2.00pm</td>
                                          <td>Jessy Reo</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Running</td>
                                          <td>05:00pm - 7.00pm</td>
                                          <td>Zara Keron</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Weight Lose</td>
                                          <td>08:00pm - 10.00pm</td>
                                          <td>Jack Sparrow</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      </tbody>
                                  </table>
                              </div>
                              <div class="tab-pane fade" id="nav-friday" role="tabpanel" aria-labelledby="friday">
                                  <table class="table">
                                      <tbody>
                                      <tr>
                                          <td>Fitness</td>
                                          <td>9:00am - 12.00pm</td>
                                          <td>Marry Smith</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Strength Trainning</td>
                                          <td>10:00am - 12.00pm</td>
                                          <td>Petter Jone</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Gym</td>
                                          <td>12:00am - 2.00pm</td>
                                          <td>Jessy Reo</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Running</td>
                                          <td>05:00pm - 7.00pm</td>
                                          <td>Zara Keron</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Weight Lose</td>
                                          <td>08:00pm - 10.00pm</td>
                                          <td>Jack Sparrow</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      </tbody>
                                  </table>
                              </div>
                              <div class="tab-pane fade" id="nav-saturday" role="tabpanel" aria-labelledby="saturday">
                                  <table class="table">
                                      <tbody>
                                      <tr>
                                          <td>Fitness</td>
                                          <td>9:00am - 12.00pm</td>
                                          <td>Marry Smith</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Strength Trainning</td>
                                          <td>10:00am - 12.00pm</td>
                                          <td>Petter Jone</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Gym</td>
                                          <td>12:00am - 2.00pm</td>
                                          <td>Jessy Reo</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Running</td>
                                          <td>05:00pm - 7.00pm</td>
                                          <td>Zara Keron</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Weight Lose</td>
                                          <td>08:00pm - 10.00pm</td>
                                          <td>Jack Sparrow</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      </tbody>
                                  </table>
                              </div>
                              <div class="tab-pane fade" id="nav-sunday" role="tabpanel" aria-labelledby="sunday">
                                  <table class="table">
                                      <tbody>
                                      <tr>
                                          <td>Fitness</td>
                                          <td>9:00am - 12.00pm</td>
                                          <td>Marry Smith</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Strength Trainning</td>
                                          <td>10:00am - 12.00pm</td>
                                          <td>Petter Jone</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Gym</td>
                                          <td>12:00am - 2.00pm</td>
                                          <td>Jessy Reo</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Running</td>
                                          <td>05:00pm - 7.00pm</td>
                                          <td>Zara Keron</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      <tr>
                                          <td>Weight Lose</td>
                                          <td>08:00pm - 10.00pm</td>
                                          <td>Jack Sparrow</td>
                                          <td><a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a></td>
                                      </tr>
                                      </tbody>
                                  </table>
                              </div>
                          </div>
                      </div>
                  </div>
                  <!-- Class Schedule Tab End-->
              </div>
          </div>
      </div>
    </section>
    <!-- Our Class Schedule  Area End -->
    <!-- Our Expert Trainers Area Start -->
    <section class="our-expert-trainers-area">
        <div class="container">
              <div class="row">
                <div class="col-lg-12 text-center">
                  <h2 class="section-heading">Our Expert Trainers</h2>
                  <img class="heading-divider" src="assets/img/divider.png" alt="divider">
                  <h3 class="section-subheading wow fadeInUp" data-wow-duration="1.2s" data-wow-delay=".1s">Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum. </h3>
                </div>
              </div>
              <div class="row">
              <!-- single trainer start-->
                <div class="col-12 col-sm-6 col-md-3">
                    <div class="single-trainer wow fadeIn" data-wow-duration="1.5s" data-wow-delay=".4s">
                       <img src="assets/img/expert-trainers-img/1.jpg" alt="Trainer">
                        <div class="single-trainer-upper">
                            <h5 class="trainer-name">Petter Jone</h5>
                            <p class="trainer-designation">Strength Trainning</p>
                            <div class="trainer-social">
                                <ul>
                                    <li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
                                    <li><a href="#"><i class="fab fa-twitter"></i></a></li>
                                    <li><a href="#"><i class="fab fa-linkedin-in"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
              <!-- single trainer end-->
              <!-- single trainer start-->
                <div class="col-12 col-sm-6 col-md-3">
                    <div class="single-trainer wow fadeIn" data-wow-duration="1.5s" data-wow-delay=".5s">
                       <img src="assets/img/expert-trainers-img/2.jpg" alt="Trainer">
                        <div class="single-trainer-upper">
                          <h5 class="trainer-name">Petter Cattie</h5>
                          <p class="trainer-designation">Strength Trainning</p>
                          <div class="trainer-social">
                              <ul>
                                  <li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
                                  <li><a href="#"><i class="fab fa-twitter"></i></a></li>
                                  <li><a href="#"><i class="fab fa-linkedin-in"></i></a></li>
                              </ul>
                          </div>
                        </div>
                    </div>
                </div>
              <!-- single trainer end-->
              <!-- single trainer start-->
                <div class="col-12 col-sm-6 col-md-3">
                    <div class="single-trainer wow fadeIn" data-wow-duration="1.5s" data-wow-delay=".6s">
                       <img src="assets/img/expert-trainers-img/3.jpg" alt="Trainer">
                        <div class="single-trainer-upper">
                          <h5 class="trainer-name">Johns Jone</h5>
                          <p class="trainer-designation">Strength Trainning</p>
                            <div class="trainer-social">
                                <ul>
                                    <li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
                                    <li><a href="#"><i class="fab fa-twitter"></i></a></li>
                                    <li><a href="#"><i class="fab fa-linkedin-in"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
              <!-- single trainer end-->
              <!-- single trainer start-->
                <div class="col-12 col-sm-6 col-md-3">
                    <div class="single-trainer wow fadeIn" data-wow-duration="1.5s" data-wow-delay=".7s">
                       <img src="assets/img/expert-trainers-img/4.jpg" alt="Trainer">
                        <div class="single-trainer-upper">
                          <h5 class="trainer-name">Jannie Cate</h5>
                          <p class="trainer-designation">Strength Trainning</p>
                            <div class="trainer-social">
                                <ul>
                                    <li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
                                    <li><a href="#"><i class="fab fa-twitter"></i></a></li>
                                    <li><a href="#"><i class="fab fa-linkedin-in"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
              <!-- single trainer end-->
              </div>
        </div>
    </section>
    <!-- Our Expert Trainers Area End -->
    <!-- Our Membership Area Start -->
    <section class="our-membership-area">
        <div class="container">
              <div class="row">
                <div class="col-lg-12 text-center">
                  <h2 class="section-heading">Our Membership</h2>
                  <img class="heading-divider" src="assets/img/divider.png" alt="divider">
                  <h3 class="section-subheading wow fadeInUp" data-wow-duration="1.2s" data-wow-delay=".1s">Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum. </h3>
                </div>
              </div>
              <div class="row membership-all-box">
              <!-- single membership box start-->
                  <div class="col-lg-4">
                      <div class="card mb-5 mb-lg-0">
                          <div class="card-body text-center">
                              <img src="assets/img/our-membership-img/1.jpg" alt="Membership">
                              <div class="card-price text-center"><h3>30$</h3><span class="period">Per Month</span></div>
                              <h5 class="card-title text-uppercase text-center">BEGINNER PLAN</h5>
                              <div class="line"></div>
                              <ul class="">
                                  <li><span>Unlimited </span>access to the gym</li>
                                  <li><span>3 classes </span>per week</li>
                                  <li><span>One Year </span>membership</li>
                                  <li><span>FREE </span>drinking package</li>
                                  <li>1 Free personal trainings </li>
                              </ul>
                              <a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a>
                          </div>
                      </div>
                  </div>
              <!-- single trainer end-->
              <!-- single membership box start-->
                  <div class="col-lg-4">
                      <div class="card membership-card-active mb-5 mb-lg-0">
                          <div class="card-body text-center">
                              <img src="assets/img/our-membership-img/2.jpg" alt="Membership">
                              <div class="card-price text-center"><h3>60$</h3><span class="period">Per Month</span></div>
                              <h5 class="card-title text-uppercase text-center">PREMIUM PLAN</h5>
                              <div class="line"></div>
                              <ul class="">
                                  <li><span>Unlimited </span>access to the gym</li>
                                  <li><span>5 classes </span>per week</li>
                                  <li><span>One Year </span>membership</li>
                                  <li><span>FREE </span>drinking package</li>
                                  <li>2 Free personal trainings </li>
                              </ul>
                              <a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a>
                          </div>
                      </div>
                  </div>
              <!-- single trainer end-->
              <!-- single membership box start-->
                  <div class="col-lg-4">
                      <div class="card mb-5 mb-lg-0">
                          <div class="card-body text-center">
                              <img src="assets/img/our-membership-img/3.jpg" alt="Membership">
                              <div class="card-price text-center"><h3>80$</h3><span class="period">Per Month</span></div>
                              <h5 class="card-title text-uppercase text-center">ULTIMATE PLAN</h5>
                              <div class="line"></div>
                              <ul class="">
                                  <li><span>Unlimited </span>access to the gym</li>
                                  <li><span>7 classes </span>per week</li>
                                  <li><span>One Year </span>membership</li>
                                  <li><span>FREE </span>drinking package</li>
                                  <li>7 Free personal trainings </li>
                              </ul>
                              <a href="pricing-table.html" class="btn section-button btn-effect text-uppercase">Join Now</a>
                          </div>
                      </div>
                  </div>
              <!-- single trainer end-->
              </div>
        </div>
    </section>
    <!-- Our Membership Area End -->
    <!-- Comments From Trainee Area Start -->
    <section class="comments-from-trainee-area">
        <div class="container-fluid padding-zero">
            <!-- Row Start-->
            <div class="row">
                <div class="col-lg-12 text-center">
                    <h2 class="section-heading">Comments From Trainee</h2>
                    <img class="heading-divider" src="assets/img/divider.png" alt="divider">
                    <h3 class="section-subheading wow fadeInUp" data-wow-duration="1.2s" data-wow-delay=".1s">Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum. </h3>
                </div>
            </div>
            <!-- Row End-->
            <!-- Row Start-->
            <div class="row">
                <div class="col-lg-12">
                    <!-- Comment Wrapper Only For Large Screen Start-->
                    <div class="comments-from-trainee-wrapper position-relative">
                        <nav>
                            <div class="nav nav-tabs nav-fill" id="nav-tab1" role="tablist">
                                <a class="nav-item nav-link active wow zoomIn" id="1" data-toggle="tab" href="#nav-1" role="tab" aria-selected="true" data-wow-duration="1.2s" data-wow-delay=".5s">
                                    <img src="assets/img/comments-from-trainee-img/8.png" alt="trainee" class="d-none d-sm-block" data-aos="zoom-in"> <p class="d-block d-sm-none">Petter Doe</p>
                                </a>
                                <a class="nav-item nav-link wow zoomIn" id="2" data-toggle="tab" href="#nav-2" role="tab" aria-selected="false" data-wow-duration="1.2s" data-wow-delay=".5s">
                                    <img src="assets/img/comments-from-trainee-img/7.png" alt="trainee" class="d-none d-sm-block" data-aos="zoom-in"> <p class="d-block d-sm-none">John Doe</p>
                                </a>
                                <a class="nav-item nav-link wow zoomIn" id="3" data-toggle="tab" href="#nav-3" role="tab" aria-selected="false" data-wow-duration="1.2s" data-wow-delay=".5s">
                                    <img src="assets/img/comments-from-trainee-img/6.png" alt="trainee" class="d-none d-sm-block" data-aos="zoom-in"> <p class="d-block d-sm-none">William Doe</p>
                                </a>
                                <a class="nav-item nav-link wow zoomIn" id="4" data-toggle="tab" href="#nav-4" role="tab" aria-selected="false" data-wow-duration="1.2s" data-wow-delay=".5s">
                                    <img src="assets/img/comments-from-trainee-img/4.png" alt="trainee" class="d-none d-sm-block" data-aos="zoom-in"> <p class="d-block d-sm-none">Cattie Doe</p>
                                </a>
                                <a class="nav-item nav-link wow zoomIn" id="5" data-toggle="tab" href="#nav-5" role="tab" aria-selected="false" data-wow-duration="1.2s" data-wow-delay=".5s">
                                    <img src="assets/img/comments-from-trainee-img/3.png" alt="trainee" class="d-none d-sm-block" data-aos="zoom-in"> <p class="d-block d-sm-none">Micle Doe</p>
                                </a>
                                <a class="nav-item nav-link wow zoomIn" id="6" data-toggle="tab" href="#nav-6" role="tab" aria-selected="false" data-wow-duration="1.2s" data-wow-delay=".5s">
                                    <img src="assets/img/comments-from-trainee-img/2.png" alt="trainee" class="d-none d-sm-block" data-aos="zoom-in"> <p class="d-block d-sm-none">James Doe</p>
                                </a>
                                <a class="nav-item nav-link wow zoomIn" id="7" data-toggle="tab" href="#nav-7" role="tab" aria-selected="false" data-wow-duration="1.2s" data-wow-delay=".5s">
                                    <img src="assets/img/comments-from-trainee-img/1.png" alt="trainee" class="d-none d-sm-block" data-aos="zoom-in"> <p class="d-block d-sm-none">Paul Doe</p>
                                </a>
                            </div>
                        </nav>
                        <div class="tab-content py-3 px-3 px-sm-0" id="nav-tabContent1" style="background-image: url('assets/img/comments-from-trainee-img/quote-bg.png'); background-repeat: no-repeat; background-size: auto; background-position: center; ">
                            <div class="tab-pane fade show active" id="nav-1" role="tabpanel" aria-labelledby="1">
                                <div class="trainee-comment-box">
                                    <img src="assets/img/comments-from-trainee-img/8.png" alt="trainee">
                                    <h5 class="text-uppercase">Petter Jone</h5>
                                    <h6>Student at A2ZGym</h6>
                                    <P>“Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum.”</P>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="nav-2" role="tabpanel" aria-labelledby="2">
                                <div class="trainee-comment-box">
                                    <img src="assets/img/comments-from-trainee-img/7.png" alt="trainee">
                                    <h5 class="text-uppercase">Petter Jone</h5>
                                    <h6>Student at A2ZGym</h6>
                                    <P>“Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum.”</P>
                                </div></div>
                            <div class="tab-pane fade" id="nav-3" role="tabpanel" aria-labelledby="3">
                                <div class="trainee-comment-box">
                                    <img src="assets/img/comments-from-trainee-img/6.png" alt="trainee">
                                    <h5 class="text-uppercase">Petter Jone</h5>
                                    <h6>Student at A2ZGym</h6>
                                    <P>“Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum.”</P>
                                </div> </div>
                            <div class="tab-pane fade" id="nav-4" role="tabpanel" aria-labelledby="4">
                                <div class="trainee-comment-box">
                                    <img src="assets/img/comments-from-trainee-img/4.png" alt="trainee">
                                    <h5 class="text-uppercase">Petter Jone</h5>
                                    <h6>Student at A2ZGym</h6>
                                    <P>“Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum.”</P>
                                </div> </div>
                            <div class="tab-pane fade" id="nav-5" role="tabpanel" aria-labelledby="5">
                                <div class="trainee-comment-box">
                                    <img src="assets/img/comments-from-trainee-img/3.png" alt="trainee">
                                    <h5 class="text-uppercase">Petter Jone</h5>
                                    <h6>Student at A2ZGym</h6>
                                    <P>“Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum.”</P>
                                </div> </div>
                            <div class="tab-pane fade" id="nav-6" role="tabpanel" aria-labelledby="6">
                                <div class="trainee-comment-box">
                                    <img src="assets/img/comments-from-trainee-img/2.png" alt="trainee">
                                    <h5 class="text-uppercase">Petter Jone</h5>
                                    <h6>Student at A2ZGym</h6>
                                    <P>“Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum.”</P>
                                </div> </div>
                            <div class="tab-pane fade" id="nav-7" role="tabpanel" aria-labelledby="7">
                                <div class="trainee-comment-box">
                                    <img src="assets/img/comments-from-trainee-img/1.png" alt="trainee">
                                    <h5 class="text-uppercase">Petter Jone</h5>
                                    <h6>Student at A2ZGym</h6>
                                    <P>“Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum.”</P>
                                </div> </div>
                        </div>
                    </div>
                    <!-- Comment Wrapper Only For Large Screen End-->
                    <!-- Comment From Trainee Slider For Small Device Start-->
                    <div class="comment-from-trainee-slider owl-carousel position-relative">
                        <!-- Single Trainee Comment Slide Start-->
                        <div class="item">
                            <div class="trainee-comment-box">
                                <img src="assets/img/comments-from-trainee-img/8.png" alt="trainee">
                                <h5 class="text-uppercase">Petter Jone</h5>
                                <h6>Student at A2ZGym</h6>
                                <P>“Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum.”</P>
                            </div>
                        </div>
                        <!-- Single Trainee Comment Slide End-->
                        <!-- Single Trainee Comment Slide Start-->
                        <div class="item">
                            <div class="trainee-comment-box">
                                <img src="assets/img/comments-from-trainee-img/1.png" alt="trainee">
                                <h5 class="text-uppercase">John Doe</h5>
                                <h6>Student at A2ZGym</h6>
                                <P>“Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum.”</P>
                            </div>
                        </div>
                        <!-- Single Trainee Comment Slide End-->
                        <!-- Single Trainee Comment Slide Start-->
                        <div class="item">
                            <div class="trainee-comment-box">
                                <img src="assets/img/comments-from-trainee-img/2.png" alt="trainee">
                                <h5 class="text-uppercase">John Jane</h5>
                                <h6>Student at A2ZGym</h6>
                                <P>“Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum.”</P>
                            </div>
                        </div>
                        <!-- Single Trainee Comment Slide End-->
                        <!-- Single Trainee Comment Slide Start-->
                        <div class="item">
                            <div class="trainee-comment-box">
                                <img src="assets/img/comments-from-trainee-img/3.png" alt="trainee">
                                <h5 class="text-uppercase">Jennie Cattie</h5>
                                <h6>Student at A2ZGym</h6>
                                <P>“Aliquam erat volutpat. Curabitur tempor nibh quis arcu convallis, sed viverra quam sollicitudin. Proin sed augue sed neque ultricies condimentum.”</P>
                            </div>
                        </div>
                        <!-- Single Trainee Comment Slide End-->
                    </div>
                    <!-- Comment From Trainee Slider For Small Device End-->
                </div>
            </div>
            <!-- Row End-->
        </div>
    </section>
    <!-- Comments From Trainee Area End -->
    <!-- Footer Start -->
    <footer class="footer">
        <!-- Footer Upper Area Start-->
        <div class="footer-upper-area">
            <div class="container">
                <!-- Row Start-->
                <div class="row">
                    <!-- Column Start-->
                    <div class="col-12 col-sm-8 col-md-8 col-lg-4">
                        <div class="footer-about">
                            <a href="index.html"><img src="assets/img/footer-logo.png" alt="logo"></a>
                            <p>Pellentesque convallis, diam et feugiat volutpat, tellus ligula consequat augue, quis malesuada nisi ante nec metus.
                                Sed id pretium nunc. Mauris vitae porttitor tortor. Fusce aliquet ac metus eget egestas. </p>
                            <form class="form-inline">
                                <input type="email" class="form-control" id="newsletter_email" placeholder="Enter your email">
                                <button type="submit" class="btn"><i class="flaticon-paper-plane"></i></button>
                            </form>
                        </div>
                    </div>
                    <!-- Column End-->
                    <!-- Column Start-->
                    <div class="col-12 col-sm-4 col-md-4 col-lg-2">
                        <div class="footer-widget quick-links">
                            <h4 class="text-uppercase">Quick Links</h4>
                            <ul>
                                <li><a href="about.html">About</a></li>
                                <li><a href="classes.html">Classes</a></li>
                                <li><a href="classes.html">Time Schedule</a></li>
                                <li><a href="pricing-table.html">Pricing Table</a></li>
                                <li><a href="blog.html">Blog</a></li>
                                <li><a href="contact.html">Contact Us</a></li>
                            </ul>
                        </div>
                    </div>
                    <!-- Column End-->
                    <!-- Column Start-->
                    <div class="col-12 col-sm-8 col-md-8 col-lg-4">
                        <div class="footer-widget footer-recent-posts">
                            <h4 class="text-uppercase">Recent Post</h4>
                            <ul>
                                <li><a href="single-blog.html"><figure><img src="assets/img/footer-img/recent-post1.jpg" alt="recent"></figure><p>Pellentesque convallis, diam et feugiat volutpat, tellus ligula<span>Sep 09, 2019</span></p></a></li>
                                <li><a href="single-blog.html"><figure><img src="assets/img/footer-img/recent-post2.jpg" alt="recent"></figure><p>Praesent vehicula odio ut erat posuere, nec malesuada dolor<span>Sep 06, 2019</span></p></a></li>
                                <li><a href="single-blog.html"><figure><img src="assets/img/footer-img/recent-post3.jpg" alt="recent"></figure><p>Nulla rhoncus condimentum ante, molestie mattis lorem<span>Sep 02, 2019</span></p></a></li>
                            </ul>
                        </div>
                    </div>
                    <!-- Column End-->
                    <!-- Column Start-->
                    <div class="col-12 col-sm-4 col-md-4 col-lg-2">
                        <div class="footer-widget footer-gallery">
                            <h4 class="text-uppercase">Our Gallery</h4>
                            <ul>
                                <li><a href="gallery.html"><figure><img src="assets/img/footer-img/gallery1.jpg" alt="gallery"></figure></a></li>
                                <li><a href="gallery.html"><figure><img src="assets/img/footer-img/gallery2.jpg" alt="gallery"></figure></a></li>
                                <li><a href="gallery.html"><figure><img src="assets/img/footer-img/gallery3.jpg" alt="gallery"></figure></a></li>
                                <li><a href="gallery.html"><figure><img src="assets/img/footer-img/gallery4.jpg" alt="gallery"></figure></a></li>
                                <li><a href="gallery.html"><figure><img src="assets/img/footer-img/gallery5.jpg" alt="gallery"></figure></a></li>
                                <li><a href="gallery.html"><figure><img src="assets/img/footer-img/gallery6.jpg" alt="gallery"></figure></a></li>
                            </ul>
                        </div>
                    </div>
                    <!-- Column End-->
                </div>
                <!-- Row End-->
            </div>
        </div>
        <!--  Footer Upper Area End-->
        <!-- Footer Bottom Area Start-->
        <div class="footer-bottom-area">
            <div class="container">
                <div class="row">
                    <div class="col-sm-12">
                        <div class="footer-bottom-part">
                            <div class="copyright">Copyright &copy; 2020.Company name All rights reserved.<a target="_blank" href="http://sc.51qianduan.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></div>
                            <div class="footer-social">
                                <ul>
                                    <li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
                                    <li><a href="#"><i class="fab fa-twitter"></i></a></li>
                                    <li><a href="#"><i class="fab fa-linkedin-in"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--  Footer Bottom Area End-->
    </footer>
    <!-- Footer End -->
    <!--Top Arrow area start-->
    <div class="top-arrow">
        <a href="#" id="scroll" style="display: none;"><i class="fas fa-angle-up"></i></a>
    </div>
    <!--Top Arrow area End-->
  <!--=======================================
        All Jquery Script link
  ===========================================-->
    <!-- Bootstrap core JavaScript -->
    <script src="assets/vendor/jquery/jquery.min.js"></script>
    <script src="assets/vendor/jquery/popper.min.js"></script>
    <script src="assets/vendor/bootstrap/js/bootstrap.min.js"></script>
    <!-- ==== Plugin JavaScript ==== -->
    <!-- jQuery owl carousel -->
    <script src="assets/js/owl.carousel.min.js"></script>
    <script src="assets/vendor/jquery-easing/jquery.easing.min.js"></script>
    <!--  Counter Up JavaScript-->
    <script src="assets/js/waypoints.min.js"></script>
    <script src="assets/js/jquery.counterup.min.js"></script>
    <!--Parallax Script-->
    <script src="assets/js/TweenMax.min.js"></script>
    <!--Animated Script-->
    <script src="assets/js/typed.min.js"></script>
    <!--VenoBox Script-->
    <script src="assets/js/venobox.min.js"></script>
    <!--WOW JS Script-->
    <script src="assets/js/wow.min.js"></script>
    <!--AOS JS Script-->
    <script src="assets/js/aos.js"></script>
    <!--Paroller JS Script-->
    <script src="assets/js/jquery.paroller.min.js"></script>
    <!--Mean Menu/Mobile Menu Script-->
    <script src="assets/js/jquery.meanmenu.min.js"></script>
    <!-- Custom scripts for this template -->
    <script src="assets/js/custom.js"></script>
    <script>
        var typed = new Typed('#typed', {
            stringsElement: '#typed-strings',
            typeSpeed: 100,
            backSpeed: 100,
            loop: true,
            smartBackspace: true,
        });
    </script>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册


热门标签: 扁平化 养生会馆 植物花草 游戏 黑色 bootstrap自适应 IT网络科技 蓝色 普通自适应 欧美风 旅游 红色 中国风 金融理财保险 绿色 韩系 高校 灰色 日系 简洁简约 工业产品 黄色 炫酷 家居装饰 紫色 卡通动画 橙色 招聘猎头 精美 实用通用 艺术创意 粉色 政府 婚庆 大气 白色 新闻资讯 婚纱摄影 棕色 清新 教育培训 彩色 绘画 设计 餐饮美食 其他风格 外贸 服装服饰 建筑 化工企业 医药器械 美容美发 动漫 电影视频 包装印刷 机械 汽车4S店 农业产品 咨询管理 酒店 健身房 化妆品 食品 花卉 房地产 协会组织 快递货运 数码电器 搬家 珠宝首饰 酒业 文化传媒 装修装饰 医院医疗 律师 酒吧音乐 图书 动物宠物 航空航天 股票 能源 公益 饮品 生活用品 家政保洁 体育 房屋租赁 商务 电力公司 打车租车 环保 宗教寺庙 工具文具 企业行业 自适应响应式 风格类型 颜色色彩

×
×
51前端

注册

×
绑定手机

请绑定手机号,在继续操作

×
单次下载支付

应付金额:279

支付完成后,回到下载页面,在进行下载

官方QQ群
意见反馈
qq群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到