<!doctype html>
<html lang="en">
    <head>
        <title>[[*longtitle]] | [[++site_name]]</title>
        <base href="[[!++site_url]]" >
        <meta charset="[[++modx_charset]]" >
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" >
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" >
        <meta name="keywords" content="[[*introtext]]" >
        <meta name="description" content="[[*description]]" >
        
        <link rel="icon" href="client-assets/images/favicon.ico?v=2" type="image/x-icon" >
        [[$dash-header]]
        <!-- Custom styles for this template -->
        <link rel="stylesheet" href="client-assets/css/greyscale.css" >
    
    </header>
    
    <body>
        
        <style>
            .carousel-item {
                height: 65vh;
                min-height: 250px;
                background: no-repeat center center scroll;
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
            }
            .nav-link {
                /* font-size: 2em; */
                text-align: center;
                font-weight: bold;
            }
        </style>
        
        <!-- Navigation -->
        <nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top" id="mainNav">
        <div class="container">

            <a class="navbar-brand js-scroll-trigger" href="#">
                <img src="client-assets/images/favicon.ico" width="30" height="30" class="d-inline-block align-top" alt="">
                Crop monitor
            </a>
            
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            
            <div class="collapse navbar-collapse" id="navbarResponsive">
                
                <form class="form-inline mx-auto justify-content-center d-none d-md-block">
                    <button class="btn btn-sm btn-outline-success" type="button">Try a [[*longtitle]] Free</button>
                </form>
                
                <ul class="navbar-nav ml-auto">
                    <li class="nav-item">
                        <a class="nav-link js-scroll-trigger" href="[[~18]]">About</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link js-scroll-trigger" href="[[~71]]">Blog</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link js-scroll-trigger" href="[[~17]]">Contact Us</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link js-scroll-trigger" href="[[~4]]">Login</a>
                    </li>
                    <div class="row">
                        <li class="col pr-0 nav-item"><a class="nav-link text-dark" href="#"><i class="fab fa-facebook-f"></i></a></li>
                        <li class="col px-0 nav-item"><a class="nav-link text-dark" href="#"><i class="fab fa-twitter"></i></a></li>
                        <li class="col pl-0 nav-item"><a class="nav-link text-dark" href="#"><i class="fab fa-instagram"></i></a></li>
                    </div>
                </ul>
            </div>
        </div>
        </nav>

        <header>
          <div id="carouselLandingPage" class="carousel slide" data-ride="carousel">
            <ol class="carousel-indicators">
              <li data-target="#carouselLandingPage" data-slide-to="0" class="active"></li>
              <li data-target="#carouselLandingPage" data-slide-to="1"></li>
              <li data-target="#carouselLandingPage" data-slide-to="2"></li>
            </ol>
            <div class="carousel-inner" role="listbox">
                
                [[!Gallery? 
                    &album=`Albrech Landing Page`
                    &thumbTpl=`slideshow_landing_page`
                ]]
                
                <style>
                    .slideOne {
                        background-image: linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25) ), url('client-assets/FredTemplate/images/work.png'), url('client-assets/FredTemplate/images/g6.jpg');
                        background-size: cover, auto 300px;
                        background-position: center, center right 25%;
                    }
                    .slideTwo {
                        background-image: linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25) ), url('client-assets/FredTemplate/images/work.png'), url('client-assets/FredTemplate/images/g7.jpg');
                        background-size: cover, auto 300px;
                        background-position: center, center right 25%;
                    }
                    .slideThree {
                        background-image: linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25) ), url('client-assets/FredTemplate/images/work.png'), url('client-assets/FredTemplate/images/g3.jpg');
                        background-size: cover, auto 300px;
                        background-position: center, center right 25%;
                    }
                </style>
                
                <!-- Slide One - Set the background image for this slide in the line below -->
                <div class="carousel-item active slideOne" style=" ">
                    <div class="carousel-caption text-left">
                        <div class="row">
                            <div class="col-md-9">
                                <h2 class="text-bold">[[*longtitle]]</h2>
                                <p class="lead col-12 col-md-6 ">[[*introtext]]</p>
                                <p class="col-12 col-md-6 font-italic d-none d-md-block">[[*description]]</p>
                                <a href="#" class="btn btn-outline-success">Get a Free Soil Report now!</a>
                            </div>
                            <div class="col-md-3 d-none d-md-block align-middle">
                                <!-- <img src="client-assets/FredTemplate/images/work.png" class="img-fluid mx-auto" alt="Responsive image"> -->
                            </div>
                        </div>
                    </div>
                </div>
              
                <!-- Slide Two - Set the background image for this slide in the line below -->
                <div class="carousel-item slideTwo" style="">
                    <div class="carousel-caption text-left">
                        <div class="row">
                            <div class="col-md-8">
                              <h2 class="text-bold">Second Slide</h2>
                              <p class="lead col-12 col-md-6 ">This is a description for the second slide.</p>
                              <p class="col-12 col-md-6 font-italic d-none d-md-block"></p>
                              <a href="#" class="btn btn-outline-success">Get a Free Soil Report now!</a>
                            </div>
                            <div class="col-md-4 d-none d-md-block">
                                <!-- <img src="client-assets/FredTemplate/images/work.png" class="img-fluid mx-auto align-middle" alt="Responsive image"> -->
                            </div>
                        </div>
                    </div>
                </div>
              
              <!-- Slide Three - Set the background image for this slide in the line below -->
              <div class="carousel-item slideThree" style="">
                <div class="carousel-caption text-left">
                    <div class="row">
                        <div class="col-md-8">
                          <h2 class="text-bold">Third Slide</h2>
                          <p class="lead col-12 col-md-6 ">This is a description for the third slide.</p>
                          <p class="col-12 col-md-6 font-italic d-none d-md-block"></p>
                          <a href="#" class="btn btn-outline-success">Get a Free Soil Report now!</a>
                        </div>
                        <div class="col-md-4 d-none d-md-block">
                            <!-- <img src="client-assets/FredTemplate/images/work.png" class="img-fluid mx-auto align-middle" alt="Responsive image"> -->
                        </div>
                    </div>
                </div>
              </div>
            </div>
            
            <a class="carousel-control-prev" href="#carouselLandingPage" role="button" data-slide="prev">
                  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                  <span class="sr-only">Previous</span>
                </a>
            <a class="carousel-control-next" href="#carouselLandingPage" role="button" data-slide="next">
                  <span class="carousel-control-next-icon" aria-hidden="true"></span>
                  <span class="sr-only">Next</span>
                </a>
          </div>
        </header>

        <!-- Page Content --> 
