<div id="layout">
<header id="header">
<div class="header-content">
<p class="main-title">
<a href="../preview/dashboard.html" class="block-link"><svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#logo-badge" />
</svg>
Fine Wine Club</a>
</p>
</div>
<div class="header-content">
<a href="../preview/login.html"><svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#logout" />
</svg>
Log out</a>
</div>
</header>
<main id="main-content">
<article class="article-wide">
<h1>Digital Sommelier</h1>
<div class="tabbed">
<ul class="flat-list">
<li>
<a href="#section-0">
<span>Starters</span>
</a>
</li>
<li>
<a href="#section-1">
<span>Main courses</span>
</a>
</li>
<li>
<a href="#section-2">
<span>Desserts</span>
</a>
</li>
</ul>
<section id="section-1">
<form action="#" method="post">
<fieldset class="custom-toggle-group">
<legend>Entrée selection</legend>
<div class="fieldset-grid">
<label>
<input type="radio" id="97ff0331-e010-0ed7-b7c8-3b729552caba" name="b3b03580-575f-678d-0cb3-a9932b553afd">
<span>Bruschetta con pomodori</span>
</label>
<label>
<input type="radio" id="eca1b14d-35e6-6bff-0a0b-2bd9a1e902bb" name="b3b03580-575f-678d-0cb3-a9932b553afd">
<span>Carpaccio di cervo</span>
</label>
<label>
<input type="radio" id="458c766a-c536-2c2f-8f75-168fffdb54a0" name="b3b03580-575f-678d-0cb3-a9932b553afd">
<span>Parmigiana della nonna</span>
</label>
<label>
<input type="radio" id="9561fc4b-7e8e-acce-9300-37dbb04d38d5" name="b3b03580-575f-678d-0cb3-a9932b553afd">
<span>Tagliere casereccio</span>
</label>
</div>
</fieldset>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Price range</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend>Price range</legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="c6119c89-42f4-ca14-2376-258fa9668982" name="9f4c141c-a0bb-f7a0-1d79-12db17b33d6b">
<span>Up to €10</span>
</label>
<label>
<input type="checkbox" id="20eacec5-e7f3-332f-660f-57faed71fd1e" name="9f4c141c-a0bb-f7a0-1d79-12db17b33d6b">
<span>€10 - €20</span>
</label>
<label>
<input type="checkbox" id="8f388f6f-e8f0-6852-3d6c-8aeba7554079" name="9f4c141c-a0bb-f7a0-1d79-12db17b33d6b">
<span>€20 - €40</span>
</label>
<label>
<input type="checkbox" id="85b2c25a-67ab-4fa2-249b-5eae954bef42" name="9f4c141c-a0bb-f7a0-1d79-12db17b33d6b">
<span>€40 - €80</span>
</label>
<label>
<input type="checkbox" id="f6b7a862-a23f-bdae-5561-b127719d20a9" name="9f4c141c-a0bb-f7a0-1d79-12db17b33d6b">
<span>€80 and up</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Colour</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend>Colour</legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="f9ec9507-2e91-dfc2-a9d1-78ae9b0de1ca" name="aa9e777b-b038-c5ab-1650-2eb51d847e70">
<span>Red</span>
</label>
<label>
<input type="checkbox" id="30152598-86b5-dbae-eb1a-27beba7f3aae" name="aa9e777b-b038-c5ab-1650-2eb51d847e70">
<span>Rosé</span>
</label>
<label>
<input type="checkbox" id="4c50a727-7bfc-b1c7-8d1c-3a590306f888" name="aa9e777b-b038-c5ab-1650-2eb51d847e70">
<span>White</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Country</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend>Country</legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="a2051924-cb7a-9d19-0c88-4a15cfa8b12e" name="c6c0a6f4-f607-ad69-70a6-cf37cb9f7ffe">
<span>Italy</span>
</label>
<label>
<input type="checkbox" id="058345be-e4a6-a879-2697-8c6d068df7db" name="c6c0a6f4-f607-ad69-70a6-cf37cb9f7ffe">
<span>Spain</span>
</label>
<label>
<input type="checkbox" id="22b8877c-cbf1-ae6c-1f32-37fd76c1be8a" name="c6c0a6f4-f607-ad69-70a6-cf37cb9f7ffe">
<span>France</span>
</label>
<label>
<input type="checkbox" id="0bb29122-852e-c697-3aa8-ac96fd8094e3" name="c6c0a6f4-f607-ad69-70a6-cf37cb9f7ffe">
<span>Argentina</span>
</label>
<label>
<input type="checkbox" id="ea4605dc-a25d-976f-43ad-c7cef0538ed2" name="c6c0a6f4-f607-ad69-70a6-cf37cb9f7ffe">
<span>Germany</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Grape</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend>Grape</legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="48938589-21d2-65df-02e4-46870a980661" name="ba3fd818-4512-6cc7-15f6-5806b0c1a802">
<span>Chardonnay</span>
</label>
<label>
<input type="checkbox" id="e0c4769d-325e-b7fe-7dd9-59c08e895fdd" name="ba3fd818-4512-6cc7-15f6-5806b0c1a802">
<span>Cabernet Sauvignon</span>
</label>
<label>
<input type="checkbox" id="5ca08bd7-5c29-7a08-823e-c24691142cdc" name="ba3fd818-4512-6cc7-15f6-5806b0c1a802">
<span>Grenache</span>
</label>
<label>
<input type="checkbox" id="e4379db7-768c-4423-15e6-7ea4f430a418" name="ba3fd818-4512-6cc7-15f6-5806b0c1a802">
<span>Syrah</span>
</label>
<label>
<input type="checkbox" id="246ee1b2-62ed-a46b-b7f3-49a3c0619c76" name="ba3fd818-4512-6cc7-15f6-5806b0c1a802">
<span>Merlot</span>
</label>
<label>
<input type="checkbox" id="61ad416f-2844-713f-7019-a286bb95a19b" name="ba3fd818-4512-6cc7-15f6-5806b0c1a802">
<span>Sangiovese</span>
</label>
<label>
<input type="checkbox" id="97b19fba-2f0d-6604-e4ad-a5acb3745281" name="ba3fd818-4512-6cc7-15f6-5806b0c1a802">
<span>Pinot Noir</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Type</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="71a6741b-325d-ba13-bfb8-5b59af0deb23" name="718d8fbb-848d-0d50-14aa-34e128e8626a">
<span>Still</span>
</label>
<label>
<input type="checkbox" id="2328a0bf-3eed-5381-e217-813e6c9d69c6" name="718d8fbb-848d-0d50-14aa-34e128e8626a">
<span>Sparkling</span>
</label>
<label>
<input type="checkbox" id="dc1d992b-3a65-1bd0-edf4-82691164a2d3" name="718d8fbb-848d-0d50-14aa-34e128e8626a">
<span>Fortified</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Style</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="398de7ec-1842-e06c-f8bb-4ce82ebba9b3" name="2df615d8-7a95-ae28-2c48-5fde777c80c7">
<span>Dry</span>
</label>
<label>
<input type="checkbox" id="3ceb24c9-7ca3-c837-81a1-2bc76e27cb40" name="2df615d8-7a95-ae28-2c48-5fde777c80c7">
<span>Medium dry</span>
</label>
<label>
<input type="checkbox" id="15478b21-ffb6-e6ea-b26a-4ee481c33c6e" name="2df615d8-7a95-ae28-2c48-5fde777c80c7">
<span>Medium Sweet</span>
</label>
<label>
<input type="checkbox" id="9e8a12a1-94ab-4c8d-e0ac-a68eef15c138" name="2df615d8-7a95-ae28-2c48-5fde777c80c7">
<span>Sweet</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Weight</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="b33be20e-2006-ceaa-48f0-645fc6b02e89" name="6fa3646e-8967-9fe5-c9a2-35c421875b82">
<span>Light bodied</span>
</label>
<label>
<input type="checkbox" id="07822c9a-a9ae-c93c-804a-4929ff0c9557" name="6fa3646e-8967-9fe5-c9a2-35c421875b82">
<span>Medium bodied</span>
</label>
<label>
<input type="checkbox" id="2d482008-bded-9dd2-aa60-1c9a8dedaadc" name="6fa3646e-8967-9fe5-c9a2-35c421875b82">
<span>Light Bodied to Full bodied</span>
</label>
<label>
<input type="checkbox" id="dba61653-adcd-cd58-64f6-7e01f668e6f1" name="6fa3646e-8967-9fe5-c9a2-35c421875b82">
<span>Medium bodied to Full bodied</span>
</label>
<label>
<input type="checkbox" id="1cdeddeb-d167-ac6c-50c9-2641de142f04" name="6fa3646e-8967-9fe5-c9a2-35c421875b82">
<span>Full bodied</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Region</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="e5169aab-11be-d122-5608-c7fd2019788c" name="e415d596-1002-06a7-2c11-96c68c85b28f">
<span>Region 1</span>
</label>
<label>
<input type="checkbox" id="0b30f7ef-ef91-173e-5249-27ba2fd5202c" name="e415d596-1002-06a7-2c11-96c68c85b28f">
<span>Region 2</span>
</label>
<label>
<input type="checkbox" id="2ba81f16-f33c-2c1f-4e09-a4cdf7614b80" name="e415d596-1002-06a7-2c11-96c68c85b28f">
<span>Region 3</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>District</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="522044ff-e47f-ba26-99a9-a12495b3bc26" name="b93ac053-fecd-02d6-12f9-b0def89e74fc">
<span>District 1</span>
</label>
<label>
<input type="checkbox" id="f4e6c58f-353f-7dd8-84fc-123a65b9a0e8" name="b93ac053-fecd-02d6-12f9-b0def89e74fc">
<span>District 2</span>
</label>
<label>
<input type="checkbox" id="ada72bb9-4e16-307c-b3fe-410ab5b733d4" name="b93ac053-fecd-02d6-12f9-b0def89e74fc">
<span>District 3</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Bottle size</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="3830cc4e-8457-9ff0-179b-05f50921b24f" name="c9630133-4e83-289c-1429-ff1743d1aeb8">
<span>37,5 cl</span>
</label>
<label>
<input type="checkbox" id="d32a6de2-6c40-d81a-6ad4-faf391bf106b" name="c9630133-4e83-289c-1429-ff1743d1aeb8">
<span>75 cl</span>
</label>
<label>
<input type="checkbox" id="bc0f3559-52b5-1781-bc15-09340bd577b6" name="c9630133-4e83-289c-1429-ff1743d1aeb8">
<span>150 cl</span>
</label>
<label>
<input type="checkbox" id="f0567670-c54f-4e1e-6b41-030b1bd8a94f" name="c9630133-4e83-289c-1429-ff1743d1aeb8">
<span>300 cl</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Drinkability</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="ed6a6636-8431-8cb0-8462-5f24e7d14766" name="355677f6-c4d7-5c2d-1dba-358cad9f7856">
<span>Old</span>
</label>
<label>
<input type="checkbox" id="989cbfe3-086d-ceaf-6801-fba14489bcb1" name="355677f6-c4d7-5c2d-1dba-358cad9f7856">
<span>Early</span>
</label>
<label>
<input type="checkbox" id="c73f9e74-70fe-28eb-7c09-dfc4c67ce188" name="355677f6-c4d7-5c2d-1dba-358cad9f7856">
<span>Mature</span>
</label>
<label>
<input type="checkbox" id="0f171665-6c78-ae18-2ef7-cb9926d753f4" name="355677f6-c4d7-5c2d-1dba-358cad9f7856">
<span>Late</span>
</label>
<label>
<input type="checkbox" id="a27b35b0-f823-0825-89f6-df209f16c91d" name="355677f6-c4d7-5c2d-1dba-358cad9f7856">
<span>Young</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="submit-area at-only">
<button type="button">
<span>
<span>Show entrée suggestions</span>
</span>
</button>
</div>
</form>
<h2>Wine suggestions</h2>
<div class="card ">
<h3 class="suggestion-table-heading">
<a href="../preview/product-page.html" class="block-link">
<span>Consulvinus, </span>
<span>La Strada</span>
</a>
<svg class="icon promo" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#star" />
</svg>
<svg class="icon wine-type" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#wine-red" />
</svg>
</h3>
<p class="suggestion-wine-origin"><svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#flag-es" />
</svg>
Spain</p>
<table class="suggestion-table">
<tr>
<th scope="row">Vintage</th>
<td>2017</td>
</tr>
<tr>
<th scope="row">Alcohol</th>
<td>13.5%</td>
</tr>
<tr>
<th scope="row">Description</th>
<td>Very fruity taste with hints of barrels, blackberries, dark cherries, violet, woodland and vanilla.
</td>
</tr>
<tr>
<th scope="row">Stored at</th>
<td>shelf 1</td>
</tr>
<tr>
<th scope="row">Suitability</th>
<td>
<div class="suitability">
<label for="suitability-0">95%</label>
<progress id="suitability-0" max="100" value="95">95</progress>
</div>
</td>
</tr>
<tr>
<th scope="row">Price</th>
<td>€28</td>
</tr>
</table>
<p class="selection-info">
<em><strong>1</strong> bottle selected from cellar (<strong>96</strong> remaining)</em>
</p>
<div class="suggestion-actions inline">
<button type="button" class="alt">
<span>
<svg class="icon alt" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#remove" />
</svg>
<span>Deselect wine</span>
</span>
</button>
<button type="button">
<span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#add" />
</svg>
<span>Select wine</span>
</span>
</button>
</div>
</div>
<div class="card ">
<h3 class="suggestion-table-heading">
<a href="../preview/product-page.html" class="block-link">
<span>Pago Negralada</span>
</a>
<svg class="icon promo" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#star-half" />
</svg>
<svg class="icon wine-type" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#wine-red" />
</svg>
</h3>
<p class="suggestion-wine-origin"><svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#flag-pt" />
</svg>
Portugal</p>
<table class="suggestion-table">
<tr>
<th scope="row">Vintage</th>
<td>2013</td>
</tr>
<tr>
<th scope="row">Alcohol</th>
<td>13%</td>
</tr>
<tr>
<th scope="row">Description</th>
<td>Layers of fragrant strawberry fruit, liquorice, herbs and minerals with soft, silky tannins on the palate.
</td>
</tr>
<tr>
<th scope="row">Stored at</th>
<td>shelf 3</td>
</tr>
<tr>
<th scope="row">Suitability</th>
<td>
<div class="suitability">
<label for="suitability-1">84%</label>
<progress id="suitability-1" max="100" value="84">84</progress>
</div>
</td>
</tr>
<tr>
<th scope="row">Price</th>
<td>€24</td>
</tr>
</table>
<p class="selection-info">
</p>
<div class="suggestion-actions inline">
<button type="button" class="alt">
<span>
<svg class="icon alt" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#remove" />
</svg>
<span>Deselect wine</span>
</span>
</button>
<button type="button">
<span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#add" />
</svg>
<span>Select wine</span>
</span>
</button>
</div>
</div>
<div class="card ">
<h3 class="suggestion-table-heading">
<a href="../preview/product-page.html" class="block-link">
<span>Barolo</span>
</a>
<svg class="icon wine-type" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#wine-red" />
</svg>
</h3>
<p class="suggestion-wine-origin"><svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#flag-it" />
</svg>
Italy</p>
<table class="suggestion-table">
<tr>
<th scope="row">Vintage</th>
<td>2015</td>
</tr>
<tr>
<th scope="row">Alcohol</th>
<td>13.5%</td>
</tr>
<tr>
<th scope="row">Description</th>
<td>Complex, spicy flavor with barrel character, hints of dried cherries, rosehips, roses, sandalwood, bitter orange, cranberry and nougat.
</td>
</tr>
<tr>
<th scope="row">Stored at</th>
<td>shelf 5</td>
</tr>
<tr>
<th scope="row">Suitability</th>
<td>
<div class="suitability">
<label for="suitability-2">81%</label>
<progress id="suitability-2" max="100" value="81">81</progress>
</div>
</td>
</tr>
<tr>
<th scope="row">Price</th>
<td>€18</td>
</tr>
</table>
<p class="selection-info">
</p>
<div class="suggestion-actions inline">
<button type="button" class="alt">
<span>
<svg class="icon alt" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#remove" />
</svg>
<span>Deselect wine</span>
</span>
</button>
<button type="button">
<span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#add" />
</svg>
<span>Select wine</span>
</span>
</button>
</div>
</div>
<div class="card ">
<h3 class="suggestion-table-heading">
<a href="../preview/product-page.html" class="block-link">
<span>Château Batailley</span>
</a>
<svg class="icon wine-type" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#wine-red" />
</svg>
</h3>
<p class="suggestion-wine-origin"><svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#flag-fr" />
</svg>
France</p>
<table class="suggestion-table">
<tr>
<th scope="row">Vintage</th>
<td>2015</td>
</tr>
<tr>
<th scope="row">Alcohol</th>
<td>13.5%</td>
</tr>
<tr>
<th scope="row">Description</th>
<td>Complex, slightly developed taste with clear roasted barrel character, element of plums, coffee, cedar, tobacco, cocoa, cardamom, blackcurrant and vanilla.
</td>
</tr>
<tr>
<th scope="row">Stored at</th>
<td>shelf 11</td>
</tr>
<tr>
<th scope="row">Suitability</th>
<td>
<div class="suitability">
<label for="suitability-3">78%</label>
<progress id="suitability-3" max="100" value="78">78</progress>
</div>
</td>
</tr>
<tr>
<th scope="row">Price</th>
<td>€22</td>
</tr>
</table>
<p class="selection-info">
</p>
<div class="suggestion-actions inline">
<button type="button" class="alt">
<span>
<svg class="icon alt" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#remove" />
</svg>
<span>Deselect wine</span>
</span>
</button>
<button type="button">
<span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#add" />
</svg>
<span>Select wine</span>
</span>
</button>
</div>
</div>
</section>
<section id="section-2">
<form action="#" method="post">
<fieldset class="custom-toggle-group">
<legend>Main course selection</legend>
<div class="fieldset-grid">
<label>
<input type="radio" id="ced5da7e-8006-d45f-1eeb-1485de9ad497" name="">
<span>Tournedos Rossini</span>
</label>
<label>
<input type="radio" id="859fb03b-22b8-cb65-7423-c2fe52d79ccc" name="">
<span>Carne de Ávila</span>
</label>
<label>
<input type="radio" id="447a8533-f734-83d6-345c-16464ae3efb7" name="">
<span>Tourtière</span>
</label>
</div>
</fieldset>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Price range</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend>Price range</legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="5ee92c8d-87f4-9cd2-31d7-52ecfdd3f465" name="1904a007-abf2-ea50-af9b-0c54267feea5">
<span>Up to €10</span>
</label>
<label>
<input type="checkbox" id="b7973272-2b9c-2be7-93c9-2feaafd29371" name="1904a007-abf2-ea50-af9b-0c54267feea5">
<span>€10 - €20</span>
</label>
<label>
<input type="checkbox" id="9e35561d-f810-3c4a-bf09-c6e340fdff99" name="1904a007-abf2-ea50-af9b-0c54267feea5">
<span>€20 - €40</span>
</label>
<label>
<input type="checkbox" id="e1eb0e5f-b0be-8b95-72b0-dc4275dc1acd" name="1904a007-abf2-ea50-af9b-0c54267feea5">
<span>€40 - €80</span>
</label>
<label>
<input type="checkbox" id="1475ff2a-ccd7-c281-c03e-70d746b7e50b" name="1904a007-abf2-ea50-af9b-0c54267feea5">
<span>€80 and up</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Colour</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend>Colour</legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="cc0c0264-6a9f-2fe9-81a2-37bc46d03324" name="d91825c5-cbff-36b5-e32c-be6ff5f0c90c">
<span>Red</span>
</label>
<label>
<input type="checkbox" id="55daf466-fb87-3dad-fe57-5bf13663d86d" name="d91825c5-cbff-36b5-e32c-be6ff5f0c90c">
<span>Rosé</span>
</label>
<label>
<input type="checkbox" id="0a510ac4-5d6f-4b75-fa2c-363dd4457ed0" name="d91825c5-cbff-36b5-e32c-be6ff5f0c90c">
<span>White</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Country</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend>Country</legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="c3c534db-8c5b-5a2c-7381-6dcc3191071e" name="31c433ef-ca9f-8bbe-d761-fa718e95b9be">
<span>Italy</span>
</label>
<label>
<input type="checkbox" id="b98d50e2-3df8-3629-fde7-17802bcc6ed3" name="31c433ef-ca9f-8bbe-d761-fa718e95b9be">
<span>Spain</span>
</label>
<label>
<input type="checkbox" id="77ed8683-95ac-a788-fe1b-3cfc1083299c" name="31c433ef-ca9f-8bbe-d761-fa718e95b9be">
<span>France</span>
</label>
<label>
<input type="checkbox" id="b9f34e58-c86e-562e-3164-009c8f8ca98f" name="31c433ef-ca9f-8bbe-d761-fa718e95b9be">
<span>Argentina</span>
</label>
<label>
<input type="checkbox" id="a4089597-1111-9ca5-ee47-4affd3061660" name="31c433ef-ca9f-8bbe-d761-fa718e95b9be">
<span>Germany</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Grape</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend>Grape</legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="5f4f5544-54f6-22b4-7fd9-d761aab36911" name="ea4100a5-19e0-f475-0faf-f5d4ddd2c44e">
<span>Chardonnay</span>
</label>
<label>
<input type="checkbox" id="29f886f0-7db1-9317-48a2-ccf3030bc4f0" name="ea4100a5-19e0-f475-0faf-f5d4ddd2c44e">
<span>Cabernet Sauvignon</span>
</label>
<label>
<input type="checkbox" id="109c59f2-6e36-2f4a-8693-9f96b333c06e" name="ea4100a5-19e0-f475-0faf-f5d4ddd2c44e">
<span>Grenache</span>
</label>
<label>
<input type="checkbox" id="8b2a8784-eccf-5fc9-5a68-df11af627c27" name="ea4100a5-19e0-f475-0faf-f5d4ddd2c44e">
<span>Syrah</span>
</label>
<label>
<input type="checkbox" id="23a8a587-64e7-9671-fee4-cc8a58a0e668" name="ea4100a5-19e0-f475-0faf-f5d4ddd2c44e">
<span>Merlot</span>
</label>
<label>
<input type="checkbox" id="61358190-4c51-2d02-08e2-070294276e02" name="ea4100a5-19e0-f475-0faf-f5d4ddd2c44e">
<span>Sangiovese</span>
</label>
<label>
<input type="checkbox" id="ee8067e9-e627-2894-84af-f4d86f0e753d" name="ea4100a5-19e0-f475-0faf-f5d4ddd2c44e">
<span>Pinot Noir</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Type</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="9b9d6cc4-77df-0953-6a70-f3c472c3af41" name="3d90a5f1-b8b8-62c8-204a-9f86f6305c00">
<span>Still</span>
</label>
<label>
<input type="checkbox" id="558e10e7-3c07-2ce6-51da-f6c8d058830c" name="3d90a5f1-b8b8-62c8-204a-9f86f6305c00">
<span>Sparkling</span>
</label>
<label>
<input type="checkbox" id="c8abbd63-bea7-1f3e-1d1d-1852e3895a60" name="3d90a5f1-b8b8-62c8-204a-9f86f6305c00">
<span>Fortified</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Style</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="245c3719-8a45-bfb5-3042-1cc656f26a3d" name="805df7a2-25aa-7ebb-bb01-92605699bc84">
<span>Dry</span>
</label>
<label>
<input type="checkbox" id="65ce45ae-08a5-7898-3636-a141094b9af2" name="805df7a2-25aa-7ebb-bb01-92605699bc84">
<span>Medium dry</span>
</label>
<label>
<input type="checkbox" id="64e73fcb-64c0-b004-b312-3fdbdbd2f58b" name="805df7a2-25aa-7ebb-bb01-92605699bc84">
<span>Medium Sweet</span>
</label>
<label>
<input type="checkbox" id="455159a7-6e8d-16f3-7e15-13c36d1050fd" name="805df7a2-25aa-7ebb-bb01-92605699bc84">
<span>Sweet</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Weight</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="f38f0d52-d859-70ab-b9d8-65f4288f42c4" name="262423ad-b549-0a6b-e01f-4c81ad40c3b9">
<span>Light bodied</span>
</label>
<label>
<input type="checkbox" id="8031d2bb-a763-38e3-0db1-463b3e21d2cf" name="262423ad-b549-0a6b-e01f-4c81ad40c3b9">
<span>Medium bodied</span>
</label>
<label>
<input type="checkbox" id="924ad919-799d-7583-e596-836d9154092f" name="262423ad-b549-0a6b-e01f-4c81ad40c3b9">
<span>Light Bodied to Full bodied</span>
</label>
<label>
<input type="checkbox" id="fdaec46f-f8a5-9e66-8a12-b2aa09b6ba87" name="262423ad-b549-0a6b-e01f-4c81ad40c3b9">
<span>Medium bodied to Full bodied</span>
</label>
<label>
<input type="checkbox" id="215e24b3-769c-cffd-9094-e0b1bcf3f9b0" name="262423ad-b549-0a6b-e01f-4c81ad40c3b9">
<span>Full bodied</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Region</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="b46fb307-2285-e9b1-96c2-1693700447ad" name="518ef301-7ad6-7d20-c07c-b06bf1097bff">
<span>Region 1</span>
</label>
<label>
<input type="checkbox" id="f4c00760-7816-8844-fad8-48a7687ed03f" name="518ef301-7ad6-7d20-c07c-b06bf1097bff">
<span>Region 2</span>
</label>
<label>
<input type="checkbox" id="fa02edb4-acda-1b19-4f90-60ef733b854f" name="518ef301-7ad6-7d20-c07c-b06bf1097bff">
<span>Region 3</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>District</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="a3d20e10-5289-91e5-b12a-0d229b4c4d7a" name="8dabb4e0-671b-0551-4ec3-1f8bd4a6d092">
<span>District 1</span>
</label>
<label>
<input type="checkbox" id="0bd488cd-e51f-564a-c162-c662cdd8cc63" name="8dabb4e0-671b-0551-4ec3-1f8bd4a6d092">
<span>District 2</span>
</label>
<label>
<input type="checkbox" id="c4835d6d-30ee-84b9-8cdb-5bf15f47c49e" name="8dabb4e0-671b-0551-4ec3-1f8bd4a6d092">
<span>District 3</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Bottle size</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="5feca93c-cc73-9050-a839-45cb2e10cd45" name="5c2ae709-39ae-9e30-5cb4-7891a465cb40">
<span>37,5 cl</span>
</label>
<label>
<input type="checkbox" id="e86b5f77-64fd-c3ef-6018-d8a75eeaac5d" name="5c2ae709-39ae-9e30-5cb4-7891a465cb40">
<span>75 cl</span>
</label>
<label>
<input type="checkbox" id="a7754452-8102-c7fe-2818-823dbaa6e635" name="5c2ae709-39ae-9e30-5cb4-7891a465cb40">
<span>150 cl</span>
</label>
<label>
<input type="checkbox" id="5c5537e6-37a6-4962-a47b-ddc6ef9b2a1d" name="5c2ae709-39ae-9e30-5cb4-7891a465cb40">
<span>300 cl</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="simple-accordion">
<div class="simple-accordion-item">
<p class="simple-accordion-title">
<span>Drinkability</span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#angle" />
</svg>
</p>
<div class="collapsible-content">
<div class="simple-accordion-inner-content">
<fieldset class="custom-toggle-group">
<legend></legend>
<div class="fieldset-grid">
<label>
<input type="checkbox" id="c4842fa0-16ec-b503-c0c3-eb6073409f22" name="f451f494-5af6-82c1-b98a-cd57f4d21c68">
<span>Old</span>
</label>
<label>
<input type="checkbox" id="e8accf98-ac90-97ca-8531-815bbe390f90" name="f451f494-5af6-82c1-b98a-cd57f4d21c68">
<span>Early</span>
</label>
<label>
<input type="checkbox" id="f1bed029-8cd8-d37d-d5a4-11620236d555" name="f451f494-5af6-82c1-b98a-cd57f4d21c68">
<span>Mature</span>
</label>
<label>
<input type="checkbox" id="079c2b98-eae8-e6f0-a7b7-5cbb5e26d9f2" name="f451f494-5af6-82c1-b98a-cd57f4d21c68">
<span>Late</span>
</label>
<label>
<input type="checkbox" id="cfe40404-4911-f7b0-ba07-006bbdaf4fd0" name="f451f494-5af6-82c1-b98a-cd57f4d21c68">
<span>Young</span>
</label>
</div>
</fieldset>
</div>
</div>
</div>
</div>
<div class="submit-area at-only">
<button type="button">
<span>
<span>Show main course suggestions</span>
</span>
</button>
</div>
</form>
<h2>Wine suggestions</h2>
<div class="card ">
<h3 class="suggestion-table-heading">
<a href="../preview/product-page.html" class="block-link">
<span>Consulvinus, </span>
<span>La Strada</span>
</a>
<svg class="icon promo" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#star" />
</svg>
<svg class="icon wine-type" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#wine-red" />
</svg>
</h3>
<p class="suggestion-wine-origin"><svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#flag-es" />
</svg>
Spain</p>
<table class="suggestion-table">
<tr>
<th scope="row">Vintage</th>
<td>2017</td>
</tr>
<tr>
<th scope="row">Alcohol</th>
<td>13.5%</td>
</tr>
<tr>
<th scope="row">Description</th>
<td>Very fruity taste with hints of barrels, blackberries, dark cherries, violet, woodland and vanilla.
</td>
</tr>
<tr>
<th scope="row">Stored at</th>
<td>shelf 1</td>
</tr>
<tr>
<th scope="row">Suitability</th>
<td>
<div class="suitability">
<label for="suitability-0">95%</label>
<progress id="suitability-0" max="100" value="95">95</progress>
</div>
</td>
</tr>
<tr>
<th scope="row">Price</th>
<td>€28</td>
</tr>
</table>
<p class="selection-info">
<em><strong>1</strong> bottle selected from cellar (<strong>96</strong> remaining)</em>
</p>
<div class="suggestion-actions inline">
<button type="button" class="alt">
<span>
<svg class="icon alt" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#remove" />
</svg>
<span>Deselect wine</span>
</span>
</button>
<button type="button">
<span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#add" />
</svg>
<span>Select wine</span>
</span>
</button>
</div>
</div>
<div class="card ">
<h3 class="suggestion-table-heading">
<a href="../preview/product-page.html" class="block-link">
<span>Pago Negralada</span>
</a>
<svg class="icon promo" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#star-half" />
</svg>
<svg class="icon wine-type" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#wine-red" />
</svg>
</h3>
<p class="suggestion-wine-origin"><svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#flag-pt" />
</svg>
Portugal</p>
<table class="suggestion-table">
<tr>
<th scope="row">Vintage</th>
<td>2013</td>
</tr>
<tr>
<th scope="row">Alcohol</th>
<td>13%</td>
</tr>
<tr>
<th scope="row">Description</th>
<td>Layers of fragrant strawberry fruit, liquorice, herbs and minerals with soft, silky tannins on the palate.
</td>
</tr>
<tr>
<th scope="row">Stored at</th>
<td>shelf 3</td>
</tr>
<tr>
<th scope="row">Suitability</th>
<td>
<div class="suitability">
<label for="suitability-1">84%</label>
<progress id="suitability-1" max="100" value="84">84</progress>
</div>
</td>
</tr>
<tr>
<th scope="row">Price</th>
<td>€24</td>
</tr>
</table>
<p class="selection-info">
</p>
<div class="suggestion-actions inline">
<button type="button" class="alt">
<span>
<svg class="icon alt" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#remove" />
</svg>
<span>Deselect wine</span>
</span>
</button>
<button type="button">
<span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#add" />
</svg>
<span>Select wine</span>
</span>
</button>
</div>
</div>
<div class="card ">
<h3 class="suggestion-table-heading">
<a href="../preview/product-page.html" class="block-link">
<span>Barolo</span>
</a>
<svg class="icon wine-type" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#wine-red" />
</svg>
</h3>
<p class="suggestion-wine-origin"><svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#flag-it" />
</svg>
Italy</p>
<table class="suggestion-table">
<tr>
<th scope="row">Vintage</th>
<td>2015</td>
</tr>
<tr>
<th scope="row">Alcohol</th>
<td>13.5%</td>
</tr>
<tr>
<th scope="row">Description</th>
<td>Complex, spicy flavor with barrel character, hints of dried cherries, rosehips, roses, sandalwood, bitter orange, cranberry and nougat.
</td>
</tr>
<tr>
<th scope="row">Stored at</th>
<td>shelf 5</td>
</tr>
<tr>
<th scope="row">Suitability</th>
<td>
<div class="suitability">
<label for="suitability-2">81%</label>
<progress id="suitability-2" max="100" value="81">81</progress>
</div>
</td>
</tr>
<tr>
<th scope="row">Price</th>
<td>€18</td>
</tr>
</table>
<p class="selection-info">
</p>
<div class="suggestion-actions inline">
<button type="button" class="alt">
<span>
<svg class="icon alt" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#remove" />
</svg>
<span>Deselect wine</span>
</span>
</button>
<button type="button">
<span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#add" />
</svg>
<span>Select wine</span>
</span>
</button>
</div>
</div>
<div class="card ">
<h3 class="suggestion-table-heading">
<a href="../preview/product-page.html" class="block-link">
<span>Château Batailley</span>
</a>
<svg class="icon wine-type" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#wine-red" />
</svg>
</h3>
<p class="suggestion-wine-origin"><svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#flag-fr" />
</svg>
France</p>
<table class="suggestion-table">
<tr>
<th scope="row">Vintage</th>
<td>2015</td>
</tr>
<tr>
<th scope="row">Alcohol</th>
<td>13.5%</td>
</tr>
<tr>
<th scope="row">Description</th>
<td>Complex, slightly developed taste with clear roasted barrel character, element of plums, coffee, cedar, tobacco, cocoa, cardamom, blackcurrant and vanilla.
</td>
</tr>
<tr>
<th scope="row">Stored at</th>
<td>shelf 11</td>
</tr>
<tr>
<th scope="row">Suitability</th>
<td>
<div class="suitability">
<label for="suitability-3">78%</label>
<progress id="suitability-3" max="100" value="78">78</progress>
</div>
</td>
</tr>
<tr>
<th scope="row">Price</th>
<td>€22</td>
</tr>
</table>
<p class="selection-info">
</p>
<div class="suggestion-actions inline">
<button type="button" class="alt">
<span>
<svg class="icon alt" height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#remove" />
</svg>
<span>Deselect wine</span>
</span>
</button>
<button type="button">
<span>
<svg class="icon " height="20" width="20" aria-hidden="true">
<use xlink:href="../../sprite.svg#add" />
</svg>
<span>Select wine</span>
</span>
</button>
</div>
</div>
</section>
<section id="section-3">
<p>Put some tasty desserts here.</p>
</section>
</div>
</article>
</main>
</div>
{{#> @regular-page}}
{{#> @article--wide}}
<h1>Digital Sommelier</h1>
{{#> @tab-interface}}
{{#> @tab-panel id="1"}}
<form action="#" method="post">
{{> @custom-toggle entree id=(random)}}
{{render '@sommelier-filters'}}
{{> @submit-area entree-submit}}
</form>
<h2>Wine suggestions</h2>
{{#each suggestions}}
{{> @suggestion-table}}
{{/each}}
{{/ @tab-panel}}
{{#> @tab-panel id="2"}}
<form action="#" method="post">
{{> @custom-toggle main-course}}
{{render '@sommelier-filters'}}
{{> @submit-area main-course-submit}}
</form>
<h2>Wine suggestions</h2>
{{#each suggestions}}
{{> @suggestion-table}}
{{/each}}
{{/ @tab-panel}}
{{#> @tab-panel id="3"}}
<p>Put some tasty desserts here.</p>
{{/ @tab-panel}}
{{/ @tab-interface}}
{{/ @article--wide}}
{{/ @regular-page}}
{
"header-type": "digisomm",
"tabs": [
{
"title": "Starters"
},
{
"title": "Main courses"
},
{
"title": "Desserts"
}
],
"entree": {
"legend": "Entrée selection",
"type": "radio",
"name": "meal-group",
"toggles": [
{
"label": "Bruschetta con pomodori"
},
{
"label": "Carpaccio di cervo"
},
{
"label": "Parmigiana della nonna"
},
{
"label": "Tagliere casereccio"
}
]
},
"main-course": {
"legend": "Main course selection",
"type": "radio",
"toggles": [
{
"label": "Tournedos Rossini"
},
{
"label": "Carne de Ávila"
},
{
"label": "Tourtière"
}
]
},
"entree-submit": {
"modifier": "at-only",
"submit-button": {
"text": "Show entrée suggestions"
}
},
"main-course-submit": {
"modifier": "at-only",
"submit-button": {
"text": "Show main course suggestions"
}
},
"suggestions": [
{
"name": "La Strada",
"country": "Spain",
"producer": "Consulvinus",
"vintage": 2017,
"alcohol": "13.5%",
"price": "€28",
"promo": {
"icon": "star"
},
"flag": {
"icon": "flag-es"
},
"wine-type": {
"icon": "wine-red"
},
"stored-at": "shelf 1",
"description": "Very fruity taste with hints of barrels, blackberries, dark cherries, violet, woodland and vanilla.\n",
"suitability": 95,
"selection-info": {
"selected": 1,
"remaining": 96
}
},
{
"name": "Pago Negralada",
"country": "Portugal",
"vintage": 2013,
"alcohol": "13%",
"price": "€24",
"promo": {
"icon": "star-half"
},
"wine-type": {
"icon": "wine-red"
},
"flag": {
"icon": "flag-pt"
},
"stored-at": "shelf 3",
"description": "Layers of fragrant strawberry fruit, liquorice, herbs and minerals with soft, silky tannins on the palate.\n",
"suitability": 84
},
{
"name": "Barolo",
"country": "Italy",
"vintage": 2015,
"alcohol": "13.5%",
"price": "€18",
"wine-type": {
"icon": "wine-red"
},
"flag": {
"icon": "flag-it"
},
"stored-at": "shelf 5",
"description": "Complex, spicy flavor with barrel character, hints of dried cherries, rosehips, roses, sandalwood, bitter orange, cranberry and nougat.\n",
"suitability": 81
},
{
"name": "Château Batailley",
"country": "France",
"vintage": 2015,
"alcohol": "13.5%",
"price": "€22",
"wine-type": {
"icon": "wine-red"
},
"flag": {
"icon": "flag-fr"
},
"stored-at": "shelf 11",
"description": "Complex, slightly developed taste with clear roasted barrel character, element of plums, coffee, cedar, tobacco, cocoa, cardamom, blackcurrant and vanilla.\n",
"suitability": 78
}
]
}
No notes defined.