<%- include('partials/head', {title :'About the program'}) %>
<%- include('partials/header') %>

<body>
<!-- Hero -->
<section id="hero">


      <div class="container">
          <div class="row">
              <div class="col-sm-6">
                  <!-- <p class="kicker">A trusted Digital Agency</p> -->
                  <h1 class="jumbo">Looking For Inspiration</h1>

                  <p>Track your progress and achieve your target weight with the weight tracker 3000 app.</p>

                  <a href="/" class="btn btn-primary mr-sm"><i class="fa-solid fa-download"></i> &nbsp;Sign up</a> <a href="https://github.com/BrandonMerry/Track_My_Weight_App" class="btn btn-secondary"><i class="fa-brands fa-github"></i> &nbsp;View on GitHub</a>
              </div>

              <div class="col-sm-6">
                  <img src="https://assets.codepen.io/772926/hero.png" class="hero-img" alt="">
              </div>
          </div>
      </div>
  </section>

  <main>
  
  <!-- Content -->
  
  <section id="intro">
      <div class="container">
          <div class="row">
              <div class="col-sm-6">
                  <p class="kicker">Weight Loss Made Easy</p>
                  <h2>Get started <br>losing weight today.</h2>

                  <p>An app designed to help you track your weight loss progress and motivate you to keep achieve your goals.</p>
             
                  <div class="accordion">
                      <div class="a-container">
                        <p class="a-btn">Set Your Goals<span></span></p>
                        <div class="a-panel">
                          <p>Tell us what you want to achieve and receive personalized goals. <br>Monthly Goals <br> Quarterly Goals <br> Caloric Goals </p>
                        </div>
                      </div>
                      <div class="a-container">
                        <p class="a-btn">Personalize The Platform<span></span></p>
                        <div class="a-panel">
                          <p>Configure the platform to meet your needs. <br> Secure Logins <br> Indivudialize configuration options  <br> Customizable Units of Measurement </p>
                        </div>
                      </div>
                      <div class="a-container">
                        <p class="a-btn">Visualize Your Progress <span></span></p>
                        <div class="a-panel">
                          <p>Set your goals then track your progress with a visuala representation of your progress </p>
                        </div>
                      </div>
                    </div>
             
              </div>

              <div class="col-sm-6">
                  <img src="https://assets.codepen.io/772926/section-img-01.png" class="img-right"  alt="">
                  </div>
              </div>
          </div>
  </section>
<!-- 
  <section id="features">
      <div class="container">
          <div class="row">
              

              <div class="col-sm-6">
                  <img src="https://assets.codepen.io/772926/section-img-02.png" class="img-left" alt="">
                  </div>

                  <div class="col-sm-6">
                      <p class="kicker">Fully Intergrated</p>
                      <h2>Work with tools you <br>already use.</h2>
  
                      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                 
                  </div>
              </div>
          </div>
  </section> -->


  <!-- <section id="pricing">
      <div class="container">
          <div class="row">
              <div class="col-sm-12 text-center">
                  <p class="kicker">Trusted Worldwide</p>
                  <h2>Designed for business teams like yours</h2>

                  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
              </div>
          </div>
          <div class="row mt-lg">
              <div class="col-sm-4">
                  <div class="card text-center">
                      <h3>Starter</h3>
                      <p class="mb-sm">Best option for personal use & for your next project.</p>

                      <div class="card-price">
                          <span class="price">£29</span>
                          <span class="term">/month</span>
                          </div>

                          <ul role="list">
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                              <span>Individual configuration</span>
                              </li>
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                              <span>No setup, or hidden fees</span>
                              </li>
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                               <span>Team size: <span class="font-semibold color-black">1 developer</span></span>
                              </li>
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                              <span>Premium support: <span class="font-semibold color-black">6 months</span></span>
                              </li>
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                              <span>Free updates: <span class="font-semibold color-black">6 months</span></span>
                              </li>
                              </ul>

                              <a href="#" class="btn btn-primary full-width">Get Started</a>
                  </div>
              </div>

              <div class="col-sm-4">
                  <div class="card text-center">
                      <h3>Company</h3>
                      <p class="mb-sm">Relevant for multiple users, extended & premium support.</p>

                      <div class="card-price">
                          <span class="price">£99</span>
                          <span class="term">/month</span>
                          </div>

                          <ul role="list">
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                              <span>Individual configuration</span>
                              </li>
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                              <span>No setup, or hidden fees</span>
                              </li>
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                               <span>Team size: <span class="font-semibold color-black">10 developer</span></span>
                              </li>
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                              <span>Premium support: <span class="font-semibold color-black">24 months</span></span>
                              </li>
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                              <span>Free updates: <span class="font-semibold color-black">24 months</span></span>
                              </li>
                              </ul>

                              <a href="#" class="btn btn-primary full-width">Get Started</a>
                  </div>
              </div>

              <div class="col-sm-4">
                  <div class="card text-center">
                      <h3>Enterprise</h3>
                      <p class="mb-sm">Best for large scale uses and extended redistribution rights.</p>

                      <div class="card-price">
                          <span class="price">£299</span>
                          <span class="term">/month</span>
                          </div>

                          <ul role="list">
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                              <span>Individual configuration</span>
                              </li>
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                              <span>No setup, or hidden fees</span>
                              </li>
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                               <span>Team size: <span class="font-semibold color-black">100+ developers</span></span>
                              </li>
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                              <span>Premium support: <span class="font-semibold color-black">36 months</span></span>
                              </li>
                              <li>
                              
                              <svg fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"></path></svg>
                              <span>Free updates: <span class="font-semibold color-black">36 months</span></span>
                              </li>
                              </ul>

                              <a href="#" class="btn btn-primary full-width color-black">Get Started</a>
                  </div>
              </div>
          </div>
      </div>
  </section> -->

  <section id="cta" class="mb-xxl">
      <div class="container">
          <div class="row">
              <div class="col-sm-12 text-center">
                  <h2>Get Started Today</h2>

                  <a href="/" class="btn btn-primary">Sign up </a>
              </div>
          </div>
      </div>
  </section>

  </main>
    
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="js/main.js"></script>
</body>

<!-- <%- include("partials/footer") %> -->