pricing.html

---
layout: default
title: Plans & Pricing
---
<section class="bg-dark-muted inverse bb bb--large">
  <div class="content">
    <header class="bb">
      <h1 class="alpha mt-80 mb-60 text-center">What sets netlify apart from the rest</h1>
    </header>

    <div class="mt-60 mb-60 text-center-med">
      <div class="l-container mb-60">
        <div class="l-third mb-30">
          <div class="pricing-icon">
            <svg width="200" height="200">
              <use xlink:href="#icon-polyhedron" />
            </svg>
          </div>
        </div>
        {% for item in site.data.plans.intro %}
        {% assign mod = forloop.index0 | modulo:3 %}
        <!-- Mod {{mod}} -->
        {% if mod == 0 %}
        <!-- Starting -->
        <div class="l-third">
          <section class="blurb blurb--wide">
            <div class="blurb-bd small">
        {% endif %}
              <h5 class="medium bold highlight mt-0 mb-0">{{item.title}}</h5>
              <p class="mt-0 mb-40 intro-item js-item">
                <span class="teaser">{{item.teaser}}</span>
                <span class="text">{{item.text}}</span>
                <a href="#" class="js-read-more">
                  <svg width="14" height="14" class="icon">
                    <use xlink:href="#icon-arrow-light" />
                  </svg>
                </a>
              </p>
        {% if mod == 2 %}
        <!-- Ending -->
            </div>
          </section>
        </div>
        {% endif %}

        {% endfor %}
      </div>
    </div>
  </div><!-- end content -->
</section>

<!-- Pricing -->
<section class="bg-light-muted-2 muted text-center">
  <div class="content">
    <header>
      <h1 class="tera mt-60 mb-40">Pricing</h1>
    </header>

    <div class="bb bb--muted">
    {% include plans.html %}
    </div>

    {% include testimonials.html %}
  </div>
</section>