<!-- Default -->
<div class="c-tablist">
<ul class="c-tablist__tabs">
<li>
<a href="#section-1">Section 1</a>
</li>
<li>
<a href="#section-2">Section 2</a>
</li>
<li>
<a href="#section-3">Section 3</a>
</li>
</ul>
<section class="c-tablist__section" id="section-1">
<h2>Section title 1</h2>
<p>111 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>
</section>
<section class="c-tablist__section" id="section-2">
<h2>Section title 2</h2>
<p>222 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>
</section>
<section class="c-tablist__section" id="section-3">
<h2>Section title 3</h2>
<p>333 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>
</section>
</div>
<!-- Flights list -->
<div class="c-tablist ">
<section class="c-tablist__section" id="section-cheaper">
<div class="c-flight-product c-flight-product--round-trip-moredays">
<div class="c-flight-product__info">
<p class="tag tag--mobile">Miglior prezzo</p>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Andata</strong>
<span class="c-route__date">Martedì, 07 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Alitalia</span>
<strong>EK 94</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>15:35</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>6h 45min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
<div class='c-flight-stops__toggle'>
<label for="stop-toggle-1" class='js-flight-stop-toggle'>
1 scalo
</label>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>23:30<span class='more-days'>+1</span></strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
</div>
</div>
<input type="checkbox" id="stop-toggle-1" name="stop-toggle-1" class="u-visuallyhidden u-chkbx-toggle" aria-controls="" aria-label="Espandi per le informazioni dello scalo" role="switch">
<div class="c-route__stop-detail u-chkbx-toggleReceiver" id="stop-detail-1" role="region" aria-live="polite">
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 765</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
BLQ
<strong>15:35</strong>
<p>Bologna, Guglielmo Marconi</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
15:45
</strong>
SVO
<p>Mosca Sheremetyevo</p>
</div>
</div>
</div>
<div class="waiting-time">
<p>Durata scalo: <strong>3h</strong></p>
</div>
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 104</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
SVO
<strong>15:35</strong>
<p>Mosca Sheremetyevo</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
01:15
<span class='more-days'>+1</span>
</strong>
Dxb
<p>Dubai International</p>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Ritorno</strong>
<span class="c-route__date">Sabato, 11 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Alitalia</span>
<strong>EK 95</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>9:00</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>6h 45min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
<span class='line__stop'></span>
</div>
<div class='c-flight-stops__toggle'>
<label for="stop-toggle-2" class='js-flight-stop-toggle'>
1 scalo
</label>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>13:20</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
</div>
</div>
<input type="checkbox" id="stop-toggle-2" name="stop-toggle-2" class="u-visuallyhidden u-chkbx-toggle" aria-controls="" aria-label="Espandi per le informazioni dello scalo" role="switch">
<div class="c-route__stop-detail u-chkbx-toggleReceiver" id="stop-detail-2" role="region" aria-live="polite">
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 765</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
BLQ
<strong>15:35</strong>
<p>Bologna, Guglielmo Marconi</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
15:45
</strong>
SVO
<p>Mosca Sheremetyevo</p>
</div>
</div>
</div>
<div class="waiting-time">
<p>Durata scalo: <strong>2h</strong></p>
</div>
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 104</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
SVO
<strong>17:45</strong>
<p>Mosca Sheremetyevo</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
01:15
</strong>
Dxb
<p>Dubai International</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__actions">
<div class="actions-wrapper">
<p class="tag tag--desktop">Miglior prezzo</p>
<div class="price">
<div>
<p>Andata/Ritorno - 1 passeggero</p>
<p>Economy class</p>
</div>
<div>
<p class="pre-price-txt">A partire da</p>
<strong class="price__value">€ 350,18</strong>
</div>
</div>
<div class="cta">
<button type="submit" class="c-button c-button--submit js-fr-dialogmodal-open" aria-controls="dialog-flight-fares">
Seleziona le tariffe
</button> <a href="#" class="buy-via-phone"><svg class="c-icon c-icon--18">
<use xlink:href="#ic-call-black-24px"></use>
</svg> Acquista al telefono</a>
</div>
</div>
</div>
</div>
<div class="c-dialog js-fr-dialogmodal c-dialog--bill-detail " id="dialog-bill-detail">
<div class="c-dialog__inner js-fr-dialogmodal-modal" aria-labelledby="dialog-bill-detail-title">
<div role="document">
<p class="c-dialog__title" id="dialog-bill-detail-title" aria-hidden="true">Totale del viaggio</p>
<table width="100%">
<tr>
<td class="desc">Costo per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Tasse per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale per tutti i passeggeri:</td>
<td class="price">
<p><strong>€ 120,00</strong></p>
</td>
</tr>
<tr>
<td class="desc">Spese di agenzia:</td>
<td class="price">
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale:</td>
<td class="price">
<p><strong>€ 790,00</strong></p>
</td>
</tr>
</table>
<div class="u-mt--medium">
<p class="clean"><small><strong>Andata BLQ - DXB:</strong> Non incluso bagaglio da stiva</small></p>
<p class="clean"><small><strong>Ritorno DXB - BLQ:</strong> bagaglio da stiva incluso</small></p>
</div>
<button type="button" class="c-dialog__close js-fr-dialogmodal-close" aria-label="Chiudi la modale">
<svg class="c-icon c-icon--32">
<use xlink:href="#ic_close_black_24px"></use>
</svg> </button>
</div>
</div>
</div>
<div class="c-flight-product c-flight-product--round-trip-stops">
<div class="c-flight-product__info">
<p class="tag tag--mobile">Miglior prezzo</p>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Andata</strong>
<span class="c-route__date">Martedì, 07 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Ryanair</span>
<strong>FR4705</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>15:35</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>5h 30min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
<div class='c-flight-stops__toggle'>
<label for="stop-toggle-3" class='js-flight-stop-toggle'>
1 scalo
</label>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>23:30</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
</div>
</div>
<input type="checkbox" id="stop-toggle-3" name="stop-toggle-3" class="u-visuallyhidden u-chkbx-toggle" aria-controls="" aria-label="Espandi per le informazioni dello scalo" role="switch">
<div class="c-route__stop-detail u-chkbx-toggleReceiver" id="stop-detail-3" role="region" aria-live="polite">
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 765</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
BLQ
<strong>15:35</strong>
<p>Bologna, Guglielmo Marconi</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
15:45
</strong>
SVO
<p>Mosca Sheremetyevo</p>
</div>
</div>
</div>
<div class="waiting-time">
<p>Durata scalo: <strong>3h</strong></p>
</div>
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 104</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
SVO
<strong>15:35</strong>
<p>Mosca Sheremetyevo</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
01:15
</strong>
Dxb
<p>Dubai International</p>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Ritorno</strong>
<span class="c-route__date">Sabato, 11 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Ryanair</span>
<strong>FR4706</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>9:00</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>6h 10min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
<div class='c-flight-stops__toggle'>
<label for="stop-toggle-4" class='js-flight-stop-toggle'>
1 scalo
</label>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>13:20</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
</div>
</div>
<input type="checkbox" id="stop-toggle-4" name="stop-toggle-4" class="u-visuallyhidden u-chkbx-toggle" aria-controls="" aria-label="Espandi per le informazioni dello scalo" role="switch">
<div class="c-route__stop-detail u-chkbx-toggleReceiver" id="stop-detail-4" role="region" aria-live="polite">
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 765</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
BLQ
<strong>15:35</strong>
<p>Bologna, Guglielmo Marconi</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
15:45
</strong>
SVO
<p>Mosca Sheremetyevo</p>
</div>
</div>
</div>
<div class="waiting-time">
<p>Durata scalo: <strong>2h</strong></p>
</div>
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 104</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
SVO
<strong>17:45</strong>
<p>Mosca Sheremetyevo</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
01:15
</strong>
Dxb
<p>Dubai International</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__actions">
<div class="actions-wrapper">
<p class="tag tag--desktop">Miglior prezzo</p>
<div class="price">
<div>
<p>Andata/Ritorno - 1 passeggero</p>
<p>Economy class</p>
</div>
<div>
<p class="pre-price-txt">A partire da</p>
<strong class="price__value">€ 355,68</strong>
</div>
</div>
<div class="cta">
<button type="submit" class="c-button c-button--submit js-fr-dialogmodal-open" aria-controls="dialog-flight-fares">
Seleziona le tariffe
</button> <a href="#" class="buy-via-phone"><svg class="c-icon c-icon--18">
<use xlink:href="#ic-call-black-24px"></use>
</svg> Acquista al telefono</a>
</div>
</div>
</div>
</div>
<div class="c-dialog js-fr-dialogmodal c-dialog--bill-detail " id="dialog-bill-detail">
<div class="c-dialog__inner js-fr-dialogmodal-modal" aria-labelledby="dialog-bill-detail-title">
<div role="document">
<p class="c-dialog__title" id="dialog-bill-detail-title" aria-hidden="true">Totale del viaggio</p>
<table width="100%">
<tr>
<td class="desc">Costo per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Tasse per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale per tutti i passeggeri:</td>
<td class="price">
<p><strong>€ 120,00</strong></p>
</td>
</tr>
<tr>
<td class="desc">Spese di agenzia:</td>
<td class="price">
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale:</td>
<td class="price">
<p><strong>€ 790,00</strong></p>
</td>
</tr>
</table>
<div class="u-mt--medium">
<p class="clean"><small><strong>Andata BLQ - DXB:</strong> Non incluso bagaglio da stiva</small></p>
<p class="clean"><small><strong>Ritorno DXB - BLQ:</strong> bagaglio da stiva incluso</small></p>
</div>
<button type="button" class="c-dialog__close js-fr-dialogmodal-close" aria-label="Chiudi la modale">
<svg class="c-icon c-icon--32">
<use xlink:href="#ic_close_black_24px"></use>
</svg> </button>
</div>
</div>
</div>
<div class="c-flight-product c-flight-product--round-trip-stops">
<div class="c-flight-product__info">
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Andata</strong>
<span class="c-route__date">Martedì, 07 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Ryanair</span>
<strong>FR4745</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>15:35</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>3h 32min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
<div class='c-flight-stops__toggle'>
<label for="stop-toggle-5" class='js-flight-stop-toggle'>
1 scalo
</label>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>23:30</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
</div>
</div>
<input type="checkbox" id="stop-toggle-5" name="stop-toggle-5" class="u-visuallyhidden u-chkbx-toggle" aria-controls="" aria-label="Espandi per le informazioni dello scalo" role="switch">
<div class="c-route__stop-detail u-chkbx-toggleReceiver" id="stop-detail-5" role="region" aria-live="polite">
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 765</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
BLQ
<strong>15:35</strong>
<p>Bologna, Guglielmo Marconi</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
15:45
</strong>
SVO
<p>Mosca Sheremetyevo</p>
</div>
</div>
</div>
<div class="waiting-time">
<p>Durata scalo: <strong>3h</strong></p>
</div>
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 104</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
SVO
<strong>15:35</strong>
<p>Mosca Sheremetyevo</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
01:15
</strong>
Dxb
<p>Dubai International</p>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Ritorno</strong>
<span class="c-route__date">Sabato, 11 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Ryanair</span>
<strong>FR4786</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>9:00</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>4h 15min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
<div class='c-flight-stops__toggle'>
<label for="stop-toggle-6" class='js-flight-stop-toggle'>
1 scalo
</label>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>13:20</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
</div>
</div>
<input type="checkbox" id="stop-toggle-6" name="stop-toggle-6" class="u-visuallyhidden u-chkbx-toggle" aria-controls="" aria-label="Espandi per le informazioni dello scalo" role="switch">
<div class="c-route__stop-detail u-chkbx-toggleReceiver" id="stop-detail-6" role="region" aria-live="polite">
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 765</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
BLQ
<strong>15:35</strong>
<p>Bologna, Guglielmo Marconi</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
15:45
</strong>
SVO
<p>Mosca Sheremetyevo</p>
</div>
</div>
</div>
<div class="waiting-time">
<p>Durata scalo: <strong>2h</strong></p>
</div>
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 104</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
SVO
<strong>17:45</strong>
<p>Mosca Sheremetyevo</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
01:15
</strong>
Dxb
<p>Dubai International</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__actions">
<div class="actions-wrapper">
<div class="price">
<div>
<p>Andata/Ritorno - 1 passeggero</p>
<p>Economy class</p>
</div>
<div>
<p class="pre-price-txt">A partire da</p>
<strong class="price__value">€ 467,68</strong>
</div>
</div>
<div class="cta">
<button type="submit" class="c-button c-button--submit js-fr-dialogmodal-open" aria-controls="dialog-flight-fares">
Seleziona le tariffe
</button> <a href="#" class="buy-via-phone"><svg class="c-icon c-icon--18">
<use xlink:href="#ic-call-black-24px"></use>
</svg> Acquista al telefono</a>
</div>
</div>
</div>
</div>
<div class="c-dialog js-fr-dialogmodal c-dialog--bill-detail " id="dialog-bill-detail">
<div class="c-dialog__inner js-fr-dialogmodal-modal" aria-labelledby="dialog-bill-detail-title">
<div role="document">
<p class="c-dialog__title" id="dialog-bill-detail-title" aria-hidden="true">Totale del viaggio</p>
<table width="100%">
<tr>
<td class="desc">Costo per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Tasse per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale per tutti i passeggeri:</td>
<td class="price">
<p><strong>€ 120,00</strong></p>
</td>
</tr>
<tr>
<td class="desc">Spese di agenzia:</td>
<td class="price">
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale:</td>
<td class="price">
<p><strong>€ 790,00</strong></p>
</td>
</tr>
</table>
<div class="u-mt--medium">
<p class="clean"><small><strong>Andata BLQ - DXB:</strong> Non incluso bagaglio da stiva</small></p>
<p class="clean"><small><strong>Ritorno DXB - BLQ:</strong> bagaglio da stiva incluso</small></p>
</div>
<button type="button" class="c-dialog__close js-fr-dialogmodal-close" aria-label="Chiudi la modale">
<svg class="c-icon c-icon--32">
<use xlink:href="#ic_close_black_24px"></use>
</svg> </button>
</div>
</div>
</div>
<div class="c-flight-product c-flight-product--round-trip">
<div class="c-flight-product__info">
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Andata</strong>
<span class="c-route__date">Martedì, 07 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Easyjet</span>
<strong>U22831</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>15:35</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>4h 15min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>23:30</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
</div>
</div>
</div>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Ritorno</strong>
<span class="c-route__date">Sabato, 11 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Easyjet</span>
<strong>U22832</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>9:00</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>4h 15min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>13:20</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__actions">
<div class="actions-wrapper">
<div class="price">
<div>
<p>Andata/Ritorno - 1 passeggero</p>
<p>Economy class</p>
</div>
<div>
<p class="pre-price-txt">A partire da</p>
<strong class="price__value">€ 489,52</strong>
</div>
</div>
<div class="cta">
<button type="submit" class="c-button c-button--submit js-fr-dialogmodal-open" aria-controls="dialog-flight-fares">
Seleziona le tariffe
</button> <a href="#" class="buy-via-phone"><svg class="c-icon c-icon--18">
<use xlink:href="#ic-call-black-24px"></use>
</svg> Acquista al telefono</a>
</div>
</div>
</div>
</div>
<div class="c-dialog js-fr-dialogmodal c-dialog--bill-detail " id="dialog-bill-detail">
<div class="c-dialog__inner js-fr-dialogmodal-modal" aria-labelledby="dialog-bill-detail-title">
<div role="document">
<p class="c-dialog__title" id="dialog-bill-detail-title" aria-hidden="true">Totale del viaggio</p>
<table width="100%">
<tr>
<td class="desc">Costo per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Tasse per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale per tutti i passeggeri:</td>
<td class="price">
<p><strong>€ 120,00</strong></p>
</td>
</tr>
<tr>
<td class="desc">Spese di agenzia:</td>
<td class="price">
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale:</td>
<td class="price">
<p><strong>€ 790,00</strong></p>
</td>
</tr>
</table>
<div class="u-mt--medium">
<p class="clean"><small><strong>Andata BLQ - DXB:</strong> Non incluso bagaglio da stiva</small></p>
<p class="clean"><small><strong>Ritorno DXB - BLQ:</strong> bagaglio da stiva incluso</small></p>
</div>
<button type="button" class="c-dialog__close js-fr-dialogmodal-close" aria-label="Chiudi la modale">
<svg class="c-icon c-icon--32">
<use xlink:href="#ic_close_black_24px"></use>
</svg> </button>
</div>
</div>
</div>
<div class="c-flight-product c-flight-product--round-trip">
<div class="c-flight-product__info">
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Andata</strong>
<span class="c-route__date">Martedì, 07 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Alitalia</span>
<strong>EK109</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>15:35</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>4h 15min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>23:30</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
</div>
</div>
</div>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Ritorno</strong>
<span class="c-route__date">Sabato, 11 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Alitalia</span>
<strong>EK100</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>9:00</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>4h 15min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>13:20</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__actions">
<div class="actions-wrapper">
<div class="price">
<div>
<p>Andata/Ritorno - 1 passeggero</p>
<p>Economy class</p>
</div>
<div>
<p class="pre-price-txt">A partire da</p>
<strong class="price__value">€ 679,23</strong>
</div>
</div>
<div class="cta">
<button type="submit" class="c-button c-button--submit js-fr-dialogmodal-open" aria-controls="dialog-flight-fares">
Seleziona le tariffe
</button> <a href="#" class="buy-via-phone"><svg class="c-icon c-icon--18">
<use xlink:href="#ic-call-black-24px"></use>
</svg> Acquista al telefono</a>
</div>
</div>
</div>
</div>
<div class="c-dialog js-fr-dialogmodal c-dialog--bill-detail " id="dialog-bill-detail">
<div class="c-dialog__inner js-fr-dialogmodal-modal" aria-labelledby="dialog-bill-detail-title">
<div role="document">
<p class="c-dialog__title" id="dialog-bill-detail-title" aria-hidden="true">Totale del viaggio</p>
<table width="100%">
<tr>
<td class="desc">Costo per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Tasse per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale per tutti i passeggeri:</td>
<td class="price">
<p><strong>€ 120,00</strong></p>
</td>
</tr>
<tr>
<td class="desc">Spese di agenzia:</td>
<td class="price">
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale:</td>
<td class="price">
<p><strong>€ 790,00</strong></p>
</td>
</tr>
</table>
<div class="u-mt--medium">
<p class="clean"><small><strong>Andata BLQ - DXB:</strong> Non incluso bagaglio da stiva</small></p>
<p class="clean"><small><strong>Ritorno DXB - BLQ:</strong> bagaglio da stiva incluso</small></p>
</div>
<button type="button" class="c-dialog__close js-fr-dialogmodal-close" aria-label="Chiudi la modale">
<svg class="c-icon c-icon--32">
<use xlink:href="#ic_close_black_24px"></use>
</svg> </button>
</div>
</div>
</div>
<p class="disclaimer">
</p>
<nav class="c-pagination" role="navigation" aria-label="Scorri tra le pagine">
<ul>
<li>
<a class="prev isDisabled" aria-hidden="true"><svg class="c-icon--32">
<use xlink:href="#ic_chevron_left_black_24px"></use>
</svg></a>
</li>
<li><a href="#" class="isActive" aria-label="Pagina attuale, Pagina 1" aria-current="true">1</a></li>
<li><a href="#" aria-label="Vai alla pagina 2">2</a></li>
<li><a href="#" aria-label="Vai alla pagina 3">3</a></li>
<li><a href="#" aria-label="Vai alla pagina 4">4</a></li>
<li>
<a href="#" class="next" aria-label="Vai alla pagina successiva"><svg class="c-icon--32">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</li>
</ul>
</nav>
</section>
<section class="c-tablist__section" id="section-quickest">
<div class="c-flight-product c-flight-product--round-trip">
<div class="c-flight-product__info">
<p class="tag tag--mobile">Il più veloce</p>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Andata</strong>
<span class="c-route__date">Martedì, 07 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Easyjet</span>
<strong>U22831</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>15:35</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>4h 15min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>23:30</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
</div>
</div>
</div>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Ritorno</strong>
<span class="c-route__date">Sabato, 11 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Easyjet</span>
<strong>U22832</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>9:00</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>4h 25min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>13:20</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__actions">
<div class="actions-wrapper">
<p class="tag tag--desktop">Il più veloce</p>
<div class="price">
<div>
<p>Andata/Ritorno - 1 passeggero</p>
<p>Economy class</p>
</div>
<div>
<p class="pre-price-txt">A partire da</p>
<strong class="price__value">€ 754,93</strong>
</div>
</div>
<div class="cta">
<button type="submit" class="c-button c-button--submit js-fr-dialogmodal-open" aria-controls="dialog-flight-fares">
Seleziona le tariffe
</button> <a href="#" class="buy-via-phone"><svg class="c-icon c-icon--18">
<use xlink:href="#ic-call-black-24px"></use>
</svg> Acquista al telefono</a>
</div>
</div>
</div>
</div>
<div class="c-dialog js-fr-dialogmodal c-dialog--bill-detail " id="dialog-bill-detail">
<div class="c-dialog__inner js-fr-dialogmodal-modal" aria-labelledby="dialog-bill-detail-title">
<div role="document">
<p class="c-dialog__title" id="dialog-bill-detail-title" aria-hidden="true">Totale del viaggio</p>
<table width="100%">
<tr>
<td class="desc">Costo per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Tasse per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale per tutti i passeggeri:</td>
<td class="price">
<p><strong>€ 120,00</strong></p>
</td>
</tr>
<tr>
<td class="desc">Spese di agenzia:</td>
<td class="price">
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale:</td>
<td class="price">
<p><strong>€ 790,00</strong></p>
</td>
</tr>
</table>
<div class="u-mt--medium">
<p class="clean"><small><strong>Andata BLQ - DXB:</strong> Non incluso bagaglio da stiva</small></p>
<p class="clean"><small><strong>Ritorno DXB - BLQ:</strong> bagaglio da stiva incluso</small></p>
</div>
<button type="button" class="c-dialog__close js-fr-dialogmodal-close" aria-label="Chiudi la modale">
<svg class="c-icon c-icon--32">
<use xlink:href="#ic_close_black_24px"></use>
</svg> </button>
</div>
</div>
</div>
<div class="c-flight-product c-flight-product--round-trip">
<div class="c-flight-product__info">
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Andata</strong>
<span class="c-route__date">Martedì, 07 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Alitalia</span>
<strong>EK109</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>15:35</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>4h 15min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>23:30</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
</div>
</div>
</div>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Ritorno</strong>
<span class="c-route__date">Sabato, 11 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Alitalia</span>
<strong>EK100</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>9:00</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>4h 15min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>13:20</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__actions">
<div class="actions-wrapper">
<div class="price">
<div>
<p>Andata/Ritorno - 1 passeggero</p>
<p>Economy class</p>
</div>
<div>
<p class="pre-price-txt">A partire da</p>
<strong class="price__value">€ 679,23</strong>
</div>
</div>
<div class="cta">
<button type="submit" class="c-button c-button--submit js-fr-dialogmodal-open" aria-controls="dialog-flight-fares">
Seleziona le tariffe
</button> <a href="#" class="buy-via-phone"><svg class="c-icon c-icon--18">
<use xlink:href="#ic-call-black-24px"></use>
</svg> Acquista al telefono</a>
</div>
</div>
</div>
</div>
<div class="c-dialog js-fr-dialogmodal c-dialog--bill-detail " id="dialog-bill-detail">
<div class="c-dialog__inner js-fr-dialogmodal-modal" aria-labelledby="dialog-bill-detail-title">
<div role="document">
<p class="c-dialog__title" id="dialog-bill-detail-title" aria-hidden="true">Totale del viaggio</p>
<table width="100%">
<tr>
<td class="desc">Costo per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Tasse per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale per tutti i passeggeri:</td>
<td class="price">
<p><strong>€ 120,00</strong></p>
</td>
</tr>
<tr>
<td class="desc">Spese di agenzia:</td>
<td class="price">
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale:</td>
<td class="price">
<p><strong>€ 790,00</strong></p>
</td>
</tr>
</table>
<div class="u-mt--medium">
<p class="clean"><small><strong>Andata BLQ - DXB:</strong> Non incluso bagaglio da stiva</small></p>
<p class="clean"><small><strong>Ritorno DXB - BLQ:</strong> bagaglio da stiva incluso</small></p>
</div>
<button type="button" class="c-dialog__close js-fr-dialogmodal-close" aria-label="Chiudi la modale">
<svg class="c-icon c-icon--32">
<use xlink:href="#ic_close_black_24px"></use>
</svg> </button>
</div>
</div>
</div>
<div class="c-flight-product c-flight-product--round-trip-stops">
<div class="c-flight-product__info">
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Andata</strong>
<span class="c-route__date">Martedì, 07 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Alitalia</span>
<strong>EK 94</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>15:35</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>5h 30min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
<div class='c-flight-stops__toggle'>
<label for="stop-toggle-7" class='js-flight-stop-toggle'>
1 scalo
</label>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>23:30</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
</div>
</div>
<input type="checkbox" id="stop-toggle-7" name="stop-toggle-7" class="u-visuallyhidden u-chkbx-toggle" aria-controls="" aria-label="Espandi per le informazioni dello scalo" role="switch">
<div class="c-route__stop-detail u-chkbx-toggleReceiver" id="stop-detail-7" role="region" aria-live="polite">
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 765</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
BLQ
<strong>15:35</strong>
<p>Bologna, Guglielmo Marconi</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
15:45
</strong>
SVO
<p>Mosca Sheremetyevo</p>
</div>
</div>
</div>
<div class="waiting-time">
<p>Durata scalo: <strong>3h</strong></p>
</div>
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 104</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
SVO
<strong>15:35</strong>
<p>Mosca Sheremetyevo</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
01:15
</strong>
Dxb
<p>Dubai International</p>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Ritorno</strong>
<span class="c-route__date">Sabato, 11 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Alitalia</span>
<strong>EK 95</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>9:00</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>5h 30min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
<div class='c-flight-stops__toggle'>
<label for="stop-toggle-8" class='js-flight-stop-toggle'>
1 scalo
</label>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>13:20</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
</div>
</div>
<input type="checkbox" id="stop-toggle-8" name="stop-toggle-8" class="u-visuallyhidden u-chkbx-toggle" aria-controls="" aria-label="Espandi per le informazioni dello scalo" role="switch">
<div class="c-route__stop-detail u-chkbx-toggleReceiver" id="stop-detail-8" role="region" aria-live="polite">
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 765</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
BLQ
<strong>15:35</strong>
<p>Bologna, Guglielmo Marconi</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
15:45
</strong>
SVO
<p>Mosca Sheremetyevo</p>
</div>
</div>
</div>
<div class="waiting-time">
<p>Durata scalo: <strong>2h</strong></p>
</div>
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 104</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
SVO
<strong>17:45</strong>
<p>Mosca Sheremetyevo</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
01:15
</strong>
Dxb
<p>Dubai International</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__actions">
<div class="actions-wrapper">
<div class="price">
<div>
<p>Andata/Ritorno - 1 passeggero</p>
<p>Economy class</p>
</div>
<div>
<p class="pre-price-txt">A partire da</p>
<strong class="price__value">€ 350,18</strong>
</div>
</div>
<div class="cta">
<button type="submit" class="c-button c-button--submit js-fr-dialogmodal-open" aria-controls="dialog-flight-fares">
Seleziona le tariffe
</button> <a href="#" class="buy-via-phone"><svg class="c-icon c-icon--18">
<use xlink:href="#ic-call-black-24px"></use>
</svg> Acquista al telefono</a>
</div>
</div>
</div>
</div>
<div class="c-dialog js-fr-dialogmodal c-dialog--bill-detail " id="dialog-bill-detail">
<div class="c-dialog__inner js-fr-dialogmodal-modal" aria-labelledby="dialog-bill-detail-title">
<div role="document">
<p class="c-dialog__title" id="dialog-bill-detail-title" aria-hidden="true">Totale del viaggio</p>
<table width="100%">
<tr>
<td class="desc">Costo per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Tasse per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale per tutti i passeggeri:</td>
<td class="price">
<p><strong>€ 120,00</strong></p>
</td>
</tr>
<tr>
<td class="desc">Spese di agenzia:</td>
<td class="price">
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale:</td>
<td class="price">
<p><strong>€ 790,00</strong></p>
</td>
</tr>
</table>
<div class="u-mt--medium">
<p class="clean"><small><strong>Andata BLQ - DXB:</strong> Non incluso bagaglio da stiva</small></p>
<p class="clean"><small><strong>Ritorno DXB - BLQ:</strong> bagaglio da stiva incluso</small></p>
</div>
<button type="button" class="c-dialog__close js-fr-dialogmodal-close" aria-label="Chiudi la modale">
<svg class="c-icon c-icon--32">
<use xlink:href="#ic_close_black_24px"></use>
</svg> </button>
</div>
</div>
</div>
<div class="c-flight-product c-flight-product--round-trip-stops">
<div class="c-flight-product__info">
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Andata</strong>
<span class="c-route__date">Martedì, 07 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Ryanair</span>
<strong>FR4705</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>15:35</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>5h 30min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
<div class='c-flight-stops__toggle'>
<label for="stop-toggle-9" class='js-flight-stop-toggle'>
1 scalo
</label>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>23:30</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
</div>
</div>
<input type="checkbox" id="stop-toggle-9" name="stop-toggle-9" class="u-visuallyhidden u-chkbx-toggle" aria-controls="" aria-label="Espandi per le informazioni dello scalo" role="switch">
<div class="c-route__stop-detail u-chkbx-toggleReceiver" id="stop-detail-9" role="region" aria-live="polite">
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 765</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
BLQ
<strong>15:35</strong>
<p>Bologna, Guglielmo Marconi</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
15:45
</strong>
SVO
<p>Mosca Sheremetyevo</p>
</div>
</div>
</div>
<div class="waiting-time">
<p>Durata scalo: <strong>3h</strong></p>
</div>
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 104</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
SVO
<strong>15:35</strong>
<p>Mosca Sheremetyevo</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
01:15
</strong>
Dxb
<p>Dubai International</p>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Ritorno</strong>
<span class="c-route__date">Sabato, 11 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Ryanair</span>
<strong>FR4706</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>9:00</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>6h 10min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
<div class='c-flight-stops__toggle'>
<label for="stop-toggle-10" class='js-flight-stop-toggle'>
1 scalo
</label>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>13:20</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
</div>
</div>
<input type="checkbox" id="stop-toggle-10" name="stop-toggle-10" class="u-visuallyhidden u-chkbx-toggle" aria-controls="" aria-label="Espandi per le informazioni dello scalo" role="switch">
<div class="c-route__stop-detail u-chkbx-toggleReceiver" id="stop-detail-10" role="region" aria-live="polite">
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 765</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
BLQ
<strong>15:35</strong>
<p>Bologna, Guglielmo Marconi</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
15:45
</strong>
SVO
<p>Mosca Sheremetyevo</p>
</div>
</div>
</div>
<div class="waiting-time">
<p>Durata scalo: <strong>2h</strong></p>
</div>
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 104</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
SVO
<strong>17:45</strong>
<p>Mosca Sheremetyevo</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
01:15
</strong>
Dxb
<p>Dubai International</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__actions">
<div class="actions-wrapper">
<div class="price">
<div>
<p>Andata/Ritorno - 1 passeggero</p>
<p>Economy class</p>
</div>
<div>
<p class="pre-price-txt">A partire da</p>
<strong class="price__value">€ 355,68</strong>
</div>
</div>
<div class="cta">
<button type="submit" class="c-button c-button--submit js-fr-dialogmodal-open" aria-controls="dialog-flight-fares">
Seleziona le tariffe
</button> <a href="#" class="buy-via-phone"><svg class="c-icon c-icon--18">
<use xlink:href="#ic-call-black-24px"></use>
</svg> Acquista al telefono</a>
</div>
</div>
</div>
</div>
<div class="c-dialog js-fr-dialogmodal c-dialog--bill-detail " id="dialog-bill-detail">
<div class="c-dialog__inner js-fr-dialogmodal-modal" aria-labelledby="dialog-bill-detail-title">
<div role="document">
<p class="c-dialog__title" id="dialog-bill-detail-title" aria-hidden="true">Totale del viaggio</p>
<table width="100%">
<tr>
<td class="desc">Costo per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Tasse per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale per tutti i passeggeri:</td>
<td class="price">
<p><strong>€ 120,00</strong></p>
</td>
</tr>
<tr>
<td class="desc">Spese di agenzia:</td>
<td class="price">
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale:</td>
<td class="price">
<p><strong>€ 790,00</strong></p>
</td>
</tr>
</table>
<div class="u-mt--medium">
<p class="clean"><small><strong>Andata BLQ - DXB:</strong> Non incluso bagaglio da stiva</small></p>
<p class="clean"><small><strong>Ritorno DXB - BLQ:</strong> bagaglio da stiva incluso</small></p>
</div>
<button type="button" class="c-dialog__close js-fr-dialogmodal-close" aria-label="Chiudi la modale">
<svg class="c-icon c-icon--32">
<use xlink:href="#ic_close_black_24px"></use>
</svg> </button>
</div>
</div>
</div>
<div class="c-flight-product c-flight-product--round-trip-stops">
<div class="c-flight-product__info">
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Andata</strong>
<span class="c-route__date">Martedì, 07 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Ryanair</span>
<strong>FR4745</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>15:35</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>3h 32min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
<div class='c-flight-stops__toggle'>
<label for="stop-toggle-11" class='js-flight-stop-toggle'>
1 scalo
</label>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>23:30</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
</div>
</div>
<input type="checkbox" id="stop-toggle-11" name="stop-toggle-11" class="u-visuallyhidden u-chkbx-toggle" aria-controls="" aria-label="Espandi per le informazioni dello scalo" role="switch">
<div class="c-route__stop-detail u-chkbx-toggleReceiver" id="stop-detail-11" role="region" aria-live="polite">
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 765</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
BLQ
<strong>15:35</strong>
<p>Bologna, Guglielmo Marconi</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
15:45
</strong>
SVO
<p>Mosca Sheremetyevo</p>
</div>
</div>
</div>
<div class="waiting-time">
<p>Durata scalo: <strong>3h</strong></p>
</div>
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 104</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
SVO
<strong>15:35</strong>
<p>Mosca Sheremetyevo</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
01:15
</strong>
Dxb
<p>Dubai International</p>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__route">
<div class="c-route ">
<div class="c-route__data">
<div class="c-route__label">
<strong>Ritorno</strong>
<span class="c-route__date">Sabato, 11 marzo 2022</span>
</div>
<div class="c-route__flight-company">
<span>Ryanair</span>
<strong>FR4786</strong>
<svg class="c-icon c-icon--16">
<use xlink:href="#ic-plane"></use>
</svg>
</div>
</div>
<div class="c-route__journey">
<div class='c-airport-info'>
<strong class='c-airport-info__code'>Dxb</strong>
<strong class='c-airport-info__time'>9:00</strong>
<p class='c-airport-info__name'><strong>Dubai</strong>, International</p>
</div>
<div class='c-flight-stops'>
<p>
Durata del volo: <strong>4h 40min</strong>
</p>
<div class='line' aria-hidden='true'>
<span class='line__stop'></span>
</div>
<div class='c-flight-stops__toggle'>
<label for="stop-toggle-12" class='js-flight-stop-toggle'>
1 scalo
</label>
</div>
</div>
<div class='c-airport-info'>
<strong class='c-airport-info__code'>BLQ</strong>
<strong class='c-airport-info__time'>13:20</strong>
<p class='c-airport-info__name'><strong>Bologna</strong>, Guglielmo Marconi</p>
</div>
</div>
</div>
<input type="checkbox" id="stop-toggle-12" name="stop-toggle-12" class="u-visuallyhidden u-chkbx-toggle" aria-controls="" aria-label="Espandi per le informazioni dello scalo" role="switch">
<div class="c-route__stop-detail u-chkbx-toggleReceiver" id="stop-detail-12" role="region" aria-live="polite">
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 765</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
BLQ
<strong>15:35</strong>
<p>Bologna, Guglielmo Marconi</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
15:45
</strong>
SVO
<p>Mosca Sheremetyevo</p>
</div>
</div>
</div>
<div class="waiting-time">
<p>Durata scalo: <strong>2h</strong></p>
</div>
<div class="c-route c-route--compact ">
<div class="c-route__flight-company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="100">
<p>Alitalia</p>
<strong>EK 104</strong>
</div>
<div class="c-route__journey">
<div class='c-airport-info c-airport-info--stops'>
SVO
<strong>17:45</strong>
<p>Mosca Sheremetyevo</p>
</div>
<div class="c-route__duration">
Durata del volo: <strong>4h 15min</strong>
</div>
<div class='c-airport-info c-airport-info--stops'>
<strong>
01:15
</strong>
Dxb
<p>Dubai International</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="c-flight-product__actions">
<div class="actions-wrapper">
<div class="price">
<div>
<p>Andata/Ritorno - 1 passeggero</p>
<p>Economy class</p>
</div>
<div>
<p class="pre-price-txt">A partire da</p>
<strong class="price__value">€ 467,68</strong>
</div>
</div>
<div class="cta">
<button type="submit" class="c-button c-button--submit js-fr-dialogmodal-open" aria-controls="dialog-flight-fares">
Seleziona le tariffe
</button> <a href="#" class="buy-via-phone"><svg class="c-icon c-icon--18">
<use xlink:href="#ic-call-black-24px"></use>
</svg> Acquista al telefono</a>
</div>
</div>
</div>
</div>
<div class="c-dialog js-fr-dialogmodal c-dialog--bill-detail " id="dialog-bill-detail">
<div class="c-dialog__inner js-fr-dialogmodal-modal" aria-labelledby="dialog-bill-detail-title">
<div role="document">
<p class="c-dialog__title" id="dialog-bill-detail-title" aria-hidden="true">Totale del viaggio</p>
<table width="100%">
<tr>
<td class="desc">Costo per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Tasse per persona:</td>
<td class="price">
<p><strong>€ 120,00</strong> x 1 adulto</p>
<p><strong>€ 120,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale per tutti i passeggeri:</td>
<td class="price">
<p><strong>€ 120,00</strong></p>
</td>
</tr>
<tr>
<td class="desc">Spese di agenzia:</td>
<td class="price">
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
<p>+ <strong>€ 15,00</strong> x 1 adulto</p>
</td>
</tr>
<tr>
<td class="desc">Totale:</td>
<td class="price">
<p><strong>€ 790,00</strong></p>
</td>
</tr>
</table>
<div class="u-mt--medium">
<p class="clean"><small><strong>Andata BLQ - DXB:</strong> Non incluso bagaglio da stiva</small></p>
<p class="clean"><small><strong>Ritorno DXB - BLQ:</strong> bagaglio da stiva incluso</small></p>
</div>
<button type="button" class="c-dialog__close js-fr-dialogmodal-close" aria-label="Chiudi la modale">
<svg class="c-icon c-icon--32">
<use xlink:href="#ic_close_black_24px"></use>
</svg> </button>
</div>
</div>
</div>
<p class="disclaimer">
Gli orari riportati si riferiscono all"ora locale della città di riferimento.
</p>
<nav class="c-pagination" role="navigation" aria-label="Scorri tra le pagine">
<ul>
<li>
<a class="prev isDisabled" aria-hidden="true"><svg class="c-icon--32">
<use xlink:href="#ic_chevron_left_black_24px"></use>
</svg></a>
</li>
<li><a href="#" class="isActive" aria-label="Pagina attuale, Pagina 1" aria-current="true">1</a></li>
<li><a href="#" aria-label="Vai alla pagina 2">2</a></li>
<li><a href="#" aria-label="Vai alla pagina 3">3</a></li>
<li><a href="#" aria-label="Vai alla pagina 4">4</a></li>
<li>
<a href="#" class="next" aria-label="Vai alla pagina successiva"><svg class="c-icon--32">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</li>
</ul>
</nav>
</section>
</div>
<!-- Destination -->
<div class="c-tablist c-tablist--destination">
<ul class="c-tablist__tabs">
<li>
<a href="#section-city-description">L’isola d’Elba in breve</a>
</li>
<li>
<a href="#section-city-calendar">Calendario voli</a>
</li>
</ul>
<section class="c-tablist__section" id="section-city-description">
<div class="c-content-expo" grid="grid">
<div class="c-content-expo__item c-content-expo__item--side" grid="4@md offset-9@md">
<div class="c-content-expo__listitem ">
<div class="o-flexgrid-inline o-flexgrid--space-between ">
<div class="c-content-expo__today">
<div class="icon icon--flight"><svg class="c-icon c-icon--48">
<use xlink:href="#ic_flight_takeoff_black_24px"></use>
</svg></div>
<div class="c-content-expo__today-info">
<div>45 min</div>
<strong class="u-typo-level-1-5">Durata volo</strong>
</div>
</div>
<div class="c-content-expo__today is-last">
<div class="c-content-expo__weather-assets">
<img src="../../images/svgs/weather-clouds.svg" alt="Il meteo di oggi è nuvoloso" />
<img src="../../images/logo-epson-meteo.png" alt="Centro Epson Meteo" width="44" />
</div>
<div class="c-content-expo__today-info">
<div>12°C / 24°C</div>
<strong class="u-typo-level-1-5">Oggi, nuvoloso</strong>
</div>
</div>
</div>
</div>
<p class="u-typo-level-4 u-color-night-100">Aeroporti serviti da Bologna</p>
<div class="">
<div class="c-content-expo__listitem ">
<div class="o-flexgrid-inline o-flexgrid--space-between ">
<strong>Elba EBA</strong> <a href="#">www.aia.gr</a>
</div>
</div>
<div class="c-content-expo__listitem">
<div class="c-trait ">
<div class="c-trait__el livery">
<img src="../../images/flights-logos/ryanair.png" class="c-trait__livery_img" alt="Ryanair">
</div>
<div class="c-trait__el company">
<p class="label">Company</p>
<p class="txt"><strong>Ryanair</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Linea/Charter</p>
<p class="txt"><strong>Linea</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Numero volo</p>
<p class="txt"><strong>SLD 504</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Partenza</p>
<p class="txt"><strong>14:40</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Arrivo</p>
<p class="txt"><strong>15:40</strong></p>
</div>
<div class="c-trait__el new">
</div>
</div>
</div>
<div class="c-content-expo__listitem">
<div class="c-trait ">
<div class="c-trait__el livery">
<img src="../../images/flights-logos/ryanair.png" class="c-trait__livery_img" alt="Ryanair">
</div>
<div class="c-trait__el company">
<p class="label">Company</p>
<p class="txt"><strong>Ryanair</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Linea/Charter</p>
<p class="txt"><strong>Linea</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Numero volo</p>
<p class="txt"><strong>SLD 504</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Partenza</p>
<p class="txt"><strong>14:40</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Arrivo</p>
<p class="txt"><strong>15:40</strong></p>
</div>
<div class="c-trait__el new">
</div>
</div>
</div>
</div>
<div class="">
<div class="c-content-expo__listitem ">
<div class="o-flexgrid-inline o-flexgrid--space-between ">
<strong>Atene ATL</strong> <a href="#">www.aia.gr</a>
</div>
</div>
<div class="c-content-expo__listitem">
<div class="c-trait ">
<div class="c-trait__el livery">
<img src="../../images/flights-logos/ryanair.png" class="c-trait__livery_img" alt="Ryanair">
</div>
<div class="c-trait__el company">
<p class="label">Company</p>
<p class="txt"><strong>Ryanair</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Linea/Charter</p>
<p class="txt"><strong>Linea</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Numero volo</p>
<p class="txt"><strong>SLD 504</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Partenza</p>
<p class="txt"><strong>14:40</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Arrivo</p>
<p class="txt"><strong>15:40</strong></p>
</div>
<div class="c-trait__el new">
</div>
</div>
</div>
</div>
<p class="u-typo-level-4 u-color-night-100">Mappa della città</p>
<div class="c-citymap ">
<div class="c-citymap__map">
<img class="static-map" src="https://maps.googleapis.com/maps/api/staticmap?center=Atene,+Grecia&zoom=14&size=600x300&markers=Atene,+Grecia&key=AIzaSyABU478CeE-kWTe9e86eDm9n4ANtibBd3M" width="100%" alt="">
<div class="dynamic-map" tabindex="-1">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d27720.073525969474!2d23.71457427705499!3d37.98734565478933!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x14a1bd1f067043f1%3A0x2736354576668ddd!2sAtene%2C+Grecia!5e0!3m2!1sit!2sit!4v1530710163014" width="100%" height="320" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>
</div>
<div class="c-citymap__footer">
<a href="https://www.google.com/maps?ll=37.990837,23.738339&z=13&t=m&hl=it-IT&gl=IT&mapclient=embed&q=Atene+Grecia" target="_blank">Visita la città su Google Maps</a>
</div>
</div>
</div>
<div class="c-content-expo__item c-content-expo__item--main" grid="7@md first@md">
<h2><strong>Voli Bologna Isola d’Elba</strong></h2>
<p>
L'Aeroporto di Bologna offre voli diretti da/per l'Isola d’Elba. In questa pagina trovi tutte le informazioni
utili.</p>
<p>
Isola d’Elba<br />
Sono molteplici le sfaccettature dell’Isola d’Elba che ne fanno da sempre un paradiso insulare a poca distanza dal
“continente”. Selvaggia ed incontaminata, super attrezzata e all’avanguardia, per grandi e piccini.</p>
<p>
Oltre 147 i chilometri di costa che racchiudono più di 150 spiagge, tutte diverse tra loro: dagli arenili dorati
alle calette di sassolini, dalle spiagge nere vulcaniche, a quelle di ciottoli bianchissimi. Spiagge celate da
imponenti scogliere di granito e basalto o che si aprono a ridosso dei centri abitati che punteggiano l’isola. La
Cotaccia, proprio accanto a Patresi, o Fonza, alla sinistra di Marina di Campo, o ancora una delle tante
insenature della penisola del Calamita, solo per citare alcune delle calette imperdibili, si trovano a poca
distanza da tutte le comodità di un soggiorno in pieno relax.</p>
<p>
Le famiglie possono tuffarsi in giornate di mare e divertimento. I campeggiatori, zaini in spalla, possono
soddisfare la loro sete di esplorazione, mentre chi cerca la quiete potrà trovarla nelle località di La Zanca e
Costa dei Gabbiani. E la sera, i colori e gli schiamazzi dei mercatini di Porto Azzurro, sono un invito a
lasciarvi avvolgere dalla vivacità dell’isola.</p>
</p>
<div class="c-content-expo__footer">
<button type="button" class="c-button c-button--submit js-fr-dialogmodal-open" aria-controls="dialog-flights-form">
Acquista il volo
</button>
<div class="c-content-expo__media">
<div class="c-media o-media ">
<img class="c-media__figure o-media__figure" src="../../images/svgs/pdf.svg" alt="PDF orari voli 2022" height="" width="32">
<div class="c-media__body o-media__body">
<a href="#"><strong>Orari voli Estate 2018</strong></a><br>PDF, 577 kb
</div>
</div>
<div class="c-media o-media ">
<img class="c-media__figure o-media__figure" src="../../images/svgs/pdf.svg" alt="PDF orari voli 2022" height="" width="32">
<div class="c-media__body o-media__body">
<a href="#"><strong>Orari voli Estate 2018</strong></a><br>PDF, 577 kb
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="c-tablist__section" id="section-city-calendar">
<div class="c-calendar c-calendar--flights">
<ul class="airports">
<li><a href="#" class="is-active">Aeroporto - Atene Eleftherios (ATH)</a></li>
<li><a href="#">Aeroporto - Atene Eleftherios (ATH)</a></li>
</ul>
<div class="filters c-form">
<div class="filters__child route">
<div role="radiogroup" aria-label="Seleziona la tratta di andata o di ritorno">
<strong class="is-label">Tratta: <span class="required-marker" aria-hidden="true">*</span></strong>
<div><input type="radio" id="andata" name="round-trip-selection" value="andata" class=" u-visuallyhidden">
<label class="" for="andata">BLQ > ATH</label>
</div>
<div><input type="radio" id="ritorno" name="round-trip-selection" value="ritorno" class=" u-visuallyhidden">
<label class="" for="ritorno">ATH > BLQ</label>
</div>
</div>
</div>
<div class="filters__child companies">
<label for="select-flight-companies" class="" aria-label="">
Compagnie aeree: <span class="required-marker" aria-hidden="true">*</span>
<select id="select-flight-companies" class="" aria-describedby="select-flight-companies-note">
<option value="" disabled selected></option>
<option value="option-1" selected>Tutte le compagnie</option>
<option value="option-2">Alitalia</option>
<option value="option-3">Ryanair</option>
</select>
<em class="c-field__note u-visuallyhidden" id="select-flight-companies-note">
Seleziona le compagnie
</em>
</label>
</div>
<div class="filters__child news" role="radiogroup" aria-label="seleziona le novità del mese corrente o dei mesi successivi">
<input type="radio" id="current-month" name="choice" value="current-months" class="js-fr-dialogmodal-open u-visuallyhidden" aria-controls="dialog-button">
<label class="" for="current-month">★ Novità di questo mese</label> <input type="radio" id="next-months" name="choice" value="next-months" class=" u-visuallyhidden">
<label class="" for="next-months">★ Novità dei prossimi mesi</label>
</div>
<div class="filters__child months">
<a href="#"><svg class="c-icon c-icon--24">
<use xlink:href="#ic_chevron_left_black_24px"></use>
</svg>
<p class="u-visuallyhidden">Mese precedente</p>
</a>
<p>Aprile</p>
<a href="#"><svg class="c-icon c-icon--24">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg>
<p class="u-visuallyhidden">Mese successivo</p>
</a>
</div>
</div>
<ul class="c-calendar__weekdays">
<li aria-label="Lunedì">Lun</li>
<li aria-label="Martedì">Mar</li>
<li aria-label="Mercoledì">Mer</li>
<li aria-label="Giovedì">Gio</li>
<li aria-label="Venerdì">Ven</li>
<li aria-label="Sabato">Sab</li>
<li aria-label="Domenica">Dom</li>
</ul>
<ul class="c-calendar__day-grid">
<li class="ghost-day">
<span>29</span>
</li>
<li class="ghost-day">
<span>30</span>
</li>
<li class="ghost-day">
<span>31</span>
</li>
<li class="">
<span>1</span>
</li>
<li class="">
<span>2</span>
</li>
<li class="active-day">
<a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-dayflight">
<span>3</span>
<div class="flight-companies">
<div class="company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="30">
<p aria-hidden="true">★</p>
</div>
<div class="company"><img src="../../images/flights-logos/ryanair.png" alt="Ryanair" width="30"></div>
</div>
</a>
</li>
<li class="">
<span>4</span>
</li>
<li class="active-day">
<a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-dayflight">
<span>5</span>
<div class="flight-companies">
<div class="company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="30">
<p aria-hidden="true">★</p>
</div>
<div class="company"><img src="../../images/flights-logos/ryanair.png" alt="Ryanair" width="30"></div>
</div>
</a>
</li>
<li class="">
<span>6</span>
</li>
<li class="active-day">
<a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-dayflight">
<span>7</span>
<div class="flight-companies">
<div class="company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="30">
<p aria-hidden="true">★</p>
</div>
<div class="company"><img src="../../images/flights-logos/ryanair.png" alt="Ryanair" width="30"></div>
</div>
</a>
</li>
<li class="">
<span>8</span>
</li>
<li class="">
<span>9</span>
</li>
<li class="active-day">
<a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-dayflight">
<span>10</span>
<div class="flight-companies">
<div class="company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="30">
<p aria-hidden="true">★</p>
</div>
<div class="company"><img src="../../images/flights-logos/ryanair.png" alt="Ryanair" width="30"></div>
</div>
</a>
</li>
<li class="">
<span>11</span>
</li>
<li class="active-day">
<a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-dayflight">
<span>12</span>
<div class="flight-companies">
<div class="company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="30">
<p aria-hidden="true">★</p>
</div>
<div class="company"><img src="../../images/flights-logos/ryanair.png" alt="Ryanair" width="30"></div>
</div>
</a>
</li>
<li class="">
<span>13</span>
</li>
<li class="active-day">
<a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-dayflight">
<span>14</span>
<div class="flight-companies">
<div class="company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="30">
<p aria-hidden="true">★</p>
</div>
<div class="company"><img src="../../images/flights-logos/ryanair.png" alt="Ryanair" width="30"></div>
</div>
</a>
</li>
<li class="">
<span>15</span>
</li>
<li class="">
<span>16</span>
</li>
<li class="active-day">
<a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-dayflight">
<span>17</span>
<div class="flight-companies">
<div class="company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="30">
<p aria-hidden="true">★</p>
</div>
<div class="company"><img src="../../images/flights-logos/ryanair.png" alt="Ryanair" width="30"></div>
</div>
</a>
</li>
<li class="">
<span>18</span>
</li>
<li class="active-day">
<a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-dayflight">
<span>19</span>
<div class="flight-companies">
<div class="company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="30">
<p aria-hidden="true">★</p>
</div>
<div class="company"><img src="../../images/flights-logos/ryanair.png" alt="Ryanair" width="30"></div>
</div>
</a>
</li>
<li class="">
<span>20</span>
</li>
<li class="active-day">
<a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-dayflight">
<span>21</span>
<div class="flight-companies">
<div class="company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="30">
<p aria-hidden="true">★</p>
</div>
<div class="company"><img src="../../images/flights-logos/ryanair.png" alt="Ryanair" width="30"></div>
</div>
</a>
</li>
<li class="">
<span>22</span>
</li>
<li class="">
<span>23</span>
</li>
<li class="active-day">
<a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-dayflight">
<span>24</span>
<div class="flight-companies">
<div class="company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="30">
<p aria-hidden="true">★</p>
</div>
<div class="company"><img src="../../images/flights-logos/ryanair.png" alt="Ryanair" width="30"></div>
</div>
</a>
</li>
<li class="">
<span>25</span>
</li>
<li class="active-day">
<a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-dayflight">
<span>26</span>
<div class="flight-companies">
<div class="company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="30">
<p aria-hidden="true">★</p>
</div>
<div class="company"><img src="../../images/flights-logos/ryanair.png" alt="Ryanair" width="30"></div>
</div>
</a>
</li>
<li class="">
<span>27</span>
</li>
<li class="active-day">
<a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-dayflight">
<span>28</span>
<div class="flight-companies">
<div class="company">
<img src="../../images/flights-logos/alitalia.png" alt="Alitalia" width="30">
<p aria-hidden="true">★</p>
</div>
<div class="company"><img src="../../images/flights-logos/ryanair.png" alt="Ryanair" width="30"></div>
</div>
</a>
</li>
<li class="">
<span>29</span>
</li>
<li class="">
<span>30</span>
</li>
<li class="ghost-day">
<span>1</span>
</li>
<li class="ghost-day">
<span>2</span>
</li>
</ul>
<small class="c-calendar__hint">
Clicca sui giorni evidenziati per vedere i voli disponibili in quel giorno.
</small>
</div>
<div class="c-dialog c-dialog--dayflight js-fr-dialogmodal " id="dialog-dayflight">
<div class="c-dialog__inner js-fr-dialogmodal-modal" aria-labelledby="dialog-dayflight-title">
<div role="document">
<p class="c-dialog__title" id="dialog-dayflight-title">Mercoledì <strong>25 Aprile 2018</strong> Andata BLQ > ATH</p>
<div class="flightDetail">
<p class="flightDetail__companyName">Alitalia</p>
<div class="flightDetail__list">
<div class="flightDetail__route">
<div class="c-transport-hallmark ">
<div class="c-transport-hallmark__item">
<div class="c-trait ">
<div class="c-trait__el livery">
<img src="../../images/flights-logos/ryanair.png" class="c-trait__livery_img" alt="Ryanair">
</div>
<div class="c-trait__el company">
<p class="label">Company</p>
<p class="txt"><strong>Ryanair</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Linea/Charter</p>
<p class="txt"><strong>Linea</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Numero volo</p>
<p class="txt"><strong>SLD 504</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Partenza</p>
<p class="txt"><strong>14:40</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Arrivo</p>
<p class="txt"><strong>15:40</strong></p>
</div>
<div class="c-trait__el new">
<span class="c-rounded-label c-rounded-label--grey u-typo-level-1">
<span aria-hidden="true">★</span> <strong>Novità</strong>
</span>
</div>
</div>
</div>
</div>
</div>
<div class="flightDetail__route">
<div class="c-transport-hallmark ">
<div class="c-transport-hallmark__item">
<div class="c-trait ">
<div class="c-trait__el livery">
<img src="../../images/flights-logos/ryanair.png" class="c-trait__livery_img" alt="Ryanair">
</div>
<div class="c-trait__el company">
<p class="label">Company</p>
<p class="txt"><strong>Ryanair</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Linea/Charter</p>
<p class="txt"><strong>Linea</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Numero volo</p>
<p class="txt"><strong>SLD 504</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Partenza</p>
<p class="txt"><strong>14:40</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Arrivo</p>
<p class="txt"><strong>15:40</strong></p>
</div>
<div class="c-trait__el new">
<span class="c-rounded-label c-rounded-label--grey u-typo-level-1">
<span aria-hidden="true">★</span> <strong>Novità</strong>
</span>
</div>
</div>
</div>
</div>
</div>
<div class="flightDetail__route">
<div class="c-transport-hallmark ">
<div class="c-transport-hallmark__item">
<div class="c-trait ">
<div class="c-trait__el livery">
<img src="../../images/flights-logos/ryanair.png" class="c-trait__livery_img" alt="Ryanair">
</div>
<div class="c-trait__el company">
<p class="label">Company</p>
<p class="txt"><strong>Ryanair</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Linea/Charter</p>
<p class="txt"><strong>Linea</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Numero volo</p>
<p class="txt"><strong>SLD 504</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Partenza</p>
<p class="txt"><strong>14:40</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Arrivo</p>
<p class="txt"><strong>15:40</strong></p>
</div>
<div class="c-trait__el new">
</div>
</div>
</div>
</div>
</div>
</div>
<p class="flightDetail__companyName">Ryanair</p>
<div class="flightDetail__list">
<div class="flightDetail__route">
<div class="c-transport-hallmark ">
<div class="c-transport-hallmark__item">
<div class="c-trait ">
<div class="c-trait__el livery">
<img src="../../images/flights-logos/ryanair.png" class="c-trait__livery_img" alt="Ryanair">
</div>
<div class="c-trait__el company">
<p class="label">Company</p>
<p class="txt"><strong>Ryanair</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Linea/Charter</p>
<p class="txt"><strong>Linea</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Numero volo</p>
<p class="txt"><strong>SLD 504</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Partenza</p>
<p class="txt"><strong>14:40</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Arrivo</p>
<p class="txt"><strong>15:40</strong></p>
</div>
</div>
</div>
</div>
</div>
<div class="flightDetail__route">
<div class="c-transport-hallmark ">
<div class="c-transport-hallmark__item">
<div class="c-trait ">
<div class="c-trait__el livery">
<img src="../../images/flights-logos/ryanair.png" class="c-trait__livery_img" alt="Ryanair">
</div>
<div class="c-trait__el company">
<p class="label">Company</p>
<p class="txt"><strong>Ryanair</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Linea/Charter</p>
<p class="txt"><strong>Linea</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Numero volo</p>
<p class="txt"><strong>SLD 504</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Partenza</p>
<p class="txt"><strong>14:40</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Arrivo</p>
<p class="txt"><strong>15:40</strong></p>
</div>
</div>
</div>
</div>
</div>
<div class="flightDetail__route">
<div class="c-transport-hallmark ">
<div class="c-transport-hallmark__item">
<div class="c-trait ">
<div class="c-trait__el livery">
<img src="../../images/flights-logos/ryanair.png" class="c-trait__livery_img" alt="Ryanair">
</div>
<div class="c-trait__el company">
<p class="label">Company</p>
<p class="txt"><strong>Ryanair</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Linea/Charter</p>
<p class="txt"><strong>Linea</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Numero volo</p>
<p class="txt"><strong>SLD 504</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Partenza</p>
<p class="txt"><strong>14:40</strong></p>
</div>
<div class="c-trait__el">
<p class="label">Arrivo</p>
<p class="txt"><strong>15:40</strong></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<button type="button" class="c-dialog__close js-fr-dialogmodal-close" aria-label="Chiudi la modale">
<svg class="c-icon c-icon--32">
<use xlink:href="#ic_close_black_24px"></use>
</svg> </button>
</div>
</div>
</div>
</section>
</div>
<!-- Flights Times -->
<div class="c-tablist c-tablist--flights-times">
<div class="status">
<div class="status__child">
<div class='c-status c-status--delay'>
<div class='c-status__img'>
<svg height='69' viewBox='0 0 69 69' width='69' xmlns='http://www.w3.org/2000/svg'>
<g fill='none' fill-rule='evenodd'>
<circle cx='34.5' cy='34.5' fill='#e8ecf2' r='34.5'></circle>
<g fill-rule='nonzero'>
<g transform='translate(11 28.96)'>
<path d='m30.7721607 21.4158365c2.2189691.839156 1.9580818 3.757661.003183 5.0503395-1.5308386 1.0122683-4.6580008 1.0122683-9.3814866 0-.8940848-.0000222-1.7454867-.429994-2.3394757-1.1814733l-3.0583814-3.8692307-15.996.000208v-18.450432h13.768882l2.2117455-1.76942938c.7010315-.56081379 1.5720533-.86634662 2.4698045-.86634662h14.6916754c1.1108814 0 2.0114286 1.18007711 2.0114286 2.635776s-.9005472 2.635776-2.0114286 2.635776h2.1371429c1.3886016 0 2.5142857 1.18007711 2.5142857 2.635776s-1.1256841 2.635776-2.5142857 2.635776h2.3885714c1.5274618 0 2.7657143 1.1800771 2.7657143 2.635776s-1.2382525 2.635776-2.7657143 2.635776h1.5085714c1.666322 0 3.0171429 1.1800771 3.0171429 2.635776s-1.3508209 2.635776-3.0171429 2.635776z' fill='#fecd05'></path>
<rect fill='#013860' height='7.907328' rx='.988416' width='7.248384' x='3.29472'></rect>
<rect fill='#013860' height='7.907328' rx='.988416' width='7.248384' x='3.29472' y='16.4736'></rect>
<rect fill='#2b72b0' height='12.519936' rx='2.306304' width='11.202048' x='1.317888' y='5.930496'></rect>
<path d='m5.76177737 14.669171-1.32383065-1.3238307c-.38235783-.3886368-.52634303-.7502363-.14083294-1.1357464.38551008-.3855101 1.18857604.3159297 1.57721282.6982875l.5143082.5143082 1.29884335-1.7318187c.32900917-.4386788 1.02957775-1.3957871 1.55630478-1.0605269.52672703.3352603.32900915.8466666 0 1.2853455l-1.98574597 2.6476613c-.17268596.2302592-.43679316.3742518-.72388715.394667-.02360831.0016548-.04707872.0024822-.07041124.0024822-.26329289 0-.51579118-.1046467-.7019612-.290829z' fill='#fff'></path>
</g>
<g transform='translate(30.36 14)'>
<path d='m22.528 11.264c0 2.9968125-1.1634219 5.8172813-3.2757656 7.942-2.1111407 2.123-4.9214688 3.3025781-7.9143281 3.3214844-.0073907 0-.0154688.0005156-.0228594 0-.0166719.0005156-.0338594.0005156-.0510469.0005156-3.00832814 0-5.83704686-1.1713281-7.96451564-3.2991406-2.1278125-2.1272969-3.29948436-4.9561875-3.29948436-7.9648594 0-3.00867186 1.17167186-5.83704686 3.29948436-7.96485936 2.12746878-2.12746878 4.9561875-3.29914064 7.96451564-3.29914064.0171875 0 .0338594 0 .0510469.00051563.0079062 0 .0158125 0 .0237187.00034374 2.9925157.0194219 5.8026719 1.19865627 7.9134688 3.32165627 2.1123437 2.12471872 3.2757656 4.94501563 3.2757656 7.94148436z' fill='#ff4a05'></path>
<g fill='#fff'>
<path d='m13.1965625 6.62028127v5.03525003c0 1.0350312-.8418438 1.8770468-1.8767031 1.8770468h-.0048125c-.4834844-.0140937-.9826094-.2093437-1.32257817-.5494844-.35423437-.3545781-.54965623-.8258593-.54965623-1.3275624v-5.03525003c0-1.02351563.84975-1.84765627 1.8722344-1.87704691h.0048125c1.0348593 0 1.8767031.8421875 1.8767031 1.87704691z'></path>
<path d='m13.0961875 15.9121875c0 .9798594-.7968125 1.7766719-1.7766719 1.7766719h-.0044687c-.9772813-.0022344-1.7718594-.7981875-1.7718594-1.7766719 0-.9781406.7945781-1.7740938 1.7718594-1.7763281h.0044687c.9798594 0 1.7766719.7968125 1.7766719 1.7763281z'></path>
</g>
</g>
</g>
</g>
</svg>
</div>
<div class='c-status__txt'>
<strong>Presentati con ampio anticipo in aeroporto</strong>
<small>Causa controlli aggiuntivi dovuti al Covid-19</small>
</div>
</div>
</div>
<div class="status__child days">
<a href="#"><svg class="c-icon c-icon--24">
<use xlink:href="#ic_chevron_left_black_24px"></use>
</svg>
<p class="u-visuallyhidden">Mese precedente</p>
</a>
<div class="today">
<p>Oggi</p>
<small>8 Maggio 2018</small>
</div>
<a href="#"><svg class="c-icon c-icon--24">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg>
<p class="u-visuallyhidden">Mese successivo</p>
</a>
</div>
<div class="status__child refresh">
<button type="button" class="c-button c-button--adding">
Aggiorna ↻
</button> <small class="last-update last-update--desktop">Ultimo aggiornamento 14:30</small>
</div>
</div>
<ul class="c-tablist__tabs" role="tablist">
<li>
<a href="#section-departures" role="tab" class="departures" aria-current="true" aria-selected="true">
<span aria-hidden="true"><svg class="c-icon c-icon--24">
<use xlink:href="#ic_flight_takeoff_black_24px"></use>
</svg></span>
Partenze
</a>
</li>
<li>
<a href="#section-arrivals" role="tab" class="arrivals" aria-current="false" aria-selected="false">
<span aria-hidden="true"><svg class="c-icon c-icon--24">
<use xlink:href="#ic_flight_land_black_24px"></use>
</svg></span>
Arrivi
</a>
</li>
</ul>
<section class="c-tablist__section" id="section-departures">
<div class="flight-items">
<div class="c-flight-info-cards ">
<div class="c-flight-info-cards__button">
<button type="button" class="c-button c-button--ghost">
Mostra 10 voli precedenti
</button>
</div>
<ul class="c-flight-info-cards__list">
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card c-flight-info-card--past">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Check-in <strong>C 54-55</strong></p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<div class="c-flight-info-cards__currentTime">
<p>Adesso sono le 17:50</p>
</div>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Check-in <strong>C 54-55</strong></p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Check-in <strong>C 54-55</strong></p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card c-flight-info-card--delayed">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
<span class="c-rounded-label c-rounded-label--negative" aria-label="">
22:03
</span>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Check-in <strong>C 54-55</strong></p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Imbarco</p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Imbarco terminato</p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Decollato</p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card c-flight-info-card--delayed">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
<span class="c-rounded-label c-rounded-label--negative" aria-label="">
22:03
</span>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Decollato 22:03</p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
<span class="c-rounded-label c-rounded-label--positive" aria-label="">
17:50
</span>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p><strong class="u-color-negative">Dirottato</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
</ul>
<div class="c-flight-info-cards__button">
<button type="button" class="c-button c-button--ghost">
Mostra 10 voli successivi
</button>
</div>
</div>
</div>
<small class="last-update last-update--mobile">Ultimo aggiornamento 14:30</small>
</section>
<section class="c-tablist__section" id="section-arrivals">
<div class="flight-items">
<div class="c-flight-info-cards ">
<div class="c-flight-info-cards__button">
<button type="button" class="c-button c-button--ghost">
Mostra 10 voli precedenti
</button>
</div>
<ul class="c-flight-info-cards__list">
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card c-flight-info-card--past">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Check-in <strong>C 54-55</strong></p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<div class="c-flight-info-cards__currentTime">
<p>Adesso sono le 17:50</p>
</div>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Check-in <strong>C 54-55</strong></p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Check-in <strong>C 54-55</strong></p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card c-flight-info-card--delayed">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
<span class="c-rounded-label c-rounded-label--negative" aria-label="">
22:03
</span>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Check-in <strong>C 54-55</strong></p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Imbarco</p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Imbarco terminato</p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Decollato</p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card c-flight-info-card--delayed">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
<span class="c-rounded-label c-rounded-label--negative" aria-label="">
22:03
</span>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p>Decollato 22:03</p>
<p>Gate <strong>5</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
<span class="c-rounded-label c-rounded-label--positive" aria-label="">
17:50
</span>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
<li class="c-flight-info-cards__list-item">
<div class="c-flight-info-card ">
<div class="c-flight-info-card__inner">
<div class="c-flight-info-card__header">
<div class="place">Santiago di Compostela SCQ</div>
<div class="schedule">
<p class="schedule__time">18:04</p>
</div>
</div>
<div class="c-flight-info-card__body">
<p>Swiss International Air Lines | <span class="flight-code">BA541</span><span class="flight-code">AA6607</span><span class="flight-code">JL7154</span><span class="flight-code">AA6607</span></p>
<div class="flight-status">
<p><strong class="u-color-negative">Dirottato</strong></p>
</div>
</div>
</div>
<div class="c-flight-info-card__footer">
<a href="#" class="cta">
Segui volo
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_fb_messenger"></use>
</svg></a> <a href="/components/preview/page-myflight-departure.html" class="cta">
Dettagli
<svg class="c-icon c-icon--18">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
</li>
</ul>
<div class="c-flight-info-cards__button">
<button type="button" class="c-button c-button--ghost">
Mostra 10 voli successivi
</button>
</div>
</div>
</div>
<small class="last-update last-update--mobile">Ultimo aggiornamento 14:30</small>
</section>
</div>
<!-- Forms -->
<div class="c-tablist c-tablist--forms">
<ul class="c-tablist__tabs" role="tablist">
<li>
<a href="#section-park-form" role="tab" rel="#section-park-form" aria-label="Prenota parcheggio">
<svg class="c-icon c-icon--24">
<use xlink:href="#ic_drive_eta_black_24px"></use>
</svg> <span aria-hidden="true">Acquista <strong>parcheggio</strong></span>
<span class="mobile-label" aria-hidden="true">Parcheggi</span>
</a>
</li>
<li>
<a href="#section-mbl-form" role="tab" rel="#section-mbl-form" aria-label="Prenota Vip Lounge" aria-current="true">
<svg class="c-icon c-icon--24">
<use xlink:href="#ic_weekend_black_24px"></use>
</svg> <span aria-hidden="true">Acquista <strong>Vip Lounge</strong></span>
<span class="mobile-label" aria-hidden="true">Vip Lounge</span>
</a>
</li>
<li>
<a href="#section-flight-form" role="tab" rel="#section-flight-form" aria-label="Acquista volo">
<svg class="c-icon c-icon--24">
<use xlink:href="#ic_airplanemode_active_black_24px"></use>
</svg> <span aria-hidden="true">Acquista <strong>Volo</strong></span>
<span class="mobile-label" aria-hidden="true">Voli</span>
</a>
</li>
<li>
<a href="#section-flight-express" role="tab" rel="#section-flight-express" aria-label="Biglietti Marconi Express">
<svg class="c-icon c-icon--24">
<use xlink:href="#ic-marconi-express-24px"></use>
</svg> <span aria-hidden="true">Acquista <strong>Treno città</strong></span>
<span class="mobile-label" aria-hidden="true">MEX</span>
</a>
</li>
</ul>
<div class="c-tablist__sections">
<section class="c-tablist__section c-tablist__section--parkings has-banner" id="section-park-form">
<div class="c-tablist__section-header">
<h2 class="c-tablist__section-title">Cerca il tuo parcheggio:</h2>
<div class="u-text-left"><button type="button" class="c-button c-button--as-link u-color-basic-white-100 js-fr-dialogmodal-open" aria-controls="dialog-useful-info">
Regole e info utili
<svg class="c-icon--18 u-color-sun-120">
<use xlink:href="#ic-info-serif"></use>
</svg>
</button></div>
</div>
<form action="/components/preview/page-parking-results" class="c-form c-form--parkings">
<div class="c-form__el c-form__el--cal">
<label for="entrance-date" class="" aria-label="Scegli data di ingresso">
Ingresso <span class="required-marker" aria-hidden="true">*</span>
<input id="entrance-date" type="date" class="" placeholder="Scegli data di ingresso" value="" aria-describedby="entrance-date-note">
<p class="c-field__note " id="entrance-date-note">
Inserisci data di entrata
</p>
</label>
</div>
<div class="c-form__el c-form__el--sel">
<label for="entrance-time" class="" aria-label="">
Orario <span class="required-marker" aria-hidden="true">*</span>
<select id="entrance-time" class="" aria-describedby="select-note">
<option value="" disabled selected>Scegli orario</option>
<option value="00:00">00:00</option>
<option value="00:15">00:15</option>
<option value="00:30">00:30</option>
<option value="00:45">00:45</option>
<option value="01:00">01:00</option>
<option value="01:15">01:15</option>
<option value="01:30">01:30</option>
<option value="01:45">01:45</option>
<option value="02:00">02:00</option>
<option value="02:15">02:15</option>
<option value="02:30">02:30</option>
<option value="02:45">02:45</option>
<option value="03:00">03:00</option>
</select>
<em class="c-field__note " id="entrance-time-note">
Ora di ingresso
</em>
</label>
</div>
<div class="c-form__el c-form__el--cal">
<label for="exit-date" class="" aria-label="Scegli data di uscita">
Uscita <span class="required-marker" aria-hidden="true">*</span>
<input id="exit-date" type="date" class="" placeholder="" value="" aria-describedby="exit-date-note">
<p class="c-field__note " id="exit-date-note">
Inserisci data di entrata uscita
</p>
</label>
</div>
<div class="c-form__el c-form__el--sel">
<label for="exit-time" class="" aria-label="">
Orario <span class="required-marker" aria-hidden="true">*</span>
<select id="exit-time" class="" aria-describedby="select-note">
<option value="" disabled selected>Scegli orario</option>
<option value="00:00">00:00</option>
<option value="00:15">00:15</option>
<option value="00:30">00:30</option>
<option value="00:45">00:45</option>
<option value="01:00">01:00</option>
<option value="01:15">01:15</option>
<option value="01:30">01:30</option>
<option value="01:45">01:45</option>
<option value="02:00">02:00</option>
<option value="02:15">02:15</option>
<option value="02:30">02:30</option>
<option value="02:45">02:45</option>
<option value="03:00">03:00</option>
</select>
<em class="c-field__note " id="exit-time-note">
Ora di uscita
</em>
</label>
</div>
<div class="c-form__el c-form__el--cta">
<button type="submit" class="c-button c-button--submit">
Cerca parcheggio
</button>
</div>
<div class="c-form__note is-negative u-visuallyhidden" id="parking-form-note">Inserisci una data e un orario di uscita successivi a quelli di entrata</div>
</form>
<div class="c-form--parkings-conventions"><a href="#" class="js-fr-dialogmodal-open" aria-controls="dialog-parking-form">Hai una convenzione?</a>
</div>
<div class="c-banner ">
<img class="" src="/images/svgs/stk_mail_discount_reservation.svg" alt="stk_mail_discount_reservation" aria-hidden="true" />
<span>
<strong>fino al 30% di sconto </strong> acquistando il parcheggio online!
</span>
</div>
</section>
<section class="c-tablist__section c-tablist__section--mbl" id="section-mbl-form">
<div class="c-tablist__section-header">
<h2 class="c-tablist__section-title">Prenota e acquista Vip Lounge:</h2>
<div class="u-text-left"><button type="button" class="c-button c-button--as-link u-color-basic-white-100 js-fr-dialogmodal-open" aria-controls="dialog-useful-info">
Regole e info utili
<svg class="c-icon--18 u-color-sun-120">
<use xlink:href="#ic-info-serif"></use>
</svg>
</button></div>
</div>
<form action="../../#.html" class="c-form c-form--mbl " id="form-mbl">
<div class="c-form__el c-form__el--23 c-form__el--cal">
<label for="departure-date-mobile" class="is-datepicker" aria-label="Scegli la data">
Data prevista <span class="required-marker" aria-hidden="true">*</span>
<input id="departure-date-mobile" type="date" class="" placeholder="Scegli la data" value="" aria-describedby="departure-date-mobile-note">
<p class="c-field__note " id="departure-date-mobile-note">
Seleziona la data di ingresso
</p>
</label>
</div>
<div class="c-form__el c-form__el--13 c-form__el--cal">
<label for="persons-select" class="" aria-label="">
N° persone <span class="required-marker" aria-hidden="true">*</span>
<select id="persons-select" class="" aria-describedby="persons-select-note">
<option value="" disabled selected></option>
<option value="option-1" selected>1</option>
<option value="option-2">2</option>
<option value="option-3">3</option>
<option value="option-4">4</option>
</select>
<em class="c-field__note " id="persons-select-note">
N° persone
</em>
</label>
</div>
<div class="c-form__el c-form__el--cta">
<button type="submit" class="c-button c-button--submit">
Prenota ora
</button>
</div>
</form>
</section>
<section class="c-tablist__section c-tablist__section--flights" id="section-flight-form">
<div class="c-tablist__section-header">
<h2 class="c-tablist__section-title">Cerca il tuo volo:</h2>
<div class="u-text-left"><button type="button" class="c-button c-button--as-link u-color-basic-white-100 js-fr-dialogmodal-open" aria-controls="dialog-useful-info">
Regole e info utili
<svg class="c-icon--18 u-color-sun-120">
<use xlink:href="#ic-info-serif"></use>
</svg>
</button></div>
</div>
<form action="../../#.html" class="c-form c-form--flights " onsubmit="return false">
<button class="js-close-overlay" aria-label="close">
<svg class="c-icon c-icon--24">
<use xlink:href="#ic_close_black_24px"></use>
</svg> </button>
<div class="wrapper wrapper--extended">
<div role="radiogroup" aria-label="seleziona volo in economy o business class">
<label for="select-economy-business-selection" class="" aria-label="">
Tipo di viaggio:
<select id="select-economy-business-selection" class="is-small is-inline" aria-describedby="select-economy-business-selection-note">
<option value="" disabled selected></option>
<option value="option-1" selected>Economy</option>
<option value="option-2">Business Class</option>
</select>
<em class="c-field__note u-visuallyhidden" id="select-economy-business-selection-note">
Seleziona il tipo di viaggio
</em>
</label> <label for="select-round-trip-selection" class="" aria-label="">
<select id="select-round-trip-selection" class="is-small is-inline" aria-describedby="select-round-trip-selection-note">
<option value="" disabled selected></option>
<option value="option-1" selected>Andata e ritorno</option>
<option value="option-2">Solo andata</option>
</select>
<em class="c-field__note u-visuallyhidden" id="select-round-trip-selection-note">
</em>
</label>
</div>
</div>
<div class="wrapper wrapper--localities">
<div class="c-form__el c-form__el--pair">
<label for="from" class=" " aria-label="">
Da <span class="required-marker" aria-hidden="true">*</span>
<input id="from" type="text" class="js-combobox " placeholder="" value="" required aria-required="true" aria-describedby="from-note" list="departures" data-combobox-prefix-class="combobox" data-combobox-case-sensitive="no" data-combobox-search-option="containing" data-combobox-help-text="Premi il tasto TAB o le frecce direzionali per accedere e navigare attraverso i suggerimenti. Conferma la tua scelta col tasto INVIO, oppure premi il tasto ESC per chiudere la lista dei suggerimenti." data-suggestion-single="C'è " data-suggestion-plural="Ci sono " data-suggestion-word="Suggerimento" data-suggestion-word-plural="Suggerimenti" data-combobox-see-more-text="Guarda più risultati">
<datalist id="departures">
<option value="Dubai, Al Maktoum Intl [DWC] (EMIRATI ARABI)">
<option value="Roma, Fiumicino [FCO] (ITALIA)">
<option value="New York Ny, John F Kennedy Intl [JFK] (STATI UNITI)">
<option value="Parigi, Charles De Gaulle [CDG] (FRANCIA)">
<option value="Berlino, Schoenefeld [SXF] (GERMANIA)">
<option value="Londra, Heathrow [LHR] (REGNO UNITO)">
<option value="Los Angeles Ca, International [LAX] (STATI UNITI)">
<option value="Cana Brava Mg [NBV] (BRASILE)">
<option value="Pecs, Pogany [PEV] (UNGHERIA)">
</datalist>
<p class="c-field__note " id="from-note">
Digita e scegli la partenza
</p>
</label>
</div>
<div class="c-form__el c-form__el--icon">
<button type="button" class="switch-round-trip js-switch-btn" aria-label="Inverti origine e destinazione">
<svg class="c-icon c-icon--24">
<use xlink:href="#ic-switch-arrows-black-24px"></use>
</svg> </button>
</div>
<div class="c-form__el c-form__el--pair">
<label for="to" class=" " aria-label="">
A <span class="required-marker" aria-hidden="true">*</span>
<input id="to" type="text" class="js-combobox " placeholder="" value="" required aria-required="true" aria-describedby="to-note" list="arrivals" data-combobox-prefix-class="combobox" data-combobox-case-sensitive="no" data-combobox-search-option="containing" data-combobox-help-text="Premi il tasto TAB o le frecce direzionali per accedere e navigare attraverso i suggerimenti. Conferma la tua scelta col tasto INVIO, oppure premi il tasto ESC per chiudere la lista dei suggerimenti." data-suggestion-single="C'è " data-suggestion-plural="Ci sono " data-suggestion-word="Suggerimento" data-suggestion-word-plural="Suggerimenti" data-combobox-see-more-text="Guarda più risultati">
<datalist id="arrivals">
<option value="Dubai, Al Maktoum Intl [DWC] (EMIRATI ARABI)">
<option value="Roma, Fiumicino [FCO] (ITALIA)">
<option value="New York Ny, John F Kennedy Intl [JFK] (STATI UNITI)">
<option value="Parigi, Charles De Gaulle [CDG] (FRANCIA)">
<option value="Berlino, Schoenefeld [SXF] (GERMANIA)">
<option value="Londra, Heathrow [LHR] (REGNO UNITO)">
<option value="Los Angeles Ca, International [LAX] (STATI UNITI)">
<option value="Cana Brava Mg [NBV] (BRASILE)">
<option value="Pecs, Pogany [PEV] (UNGHERIA)">
</datalist>
<p class="c-field__note " id="to-note">
Digita e scegli l'arrivo
</p>
</label>
</div>
</div>
<div class="wrapper wrapper--dates">
<span class="c-form__note is-negative u-visuallyhidden" id="flights-form-note">Inserisci una data di uscita successiva a quella di entrata</span>
<div class="c-form__el c-form__el--pair js-round-desktop">
<label for="round-desktop" class="flatpickr-label" aria-label="Scegli la data di andata">
Andata
<input id="round-desktop" type="date" class="js-flatpickr flatpickr-input" placeholder="" value="" aria-describedby="round-desktop-note">
<p class="c-field__note " id="round-desktop-note">
Seleziona la data di andata
</p>
</label>
</div>
<div class="c-form__el c-form__el--pair js-trip-desktop">
<label for="trip-desktop" class="flatpickr-label" aria-label="Scegli la data di ritorno">
Ritorno
<input id="trip-desktop" type="date" class="js-flatpickr flatpickr-input" placeholder="" value="" aria-describedby="trip-desktop-note">
<p class="c-field__note " id="trip-desktop-note">
Seleziona la data di ritorno
</p>
</label>
</div>
</div>
<div class="wrapper wrapper--alone wrapper--pax">
<div class="c-form__el c-form__el--pax ">
<label for="text-field">
Passeggeri
<span class="required-marker" aria-hidden="true">*</span>
<button type="button" class="c-form__el--toggleFlightsPax js-toggleFlightsPax" aria-expanded="false" aria-label="1 passeggero" aria-describedby="pax-note" aria-controls="aria-paxChoiceDesc">
<svg class="c-icon c-icon--24">
<use xlink:href="#ic-person-black-24px"></use>
</svg> <strong>1
</strong>
</button>
<p class="c-field__note" id="pax-note" aria-hidden="true">
N. passeggeri
</p>
</label>
<div class="js-flightsPaxCnt" id="aria-paxChoice">
<div class="u-visuallyhidden" aria-live="polite" id="aria-paxChoiceDesc">
Procedi per modificare la quantità.
</div>
<div class="pax-type">
<label for="adult">
<strong>Adulti</strong> (da 12 anni in su)</label>
<div class="c-button c-button--qty " aria-label="Seleziona il numero">
<button type="button" class="minus js-toggle-remove" aria-label="Diminuisci di uno" data-toggle="lounge-service">-</button>
<input type="number" class="js-qty-value" value="1" readonly id="adult" aria-label="Quantità" min="1">
<button type="button" class="plus js-toggle-add" aria-label="Aumenta di uno" data-toggle="lounge-service">+</button>
</div>
</div>
<div class="pax-type">
<label for="child">
<strong>Bambini</strong> (da 2 a 11 anni)</label>
<div class="c-button c-button--qty " aria-label="Seleziona il numero">
<button type="button" class="minus js-toggle-remove" aria-label="Diminuisci di uno" data-toggle="lounge-service">-</button>
<input type="number" class="js-qty-value" value="1" readonly id="child" aria-label="Quantità" min="1">
<button type="button" class="plus js-toggle-add" aria-label="Aumenta di uno" data-toggle="lounge-service">+</button>
</div>
</div>
<div class="pax-type">
<label for="baby">
<strong>Neonato</strong> (Meno di 2 anni)</label>
<div class="c-button c-button--qty " aria-label="Seleziona il numero">
<button type="button" class="minus js-toggle-remove" aria-label="Diminuisci di uno" data-toggle="lounge-service">-</button>
<input type="number" class="js-qty-value" value="1" readonly id="baby" aria-label="Quantità" min="1">
<button type="button" class="plus js-toggle-add" aria-label="Aumenta di uno" data-toggle="lounge-service">+</button>
</div>
</div>
<button type="button" class="js-closeFlightsPax c-button c-button--as-link" aria-hidden="true">Chiudi</button>
</div>
</div>
</div>
<div class="wrapper wrapper--alone">
<div class="c-form__el c-form__el--cta">
<button type="submit" class="c-button c-button--submit">
Cerca il tuo volo
</button>
</div>
</div>
</form>
</section>
<section class="c-tablist__section c-tablist__section--express" id="section-flight-express">
<div class="c-tablist__section-header">
<h2 class="c-tablist__section-title">Treni da e per Bologna:</h2>
<div class="u-text-left"><button type="button" class="c-button c-button--as-link u-color-basic-white-100 js-fr-dialogmodal-open" aria-controls="dialog-useful-info">
Regole e info utili
<svg class="c-icon--18 u-color-sun-120">
<use xlink:href="#ic-info-serif"></use>
</svg>
</button></div>
</div>
<div class="c-form__fields">
<div class="l-travel-home__organize o-adjacent o-adjacent--threeInARow">
<div class="o-adjacent__item">
<div class="c-card c-card--ticket ">
<div class="c-card__text">
<h2 aria-label="">Biglietto <strong>ordinario flex</strong></h2>
<div class="c-card__price-note">
<span aria-label="prezzo sola andata">solo andata</span>
<strong aria-label="8,70 €">8,70 €</strong>
</div>
<div class="c-card__price-note">
<span aria-label="prezzo andata e ritorno">andata/ritorno</span>
<strong aria-label="16,00 €">16,00 €</strong>
</div>
</div>
<div class="c-card__rip"></div>
<div class="c-card__footer">
<a href="#" class="c-link c-link--primary-disabled">
<span>Disponibile a breve</span>
</a>
<div class="c-card__description">
<a href="#">
Scopri di più sul nuovo servizio
</a> <input type="checkbox" id="check_express_flex" class="u-visuallyhidden u-chkbx-toggle">
<label for="check_express_flex" aria-label="">Scopri di più su questa tariffa</label>
<div class="u-chkbx-toggleReceiver">
<p>Questa tariffa prevede biglietti <strong>utilizzabili in qualsiasi data entro 12 mesi dall’acquisto</strong>; nel caso dei biglietti andata e ritorno, il ritorno deve essere effettuato entro 30 giorni dall’andata.</p>
<p><strong>Viaggi con dei bambini?</strong> I bambini fino a 4 anni accompagnati da un adulto con biglietto valido viaggiano gratuitamente.</p>
<img src="../../images/svgs/marconi-express.svg" alt="Logo Marconi Express">
</div>
</div>
</div>
</div>
</div>
<div class="o-adjacent__item">
<div class="c-card c-card--ticket ">
<div class="c-card__text">
<h2 aria-label="">Biglietto <strong>famiglia</strong></h2>
<div class="c-card__price-note">
<span aria-label="prezzo sola andata">solo andata</span>
<strong aria-label="18,00 €">18,00 €</strong>
</div>
<div class="c-card__price-note">
<span aria-label="prezzo andata e ritorno">andata/ritorno</span>
<strong aria-label="34,00 €">34,00 €</strong>
</div>
</div>
<div class="c-card__rip"></div>
<div class="c-card__footer">
<a href="#" class="c-link c-link--primary-disabled">
<span>Disponibile a breve</span>
</a>
<div class="c-card__description">
<a href="#">
Scopri di più sul nuovo servizio
</a> <input type="checkbox" id="check_express_family" class="u-visuallyhidden u-chkbx-toggle">
<label for="check_express_family" aria-label="">Scopri di più su questa tariffa</label>
<div class="u-chkbx-toggleReceiver">
<p>Questa tariffa è <strong>valida per un massimo di 2 adulti e 3 ragazzi tra i 5 e i 16 anni compresi</strong>. I biglietti sono utilizzabili solo nelle date scelte in fase di acquisto, senza vincoli di orario, e sono nominativi.</p>
<p><strong>Viaggi con dei bambini?</strong> I bambini fino a 4 anni accompagnati da un adulto con biglietto valido viaggiano gratuitamente.</p>
<img src="../../images/svgs/marconi-express.svg" alt="Logo Marconi Express">
</div>
</div>
</div>
</div>
</div>
<div class="o-adjacent__item">
<div class="c-card c-card--ticket ">
<div class="c-card__text">
<h2 aria-label="">Biglietto <strong>gruppi</strong></h2>
<div class="c-card__price-note">
<span aria-label="prezzo sola andata">solo andata</span>
<strong aria-label="7,00 €">7,00 €</strong>
</div>
<div class="c-card__price-note">
<span aria-label="prezzo andata e ritorno">andata/ritorno</span>
<strong aria-label="14,00 €">14,00 €</strong>
</div>
</div>
<div class="c-card__rip"></div>
<div class="c-card__footer">
<a href="#" class="c-link c-link--primary-disabled">
<span>Disponibile a breve</span>
</a>
<div class="c-card__description">
<a href="#">
Scopri di più sul nuovo servizio
</a> <input type="checkbox" id="check_express_group" class="u-visuallyhidden u-chkbx-toggle">
<label for="check_express_group" aria-label="">Scopri di più su questa tariffa</label>
<div class="u-chkbx-toggleReceiver">
<p>Questa tariffa è da considerare a persona ed è <strong>acquistabile per un numero minimo di 10 passeggeri nello stesso viaggio</strong>. I biglietti sono utilizzabili solo nelle date scelte in fase di acquisto, senza vincoli di orario.</p>
<p><strong>Viaggi con dei bambini?</strong> I bambini fino a 4 anni accompagnati da un adulto con biglietto valido viaggiano gratuitamente.</p>
<img src="../../images/svgs/marconi-express.svg" alt="Logo Marconi Express">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- Billboards -->
<div class="c-tablist c-billboards_tablist">
<ul class="c-tablist__tabs">
<li>
<a href="#partenze" aria-current="true">Partenze</a>
</li>
<li>
<a href="#arrivi">Arrivi</a>
</li>
</ul>
<div class="c-billboards ">
<div class="c-billboards__item c-tablist__section" id="partenze">
<div class="c-billboard c-billboard--departures ">
<input class="c-billboard__toggle" type="checkbox" name="billboard" id="radio-toggle-billboard-departures" aria-hidden="true">
<label class="c-billboard__label" for="radio-toggle-billboard-departures">
<div class="icon"><svg class="c-icon c-icon--32">
<use xlink:href="#ic_flight_takeoff_black_24px"></use>
</svg></div>
<div class="text">
<p>Partenze</p>
<small>Ultimo aggiornamento 10:10</small>
</div>
<div class="status">
<div class='c-status c-status--delay'>
<div class='c-status__img'>
<svg height='69' viewBox='0 0 69 69' width='69' xmlns='http://www.w3.org/2000/svg'>
<g fill='none' fill-rule='evenodd'>
<circle cx='34.5' cy='34.5' fill='#e8ecf2' r='34.5'></circle>
<g fill-rule='nonzero'>
<g transform='translate(11 28.96)'>
<path d='m30.7721607 21.4158365c2.2189691.839156 1.9580818 3.757661.003183 5.0503395-1.5308386 1.0122683-4.6580008 1.0122683-9.3814866 0-.8940848-.0000222-1.7454867-.429994-2.3394757-1.1814733l-3.0583814-3.8692307-15.996.000208v-18.450432h13.768882l2.2117455-1.76942938c.7010315-.56081379 1.5720533-.86634662 2.4698045-.86634662h14.6916754c1.1108814 0 2.0114286 1.18007711 2.0114286 2.635776s-.9005472 2.635776-2.0114286 2.635776h2.1371429c1.3886016 0 2.5142857 1.18007711 2.5142857 2.635776s-1.1256841 2.635776-2.5142857 2.635776h2.3885714c1.5274618 0 2.7657143 1.1800771 2.7657143 2.635776s-1.2382525 2.635776-2.7657143 2.635776h1.5085714c1.666322 0 3.0171429 1.1800771 3.0171429 2.635776s-1.3508209 2.635776-3.0171429 2.635776z' fill='#fecd05'></path>
<rect fill='#013860' height='7.907328' rx='.988416' width='7.248384' x='3.29472'></rect>
<rect fill='#013860' height='7.907328' rx='.988416' width='7.248384' x='3.29472' y='16.4736'></rect>
<rect fill='#2b72b0' height='12.519936' rx='2.306304' width='11.202048' x='1.317888' y='5.930496'></rect>
<path d='m5.76177737 14.669171-1.32383065-1.3238307c-.38235783-.3886368-.52634303-.7502363-.14083294-1.1357464.38551008-.3855101 1.18857604.3159297 1.57721282.6982875l.5143082.5143082 1.29884335-1.7318187c.32900917-.4386788 1.02957775-1.3957871 1.55630478-1.0605269.52672703.3352603.32900915.8466666 0 1.2853455l-1.98574597 2.6476613c-.17268596.2302592-.43679316.3742518-.72388715.394667-.02360831.0016548-.04707872.0024822-.07041124.0024822-.26329289 0-.51579118-.1046467-.7019612-.290829z' fill='#fff'></path>
</g>
<g transform='translate(30.36 14)'>
<path d='m22.528 11.264c0 2.9968125-1.1634219 5.8172813-3.2757656 7.942-2.1111407 2.123-4.9214688 3.3025781-7.9143281 3.3214844-.0073907 0-.0154688.0005156-.0228594 0-.0166719.0005156-.0338594.0005156-.0510469.0005156-3.00832814 0-5.83704686-1.1713281-7.96451564-3.2991406-2.1278125-2.1272969-3.29948436-4.9561875-3.29948436-7.9648594 0-3.00867186 1.17167186-5.83704686 3.29948436-7.96485936 2.12746878-2.12746878 4.9561875-3.29914064 7.96451564-3.29914064.0171875 0 .0338594 0 .0510469.00051563.0079062 0 .0158125 0 .0237187.00034374 2.9925157.0194219 5.8026719 1.19865627 7.9134688 3.32165627 2.1123437 2.12471872 3.2757656 4.94501563 3.2757656 7.94148436z' fill='#ff4a05'></path>
<g fill='#fff'>
<path d='m13.1965625 6.62028127v5.03525003c0 1.0350312-.8418438 1.8770468-1.8767031 1.8770468h-.0048125c-.4834844-.0140937-.9826094-.2093437-1.32257817-.5494844-.35423437-.3545781-.54965623-.8258593-.54965623-1.3275624v-5.03525003c0-1.02351563.84975-1.84765627 1.8722344-1.87704691h.0048125c1.0348593 0 1.8767031.8421875 1.8767031 1.87704691z'></path>
<path d='m13.0961875 15.9121875c0 .9798594-.7968125 1.7766719-1.7766719 1.7766719h-.0044687c-.9772813-.0022344-1.7718594-.7981875-1.7718594-1.7766719 0-.9781406.7945781-1.7740938 1.7718594-1.7763281h.0044687c.9798594 0 1.7766719.7968125 1.7766719 1.7763281z'></path>
</g>
</g>
</g>
</g>
</svg>
</div>
<div class='c-status__txt'>
<strong>Presentati con ampio anticipo in aeroporto</strong>
<small>Causa controlli aggiuntivi dovuti al Covid-19</small>
</div>
</div>
</div>
</label>
<div class="c-billboard__table">
<table class="c-table c-table--flights">
<caption class="u-visuallyhidden"></caption>
<thead>
<tr>
<th class="no-mobile">Compagnia</th>
<th>Destinazione</th>
<th>N° Volo</th>
<th>Orario stimato</th>
<th>Stato</th>
</tr>
</thead>
<tbody>
<tr>
<td class="no-mobile c-table__cell-to-clamp">
<div class="clamp">
<a href="../../ /components/preview/page-flight-companies.html"><strong>Swiss International Air Lines</strong></a>
</div>
</td>
<td class="c-table__cell-to-clamp">
<div class="clamp"><strong>MARSA ALAM / SHARM EL SHEIKH</strong></div>
</td>
<td>
<a href="../../ /components/preview/page-myflight-arrival-pax.html" aria-label="Info FRANKFURT YU9001">YU9001</a>
</td>
<td>14:00</td>
<td class="situation">Check-in C 45→48</td>
</tr>
<tr>
<td class="no-mobile c-table__cell-to-clamp">
<div class="clamp">
<a href="../../ /components/preview/page-flight-companies.html"><strong>Swiss International Air Lines</strong></a>
</div>
</td>
<td class="c-table__cell-to-clamp">
<div class="clamp"><strong>MARSA ALAM / SHARM EL SHEIKH</strong></div>
</td>
<td>
<a href="../../ /components/preview/page-myflight-arrival-pax.html" aria-label="Info FRANKFURT YU9001">YU9001</a>
</td>
<td>14:00</td>
<td class="situation">Check-in C 45→48</td>
</tr>
<tr>
<td class="no-mobile c-table__cell-to-clamp">
<div class="clamp">
<a href="../../ /components/preview/page-flight-companies.html"><strong>Swiss International Air Lines</strong></a>
</div>
</td>
<td class="c-table__cell-to-clamp">
<div class="clamp"><strong>MARSA ALAM / SHARM EL SHEIKH</strong></div>
</td>
<td>
<a href="../../ /components/preview/page-myflight-arrival-pax.html" aria-label="Info FRANKFURT YU9001">YU9001</a>
</td>
<td>14:00</td>
<td class="situation">Check-in C 45→48</td>
</tr>
<tr>
<td class="no-mobile c-table__cell-to-clamp">
<div class="clamp">
<a href="../../ /components/preview/page-flight-companies.html"><strong>Swiss International Air Lines</strong></a>
</div>
</td>
<td class="c-table__cell-to-clamp">
<div class="clamp"><strong>MARSA ALAM / SHARM EL SHEIKH</strong></div>
</td>
<td>
<a href="../../ /components/preview/page-myflight-arrival-pax.html" aria-label="Info FRANKFURT YU9001">YU9001</a>
</td>
<td>14:00</td>
<td class="situation">Check-in C 45→48</td>
</tr>
<tr>
<td class="no-mobile"><a href="../../ /components/preview/page-flight-companies.html"><strong>Alitalia</strong></a></td>
<td><strong>LONDON LHR</strong></td>
<td><a href="../../ /components/preview/page-myflight-arrival-pax.html" aria-label="Info LONDON LHR CP9827">CP9827</a></td>
<td>14:00 <strong class="is-negative">14:20</strong></td>
<td class="situation">Check-in C 45→48</td>
</tr>
</tbody>
</table>
<p class="foot">
<a href="../preview/page-arrivals-departures#section-departures.html">Tutte le partenze</a>
</p>
</div>
</div>
<div class="c-billboard__status status">
<div class='c-status c-status--delay'>
<div class='c-status__img'>
<svg height='69' viewBox='0 0 69 69' width='69' xmlns='http://www.w3.org/2000/svg'>
<g fill='none' fill-rule='evenodd'>
<circle cx='34.5' cy='34.5' fill='#e8ecf2' r='34.5'></circle>
<g fill-rule='nonzero'>
<g transform='translate(11 28.96)'>
<path d='m30.7721607 21.4158365c2.2189691.839156 1.9580818 3.757661.003183 5.0503395-1.5308386 1.0122683-4.6580008 1.0122683-9.3814866 0-.8940848-.0000222-1.7454867-.429994-2.3394757-1.1814733l-3.0583814-3.8692307-15.996.000208v-18.450432h13.768882l2.2117455-1.76942938c.7010315-.56081379 1.5720533-.86634662 2.4698045-.86634662h14.6916754c1.1108814 0 2.0114286 1.18007711 2.0114286 2.635776s-.9005472 2.635776-2.0114286 2.635776h2.1371429c1.3886016 0 2.5142857 1.18007711 2.5142857 2.635776s-1.1256841 2.635776-2.5142857 2.635776h2.3885714c1.5274618 0 2.7657143 1.1800771 2.7657143 2.635776s-1.2382525 2.635776-2.7657143 2.635776h1.5085714c1.666322 0 3.0171429 1.1800771 3.0171429 2.635776s-1.3508209 2.635776-3.0171429 2.635776z' fill='#fecd05'></path>
<rect fill='#013860' height='7.907328' rx='.988416' width='7.248384' x='3.29472'></rect>
<rect fill='#013860' height='7.907328' rx='.988416' width='7.248384' x='3.29472' y='16.4736'></rect>
<rect fill='#2b72b0' height='12.519936' rx='2.306304' width='11.202048' x='1.317888' y='5.930496'></rect>
<path d='m5.76177737 14.669171-1.32383065-1.3238307c-.38235783-.3886368-.52634303-.7502363-.14083294-1.1357464.38551008-.3855101 1.18857604.3159297 1.57721282.6982875l.5143082.5143082 1.29884335-1.7318187c.32900917-.4386788 1.02957775-1.3957871 1.55630478-1.0605269.52672703.3352603.32900915.8466666 0 1.2853455l-1.98574597 2.6476613c-.17268596.2302592-.43679316.3742518-.72388715.394667-.02360831.0016548-.04707872.0024822-.07041124.0024822-.26329289 0-.51579118-.1046467-.7019612-.290829z' fill='#fff'></path>
</g>
<g transform='translate(30.36 14)'>
<path d='m22.528 11.264c0 2.9968125-1.1634219 5.8172813-3.2757656 7.942-2.1111407 2.123-4.9214688 3.3025781-7.9143281 3.3214844-.0073907 0-.0154688.0005156-.0228594 0-.0166719.0005156-.0338594.0005156-.0510469.0005156-3.00832814 0-5.83704686-1.1713281-7.96451564-3.2991406-2.1278125-2.1272969-3.29948436-4.9561875-3.29948436-7.9648594 0-3.00867186 1.17167186-5.83704686 3.29948436-7.96485936 2.12746878-2.12746878 4.9561875-3.29914064 7.96451564-3.29914064.0171875 0 .0338594 0 .0510469.00051563.0079062 0 .0158125 0 .0237187.00034374 2.9925157.0194219 5.8026719 1.19865627 7.9134688 3.32165627 2.1123437 2.12471872 3.2757656 4.94501563 3.2757656 7.94148436z' fill='#ff4a05'></path>
<g fill='#fff'>
<path d='m13.1965625 6.62028127v5.03525003c0 1.0350312-.8418438 1.8770468-1.8767031 1.8770468h-.0048125c-.4834844-.0140937-.9826094-.2093437-1.32257817-.5494844-.35423437-.3545781-.54965623-.8258593-.54965623-1.3275624v-5.03525003c0-1.02351563.84975-1.84765627 1.8722344-1.87704691h.0048125c1.0348593 0 1.8767031.8421875 1.8767031 1.87704691z'></path>
<path d='m13.0961875 15.9121875c0 .9798594-.7968125 1.7766719-1.7766719 1.7766719h-.0044687c-.9772813-.0022344-1.7718594-.7981875-1.7718594-1.7766719 0-.9781406.7945781-1.7740938 1.7718594-1.7763281h.0044687c.9798594 0 1.7766719.7968125 1.7766719 1.7763281z'></path>
</g>
</g>
</g>
</g>
</svg>
</div>
<div class='c-status__txt'>
<strong>Presentati con ampio anticipo in aeroporto</strong>
<small>Causa controlli aggiuntivi dovuti al Covid-19</small>
</div>
</div>
</div>
</div>
<div class="c-billboards__item c-tablist__section" hidden id="arrivi">
<div class="c-billboard c-billboard--arrivals ">
<input class="c-billboard__toggle" type="checkbox" name="billboard" id="radio-toggle-billboard-arrivals" aria-hidden="true">
<label class="c-billboard__label" for="radio-toggle-billboard-arrivals">
<div class="icon"><svg class="c-icon c-icon--32">
<use xlink:href="#ic_flight_land_black_24px"></use>
</svg></div>
<div class="text">
<p>Arrivi</p>
<small>Ultimo aggiornamento 10:10</small>
</div>
</label>
<div class="c-billboard__table">
<table class="c-table c-table--flights">
<caption class="u-visuallyhidden"></caption>
<thead>
<tr>
<th class="no-mobile">Compagnia</th>
<th>Provenienza</th>
<th>N° Volo</th>
<th>Orario stimato</th>
<th>Stato</th>
</tr>
</thead>
<tbody>
<tr>
<td class="no-mobile c-table__cell-to-clamp">
<div class="clamp">
<a href="../../ /components/preview/page-flight-companies.html"><strong>Alitalia</strong></a>
</div>
</td>
<td class="c-table__cell-to-clamp">
<div class="clamp">
<strong>VIENNA</strong>
</div>
</td>
<td><a href="../../ /components/preview/page-myflight-arrival-pax.html" aria-label="Info VIENNA BE3783">BE3783</a></td>
<td>14:00</td>
<td class="situation">Atterrato</td>
</tr>
<tr>
<td class="no-mobile c-table__cell-to-clamp">
<div class="clamp">
<a href="../../ /components/preview/page-flight-companies.html"><strong>Alitalia</strong></a>
</div>
</td>
<td class="c-table__cell-to-clamp">
<div class="clamp">
<strong>VIENNA</strong>
</div>
</td>
<td><a href="../../ /components/preview/page-myflight-arrival-pax.html" aria-label="Info VIENNA BE3783">BE3783</a></td>
<td>14:00</td>
<td class="situation">Atterrato</td>
</tr>
<tr>
<td class="no-mobile c-table__cell-to-clamp">
<div class="clamp">
<a href="../../ /components/preview/page-flight-companies.html"><strong>Alitalia</strong></a>
</div>
</td>
<td class="c-table__cell-to-clamp">
<div class="clamp">
<strong>VIENNA</strong>
</div>
</td>
<td><a href="../../ /components/preview/page-myflight-arrival-pax.html" aria-label="Info VIENNA BE3783">BE3783</a></td>
<td>14:00</td>
<td class="situation">Atterrato</td>
</tr>
<tr>
<td class="no-mobile c-table__cell-to-clamp">
<div class="clamp">
<a href="../../ /components/preview/page-flight-companies.html"><strong>Alitalia</strong></a>
</div>
</td>
<td class="c-table__cell-to-clamp">
<div class="clamp">
<strong>VIENNA</strong>
</div>
</td>
<td><a href="../../ /components/preview/page-myflight-arrival-pax.html" aria-label="Info VIENNA BE3783">BE3783</a></td>
<td>14:00</td>
<td class="situation">Atterrato</td>
</tr>
<tr>
<td class="no-mobile"><a href="../../ /components/preview/page-flight-companies.html"><strong>Alitalia</strong></a></td>
<td><strong>MADRID</strong></td>
<td><a href="../../ /components/preview/page-myflight-arrival-pax.html" aria-label="Info MADRID AZ8783">AZ8783</a></td>
<td>14:00 <strong class="is-positive">13:50</strong></td>
<td class="situation">Atterrato</td>
</tr>
</tbody>
</table>
<p class="foot">
<a href="../preview/page-arrivals-departures#section-arrivals.html">Tutti gli arrivi</a>
</p>
</div>
</div>
</div>
</div>
</div>
<!-- Flights List Toggle -->
<div class=''>
<ul class='c-switcher'>
<li>
<a href='#section-cheaper' aria-label='Risultati ordinati per prezzo crescente'>
Il volo più economico
<strong>
129,90 €
</strong>
</a>
</li>
<li>
<a href='#section-quickest' aria-label='Risultati ordinati per durata del volo crescente'>
Il volo più veloce
<strong>
3h 56'
</strong>
</a>
</li>
</ul>
</div>
<!-- Titolo Borsa -->
<div class="c-tablist c-tablist--titolo-borsa">
<ul class="c-tablist__tabs">
<li>
<a href="#section-overview" aria-label="Overview">Overview</a>
</li>
<li>
<a href="#section-trends" aria-label="Grafico e trends">Grafico e Trends</a>
</li>
<li>
<a href="#section-stats" aria-label="Dati statistici">Statistiche</a>
</li>
</ul>
<section class="c-tablist__section" id="section-overview">
<div class="iframes-container">
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
</div>
</section>
<section class="c-tablist__section" id="section-trends">
<div class="iframes-container">
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
</div>
</section>
<section class="c-tablist__section" id="section-stats">
<div class="iframes-container">
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
</div>
</section>
</div>
<!-- Youfirst -->
<div class="c-tablist c-tablist--youfirst">
<ul class="c-tablist__tabs" role="tablist">
<li>
<a href="#partenze" role="tab" rel="#partenze" aria-label="Youfirst in partenza" aria-current="true" aria-selected="true">
<svg class="c-icon c-icon--24">
<use xlink:href="#ic_flight_takeoff_black_24px"></use>
</svg>
<span class="c-tablist__label--desktop">Youfirst in partenza</span>
<span class="c-tablist__label--mobile">alla Partenza</span>
</a>
</li>
<li>
<a href="#arrivi" role="tab" rel="#arrivi" aria-label="Youfirst in arrivo">
<svg class="c-icon c-icon--24">
<use xlink:href="#ic_flight_land_black_24px"></use>
</svg>
<span class="c-tablist__label--desktop">Youfirst in arrivo</span>
<span class="c-tablist__label--mobile">all'Arrivo</span>
</a>
</li>
<li>
<a href="#allinclusive" role="tab" rel="#allinclusive" aria-label="All Inclusive">
<svg class="c-icon c-icon--24">
<use xlink:href="#ic_flight_takeoff_black_24px"></use>
</svg> +
<svg class="c-icon c-icon--24">
<use xlink:href="#ic_flight_land_black_24px"></use>
</svg>
<span class="c-tablist__label--desktop">All Inclusive</span>
<span class="c-tablist__label--mobile">All Inclusive</span>
</a>
</li>
</ul>
<div class="c-tablist__sections ">
<div class="c-tablist__section" id="partenze">
<div class="youfirst_tab">
<div class="youfirst_tab__title">Un servizio dedicato per semplificare la tua partenza</div>
<div class="youfirst_tab__container">
<div class="youfirst_tab__item">
<p><strong>Servizi alla partenza</strong></p>
<ul>
<li><strong>Accoglienza</strong> da parte del nostro personale alla reception della Marconi Business Lounge al 1° piano del Terminal.</li>
<li><strong>Assistenza nelle procedure di check-in</strong> all’interno della Lounge, con drop-off bagaglio da stiva se presente.</li>
<li><strong>Servizio di facchinaggio</strong> per il bagaglio da stiva.</li>
<li>Ingresso alla Vip Lounge e <strong>utilizzo della corsia Fast Track</strong>.</li>
<li>Assistenza ed <strong>imbarco prioritario</strong> al Gate.</li>
<li><strong>Assistenza al controllo passaporti</strong> (se necessario).</li>
<li><strong>Trasferimento dal Terminal all’aeromobile</strong> con mezzo riservato (minivan massimo 5 posti).</li>
</ul>
<button type="submit" class="c-button c-button--submit c-button--elastic" aria-label="Prenota Youfirst in partenza">
Prenota Youfirst in partenza
</button>
</div>
<div class="youfirst_tab__item youfirst_tab__item--images">
<div class="youfirst_tab__image"><img src="../../images/youfirst-oblo-1.png" alt="" /></div>
<div class="youfirst_tab__image"><img src="../../images/youfirst-oblo-2.png" alt="" /></div>
</div>
</div>
</div>
</div>
<div class="c-tablist__section" hidden id="arrivi">
<div class="youfirst_tab">
<div class="youfirst_tab__title">Un servizio dedicato per viaggiare in tutta serenità</div>
<div class="youfirst_tab__container">
<div class="youfirst_tab__item">
<p><strong>Servizi in arrivo</strong></p>
<ul>
<li><strong>Accoglienza</strong> da parte del nostro personale alla reception della Marconi Business Lounge al
1° piano del Terminal.</li>
<li><strong>Assistenza nelle procedure di check-in</strong> all’interno della Lounge, con drop-off bagaglio da
stiva se presente.</li>
<li><strong>Servizio di facchinaggio</strong> per il bagaglio da stiva.</li>
<li>Ingresso alla Vip Lounge e <strong>utilizzo della corsia Fast Track</strong>.</li>
<li>Assistenza ed <strong>imbarco prioritario</strong> al Gate.</li>
<li><strong>Assistenza al controllo passaporti</strong> (se necessario).</li>
<li><strong>Trasferimento dal Terminal all’aeromobile</strong> con mezzo riservato (minivan massimo 5 posti).
</li>
</ul>
<button type="submit" class="c-button c-button--submit c-button--elastic" aria-label="Prenota Youfirst in arrivo">
Prenota Youfirst in arrivo
</button>
</div>
<div class="youfirst_tab__item youfirst_tab__item--images">
<div class="youfirst_tab__image"><img src="../../images/youfirst-oblo-1.png" alt="" /></div>
<div class="youfirst_tab__image"><img src="../../images/youfirst-oblo-2.png" alt="" /></div>
</div>
</div>
</div>
</div>
<div class="c-tablist__section" hidden id="allinclusive">
<div class="youfirst_tab">
<div class="youfirst_tab__title">Un servizio dedicato per viaggiare in tutta serenità</div>
<div class="youfirst_tab__container">
<div class="youfirst_tab__item">
<div class="youfirst_tab__expand">
<input type="checkbox" id="expand-partenza" name="expand-partenza" class="u-visuallyhidden u-chkbx-showmore" aria-controls="expand-partenza-target" aria-label="Espandi per le informazioni del volo" role="switch">
<p><strong>Inclusi tutti i servizi “In partenza”</strong></p>
<div class="u-chkbx-showmore-target" id="expand-partenza-target">
<ul>
<li><strong>Accoglienza</strong> da parte del nostro personale alla reception della Marconi Business Lounge al
1° piano del Terminal.</li>
<li><strong>Assistenza nelle procedure di check-in</strong> all’interno della Lounge, con drop-off bagaglio da
stiva se presente.</li>
<li><strong>Servizio di facchinaggio</strong> per il bagaglio da stiva.</li>
<li>Ingresso alla Vip Lounge e <strong>utilizzo della corsia Fast Track</strong>.</li>
<li>Assistenza ed <strong>imbarco prioritario</strong> al Gate.</li>
<li><strong>Assistenza al controllo passaporti</strong> (se necessario).</li>
<li><strong>Trasferimento dal Terminal all’aeromobile</strong> con mezzo riservato (minivan massimo 5 posti).
</li>
</ul>
</div>
<label for="expand-partenza" class='u-chkbx-showmore-label'>
Leggi <span class="more">di più</span><span class="less">meno</span>
</label>
</div>
<div class="youfirst_tab__divider"><span>+</span></div>
<div class="youfirst_tab__expand">
<div class="youfirst_tab__expand">
<input type="checkbox" id="expand-arrivo" name="expand-arrivo" class="u-visuallyhidden u-chkbx-showmore" aria-controls="expand-arrivo-target" aria-label="Espandi per le informazioni del volo" role="switch">
<p><strong>Inclusi tutti i servizi “In partenza”</strong></p>
<div class="u-chkbx-showmore-target" id="expand-arrivo-target">
<ul>
<li><strong>Accoglienza</strong> da parte del nostro personale alla reception della Marconi Business Lounge al
1° piano del Terminal.</li>
<li><strong>Assistenza nelle procedure di check-in</strong> all’interno della Lounge, con drop-off bagaglio da
stiva se presente.</li>
<li><strong>Servizio di facchinaggio</strong> per il bagaglio da stiva.</li>
<li>Ingresso alla Vip Lounge e <strong>utilizzo della corsia Fast Track</strong>.</li>
<li>Assistenza ed <strong>imbarco prioritario</strong> al Gate.</li>
<li><strong>Assistenza al controllo passaporti</strong> (se necessario).</li>
<li><strong>Trasferimento dal Terminal all’aeromobile</strong> con mezzo riservato (minivan massimo 5 posti).
</li>
</ul>
</div>
<label for="expand-arrivo" class='u-chkbx-showmore-label'>
Leggi <span class="more">di più</span><span class="less">meno</span>
</label>
</div>
</div>
<button type="submit" class="c-button c-button--submit c-button--elastic" aria-label="Prenota Youfirst All Inclusive">
Prenota Youfirst All Inclusive
</button>
</div>
<div class="youfirst_tab__item youfirst_tab__item--images">
<div class="youfirst_tab__image"><img src="../../images/youfirst-oblo-1.png" alt="" /></div>
<div class="youfirst_tab__image"><img src="../../images/youfirst-oblo-2.png" alt="" /></div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Default -->
<div class="c-tablist">
<ul class="c-tablist__tabs">
{{#each tab}}
<li>
<a href="#{{ this.anchor-id }}">{{ this.tab-text }}</a>
</li>
{{/each}}
</ul>
{{#each tab}}
<section class="c-tablist__section" id="{{ this.anchor-id }}">
<h2>{{ this.tab-content-title }}</h2>
{{{ this.tab-content-text }}}
</section>
{{/each}}
</div>
<!-- Flights list -->
<div class="c-tablist {{modifier}}">
<section class="c-tablist__section" id="section-cheaper">
{{#if hasLoading}}
{{render "@loading"}}
{{/if}}
{{#each cheaper-items}}
{{render componentName componentInstance merge=true}}
{{/each}}
<p class="disclaimer">
{{{disclaimer-text}}}
</p>
{{render "@pagination"}}
</section>
<section class="c-tablist__section" id="section-quickest">
{{#if hasLoading}}
{{render "@loading"}}
{{/if}}
{{#each quickest-items}}
{{render componentName componentInstance merge=true}}
{{/each}}
<p class="disclaimer">
Gli orari riportati si riferiscono all"ora locale della città di riferimento.
</p>
{{render "@pagination"}}
</section>
</div>
<!-- Destination -->
<div class="c-tablist c-tablist--destination">
<ul class="c-tablist__tabs">
<li>
<a href="#section-city-description">L’isola d’Elba in breve</a>
</li>
<li>
<a href="#section-city-calendar">Calendario voli</a>
</li>
</ul>
<section class="c-tablist__section" id="section-city-description">
{{ render "@content-expo--destination" }}
</section>
<section class="c-tablist__section" id="section-city-calendar">
{{ render "@calendar--select-company" }}
</section>
</div>
<!-- Flights Times -->
<div class="c-tablist c-tablist--flights-times">
<div class="status">
<div class="status__child">
{{ render "@status--delay" }}
</div>
<div class="status__child days">
<a href="#">{{> @icon prev-month }}<p class="u-visuallyhidden">Mese precedente</p></a>
<div class="today">
<p>Oggi</p>
<small>8 Maggio 2018</small>
</div>
<a href="#">{{> @icon next-month }}<p class="u-visuallyhidden">Mese successivo</p></a>
</div>
<div class="status__child refresh">
{{> @button refresh-btn }}
<small class="last-update last-update--desktop">Ultimo aggiornamento 14:30</small>
</div>
</div>
<ul class="c-tablist__tabs" role="tablist">
<li>
<a href="#section-departures" role="tab" class="departures" aria-current="true" aria-selected="true" >
<span aria-hidden="true">{{> @icon departures-icon }}</span>
Partenze
</a>
</li>
<li>
<a href="#section-arrivals" role="tab" class="arrivals" aria-current="false" aria-selected="false">
<span aria-hidden="true">{{> @icon arrivals-icon }}</span>
Arrivi
</a>
</li>
</ul>
{{!-- Departures --}}
<section class="c-tablist__section" id="section-departures">
<div class="flight-items">
{{ render "@flight-info-cards" }}
</div>
<small class="last-update last-update--mobile">Ultimo aggiornamento 14:30</small>
</section>
{{!-- End departures --}}
{{!-- Arrivals --}}
<section class="c-tablist__section" id="section-arrivals">
<div class="flight-items">
{{ render "@flight-info-cards" }}
</div>
<small class="last-update last-update--mobile">Ultimo aggiornamento 14:30</small>
</section>
{{!-- End arrivals --}}
{{!-- Desktop time switcher --}}
{{!-- <div class="c-tablist__time-switcher">
{{ render "@time-switcher" }}
</div> --}}
</div>
<!-- Forms -->
<div class="c-tablist c-tablist--forms">
<ul class="c-tablist__tabs" role="tablist">
{{#if home-it}}
<li>
<a href="#section-park-form" role="tab" rel="#section-park-form" aria-label="Prenota parcheggio">
{{> @icon class="c-icon c-icon--24" symbol="ic_drive_eta_black_24px" }}
<span aria-hidden="true">Acquista <strong>parcheggio</strong></span>
<span class="mobile-label" aria-hidden="true">Parcheggi</span>
</a>
</li>
{{/if}}
<li>
<a href="#section-mbl-form" role="tab" rel="#section-mbl-form" aria-label="Prenota Vip Lounge" aria-current="true">
{{> @icon class="c-icon c-icon--24" symbol="ic_weekend_black_24px" }}
<span aria-hidden="true">Acquista <strong>Vip Lounge</strong></span>
<span class="mobile-label" aria-hidden="true">Vip Lounge</span>
</a>
</li>
{{#if home-it}}
<li>
<a href="#section-flight-form" role="tab" rel="#section-flight-form" aria-label="Acquista volo">
{{> @icon class="c-icon c-icon--24" symbol="ic_airplanemode_active_black_24px" }}
<span aria-hidden="true">Acquista <strong>Volo</strong></span>
<span class="mobile-label" aria-hidden="true">Voli</span>
</a>
</li>
{{/if}}
<li>
<a href="#section-flight-express" role="tab" rel="#section-flight-express" aria-label="Biglietti Marconi Express">
{{> @icon class="c-icon c-icon--24" symbol="ic-marconi-express-24px" }}
<span aria-hidden="true">Acquista <strong>Treno città</strong></span>
<span class="mobile-label" aria-hidden="true">MEX</span>
</a>
</li>
</ul>
<div class="c-tablist__sections">
{{#if home-it}}
<section class="c-tablist__section c-tablist__section--parkings has-banner" id="section-park-form">
<div class="c-tablist__section-header">
<h2 class="c-tablist__section-title">Cerca il tuo parcheggio:</h2>
<div class="u-text-left">{{> @button--as-link btn-useful-info }}</div>
</div>
{{ render "@form--parkings" forms merge=true }}
{{#if form-belowbanner}}
{{ render "@banner" form-belowbanner merge=true }}
{{/if}}
</section>
{{/if}}
<section class="c-tablist__section c-tablist__section--mbl" id="section-mbl-form">
<div class="c-tablist__section-header">
<h2 class="c-tablist__section-title">Prenota e acquista Vip Lounge:</h2>
<div class="u-text-left">{{> @button--as-link btn-useful-info }}</div>
</div>
{{ render "@form--mbl" }}
</section>
{{#if home-it}}
<section class="c-tablist__section c-tablist__section--flights" id="section-flight-form">
<div class="c-tablist__section-header">
<h2 class="c-tablist__section-title">Cerca il tuo volo:</h2>
<div class="u-text-left">{{> @button--as-link btn-useful-info }}</div>
</div>
{{ render "@form--flights" form-flights merge=true }}
</section>
{{/if}}
<section class="c-tablist__section c-tablist__section--express" id="section-flight-express">
<div class="c-tablist__section-header">
<h2 class="c-tablist__section-title">Treni da e per Bologna:</h2>
<div class="u-text-left">{{> @button--as-link btn-useful-info }}</div>
</div>
{{ render "@form--express" }}
</section>
</div>
</div>
<!-- Billboards -->
<div class="c-tablist c-billboards_tablist">
<ul class="c-tablist__tabs">
<li>
<a href="#partenze" aria-current="true">Partenze</a>
</li>
<li>
<a href="#arrivi">Arrivi</a>
</li>
</ul>
<div class="c-billboards {{ modifier }}">
<div class="c-billboards__item c-tablist__section" id="partenze">
{{ render "@billboard--departures" }}
</div>
<div class="c-billboards__item c-tablist__section" hidden id="arrivi">
{{ render "@billboard--arrivals" }}
</div>
</div>
</div>
<!-- Flights List Toggle -->
<div class=''>
<ul class='c-switcher'>
<li>
<a
href='#section-cheaper'
aria-label='Risultati ordinati per prezzo crescente'
>
Il volo più economico
<strong>
129,90 €
</strong>
</a>
</li>
<li>
<a
href='#section-quickest'
aria-label='Risultati ordinati per durata del volo crescente'
>
Il volo più veloce
<strong>
3h 56'
</strong>
</a>
</li>
</ul>
</div>
<!-- Titolo Borsa -->
<div class="c-tablist c-tablist--titolo-borsa">
<ul class="c-tablist__tabs">
<li>
<a href="#section-overview" aria-label="Overview">Overview</a>
</li>
<li>
<a href="#section-trends" aria-label="Grafico e trends">Grafico e Trends</a>
</li>
<li>
<a href="#section-stats" aria-label="Dati statistici">Statistiche</a>
</li>
</ul>
<section class="c-tablist__section" id="section-overview">
<div class="iframes-container">
{{#repeat 4}}
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
{{/repeat}}
</div>
</section>
<section class="c-tablist__section" id="section-trends">
<div class="iframes-container">
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
</div>
</section>
<section class="c-tablist__section" id="section-stats">
<div class="iframes-container">
{{#repeat 7}}
<div class="iframes-container__item">
<iframe src="" frameborder="0" style="background: #ccc"></iframe>
</div>
{{/repeat}}
</div>
</section>
</div>
<!-- Youfirst -->
<div class="c-tablist c-tablist--youfirst">
<ul class="c-tablist__tabs" role="tablist">
<li>
<a href="#partenze" role="tab" rel="#partenze" aria-label="Youfirst in partenza" aria-current="true" aria-selected="true">
<svg class="c-icon c-icon--24"><use xlink:href="#ic_flight_takeoff_black_24px"></use></svg>
<span class="c-tablist__label--desktop">Youfirst in partenza</span>
<span class="c-tablist__label--mobile">alla Partenza</span>
</a>
</li>
<li>
<a href="#arrivi" role="tab" rel="#arrivi" aria-label="Youfirst in arrivo" >
<svg class="c-icon c-icon--24"><use xlink:href="#ic_flight_land_black_24px"></use></svg>
<span class="c-tablist__label--desktop">Youfirst in arrivo</span>
<span class="c-tablist__label--mobile">all'Arrivo</span>
</a>
</li>
<li>
<a href="#allinclusive" role="tab" rel="#allinclusive" aria-label="All Inclusive">
<svg class="c-icon c-icon--24"><use xlink:href="#ic_flight_takeoff_black_24px"></use> </svg> +
<svg class="c-icon c-icon--24"><use xlink:href="#ic_flight_land_black_24px"></use></svg>
<span class="c-tablist__label--desktop">All Inclusive</span>
<span class="c-tablist__label--mobile">All Inclusive</span>
</a>
</li>
</ul>
<div class="c-tablist__sections {{ modifier }}">
<div class="c-tablist__section" id="partenze">
{{!-- TAB PARTENZA --}}
<div class="youfirst_tab">
<div class="youfirst_tab__title">Un servizio dedicato per semplificare la tua partenza</div>
<div class="youfirst_tab__container">
<div class="youfirst_tab__item">
<p><strong>Servizi alla partenza</strong></p>
<ul>
<li><strong>Accoglienza</strong> da parte del nostro personale alla reception della Marconi Business Lounge al 1° piano del Terminal.</li>
<li><strong>Assistenza nelle procedure di check-in</strong> all’interno della Lounge, con drop-off bagaglio da stiva se presente.</li>
<li><strong>Servizio di facchinaggio</strong> per il bagaglio da stiva.</li>
<li>Ingresso alla Vip Lounge e <strong>utilizzo della corsia Fast Track</strong>.</li>
<li>Assistenza ed <strong>imbarco prioritario</strong> al Gate.</li>
<li><strong>Assistenza al controllo passaporti</strong> (se necessario).</li>
<li><strong>Trasferimento dal Terminal all’aeromobile</strong> con mezzo riservato (minivan massimo 5 posti).</li>
</ul>
{{> @button type="submit" modifier="c-button--submit c-button--elastic" text="Prenota Youfirst in partenza" aria-label="Prenota Youfirst in partenza" }}
</div>
<div class="youfirst_tab__item youfirst_tab__item--images">
<div class="youfirst_tab__image"><img src="{{ path '/images/youfirst-oblo-1.png' }}" alt="" /></div>
<div class="youfirst_tab__image"><img src="{{ path '/images/youfirst-oblo-2.png' }}" alt="" /></div>
</div>
</div>
</div>
{{!-- /TAB --}}
</div>
<div class="c-tablist__section" hidden id="arrivi">
{{!-- TAB ARRIVO --}}
<div class="youfirst_tab">
<div class="youfirst_tab__title">Un servizio dedicato per viaggiare in tutta serenità</div>
<div class="youfirst_tab__container">
<div class="youfirst_tab__item">
<p><strong>Servizi in arrivo</strong></p>
<ul>
<li><strong>Accoglienza</strong> da parte del nostro personale alla reception della Marconi Business Lounge al
1° piano del Terminal.</li>
<li><strong>Assistenza nelle procedure di check-in</strong> all’interno della Lounge, con drop-off bagaglio da
stiva se presente.</li>
<li><strong>Servizio di facchinaggio</strong> per il bagaglio da stiva.</li>
<li>Ingresso alla Vip Lounge e <strong>utilizzo della corsia Fast Track</strong>.</li>
<li>Assistenza ed <strong>imbarco prioritario</strong> al Gate.</li>
<li><strong>Assistenza al controllo passaporti</strong> (se necessario).</li>
<li><strong>Trasferimento dal Terminal all’aeromobile</strong> con mezzo riservato (minivan massimo 5 posti).
</li>
</ul>
{{> @button type="submit" modifier="c-button--submit c-button--elastic" text="Prenota Youfirst in arrivo"
aria-label="Prenota Youfirst in arrivo" }}
</div>
<div class="youfirst_tab__item youfirst_tab__item--images">
<div class="youfirst_tab__image"><img src="{{ path '/images/youfirst-oblo-1.png' }}" alt="" /></div>
<div class="youfirst_tab__image"><img src="{{ path '/images/youfirst-oblo-2.png' }}" alt="" /></div>
</div>
</div>
</div>
{{!-- /TAB --}}
</div>
<div class="c-tablist__section" hidden id="allinclusive">
{{!-- TAB ALL INCLUSIVE--}}
<div class="youfirst_tab">
<div class="youfirst_tab__title">Un servizio dedicato per viaggiare in tutta serenità</div>
<div class="youfirst_tab__container">
<div class="youfirst_tab__item">
<div class="youfirst_tab__expand">
<input type="checkbox" id="expand-partenza" name="expand-partenza" class="u-visuallyhidden u-chkbx-showmore" aria-controls="expand-partenza-target" aria-label="Espandi per le informazioni del volo" role="switch">
<p><strong>Inclusi tutti i servizi “In partenza”</strong></p>
<div class="u-chkbx-showmore-target" id="expand-partenza-target">
<ul>
<li><strong>Accoglienza</strong> da parte del nostro personale alla reception della Marconi Business Lounge al
1° piano del Terminal.</li>
<li><strong>Assistenza nelle procedure di check-in</strong> all’interno della Lounge, con drop-off bagaglio da
stiva se presente.</li>
<li><strong>Servizio di facchinaggio</strong> per il bagaglio da stiva.</li>
<li>Ingresso alla Vip Lounge e <strong>utilizzo della corsia Fast Track</strong>.</li>
<li>Assistenza ed <strong>imbarco prioritario</strong> al Gate.</li>
<li><strong>Assistenza al controllo passaporti</strong> (se necessario).</li>
<li><strong>Trasferimento dal Terminal all’aeromobile</strong> con mezzo riservato (minivan massimo 5 posti).
</li>
</ul>
</div>
<label for="expand-partenza" class='u-chkbx-showmore-label'>
Leggi <span class="more">di più</span><span class="less">meno</span>
</label>
</div>
<div class="youfirst_tab__divider"><span>+</span></div>
<div class="youfirst_tab__expand">
<div class="youfirst_tab__expand">
<input type="checkbox" id="expand-arrivo" name="expand-arrivo" class="u-visuallyhidden u-chkbx-showmore"
aria-controls="expand-arrivo-target" aria-label="Espandi per le informazioni del volo" role="switch">
<p><strong>Inclusi tutti i servizi “In partenza”</strong></p>
<div class="u-chkbx-showmore-target" id="expand-arrivo-target">
<ul>
<li><strong>Accoglienza</strong> da parte del nostro personale alla reception della Marconi Business Lounge al
1° piano del Terminal.</li>
<li><strong>Assistenza nelle procedure di check-in</strong> all’interno della Lounge, con drop-off bagaglio da
stiva se presente.</li>
<li><strong>Servizio di facchinaggio</strong> per il bagaglio da stiva.</li>
<li>Ingresso alla Vip Lounge e <strong>utilizzo della corsia Fast Track</strong>.</li>
<li>Assistenza ed <strong>imbarco prioritario</strong> al Gate.</li>
<li><strong>Assistenza al controllo passaporti</strong> (se necessario).</li>
<li><strong>Trasferimento dal Terminal all’aeromobile</strong> con mezzo riservato (minivan massimo 5 posti).
</li>
</ul>
</div>
<label for="expand-arrivo" class='u-chkbx-showmore-label'>
Leggi <span class="more">di più</span><span class="less">meno</span>
</label>
</div>
</div>
{{> @button type="submit" modifier="c-button--submit c-button--elastic" text="Prenota Youfirst All Inclusive"
aria-label="Prenota Youfirst All Inclusive" }}
</div>
<div class="youfirst_tab__item youfirst_tab__item--images">
<div class="youfirst_tab__image"><img src="{{ path '/images/youfirst-oblo-1.png' }}" alt="" /></div>
<div class="youfirst_tab__image"><img src="{{ path '/images/youfirst-oblo-2.png' }}" alt="" /></div>
</div>
</div>
</div>
{{!-- /TAB --}}
</div>
</div>
</div>
/* Default */
{
"home-it": true,
"tab": [
{
"anchor-id": "section-1",
"tab-text": "Section 1",
"tab-content-title": "Section title 1",
"tab-content-text": "<p>111 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-2",
"tab-text": "Section 2",
"tab-content-title": "Section title 2",
"tab-content-text": "<p>222 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-3",
"tab-text": "Section 3",
"tab-content-title": "Section title 3",
"tab-content-text": "<p>333 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
}
]
}
/* Flights list */
{
"home-it": true,
"tab": [
{
"anchor-id": "section-1",
"tab-text": "Section 1",
"tab-content-title": "Section title 1",
"tab-content-text": "<p>111 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-2",
"tab-text": "Section 2",
"tab-content-title": "Section title 2",
"tab-content-text": "<p>222 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-3",
"tab-text": "Section 3",
"tab-content-title": "Section title 3",
"tab-content-text": "<p>333 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
}
],
"switcher": {
"aria-label": "Cerca tra le seguenti sezioni",
"items": [
{
"section": "Tutti i risultati",
"number": "(123)",
"class": "is-active"
},
{
"section": "Voli diretti",
"number": "(80)"
},
{
"section": "Con scalo",
"number": "(43)"
}
]
},
"multiselect-company": {
"exposed-text": "Tutte le compagnie aeree",
"aria-label": "Seleziona le compagnie aeree",
"options": [
{
"id": "alitalia",
"name": "alitalia",
"text": "Alitalia"
},
{
"id": "ryanair",
"name": "ryanair",
"text": "Ryanair"
},
{
"id": "emirates",
"name": "emirates",
"text": "Emirates"
},
{
"id": "klm",
"name": "kml",
"text": "KLM"
},
{
"id": "delta",
"name": "delta",
"text": "Delta Airlines"
},
{
"id": "lufthansa",
"name": "lufthansa",
"text": "Lufthansa"
},
{
"id": "airdolomiti",
"name": "airdolomiti",
"text": "Air Dolomiti"
}
]
},
"cheaper-items": [
{
"componentName": "@flight-product--round-trip-moredays",
"componentInstance": {
"round": {
"route-label": "<strong>Andata</strong>"
},
"trip": {
"route-label": "<strong>Ritorno</strong>"
}
}
},
{
"componentName": "@flight-product--round-trip-stops",
"componentInstance": {
"round": {
"route-label": "<strong>Andata</strong>",
"company-logo": "/images/flights-logos/ryanair.png",
"company-name": "Ryanair",
"flight-code": "FR4705",
"stops": {
"duration": "Durata del volo: <strong>5h 30min</strong>",
"stops-number": 1,
"toggle": {
"id": "stop-toggle-3",
"name": "stop-toggle-3",
"text": "1 scalo"
},
"aria-controls-id": "stop-detail-3"
}
},
"trip": {
"route-label": "<strong>Ritorno</strong>",
"company-logo": "/images/flights-logos/ryanair.png",
"company-name": "Ryanair",
"flight-code": "FR4706",
"stops": {
"duration": "Durata del volo: <strong>6h 10min</strong>",
"stops-number": 1,
"toggle": {
"id": "stop-toggle-4",
"name": "stop-toggle-4",
"text": "1 scalo"
},
"aria-controls-id": "stop-detail-4"
}
},
"price": {
"value": "€ 355,68"
}
}
},
{
"componentName": "@flight-product--round-trip-stops",
"componentInstance": {
"round": {
"route-label": "<strong>Andata</strong>",
"company-logo": "/images/flights-logos/ryanair.png",
"company-name": "Ryanair",
"flight-code": "FR4745",
"stops": {
"duration": "Durata del volo: <strong>3h 32min</strong>",
"stops-number": 1,
"toggle": {
"id": "stop-toggle-5",
"name": "stop-toggle-5",
"text": "1 scalo"
},
"aria-controls-id": "stop-detail-5"
}
},
"trip": {
"route-label": "<strong>Ritorno</strong>",
"company-logo": "/images/flights-logos/ryanair.png",
"company-name": "Ryanair",
"flight-code": "FR4786",
"stops": {
"duration": "Durata del volo: <strong>4h 15min</strong>",
"stops-number": 1,
"toggle": {
"id": "stop-toggle-6",
"name": "stop-toggle-6",
"text": "1 scalo"
},
"aria-controls-id": "stop-detail-6"
}
},
"price": {
"value": "€ 467,68"
},
"tag": null
}
},
{
"componentName": "@flight-product--round-trip",
"componentInstance": {
"round": {
"route-label": "<strong>Andata</strong>",
"company-logo": "/images/flights-logos/easyjet.png",
"company-name": "Easyjet",
"flight-code": "U22831"
},
"trip": {
"route-label": "<strong>Ritorno</strong>",
"company-logo": "/images/flights-logos/easyjet.png",
"company-name": "Easyjet",
"flight-code": "U22832"
},
"price": {
"value": "€ 489,52"
},
"tag": null
}
},
{
"componentName": "@flight-product--round-trip",
"componentInstance": {
"round": {
"route-label": "<strong>Andata</strong>",
"company-logo": "/images/flights-logos/alitalia.png",
"company-name": "Alitalia",
"flight-code": "EK109"
},
"trip": {
"route-label": "<strong>Ritorno</strong>",
"company-logo": "/images/flights-logos/alitalia.png",
"company-name": "Alitalia",
"flight-code": "EK100"
},
"price": {
"value": "€ 679,23"
},
"tag": null
}
}
],
"quickest-items": [
{
"componentName": "@flight-product--round-trip",
"componentInstance": {
"round": {
"route-label": "<strong>Andata</strong>",
"company-logo": "/images/flights-logos/easyjet.png",
"company-name": "Easyjet",
"flight-code": "U22831",
"stops": {
"duration": "Durata del volo: <strong>4h 15min</strong>",
"stops-number": null
}
},
"trip": {
"route-label": "<strong>Ritorno</strong>",
"company-logo": "/images/flights-logos/easyjet.png",
"company-name": "Easyjet",
"flight-code": "U22832",
"stops": {
"duration": "Durata del volo: <strong>4h 25min</strong>",
"stops-number": null
}
},
"price": {
"value": "€ 754,93"
},
"tag": {
"text": "Il più veloce"
}
}
},
{
"componentName": "@flight-product--round-trip",
"componentInstance": {
"round": {
"route-label": "<strong>Andata</strong>",
"company-logo": "/images/flights-logos/alitalia.png",
"company-name": "Alitalia",
"flight-code": "EK109"
},
"trip": {
"route-label": "<strong>Ritorno</strong>",
"company-logo": "/images/flights-logos/alitalia.png",
"company-name": "Alitalia",
"flight-code": "EK100"
},
"price": {
"value": "€ 679,23"
},
"tag": null
}
},
{
"componentName": "@flight-product--round-trip-stops",
"componentInstance": {
"tag": null,
"round": {
"route-label": "<strong>Andata</strong>",
"stops": {
"duration": "Durata del volo: <strong>5h 30min</strong>",
"stops-number": 1,
"toggle": {
"id": "stop-toggle-7",
"name": "stop-toggle-7",
"text": "1 scalo"
},
"aria-controls-id": "stop-detail-7"
}
},
"trip": {
"route-label": "<strong>Ritorno</strong>",
"stops": {
"duration": "Durata del volo: <strong>5h 30min</strong>",
"stops-number": 1,
"toggle": {
"id": "stop-toggle-8",
"name": "stop-toggle-8",
"text": "1 scalo"
},
"aria-controls-id": "stop-detail-8"
}
}
}
},
{
"componentName": "@flight-product--round-trip-stops",
"componentInstance": {
"round": {
"route-label": "<strong>Andata</strong>",
"company-logo": "/images/flights-logos/ryanair.png",
"company-name": "Ryanair",
"flight-code": "FR4705",
"stops": {
"duration": "Durata del volo: <strong>5h 30min</strong>",
"stops-number": 1,
"toggle": {
"id": "stop-toggle-9",
"name": "stop-toggle-9",
"text": "1 scalo"
},
"aria-controls-id": "stop-detail-9"
}
},
"trip": {
"route-label": "<strong>Ritorno</strong>",
"company-logo": "/images/flights-logos/ryanair.png",
"company-name": "Ryanair",
"flight-code": "FR4706",
"stops": {
"duration": "Durata del volo: <strong>6h 10min</strong>",
"stops-number": 1,
"toggle": {
"id": "stop-toggle-10",
"name": "stop-toggle-10",
"text": "1 scalo"
},
"aria-controls-id": "stop-detail-10"
}
},
"price": {
"value": "€ 355,68"
},
"tag": null
}
},
{
"componentName": "@flight-product--round-trip-stops",
"componentInstance": {
"round": {
"route-label": "<strong>Andata</strong>",
"company-logo": "/images/flights-logos/ryanair.png",
"company-name": "Ryanair",
"flight-code": "FR4745",
"stops": {
"duration": "Durata del volo: <strong>3h 32min</strong>",
"stops-number": 1,
"toggle": {
"id": "stop-toggle-11",
"name": "stop-toggle-11",
"text": "1 scalo"
},
"aria-controls-id": "stop-detail-11"
}
},
"trip": {
"route-label": "<strong>Ritorno</strong>",
"company-logo": "/images/flights-logos/ryanair.png",
"company-name": "Ryanair",
"flight-code": "FR4786",
"stops": {
"duration": "Durata del volo: <strong>4h 40min</strong>",
"stops-number": 1,
"toggle": {
"id": "stop-toggle-12",
"name": "stop-toggle-12",
"text": "1 scalo"
},
"aria-controls-id": "stop-detail-12"
}
},
"price": {
"value": "€ 467,68"
},
"tag": null
}
}
]
}
/* Destination */
{
"home-it": true,
"tab": [
{
"anchor-id": "section-1",
"tab-text": "Section 1",
"tab-content-title": "Section title 1",
"tab-content-text": "<p>111 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-2",
"tab-text": "Section 2",
"tab-content-title": "Section title 2",
"tab-content-text": "<p>222 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-3",
"tab-text": "Section 3",
"tab-content-title": "Section title 3",
"tab-content-text": "<p>333 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
}
]
}
/* Flights Times */
{
"home-it": true,
"tab": [
{
"anchor-id": "section-1",
"tab-text": "Section 1",
"tab-content-title": "Section title 1",
"tab-content-text": "<p>111 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-2",
"tab-text": "Section 2",
"tab-content-title": "Section title 2",
"tab-content-text": "<p>222 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-3",
"tab-text": "Section 3",
"tab-content-title": "Section title 3",
"tab-content-text": "<p>333 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
}
],
"departures-icon": {
"symbol": "ic_flight_takeoff_black_24px",
"class": "c-icon c-icon--24"
},
"arrivals-icon": {
"symbol": "ic_flight_land_black_24px",
"class": "c-icon c-icon--24"
},
"prev-month": {
"symbol": "ic_chevron_left_black_24px",
"class": "c-icon c-icon--24"
},
"next-month": {
"symbol": "ic_chevron_right_black_24px",
"class": "c-icon c-icon--24"
},
"refresh-btn": {
"type": "button",
"text": "Aggiorna ↻",
"modifier": "c-button--adding"
},
"time-switch": {
"modifier": "c-time-switcher--flights-times"
}
}
/* Forms */
{
"home-it": true,
"tab": [
{
"anchor-id": "section-1",
"tab-text": "Section 1",
"tab-content-title": "Section title 1",
"tab-content-text": "<p>111 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-2",
"tab-text": "Section 2",
"tab-content-title": "Section title 2",
"tab-content-text": "<p>222 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-3",
"tab-text": "Section 3",
"tab-content-title": "Section title 3",
"tab-content-text": "<p>333 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
}
],
"btn-useful-info": {
"type": "button",
"text": "Regole e info utili",
"modifier": "c-button--as-link u-color-basic-white-100 js-fr-dialogmodal-open",
"opens-dialog": "dialog-useful-info",
"svg": {
"symbol": "ic-info-serif",
"class": "c-icon--18 u-color-sun-120"
}
},
"form-belowbanner": {
"sticker": {
"img-src": "/images/svgs/stk_mail_discount_reservation.svg",
"img-alt": "stk_mail_discount_reservation"
},
"text": "<strong>fino al 30% di sconto </strong> acquistando il parcheggio online!"
},
"form-flights": {
"hide-switch": true
}
}
/* Billboards */
{
"home-it": true,
"tab": [
{
"anchor-id": "section-1",
"tab-text": "Section 1",
"tab-content-title": "Section title 1",
"tab-content-text": "<p>111 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-2",
"tab-text": "Section 2",
"tab-content-title": "Section title 2",
"tab-content-text": "<p>222 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-3",
"tab-text": "Section 3",
"tab-content-title": "Section title 3",
"tab-content-text": "<p>333 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
}
]
}
/* Flights List Toggle */
{
"home-it": true,
"tab": [
{
"anchor-id": "section-1",
"tab-text": "Section 1",
"tab-content-title": "Section title 1",
"tab-content-text": "<p>111 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-2",
"tab-text": "Section 2",
"tab-content-title": "Section title 2",
"tab-content-text": "<p>222 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-3",
"tab-text": "Section 3",
"tab-content-title": "Section title 3",
"tab-content-text": "<p>333 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
}
]
}
/* Titolo Borsa */
{
"home-it": true,
"tab": [
{
"anchor-id": "section-1",
"tab-text": "Section 1",
"tab-content-title": "Section title 1",
"tab-content-text": "<p>111 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-2",
"tab-text": "Section 2",
"tab-content-title": "Section title 2",
"tab-content-text": "<p>222 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-3",
"tab-text": "Section 3",
"tab-content-title": "Section title 3",
"tab-content-text": "<p>333 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
}
]
}
/* Youfirst */
{
"home-it": true,
"tab": [
{
"anchor-id": "section-1",
"tab-text": "Section 1",
"tab-content-title": "Section title 1",
"tab-content-text": "<p>111 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-2",
"tab-text": "Section 2",
"tab-content-title": "Section title 2",
"tab-content-text": "<p>222 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
},
{
"anchor-id": "section-3",
"tab-text": "Section 3",
"tab-content-title": "Section title 3",
"tab-content-text": "<p>333 Lorem ipsum dolor sit amet consectetur, adipisicing elit. Facere nemo nihil dolor reprehenderit blanditiis dignissimos a nostrum. Quam, neque? Omnis non, facere modi adipisci et dicta. Voluptate, quo. Quia, adipisci.</p>"
}
]
}
.c-tablist {
position: relative;
text-align: center;
// only IE 10 & 11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
z-index: 2;
}
main & {
grid-column: main;
}
.c-tablist__tabs {
padding: 0;
display: inline-flex;
position: relative;
z-index: 1;
margin: 0 auto;
border-radius: remify(16px);
border: 4px solid primary(night, 20);
background-color: primary(night, 20);
}
.c-tablist__tabs li,
.c-tablist__tabs a {
display: inline-block;
flex: 1;
border-radius: remify(4px) remify(4px) 0 0;
}
.c-tablist__tabs a {
text-decoration: none;
padding: remify(8px) remify(20px);
color: primary(night, 100);
display: block;
text-align: center;
white-space: nowrap;
min-width: remify(140px);
background-color: primary(night, 20);
color: primary(night, 100);
border-radius: remify(12px);
@include min-screen (bp(tablet)) {
padding: remify(8px) remify(40px);
min-width: remify(220px);
}
.c-icon {
vertical-align: bottom;
color: currentColor;
}
svg {
* {
fill: currentColor;
}
}
}
.c-tablist__tabs [aria-current="true"] {
color: #fff;
background-color: primary(night, 80);
}
.c-tablist__section {
padding: remify(16px);
@include min-screen(bp(tablet-p)) {
padding: 0;
}
.disclaimer {
text-align: center;
font-size: 75%;
margin-top: remify(20px);
}
.c-tablist__empty-message {
color: primary(night, 100);
font-weight: fw(regular);
margin: remify(80px) 0;
font-size: 150%;
text-align: center;
}
}
.c-tablist__section-header {
padding: remify(16px);
display: flex;
flex-direction: column;
gap: remify(16px);
@include min-screen(bp(phone-p)) {
flex-direction: row;
justify-content: space-between;
align-items: center;
}
}
.c-tablist__section-title {
@include font-scale(level-3);
color: #fff;
// padding: remify(16px) 0 0 remify(16px);
text-align: left;
}
}
/*------------------------------------*\
Flights-list modifier
\*------------------------------------*/
.c-tablist--flights-list,
.c-tablist--destination {
.c-tablist__section {
position: relative;
@include min-screen(bp(tablet-l)) {
padding: remify(48px);
}
}
}
/*------------------------------------*\
Destination modifier
\*------------------------------------*/
.c-tablist--destination {
margin-top: remify(40px);
}
/*------------------------------------*\
Flights times modifier
\*------------------------------------*/
.c-tablist--flights-times {
.c-tablist__tabs {
z-index: 0; // To prevent the bug of autocomplete that goes under the tabs
width: 100%;
max-width: remify(450px);
@include min-screen(bp(tablet-p)) {
width: 50%;
max-width: initial;
}
}
.c-tablist__section {
padding: remify(16px) 0;
}
// .c-main--arrivals-departures & {
// margin-top: remify(24px);
// }
.c-tablist__tabs a {
font-size: 75%;
@include min-screen(bp(phone-p)) {
font-size: 100%;
}
}
.status {
text-align: center;
margin-bottom: remify(32px);
position: relative;
@include min-screen(bp(tablet)) {
display: grid;
grid-template-columns: repeat(3, 1fr);
align-items: center;
// display: flex;
// justify-content: space-between;
// align-items: center;
}
}
.status__child {
&.refresh {
display: none;
@include min-screen(bp(tablet)) {
display: block;
}
}
&.is-alone {
margin-left: auto;
}
}
.status__child+.status__child {
margin-top: remify(16px);
@include min-screen(bp(tablet)) {
margin-top: 0;
}
}
.status .days {
display: flex;
align-items: center;
justify-content: center;
// @include min-screen(bp(tablet-p)) {
// position: absolute;
// left: 50%;
// transform: translateX(-50%);
// }
.today {
text-align: center;
color: primary(night, 100);
}
p {
font-size: 150%;
margin: 0 remify(24px);
}
small {
text-transform: uppercase;
}
a {
max-height: remify(24px);
}
svg * {
fill: primary(night, 100);
}
}
.last-update {
text-align: center;
width: 100%;
}
.last-update--mobile {
display: block;
margin-top: remify(24px);
@include min-screen(bp(tablet)) {
display: none;
}
}
.last-update--desktop {
display: none;
@include min-screen(bp(tablet)) {
display: block;
margin-top: remify(8px);
}
}
.c-tablist__time-switcher {
display: none;
position: sticky;
z-index: 200;
bottom: 0;
@include min-screen(bp(tablet)) {
display: block;
}
}
.flight-items {
max-width: remify(800px);
margin-inline: auto;
padding-inline: remify(16px);
}
}
/*------------------------------------*\
Forms modifier
\*------------------------------------*/
.c-tablist--forms {
.c-tablist__sections {
margin-top: 0;
@include min-screen(bp(tablet)) {
display:0 0 remify(48px);
}
// Dichiara un'altezza minima in modo da evitare il reflow della pagina
min-height: remify(96px);
}
.c-tablist__section {
box-shadow: none;
padding: 0;
margin: 0 auto;
outline: none;
max-width: remify(900px);
background-color: primary(night, 100);
border-radius: 0 0 remify(16px) remify(16px);
&~.c-tablist__section {
display: none;
}
// Rende visibile il tab corrente quando XIAO ha terminato il caricamento
&[aria-label]:not([hidden]) {
display: block;
}
}
.c-tablist__section--flights {
@include min-screen( $bp-form-flights ) {
width: 100%;
max-width: remify(1269px);
border-radius: remify(16px);
margin: 0 auto;
}
}
.c-tablist__tabs {
justify-content: space-between;
flex-wrap: nowrap;
border: none;
border-radius: 0;
width: 100%;
max-width: remify(900px);
border-radius: remify(16px) remify(16px) 0 0;
overflow: hidden;
@include min-screen(bp(tablet)) {
justify-content: center;
flex-wrap: nowrap;
}
}
.c-tablist__tabs li {
flex: 0 1 25%;
border-radius: 0;
}
.c-tablist__tabs a,
.c-tablist__tabs [aria-current="true"] {
padding: remify(16px) remify(4px);
background-color: primary(night, 20);
color: primary(night, 120);
display: block;
text-align: center;
border-radius: 0;
width: 100%;
min-width: remify(40px);
@include font-scale(level-1-5);
}
.c-tablist__tabs [aria-current="true"] {
text-decoration: none;
background-color: primary(night, 100);
color: #fff;
}
.c-tablist__tabs li a:hover,
.c-tablist__tabs [aria-current="true"] {
@include max-screen(bp(tablet)) {
background-color: primary(night, 120);
color: primary(sun, 100);
}
}
.c-tablist__tabs a svg {
display: inline-block;
* {
fill: currentColor;
}
}
.c-tablist__tabs span {
display: none;
@include min-screen(bp(tablet)) {
display: inline-block;
}
}
.c-tablist__tabs .mobile-label {
display: block;
@include min-screen(bp(tablet)) {
display: none;
}
}
.c-tablist__section--express {
.c-form__fields {
padding: remify(16px);
}
}
}
/*------------------------------------*\
HOMEPAGE forms modifier
\*------------------------------------*/
// .c-tablist--forms .c-tablist__section--parkings.has-banner:not([hidden]) {}
.c-tablist--forms .c-tablist__section {
.c-form {
padding: remify(16px);
text-align: left;
label {
color: #fff;
}
.c-field__note {
color: #fff;
}
label.is-negative {
color: status(light-negative);
input {
background-color: status(light-negative);
}
.c-field__note {
color: status(light-negative);
}
}
}
.c-banner {
border-radius: 0 0 remify(16px) remify(16px);
}
.c-form .pax-type label {
color: inherit;
}
}
/*------------------------------------*\
Pax-guide modifier
\*------------------------------------*/
.c-tablist--pax-guide {
*:focus {
outline: none;
}
.c-tablist__section {
margin-top: remify(8px);
border-radius: remify(8px);
background-color: primary(night, 120);
color: #fff;
a {
color: currentColor;
}
}
.c-tablist__tabs a,
.c-tablist__tabs [aria-current="true"] {
padding: remify(16px);
background-color: primary(night, 100);
color: #fff;
display: block;
text-align: center;
height: 100%;
border-radius: remify(4px);
background-color: transparent;
box-shadow: none;
font-size: 150%;
font-weight: fw(light);
}
.c-tablist__tabs [aria-current="true"] {
text-decoration: none;
font-weight: fw(semibold);
&:before {
position: absolute;
@include css-triangle("down", 10px, primary(sun, 100));
bottom: remify(-10px);
left: 50%;
transform: translateX(-50%);
@include min-screen(bp(tablet)) {
content: "";
}
}
}
}
/*------------------------------------*\
titolo-borsa modifier
\*------------------------------------*/
.c-tablist.c-tablist--titolo-borsa {
margin: remify(40px) 0;
.c-tablist__tabs {
@include max-screen(bp(phone-p)) {
align-items: flex-end;
}
}
.c-tablist__tabs a {
font-size: 75%;
&[aria-current="true"] {
border-top: remify(5px) solid;
}
&.departures {
border-color: primary(sky, 100);
}
&.arrivals {
border-color: primary(sun, 100);
}
@include min-screen(bp(phone-p)) {
font-size: 100%;
}
@include min-screen(bp(tablet)) {
font-size: 145%;
line-height: 1.42;
}
}
.iframes-container {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.iframes-container__item {
flex: 0 1 remify(600px);
padding: remify(8px);
}
}
/*------------------------------------*\
YouFirst modifier
\*------------------------------------*/
.c-tablist--youfirst {
@include shadow(higher);
max-width: remify(900px);
margin: 0 auto;
border: 1px solid primary(night, 20);
border-radius: remify(24px);
.c-tablist__sections {
margin-top: 0;
@include min-screen(bp(tablet)) {
display:0 0 remify(48px);
}
// Dichiara un'altezza minima in modo da evitare il reflow della pagina
min-height: remify(96px);
}
.c-tablist__section {
box-shadow: none;
padding: 0;
margin: 0 auto;
outline: none;
border-radius: 0 0 remify(24px) remify(24px);
background: linear-gradient(180deg, #FFFFFF 39%, #EAF2FB 135.82%, #F4F4F4 144.03%);
& ~ .c-tablist__section {
display: none;
}
// Rende visibile il tab corrente quando XIAO ha terminato il caricamento
&[aria-label]:not([hidden]) {
display: block;
}
}
.c-tablist__tabs {
justify-content: space-between;
flex-wrap: nowrap;
border: none;
border-radius: 0;
width: 100%;
border-radius: remify(24px) remify(24px) 0 0;
overflow: hidden;
@include min-screen(bp(tablet)) {
justify-content: center;
flex-wrap: nowrap;
}
}
.c-tablist__tabs li {
flex: 0 1 100%;
border-radius: 0;
}
.c-tablist__tabs a,
.c-tablist__tabs [aria-current="true"] {
padding: remify(16px) remify(4px);
background-color: primary(night, 10);
color: primary(night, 120);
display: block;
text-align: center;
border-radius: 0;
width: 100%;
min-width: remify(40px);
@include font-scale(level-1-5);
.c-tablist__label--desktop { display: none;}
.c-tablist__label--mobile { display: block;}
@include min-screen(bp(tablet)) {
.c-tablist__label--desktop { display: inline-block;}
.c-tablist__label--mobile { display: none;}
}
}
.c-tablist__tabs [aria-current="true"] {
text-decoration: none;
background-color: #fff;
}
.c-tablist__tabs a svg {
display: inline-block;
* {
fill: currentColor;
}
}
.c-tablist__tabs span {
display: none;
@include min-screen(bp(tablet)) {
display: inline-block;
}
}
.c-tablist__section--express {
.c-form__fields {
padding: remify(16px);
}
}
}
.youfirst_tab {
text-align: left;
padding: remify(24px);
@include min-screen(bp(tablet)) {
padding: remify(24px) remify(48px) remify(48px);
}
.youfirst_tab__title {
@include font-scale(level-4);
color: primary(night, 120);
margin-bottom: remify(24px);
}
.youfirst_tab__container {
display: flex;
justify-content: space-between;
align-items: flex-start;
}
.youfirst_tab__item {
@include min-screen(bp(tablet-p)) {
flex: 0 1 50%;
}
p {
margin-bottom: remify(8px);
}
ul li{
@include font-scale(level-1-5);
list-style: disc;
margin-bottom: remify(8px);
margin-left: remify(16px);
}
.c-button--submit {
width: 100%;
margin-top: remify(24px);
}
&:first-child {
@include min-screen(bp(tablet)) {
padding-right: remify(48px);
border-right: 1px solid primary(night, 20);
}
}
&.youfirst_tab__item--images {
display: none;
@include min-screen(bp(tablet)) {
padding-left: remify(48px);
display: flex;
justify-content: space-between;
.youfirst_tab__image {
flex: 0 1 46%;
}
}
}
}
.u-chkbx-showmore ~ .u-chkbx-showmore-target { display: block; max-height: 4rem; overflow: hidden; }
.u-chkbx-showmore:checked ~ .u-chkbx-showmore-target { display: block; max-height: 100%; }
.u-chkbx-showmore ~ label .more { display: inline-block; }
.u-chkbx-showmore:checked ~ label .more { display: none; }
.u-chkbx-showmore ~ label .less { display: none; }
.u-chkbx-showmore:checked ~ label .less { display: inline-block; }
.u-chkbx-showmore-label {
color: primary(sky, 120);
@include font-scale(level-2);
display: inline-block;
margin: remify(8px) 0 remify(16px);
&, & span {
text-decoration: underline;
}
&:hover {
cursor: pointer;
}
}
.youfirst_tab__divider {
text-align: center;
padding: remify(8px) 0;
margin: remify(8px) 0;
position: relative;
span {
padding: 0 remify(16px);
background-color: #fff;
display: inline-block;
position: relative;
z-index: 2;
}
&:after {
content: "";
position: absolute;
left: remify(24px);
right: remify(24px);
top: 50%;
transform: translateY(-50%);
border-bottom: 1px solid primary(night, 20);
z-index: 1;
}
}
}
(function($) {
/*
This JS shows the sections only on click on one of the tabs.
'.c-tablist__sections' is hidden by CSS into: `src/views/03-organisms/organism-tablist/_tablist.scss`
*/
var $tabs = $('.c-tablist--forms .c-tablist__tabs a');
var $sections = $('.c-tablist--forms .c-tablist__sections');
$tabs.click(function () {
//** non credo che serva più
//** commento tutto per poi rimuoverlo */
// Shows the sections on click
// $sections.show();
// Jumps the page to the offset of tabs only on mobile in order to avoid page jumping on every tap.
// if ($(window).width() < 768) {
// $("html, body").animate({
// scrollTop: $(this).offset().top - 10
// }, 300);
// };
});
})(jQuery);
(function($) {
/*
This JS scrolls the page on the anchors in order to avoid the page goes to the top everytime.
*/
var $tabs = $('.c-tablist__tabs a');
$tabs.on( "click", function(e) {
// console.log($(this).text());
// e.preventDefault();
// $('html,body').animate({
// scrollTop: $(this).offset().top - 10
// }, 500);
});
})(jQuery);
No notes defined.