<section id="about" class="py-5"> 
  <div class="container"> 
    <h2 class="text-success">Albrecht Soil Analysis</h2> 
     
    <hr>
    
    <blockquote class="blockquote text-center"> 
        <p class="mb-0">The soil is the ‘<i>creative material</i>’ of most of the basic needs of life. Creation starts with a handful of dust.</p> 
        <footer class="blockquote-footer">Dr. William A. Abrecht. <cite title="Source Title">University of Missouri</cite></footer> 
    </blockquote> 
    
    <hr>
    
    <div class="row card-deck"> 
        <div class="card border-success text-center mb-3"> 
            <div class="card-body">
                <h2 class="card-title text-center">Physical</h2> 
                <i class="fas fa-atom fa-3x"></i> 
                <p class="card-text">When you correct cation balance, you have addressed soil chemistry, which improves the physical structure of the soil.</p> 
            </div>
        </div> 
         
        <div class="card border-success text-center mb-3"> 
            <div class="card-body">
                <h2 class="card-title text-center">Chemical</h2> 
                <i class="fas fa-flask fa-3x"></i> 
                <p class="card-text">The correction of cation balance and the provision of minimum levels of micronutrients tkatesk care of the chemical part of soil productivity and health.</p>
            </div>
        </div> 
         
        <div class="card border-success text-center mb-3"> 
            <div class="card-body">
                <h2 class="card-title text-center">Biological</h2> 
                <i class="fas fa-bug fa-3x"></i> 
                <p class="card-text">The essential understanding involves a recognition that the purpose of cation balancing is to stimulate soil biology, and much of the beneficial response relates to firing up this workforce</p> 
            </div>
        </div> 
    </div> 
     
    <hr> 

  </div> 
