
<!-- 

Use for pics:

  https://www.zillow.com/homedetails/3661-Richwood-Cir-Kannapolis-NC-28081/61653437_zpid/?

 -->

<!DOCTYPE html>
<html>
<head>

	<title>Pine Creek HOA</title>


  <!-- Bootstrap backup -->
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
  <!-- Lato Font embed -->
  <link href="https://fonts.googleapis.com/css?family=Lato:400,700&display=swap" rel="stylesheet">
  <!-- Libre Bakersville Font embed -->
  <link href="https://fonts.googleapis.com/css?family=Libre+Baskerville:400,700&display=swap" rel="stylesheet">
	<!-- Current project CSS file -->
	<link rel="stylesheet" type="text/css" href="css/main.css">

</head>
<body>
  <nav id="mainNav" class="main-nav">
    <div class="container">
      <div class="mobile-nav">
        <a class="mobile-nav--logo" href="#"><img src="img/logo.svg" alt="Pine Creek Logo"></a>
        <div id="hamburger" class="hamburger">
          <div></div>
          <div></div>
          <div></div>
        </div>
      </div>
      <ul>
        <li><a class="nav-item" href="#">Welcome</a></li>
        <li><a class="nav-item" href="#">The Vineyard</a></li>
        <li><a class="nav-item" href="#">Custom Homes</a></li>
        <li class="main-nav--logo"><a href="#"><img src="img/logo.svg" alt="Pine Creek Logo"></a></li>
        <li><a class="nav-item" href="#">Kannapolis</a></li>
        <li><a class="nav-item" href="#">Home Owners</a></li>
        <li><a class="nav-item" href="#">Contact Us</a></li>
      </ul>
    </div>
  </nav>

	<main class="page-content">

    <div class="hero">
      <div style="padding:56.25% 0 0 0;position:relative;">
  <video playsinline muted autoplay loop preload="auto" style="position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;" aria-hidden="true">
          <source src="img/intro_short.mp4" type="video/mp4">
          <!-- Fallback text -->
          Your browser does not support HTML5 video. Download the video <a href="img/intro_short.mp4">here</a>.
        </video>
      </div>
    </div>

    <section class="container my-5">
      <div class="hero-text row py-5">
        <div class="col-md-6">
          <h1>Welcome to Pine Creek</h1>
          <h5>Kannapolis' Premier Gated community</h5>
        </div>
        <div class="col-md-6 mt-3 mt-md-0">
          <p>Pine Creek is one of the Greater Charlotte Area’s premier gated communities offering custom built homes in North Carolina’s Cabarrus County.</p>
          <p>The neighborhood features elegant custom built homes based on French country designs and influences, and homes range in size from 4,500 to over 11,000 square feet. Each home is carefully positioned on lots of one acre or more in order to preserve the natural beauty of the original landscape and to protect each homeowner’s privacy.</p>
          <p>Create lifelong memories with your family in a luxury, custom home in a secure and quiet community. Welcome home to Pine Creek.</p>
        </div>
      </div>
    </section>
    
    <div class="container">
      <hr>
    </div>

    <section class="container my-5">
      <div class="row py-5">
        <div class="col-md-5">
          <h3>The Vineyard</h3>
          <p>A subsect of Pine Creek, The Vineyard is its own haven. Enclosed by lush grape vines and woods, The Vineyard custom homes feature Spanish/Tuscan styled architectural designs.</p>
          <a class="btn btn-primary" href="#">Learn More</a>
        </div>
        <div class="ml-auto col-md-6">
          <div id="slidesVineyard" class="slides vineyard">
            <img class="slides-img" src="img/vineyard-0.jpg" onerror="imgVineyardError(this)">
            <div class="slides-arrow out">
              <svg viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1"><polyline points="15 18 9 12 15 6"></polyline></svg>
            </div>
            <div class="slides-arrow">
              <svg viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1"><polyline points="9 18 15 12 9 6"></polyline></svg>
            </div>
          </div>
        </div>
      </div>
    </section>

    <div class="container">
      <hr>
    </div>

    <section class="container my-5">
      <div class="row py-5">
        <div class="ml-auto col-md-5 order-md-2">
          <h3>Build Your Custom Home in Pine Creek</h3>
          <p>While Pine Creek does not have a list of pre-approved custom home builders in order to provide owners with more flexibility in who builds their future custom home, Pine Creek Homeowners’ Association does evaluate proposed plans in accordance to the guidance in Pine Creek Covenants.</p>
          <p>The primary focus of this approval process is to ensure all proposed home designs, architectural details and landscape designs align with the existing custom homes in Pine Creek. The HOA is pleased to provide feedback to a potential buyer on home plan renderings to confirm your vision would be in harmony with the style of the neighborhood.</p>
          <a class="btn btn-primary" href="#">View open lots</a>
          <a class="btn btn-light" href="#">Contact us</a>
        </div>
        <div class="col-md-6">
          <div id="slidesHouse" class="slides house">
            <img class="slides-img" src="img/house-0.jpg" onerror="imgHouseError(this)">
            <div class="slides-arrow out">
              <svg viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1"><polyline points="15 18 9 12 15 6"></polyline></svg>
            </div>
            <div class="slides-arrow">
              <svg viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"></polyline></svg>
            </div>
          </div>
        </div>
      </div>
    </section>

    <div class="container">
      <hr>
    </div>

    <section class="container my-5">
      <div class="row py-5">
        <div class="col-md-6">
          <h3>Call Kannapolis, NC ‘Home’</h3>
          <p>Kannapolis, North Carolina is a family-oriented town filled with Southern charm. Kannapolis was originally developed in 1906 to be the home to Cannon Mills. Even though the mill is no longer open, Kannapolis has exploded with residential and business development and has become home to families desiring to live close to uptown with the small town, country feel.</p>
          <p>The town is conveniently located; right off of I-85 and within 30 minutes of uptown Charlotte and Charlotte Douglas International Airport. With growing businesses, a vast array of shops and restaurants, a beautiful downtown, Cabarrus County schools and highly sought after private schools, and the grandeur of the NC Research Campus, Kannapolis is a wonderful place to call home.</p>
        </div>
        <div class="ml-auto col-md-6">
          <div class="slides">
            <img class="slides-img" src="img/kannapolis-nc.jpg">
          </div>
        </div>
      </div>
    </section>

    <div class="container">
      <hr>
    </div>

    <section class="container my-5">
      <div class="py-5">
        <div class="pb-4 text-center">
          <h3>Pine Creek Homeowners’ Association</h3>
        </div>
        <p>The Pine Creek Homeowners’ Association consists of board members voted into position by homeowners within the neighborhood. The Homeowner’s Association is responsible for approving proposed building plans and ongoing maintenance of homes within the neighborhood to ensure homes are built and managed to meet the aesthetics of Pine Creek and the Vineyards.</p>
      </div>
    </section>

	</main>
	
	<!-- Current project JS file -->
	<script type="text/javascript" src="js/main.js"></script>
</body>
</html>
	
