{{ define "content" }}
{{ .Content }}

<div class="columns pricing-tiers is-centered is-multiline">
    {{- with $.Site.Data.memberships.membership_levels }}
    {{ range . -}}

    {{ $period := (default "monthly" .period) }}
    {{ if eq $period "yearly" }}
    {{ $period = "per year" }}
    {{ else if eq $period "monthly" }}
    {{ $period = "per month" }}
    {{ else if eq $period "weekly" }}
    {{ $period = "per weekly" }}
    {{ else if eq $period "daily" }}
    {{ $period = "per day" }}
    {{ end }}

    <div class="column is-one-quarter">
        <div class="box is-large hover-items">
            <h3 class="is-size-4 has-text-weight-bold">{{ .name }}</h3>
            <div class="is-size-1 has-text-weight-bold pricing-price">£{{ default " POA" .price }}</div>
            <div class="_is-block mt-1 is-size-7 has-text-weight-normal">{{ $period }}</div>
            <div class="content mt-5 pricing-description is-size-6">
                <p>{{ .description }}</p>
            </div>
            <div class="content">
                <a href="{{ .link }}" class="button is-primary is-medium is-fullwidth has-box-shadow ">{{ default "Join Today" .button }}</a>
            </div>
        </div>
    </div>
    {{ end }}
    {{- end }}
</div>
{{ end }}