</section> 

<!-- Projects Section -->
<section id="services" class="projects-section bg-light pt-2">
    <div class="container">
         [[!getResources? 
           &parents=`[[*id]]`
           &level=`0`
           &includeTVs=`1` 
           &processTVs=`1`
           &includeContent=`1`
           &tplFirst=`projectsSectionFIRST`
           &tpl=`projectsSectionEVEN`
           &tplOdd=`projectsSectionODD`
           &sortby=`FIELD(modResource.id, 95 )`
           &sortdir=`ASC`
           &limit=`0`
         ]]
    </div>
</section>
          
<section class="bg-dark text-light py-5" id="blog" > 
    <div class="container"> 
        <p class="lead">
            
        </p> 
    </div> 
</section> 

<section class="py-5" id="contact" > 
    <div class="container"> 
        <p class="lead">
            Dr. Albrecht saw a direct link between soil quality and food quality, drawing direct connection between poor quality forage crops, and ill health in livestock.
        </p> 
    </div> 
</section> 

<section class="bg-dark text-light py-5" id="login" > 
    <div class="container"> 
        <p class="lead">
            Feed the soil to feed the plant is another vital concept of the Albrecht Model of soil building.
        </p> 
    </div> 
</section> 

<section class="py-5" id="" > 
    <div class="container"> 
        <p class="lead">
            Feed the soil to feed the plant is another vital concept of the Albrecht Model of soil building.
        </p> 
    </div> 
</section>
        

<!-- Signup Section -->
<section id="signup" class="signup-section">
    <div class="container">
      <div class="row">
        <div class="col-md-10 col-lg-8 mx-auto text-center">

          <i class="far fa-paper-plane fa-2x mb-2 text-white"></i>
          <h2 class="text-white mb-5">Subscribe to receive updates!</h2>
                [[!FormIt?
                    &hooks=`MailChimpSubscribe`
                    &validate=`email:email:required,name:required`
                    &validationErrorMessage=`true`
                    &clearFieldsOnSuccess=`1`
                    &submitVar=`newsletter-submit`
                    &mailchimpListId=`04e221f3bc`
                    &mailchimpFields=`name=FNAME,email=EMAIL`
                    &mailchimpSubscribeField=`newsletter`
                    &mailchimpSubscribeFieldValue=`1`
                    &successMessage=`Thankyou for subscribing`
                ]]
          <span>[[!+fi.successMessage:notempty=`<h2 class="text-white mb-5">[[!+fi.successMessage]]</h2>`]]
          [[!+fi.validation_error_message:notempty=`<h2 class="text-white mb-5">[[+errors]] [[!+fi.validation_error_message]]</h2>`]]</span>
          <form action="[[~[[*id]]]]#signup" method="post" class="form-inline d-flex">
            <input type="hidden" name="nospam" value="" />
            <input class="form-control flex-fill mr-0 mr-sm-2 mb-3 mb-sm-0" type="email" name="email" id="email" value="[[!+fi.email]]" placeholder="Email Address" >
            <input class="form-control flex-fill mr-0 mr-sm-2 mb-3 mb-sm-0" type="text" name="name" id="name" value="[[!+fi.name]]" placeholder="Full Name">
            <input type="submit" name="newsletter-submit" class="btn btn-success mx-auto" value="Subscribe" />
          </form>
          
        </div>
      </div>
    </div>
</section>


