---

layout: default

---

<div class="columns is-multiline">

<div class="column is-6">

<figure class="image is-4by3">

<img src="{{ page.image }}" />

</figure>

</div>

<div class="column is-6">

<p class="title is-3">{{ page.title }}</p>

<p class="subtitle is-3">{{ page.subtitle }}</p>

<p class="title is-4 has-text-right">{{ page.price }}</p>

{% if page.product_code %}

<p class="subtitle is-5 has-text-right">{{ page.product_code }}</p>

{% endif %}

{% if page.rating %}

{% include rating.html rating=page.rating %}

{% endif %}

{% if page.features %}

<div class="content">

{% for feature in page.features %}

<p>

<span class="icon">

{% if feature.icon %}

<i class="fas {{ feature.icon }}"></i>

{% else %}

<i class="fas fa-circle fa-xs"></i>

{% endif %}

</span>

<span>{{ feature.label }}</span></p>

{% endfor %}

</div>

{% endif %}

</div>

<div class="column is-12">

<p class="title is-4">Description</p>

<div class="content">

{{ content }}

</div>

</div>

{% if site.data.reviews[page.product_code] %}

<div class="column is-12">

<p class="title is-4">Reviews</p>

{% for review in site.data.reviews[page.product_code] %}

{% include review.html %}

{% endfor %}

</div>

{% endif %}