{{ if .Site.Data.pricing.enable}}
{{"<!-- Start Pricing section -->" | safeHTML}}
<section id="pricing" class="pricing section">
    <div class="container">
        <div class="row">

            {{"<!-- section title -->" | safeHTML}}
            <div class="title text-center wow fadeInDown" data-wow-duration="500ms">
                <h2>{{ with .Site.Data.pricing.heading }} {{ . }} {{ end }}<span class="color"> {{ with .Site.Data.pricing.headingSpan }} {{ . }} {{ end }}</span></h2>
                <div class="border"></div>
            </div>
            {{"<!-- /section title -->" | safeHTML}}

            {{ range .Site.Data.pricing.pricingTable }}
            {{"<!-- single pricing table -->" | safeHTML}}
            <div class="col-md-3 col-sm-6 col-xs-12 text-center wow fadeInUp" data-wow-duration="200ms">
                <div class="price-item">

                    {{"<!-- plan name & value -->" | safeHTML}}
                    <div class="price-title">
                        <h3>{{ .title }}</h3>
                        <p><strong class="value">{{ .price }}</strong>/ {{ .time }}</p>
                    </div>

                    {{"<!-- plan description -->" | safeHTML}}
                    <ul>
                        {{ range .plan }}
                        <li>{{ .planDetails }}</li>
                        {{ end }}
                    </ul>

                    {{"<!-- signup button -->" | safeHTML}}
                    <a class="btn btn-transparent" href="{{ .btnURL | absURL}}">{{ .btnText }}</a>

                </div>
            </div>
            {{"<!-- end single pricing table -->" | safeHTML}}
            {{ end }}
        </div>
    </div>
</section>
{{"<!-- /pricing -->" | safeHTML}}
{{ end }}