<!-- Contact Section -->
<section id="contact"  class="contact-section bg-black">
    <div class="container">
        
        <div class="row">
            <div class="col-md-4 mb-3 mb-md-0">
              <div class="card py-4 h-100">
                <div class="card-body text-center">
                  <i class="fas fa-map-marked-alt text-primary mb-2"></i>
                  <h4 class="text-uppercase m-0">Address</h4>
                  <hr class="my-4">
                  <div class="small text-black-50">34 Coplestone Street,<br> Scottsdale, Tasmania 7260</div>
                </div>
              </div>
            </div>
    
            <div class="col-md-4 mb-3 mb-md-0">
              <div class="card py-4 h-100">
                <div class="card-body text-center">
                  <i class="fas fa-envelope text-primary mb-2"></i>
                  <h4 class="text-uppercase m-0">Email</h4>
                  <hr class="my-4">
                  <div class="small text-black-50">
                    <a href="#">enquiry@cropmonitor.info</a>
                  </div>
                </div>
              </div>
            </div>
    
            <div class="col-md-4 mb-3 mb-md-0">
              <div class="card py-4 h-100">
                <div class="card-body text-center">
                  <i class="fas fa-mobile-alt text-primary mb-2"></i>
                  <h4 class="text-uppercase m-0">Phone</h4>
                  <hr class="my-4">
                  <div class="small text-black-50">0417 728 061</div>
                </div>
              </div>
            </div>
        </div>
    
        <div class="row">
            <div class="col mb-3 mt-3 mb-md-0">
              <div class="card py-4 h-100">
                <div class="card-body text-center">
                  <i class="fas fa-mobile-alt text-primary mb-2"></i>
                  <h4 class="text-uppercase m-0">Contact Us</h4>
                  <hr class="my-4">
                        [[!FormIt?
                            &hooks=`spam,email`
                            &submitVar=`enquiry-submit`
                            &emailTpl=`CMenquiryEmailTpl`
                            &emailTo=`enquiries@cropmonitor.info`
                            &successMessage=`Thankyou for contacting us, we will be in touch soon.`
                            &validationErrorMessage=`true`
                            &validate=`nospam:blank,
                                name:required,
                                email:email:required,
                                text:required:stripTags`
                        ]]  
                    <span>
                        [[!+fi.successMessage:notempty=`<div class="small text-black-50">[[!+fi.successMessage]]</div>`]]
                        [[!+fi.validation_error_message:notempty=`<div class="small text-black-50">[[+errors]] [[!+fi.validation_error_message]]</div>`]]
                    </span>
                    <form action="[[~[[*id]]]]#contact" method="post" class="form-inline d-flex">
                        <input type="hidden" name="nospam" value="" />
                        <input class="form-control form-control-sm flex-fill mr-0 mr-sm-2 mb-3 mb-sm-0" type="email" name="email" id="email" value="[[!+fi.email]]" placeholder="Email Address" >
                        <input class="form-control form-control-sm flex-fill mr-0 mr-sm-2 mb-3 mb-sm-0" type="text" name="name" id="name" value="[[!+fi.name]]" placeholder="Full Name">
                        <textarea class="form-control form-control-sm flex-fill mr-0 mr-sm-2 mb-3 mb-sm-0" name="text" id="text" rows="1" value="[[!+fi.text]]" placeholder="Your enquiry is about...." ></textarea>
                        <input type="submit" name="enquiry-submit" class="btn-sm btn btn-success" value="Submit" />
                    </form>
                </div>
              </div>
            </div>
        </div>
    
        <!--
        <div class="social d-flex justify-content-center">
            <a href="#" class="mx-2">
              <i class="fab fa-youtube"></i>
            </a>
            <a href="#" class="mx-2">
              <i class="fab fa-facebook-f"></i>
            </a>
            <a href="#" class="mx-2">
              <i class="fab fa-linkedin"></i>
            </a>
        </div>
        -->
    </div>
</section>        
        <!-- Footer -->
        <footer class="footer bg-dark py-2 text-center text-white-50">
            <div class="container">
              [[SimpleCopyright? &startYear=`2005`]]. All Rights Reserved<a href="[[~1]]"></a>
            </div>
        </footer>
        
    </body>

    [[$dash-footer]]

</html>