<header class="c-header c-header--chinese">

    <div class="c-header__inner">

        <div class="c-header_orientation">
            <div class="c-orientation ">
                <div class="c-orientation__inner">

                    <div class="c-orientation__utilities">

                        <div class="c-languages__dropdown">
                            <input type="checkbox" id="checkbox_language_toggle" class="c-languages__switch">
                            <label for="checkbox_language_toggle">
                                zh
                                <svg class="c-icon c-icon--24 chevron--up">
                                    <use xlink:href="#ic_arrow_drop_up_black_24px"></use>
                                </svg> <svg class="c-icon c-icon--24 chevron--down">
                                    <use xlink:href="#ic_arrow_drop_down_black_24px"></use>
                                </svg>
                                <ul class="c-languages__dropdown-content" aria-label="Seleziona la lingua del sito">
                                    <li>
                                        <a href="#" aria-label="Inglese">eng</a>
                                    </li>
                                    <li>
                                        <a href="#" aria-label="Italiano">ita</a>
                                    </li>
                                </ul>
                            </label>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="c-header__toolbar">
            <div class="c-toolbar">

                <div class="c-toolbar__inner">
                    <div class="c-toolbar__left">
                        <a href="" class="c-toolbar__logo">
                            <img src="../../images/svgs/logo-adb.svg" class="c-logo" alt="Homepage aeroporto di Bologna">
                        </a>
                        <a href="" class="c-toolbar__logo c-toolbar__logo--innovability">
                            <img src="../../images/svgs/logo-innovability.svg" class="c-logo c-logo--innovability" alt="Homepage aeroporto di Bologna">
                        </a>
                    </div>

                    <div class="c-toolbar__center" aria-hidden="true">
                        <div class="c-header__shortcuts" aria-hidden="true">
                            <nav class="c-navigation-shortcuts">
                                <ul>
                                    <li class="has-dropdown is-active">
                                        <div class="c-navigation-shortcuts__dropdown o-collapsible">
                                            <div class="o-collapsible__title js-collapsible-title ">
                                                <strong>Voli</strong>
                                                <span>Orari, destinazioni e info</span>
                                            </div>

                                            <div class="c-navigation-shortcuts__megamenu">
                                                <div class="c-megamenu">
                                                    <div class="c-megamenu__card">
                                                        <div class="c-megamenu__card-overlay">
                                                        </div>
                                                        <div class="c-megamenu__card-content">
                                                            <p class="c-megamenu__card-title">Vola da Bologna</p>
                                                            <div class="c-megamenu__card-abstract">

                                                                Cerca il tuo volo o vai alla sezione <a href="#">Arrivi e partenze</a>
                                                            </div>

                                                            <div class="c-megamenu__card-form c-form">
                                                                <div class="c-megamenu__card-input">
                                                                    <label for="flight-label" class="" aria-label="">

                                                                        Inserisci numero volo <span class="required-marker" aria-hidden="true">*</span>

                                                                        <input id="flight-id" type="text" class="" placeholder="" value="" aria-describedby="flight-note">

                                                                        <p class="c-field__note " id="flight-note">
                                                                            Es. AZ234 oppure Parigi
                                                                        </p>

                                                                    </label>

                                                                </div>
                                                                <button type="button" class="c-button ">

                                                                    Cerca

                                                                </button>
                                                            </div>

                                                        </div>
                                                    </div>
                                                    <div class="c-megamenu__main">
                                                        <div class="c-megamenu__lists">
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Vola da Bologna</strong>
                                                                <li><a href="/components/preview/page-arrivals-departures--default">Arrivi e partenze</a></li>
                                                                <li><a href="/components/preview/page-flights-buy-flight">Acquisto Volo</a></li>
                                                                <li><a href="/components/preview/page-flights-landing-destinations">Destinazioni</a></li>
                                                                <li><a href="/components/preview/page-flight-companies">Le nostre compagnie aeree</a></li>
                                                                <li><a href="/components/preview/page-tickets-phone">Biglietteria telefonica</a></li>

                                                            </ul>
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Prepara il tuo viaggio</strong>
                                                                <li><a href="/components/preview/page-routes-luggage">Bagagli</a></li>
                                                                <li><a href="/components/preview/page-routes-documents">Documenti</a></li>
                                                                <li><a href="#">Fast Track</a></li>
                                                                <li><a href="#">Viaggi e Covid-19</a></li>
                                                                <li><a href="/components/preview/page-parkings-home">Prenota un parcheggio</a></li>

                                                            </ul>
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Controlli in aeroporto</strong>
                                                                <li><a href="#">Controlli in partenza</a></li>
                                                                <li><a href="#">Controlli in arrivo</a></li>

                                                            </ul>

                                                        </div>
                                                        <div class="c-megamenu__crossell">
                                                            <p>Vola da Bologna e <a href="#">acquista online il tuo parcheggio</a> ad un prezzo scontato </p>
                                                        </div>
                                                    </div>

                                                    <button type="button" class="c-navigation-shortcuts__closemegamenu js-closeMegaMenu" aria-label="Chiudi la guida del passeggero">
                                                        <svg class="c-icon c-icon--32">
                                                            <use xlink:href="#ic_close_black_24px"></use>
                                                        </svg> </button>
                                                </div>
                                                <div class="c-megamenu__overlay"></div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="has-dropdown ">
                                        <div class="c-navigation-shortcuts__dropdown o-collapsible">
                                            <div class="o-collapsible__title js-collapsible-title ">
                                                <strong>Parcheggi</strong>
                                                <span>Soste brevi e lunghe</span>
                                            </div>

                                            <div class="c-navigation-shortcuts__megamenu">
                                                <div class="c-megamenu">
                                                    <div class="c-megamenu__card">
                                                        <div class="c-megamenu__card-overlay">
                                                        </div>
                                                        <div class="c-megamenu__card-content">
                                                            <p class="c-megamenu__card-title">Parcheggia in aeroporto:</p>
                                                            <div class="c-megamenu__card-abstract">

                                                                Qualità e sicurezza al miglior prezzo
                                                            </div>

                                                            <a href="#" class="c-link c-link--primary">
                                                                <span>Acquista ora</span>
                                                                <svg class="svg-24">
                                                                    <use xlink:href="#ic_chevron_right_black_24px"></use>
                                                                </svg></a>
                                                        </div>
                                                    </div>
                                                    <div class="c-megamenu__main">
                                                        <div class="c-megamenu__lists">
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Parcheggia per volare</strong>
                                                                <li><a href="/components/preview/page-parkings-home">Acquista parcheggi</a></li>
                                                                <li><a href="/components/preview/page-meet-greet">Soste brevi</a></li>
                                                                <li><a href="/components/preview/page-where-to-pay">Come e dove pagare</a></li>
                                                                <li><a href="/components/preview/page-rates-conventions">Tariffe e convenzioni</a></li>
                                                                <li><a href="/components/preview/page-home-assistenze">Passeggeri a ridotta mobilità</a></li>

                                                            </ul>
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Parcheggia e raggiungi la città</strong>
                                                                <li><a href="#">Park &amp; Mex</a></li>
                                                                <li><a href="/components/preview/page-transports-mex">Marconi Express</a></li>

                                                            </ul>

                                                        </div>
                                                        <div class="c-megamenu__crossell">
                                                            <p>Fino al 30% di sconto su tariffe e ingressi Vip Lounge <a href="#">acquistando online il tuo parcheggio</a></p>
                                                        </div>
                                                    </div>

                                                    <button type="button" class="c-navigation-shortcuts__closemegamenu js-closeMegaMenu" aria-label="Chiudi la guida del passeggero">
                                                        <svg class="c-icon c-icon--32">
                                                            <use xlink:href="#ic_close_black_24px"></use>
                                                        </svg> </button>
                                                </div>
                                                <div class="c-megamenu__overlay"></div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="has-dropdown ">
                                        <div class="c-navigation-shortcuts__dropdown o-collapsible">
                                            <div class="o-collapsible__title js-collapsible-title ">
                                                <strong>In aeroporto</strong>
                                                <span>Lounge, shopping e servizi</span>
                                            </div>

                                            <div class="c-navigation-shortcuts__megamenu">
                                                <div class="c-megamenu">
                                                    <div class="c-megamenu__card">
                                                        <div class="c-megamenu__card-overlay">
                                                        </div>
                                                        <div class="c-megamenu__card-content">
                                                            <p class="c-megamenu__card-title">MBL Lounge per partire rilassati</p>
                                                            <div class="c-megamenu__card-abstract">

                                                                Area relax e ristoro, wifi, fast-track dedicato e parcheggi a tariffe scontate
                                                            </div>

                                                            <a href="/components/preview/page-lounge" class="c-link c-link--primary">
                                                                <span>Prenota VIP Lounge</span>
                                                                <svg class="svg-24">
                                                                    <use xlink:href="#ic_chevron_right_black_24px"></use>
                                                                </svg></a>
                                                        </div>
                                                    </div>
                                                    <div class="c-megamenu__main">
                                                        <div class="c-megamenu__lists">
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Lounge e Servizi Premium</strong>
                                                                <li><a href="/components/preview/page-lounge">MBL VIP Lounge</a></li>
                                                                <li><a href="/components/preview/page-youfirst">Youfirst</a></li>
                                                                <li><a href="/components/preview/page-area-meeting">Meeting area</a></li>
                                                                <li><a href="/components/preview/page-fitness">Palestre</a></li>

                                                            </ul>
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Negozi e Ristoranti</strong>
                                                                <li><a href="/components/preview/page-shopping-listing">Fashion &amp; Style</a></li>
                                                                <li><a href="/components/preview/page-shopping-listing">General stores</a></li>
                                                                <li><a href="/components/preview/page-shopping-listing">Bar</a></li>
                                                                <li><a href="/components/preview/page-shopping-listing">Ristoranti</a></li>

                                                            </ul>
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Servizi</strong>
                                                                <li><a href="/components/preview/page-home-customer-care">Bagagli Smarriti</a></li>
                                                                <li><a href="/components/preview/page-home-customer-care">Cambio valuta</a></li>
                                                                <li><a href="/components/preview/page-home-customer-care">Tutti i servizi al passeggero</a></li>

                                                            </ul>

                                                        </div>
                                                        <div class="c-megamenu__crossell">
                                                            <p><a href="#">Acquista online Ingressi Vip Lounge</a> e avrai tariffe deicate per il tuo parcheggio</p>
                                                        </div>
                                                    </div>

                                                    <button type="button" class="c-navigation-shortcuts__closemegamenu js-closeMegaMenu" aria-label="Chiudi la guida del passeggero">
                                                        <svg class="c-icon c-icon--32">
                                                            <use xlink:href="#ic_close_black_24px"></use>
                                                        </svg> </button>
                                                </div>
                                                <div class="c-megamenu__overlay"></div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="has-dropdown ">
                                        <div class="c-navigation-shortcuts__dropdown o-collapsible">
                                            <div class="o-collapsible__title js-collapsible-title ">
                                                <strong>Da e per l’aeroporto</strong>
                                                <span>Trasporti pubblici e auto</span>
                                            </div>

                                            <div class="c-navigation-shortcuts__megamenu">
                                                <div class="c-megamenu">
                                                    <div class="c-megamenu__card">
                                                        <div class="c-megamenu__card-overlay">
                                                        </div>
                                                        <div class="c-megamenu__card-content">
                                                            <p class="c-megamenu__card-title">Raggiungi la città in una manciata di minuti</p>
                                                            <div class="c-megamenu__card-abstract">

                                                            </div>

                                                            <a href="#" class="c-link c-link--primary">
                                                                <span>Scopri</span>
                                                                <svg class="svg-24">
                                                                    <use xlink:href="#ic_chevron_right_black_24px"></use>
                                                                </svg></a>
                                                        </div>
                                                    </div>
                                                    <div class="c-megamenu__main">
                                                        <div class="c-megamenu__lists">
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Trasporti pubblici da e per BLQ</strong>
                                                                <li><a href="/components/preview/page-transports-bus">Bus</a></li>
                                                                <li><a href="/components/preview/page-transports-taxi">Taxi</a></li>
                                                                <li><a href="/components/preview/page-transports-mex">Navetta Marconi Express</a></li>
                                                                <li><a href="/components/preview/page-transports-train">Treni</a></li>

                                                            </ul>
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Auto e trasporti privati</strong>
                                                                <li><a href="/components/preview/page-transports-car">Arrivare con l’auto</a></li>
                                                                <li><a href="/components/preview/page-transports-rent-car">Noleggio auto</a></li>
                                                                <li><a href="/components/preview/page-transports-rent-car">Noleggio con conducente</a></li>

                                                            </ul>

                                                        </div>
                                                    </div>

                                                    <button type="button" class="c-navigation-shortcuts__closemegamenu js-closeMegaMenu" aria-label="Chiudi la guida del passeggero">
                                                        <svg class="c-icon c-icon--32">
                                                            <use xlink:href="#ic_close_black_24px"></use>
                                                        </svg> </button>
                                                </div>
                                                <div class="c-megamenu__overlay"></div>
                                            </div>
                                        </div>
                                    </li>
                                    <li class="has-dropdown ">
                                        <div class="c-navigation-shortcuts__dropdown o-collapsible">
                                            <div class="o-collapsible__title js-collapsible-title ">
                                                <strong>Necessità particolari</strong>
                                                <span>Accessibilità, Famiglie, Animali</span>
                                            </div>

                                            <div class="c-navigation-shortcuts__megamenu">
                                                <div class="c-megamenu">
                                                    <div class="c-megamenu__card">
                                                        <div class="c-megamenu__card-overlay">
                                                        </div>
                                                        <div class="c-megamenu__card-content">
                                                            <p class="c-megamenu__card-title">Siamo a tua disposizione</p>
                                                            <div class="c-megamenu__card-abstract">

                                                            </div>

                                                            <a href="#" class="c-link c-link--primary">
                                                                <span>Hai bisogno di aiuto?</span>
                                                                <svg class="svg-24">
                                                                    <use xlink:href="#ic_chevron_right_black_24px"></use>
                                                                </svg></a>
                                                        </div>
                                                    </div>
                                                    <div class="c-megamenu__main">
                                                        <div class="c-megamenu__lists">
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Assistenze speciali</strong>
                                                                <li><a href="/components/preview/page-routes-prm">Modalità di richiesta assistenza</a></li>
                                                                <li><a href="/components/preview/page-routes-prm-airport">Arrivo in aeroporto</a></li>
                                                                <li><a href="/components/preview/page-routes-prm-services">Servizi dedicati</a></li>
                                                                <li><a href="/components/preview/page-routes-prm-rights">Diritti e qualità del servizio</a></li>
                                                                <li><a href="/components/preview/page-home-assistenze">Autismo</a></li>
                                                                <li><a href="/components/preview/page-home-assistenze">Sordità - Servizio Tellis</a></li>

                                                            </ul>
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Famiglie e minori</strong>
                                                                <li><a href="/components/preview/page-home-assistenze">In aeroporto</a></li>
                                                                <li><a href="/components/preview/page-home-assistenze">Minori che viaggiano da soli</a></li>

                                                            </ul>
                                                            <ul>
                                                                <strong class="c-megamenu__listtitle">Animali al seguito</strong>
                                                                <li><a href="/components/preview/page-routes-animals">Regole per il trasporto</a></li>
                                                                <li><a href="/components/preview/page-routes-animals-ue">Paesi U.E.</a></li>
                                                                <li><a href="/components/preview/page-routes-animals-xue">Paesi Extra U.E.</a></li>

                                                            </ul>

                                                        </div>
                                                    </div>

                                                    <button type="button" class="c-navigation-shortcuts__closemegamenu js-closeMegaMenu" aria-label="Chiudi la guida del passeggero">
                                                        <svg class="c-icon c-icon--32">
                                                            <use xlink:href="#ic_close_black_24px"></use>
                                                        </svg> </button>
                                                </div>
                                                <div class="c-megamenu__overlay"></div>
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </nav>
                        </div>
                    </div>

                    <div class="c-toolbar__right">

                        <a class="c-toolbar__assistance" href="../preview/page-home-assistenze.html">
                            <span class="u-visuallyhidden">Assistenze speciali</span>
                            <img src="../../images/svgs/icon_ special_assistance_24px.svg" class="prm-icon" alt="">
                        </a>

                        <button type="" class="c-button ">

                        </button>
                        <div class="c-notifications ">

                            <button type="button" class="c-notifications__button has-indicator js-toggleNotificationsBtn" aria-expanded="false" aria-label="Notifiche" aria-controls="aria-notifications">
                                <svg class="c-icon c-icon--24">
                                    <use xlink:href="#ic_notifications_active_black_24px"></use>
                                </svg>
                                <p class="c-notifications__indicator" aria-hidden="true">2</p>
                            </button>

                            <div class="c-notifications__box is-narrow has-indicator js-notificationsBox" aria-live="polite" id="aria-notifications">

                                <div class="c-notifications__head">
                                    <div class="c-notifications__title">
                                        Centro notifiche
                                    </div>
                                    <button type="button" class="c-notifications__closeBtn js-toggleNotificationsBtn" aria-expanded="false" aria-label="Chiudi" aria-controls="aria-notifications">
                                        Chiudi <svg class="c-icon c-icon--16">
                                            <use xlink:href="#ic_close_black_24px"></use>
                                        </svg>
                                    </button>
                                </div>

                                <ul class="c-notifications__list">
                                    <li class="important not-read">
                                        <span class="c-notifications__title">Lorem ipsum dolor sit amet</span>
                                        <p><strong>Prevista forte nevicata il 5 Dicembre</strong> dalle ore 10:00 alle ore 17:00. Parti prima e arriva per tempo in aeroporto.</p>
                                        <a class="c-notifications__link" href="#">></a>
                                    </li>
                                    <li class="not-read">
                                        <span class="c-notifications__title"></span>
                                        <p><strong>Prevista forte nevicata il 5 Dicembre</strong> dalle ore 10:00 alle ore 17:00. Parti prima e arriva per tempo in aeroporto.</p>
                                        <a class="c-notifications__link" href="#">></a>
                                    </li>
                                    <li class="">
                                        <span class="c-notifications__title"></span>
                                        <p><strong>Prevista forte nevicata il 5 Dicembre</strong> dalle ore 10:00 alle ore 17:00. Parti prima e arriva per tempo in aeroporto.</p>
                                        <p>Prevista forte nevicata il 5 Dicembre dalle ore 10:00 alle ore 17:00. Parti prima e arriva per tempo in aeroporto.</p>
                                        <a class="c-notifications__link" href="#">></a>
                                    </li>
                                    <li class="">
                                        <span class="c-notifications__title"></span>
                                        <p><strong>Prevista forte nevicata il 5 Dicembre</strong> dalle ore 10:00 alle ore 17:00. Parti prima e arriva per tempo in aeroporto.</p>
                                        <a class="c-notifications__link" href="#">></a>
                                    </li>
                                    <li class="">
                                        <span class="c-notifications__title"></span>
                                        <p><strong>Prevista forte nevicata il 5 Dicembre</strong> dalle ore 10:00 alle ore 17:00. Parti prima e arriva per tempo in aeroporto.</p>
                                        <a class="c-notifications__link" href="#">></a>
                                    </li>
                                </ul>

                            </div>

                        </div>
                        <div class="c-header__switch c-toolbar__icon c-toolbar__switch is-clickable">
                            <div data-menu-component class='c-navigation-switch'>
                                <input type='checkbox' role='button' aria-haspopup='true' id='toggle-extended-nav' class='u-visuallyhidden' aria-hidden='true' />
                                <label for='toggle-extended-nav' data-opens-menu aria-hidden='true'>
                                    <span class='u-visuallyhidden expanded-text'>
                                        Chiudi menù
                                    </span>
                                    <span class='u-visuallyhidden collapsed-text'>
                                        Apri menù
                                    </span>
                                </label>
                            </div>
                        </div>

                    </div>
                </div>

            </div>

            <div class="c-dialog c-dialog--search js-fr-dialogmodal " id="dialog-search">
                <div class="js-fr-dialogmodal-modal">
                    <div role="document">

                        <div class="c-expanded-search ">

                            <form class="c-expanded-search__searchWrapper c-form">

                                <label for="search-field" class="  has-button" aria-label="">
                                    Cerca nel sito
                                    <input id="search-field" type="text" class="js-combobox " placeholder="" value="" aria-describedby="search-field-note" list="search-destinations" 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">
                                    <button type="submit" class="c-button c-button--submit c-button--searchIcon " aria-label="Avvia la ricerca">
                                        <svg class="c-icon c-icon--18">
                                            <use xlink:href="#ic_search_black_24px"></use>
                                        </svg> </button>
                                    <datalist id="search-destinations">
                                        <option value="Check in A">
                                        <option value="Check in B">
                                        <option value="Check in C">
                                        <option value="Accettazione">
                                        <option value="Cafè">
                                        <option value="Bagagli">
                                        <option value="Bar centrale">
                                    </datalist>
                                    <p class="c-field__note " id="search-field-note">
                                        Scrivi ciò che vuoi cercare es: <strong>arrivi</strong>, <strong>bagagli</strong>, <strong>VIP lounge</strong>, etc &hellip;
                                    </p>
                                </label>
                                <p class="c-expanded-search__search-flight">
                                    <a href="../preview/page-arrivals-departures--default.html">Stai cercando un volo?→</a>
                                </p>

                                <div class="c-search-suggestions">

                                    <h3>Potrebbero esserti utili</h3>

                                    <ul class="c-search-suggestions__list">

                                        <li class="c-search-suggestions__item">
                                            <a href="#">Ultimi aggiornamenti covid <span aria-hidden="true">&#8594;</span></a>
                                        </li>
                                        <li class="c-search-suggestions__item">
                                            <a href="#">Parcheggia in aeroporto <span aria-hidden="true">&#8594;</span></a>
                                        </li>
                                        <li class="c-search-suggestions__item">
                                            <a href="#">Contatti e supporto <span aria-hidden="true">&#8594;</span></a>
                                        </li>
                                        <li class="c-search-suggestions__item">
                                            <a href="#">Fast track <span aria-hidden="true">&#8594;</span></a>
                                        </li>
                                    </ul>

                                </div>

                            </form>

                            <button type="button" class="c-expanded-search__close js-fr-dialogmodal-close" aria-label="Chiudi la modale">
                                Chiudi
                                <svg class="c-icon c-icon--18">
                                    <use xlink:href="#ic_close_black_24px"></use>
                                </svg> </button>

                        </div>

                    </div>
                </div>
            </div>

        </div>

    </div>

    <div role="menu" data-menu-origin="top" class="c-header__primary-navigation">
        <nav class="c-primary-navigation">

            <ul class="c-site-areas c-primary-navigation__areas" aria-hidden="false">
                <li>
                    <a href="/components/preview/page-home-travel--default.html" class="is-active">Viaggiare</a>
                </li>

                <li>
                    <a href="/components/preview/page-society-home.html">Società</a>
                </li>

                <li>
                    <a href="/components/preview/page-investor-home.html">Investor relations</a>
                </li>

                <li>
                    <a href="/components/preview/papage-innovability-home.html">Innovability</a>
                </li>

            </ul>

            <ul class="c-primary-navigation__biz">

                <li>
                    <div class="c-primary-navigation__accordion o-collapsible">
                        <p class="c-primary-navigation__toggle o-collapsible__title js-collapsible-title">
                            <strong>Voli</strong>
                            <span>Orari, destinazioni e info</span>
                        </p>
                        <ul class="sub-level">
                            <p class="sub-title">Vola da Bologna</p>
                            <li>
                                <a href="/components/preview/page-arrivals-departures--default">Arrivi e partenze</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-flights-buy-flight">Acquisto Volo</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-flights-landing-destinations">Destinazioni</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-flight-companies">Le nostre compagnie aeree</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-tickets-phone">Biglietteria telefonica</a>
                            </li>
                        </ul>
                        <ul class="sub-level">
                            <p class="sub-title">Prepara il tuo viaggio</p>
                            <li>
                                <a href="/components/preview/page-routes-luggage">Bagagli</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-routes-documents">Documenti</a>
                            </li>
                            <li>
                                <a href="#">Fast Track</a>
                            </li>
                            <li>
                                <a href="#">Viaggi e Covid-19</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-parkings-home">Prenota un parcheggio</a>
                            </li>
                        </ul>
                        <ul class="sub-level">
                            <p class="sub-title">Controlli in aeroporto</p>
                            <li>
                                <a href="#">Controlli in partenza</a>
                            </li>
                            <li>
                                <a href="#">Controlli in arrivo</a>
                            </li>
                        </ul>
                    </div>
                </li>

                <li>
                    <div class="c-primary-navigation__accordion o-collapsible">
                        <p class="c-primary-navigation__toggle o-collapsible__title js-collapsible-title">
                            <strong>Parcheggi</strong>
                            <span>Soste brevi e lunghe</span>
                        </p>
                        <ul class="sub-level">
                            <p class="sub-title">Parcheggia per volare</p>
                            <li>
                                <a href="/components/preview/page-parkings-home">Acquista parcheggi</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-meet-greet">Soste brevi</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-where-to-pay">Come e dove pagare</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-rates-conventions">Tariffe e convenzioni</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-home-assistenze">Passeggeri a ridotta mobilità</a>
                            </li>
                        </ul>
                        <ul class="sub-level">
                            <p class="sub-title">Parcheggia e raggiungi la città</p>
                            <li>
                                <a href="#">Park &amp; Mex</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-transports-mex">Marconi Express</a>
                            </li>
                        </ul>
                    </div>
                </li>

                <li>
                    <div class="c-primary-navigation__accordion o-collapsible">
                        <p class="c-primary-navigation__toggle o-collapsible__title js-collapsible-title">
                            <strong>In aeroporto</strong>
                            <span>Lounge, shopping e servizi</span>
                        </p>
                        <ul class="sub-level">
                            <p class="sub-title">Lounge e Servizi Premium</p>
                            <li>
                                <a href="/components/preview/page-lounge">MBL VIP Lounge</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-youfirst">Youfirst</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-area-meeting">Meeting area</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-fitness">Palestre</a>
                            </li>
                        </ul>
                        <ul class="sub-level">
                            <p class="sub-title">Negozi e Ristoranti</p>
                            <li>
                                <a href="/components/preview/page-shopping-listing">Fashion &amp; Style</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-shopping-listing">General stores</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-shopping-listing">Bar</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-shopping-listing">Ristoranti</a>
                            </li>
                        </ul>
                        <ul class="sub-level">
                            <p class="sub-title">Servizi</p>
                            <li>
                                <a href="/components/preview/page-home-customer-care">Bagagli Smarriti</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-home-customer-care">Cambio valuta</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-home-customer-care">Tutti i servizi al passeggero</a>
                            </li>
                        </ul>
                    </div>
                </li>

                <li>
                    <div class="c-primary-navigation__accordion o-collapsible">
                        <p class="c-primary-navigation__toggle o-collapsible__title js-collapsible-title">
                            <strong>Da e per l’aeroporto</strong>
                            <span>Trasporti pubblici e auto</span>
                        </p>
                        <ul class="sub-level">
                            <p class="sub-title">Trasporti pubblici da e per BLQ</p>
                            <li>
                                <a href="/components/preview/page-transports-bus">Bus</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-transports-taxi">Taxi</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-transports-mex">Navetta Marconi Express</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-transports-train">Treni</a>
                            </li>
                        </ul>
                        <ul class="sub-level">
                            <p class="sub-title">Auto e trasporti privati</p>
                            <li>
                                <a href="/components/preview/page-transports-car">Arrivare con l’auto</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-transports-rent-car">Noleggio auto</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-transports-rent-car">Noleggio con conducente</a>
                            </li>
                        </ul>
                    </div>
                </li>

                <li>
                    <div class="c-primary-navigation__accordion o-collapsible">
                        <p class="c-primary-navigation__toggle o-collapsible__title js-collapsible-title">
                            <strong>Necessità particolari</strong>
                            <span>Accessibilità, Famiglie, Animali</span>
                        </p>
                        <ul class="sub-level">
                            <p class="sub-title">Assistenze speciali</p>
                            <li>
                                <a href="/components/preview/page-routes-prm">Modalità di richiesta assistenza</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-routes-prm-airport">Arrivo in aeroporto</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-routes-prm-services">Servizi dedicati</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-routes-prm-rights">Diritti e qualità del servizio</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-home-assistenze">Autismo</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-home-assistenze">Sordità - Servizio Tellis</a>
                            </li>
                        </ul>
                        <ul class="sub-level">
                            <p class="sub-title">Famiglie e minori</p>
                            <li>
                                <a href="/components/preview/page-home-assistenze">In aeroporto</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-home-assistenze">Minori che viaggiano da soli</a>
                            </li>
                        </ul>
                        <ul class="sub-level">
                            <p class="sub-title">Animali al seguito</p>
                            <li>
                                <a href="/components/preview/page-routes-animals">Regole per il trasporto</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-routes-animals-ue">Paesi U.E.</a>
                            </li>
                            <li>
                                <a href="/components/preview/page-routes-animals-xue">Paesi Extra U.E.</a>
                            </li>
                        </ul>
                    </div>
                </li>

            </ul>

            <div class="c-primary-navigation__remote">
                <a href="#">
                    <svg class="c-icon c-icon--24">
                        <use xlink:href="#ic_flight_takeoff_black_24px"></use>
                    </svg> <span>Arrivi e partenze</span>
                </a>
                <a href="#">
                    <svg class="c-icon c-icon--24">
                        <use xlink:href="#ic-parking-sign-24px"></use>
                    </svg> <span>Prenota parcheggio</span>
                </a>
                <a href="#">
                    <svg class="c-icon c-icon--24">
                        <use xlink:href="#ic_weekend_black_24px"></use>
                    </svg> <span>Prenota LOUNGE</span>
                </a>
                <a href="#">
                    <svg class="c-icon c-icon--24">
                        <use xlink:href="#ic-marconi-express-24px"></use>
                    </svg> <span>Treni per centro città</span>
                </a>
                <a href="#">
                    <svg class="c-icon c-icon--24">
                        <use xlink:href="#ic_help_black_24px"></use>
                    </svg> <span>Hai bisogno di aiuto?</span>
                </a>
            </div>

            <div class="c-primary-navigation__utils">
                <ul class="c-languages" aria-label="Seleziona la lingua del sito">
                    <li>
                        <a href="#" aria-label="ita">
                            <img src="../../images/svgs/flag_it.svg" class="c-language__img" alt="Lingua italiana" aria-hidden="true" />
                            ita
                        </a>
                    </li>
                    <li>
                        <a href="#" aria-label="eng">
                            <img src="../../images/svgs/flag_en.svg" class="c-language__img" alt="English language" aria-hidden="true" />
                            eng
                        </a>
                    </li>
                </ul>

                <a class="c-primary-navigation__assistance " href="../preview/page-home-assistenze.html">
                    Lavora con noi
                </a>
            </div>

        </nav>
    </div>

</header>
<div class="c-slim-alert">
    <div class="c-slim-alert__inner">
        <div class="c-slim-alert__content">
            <div class="c-slim-alert__label">
                <img src="../../images/svgs/stk_covid.svg" alt="Accedi alla MyBLQ" aria-hidden="true" width="24">
                <strong>Covid 19:</strong>
            </div>
            <div>
                <a href="#">
                    Ultimi aggiornamenti
                </a>
            </div>
            <div>
                <a href="#">
                    Approfondimenti
                </a>
            </div>
            <div class="c-slim-alert__notifications">
                <div class="c-notifications ">

                    <button type="button" class="c-notifications__button has-indicator js-toggleNotificationsBtn" aria-expanded="false" aria-label="Notifiche" aria-controls="aria-notifications">
                        <svg class="c-icon c-icon--24">
                            <use xlink:href="#ic_notifications_active_black_24px"></use>
                        </svg>
                        <p class="c-notifications__indicator" aria-hidden="true">2</p>
                    </button>

                    <div class="c-notifications__box is-narrow has-indicator js-notificationsBox" aria-live="polite" id="aria-notifications">

                        <div class="c-notifications__head">
                            <div class="c-notifications__title">
                                Centro notifiche
                            </div>
                            <button type="button" class="c-notifications__closeBtn js-toggleNotificationsBtn" aria-expanded="false" aria-label="Chiudi" aria-controls="aria-notifications">
                                Chiudi <svg class="c-icon c-icon--16">
                                    <use xlink:href="#ic_close_black_24px"></use>
                                </svg>
                            </button>
                        </div>

                        <ul class="c-notifications__list">
                            <li class="important not-read">
                                <span class="c-notifications__title">Lorem ipsum dolor sit amet</span>
                                <p><strong>Prevista forte nevicata il 5 Dicembre</strong> dalle ore 10:00 alle ore 17:00. Parti prima e arriva per tempo in aeroporto.</p>
                                <a class="c-notifications__link" href="#">></a>
                            </li>
                            <li class="not-read">
                                <span class="c-notifications__title"></span>
                                <p><strong>Prevista forte nevicata il 5 Dicembre</strong> dalle ore 10:00 alle ore 17:00. Parti prima e arriva per tempo in aeroporto.</p>
                                <a class="c-notifications__link" href="#">></a>
                            </li>
                            <li class="">
                                <span class="c-notifications__title"></span>
                                <p><strong>Prevista forte nevicata il 5 Dicembre</strong> dalle ore 10:00 alle ore 17:00. Parti prima e arriva per tempo in aeroporto.</p>
                                <p>Prevista forte nevicata il 5 Dicembre dalle ore 10:00 alle ore 17:00. Parti prima e arriva per tempo in aeroporto.</p>
                                <a class="c-notifications__link" href="#">></a>
                            </li>
                            <li class="">
                                <span class="c-notifications__title"></span>
                                <p><strong>Prevista forte nevicata il 5 Dicembre</strong> dalle ore 10:00 alle ore 17:00. Parti prima e arriva per tempo in aeroporto.</p>
                                <a class="c-notifications__link" href="#">></a>
                            </li>
                            <li class="">
                                <span class="c-notifications__title"></span>
                                <p><strong>Prevista forte nevicata il 5 Dicembre</strong> dalle ore 10:00 alle ore 17:00. Parti prima e arriva per tempo in aeroporto.</p>
                                <a class="c-notifications__link" href="#">></a>
                            </li>
                        </ul>

                    </div>

                </div>
            </div>
        </div>
    </div>
</div>
<div class='c-overlay'></div>
<header class="c-header {{modifier}}">

  <div class="c-header__inner">
  
    <div class="c-header_orientation">
      {{> @orientation--chinese dropdown-toolbar merge=true }}
    </div>
  
    <div class="c-header__toolbar">
      {{> @toolbar--chinese dropdown-header merge=true }}
    </div>
  
  </div>

  <div role="menu" data-menu-origin="top" class="c-header__primary-navigation">
    {{ render "@primary-navigation" shortcuts merge=true }}
  </div>
  
</header>
{{ render "@slim-alert" }}
<div class='c-overlay'></div>
{
  "name": "default",
  "dropdown-toolbar": {
    "site-areas": {
      "areas": [
        {
          "text": "Viaggiare",
          "class": "is-active",
          "link": "/components/preview/page-home-travel--default"
        },
        {
          "text": "Società",
          "link": "/components/preview/page-society-home"
        },
        {
          "text": "Investor relations",
          "link": "/components/preview/page-investor-home"
        },
        {
          "text": "Innovability",
          "link": "/components/preview/page-innovability-home"
        }
      ],
      "work-with-us": true
    },
    "dropdown-orientation": {
      "main-language": {
        "text": "ita",
        "url": "#",
        "aria-label": "Italiano"
      },
      "sub-languages": [
        {
          "text": "eng",
          "url": "#",
          "aria-label": "Inglese"
        },
        {
          "text": "zh",
          "url": "#",
          "aria-label": "Cinese"
        }
      ]
    },
    "orientation-cn": {
      "main-language": {
        "text": "zh",
        "url": "#",
        "aria-label": "Cinese"
      },
      "sub-languages": [
        {
          "text": "eng",
          "url": "#",
          "aria-label": "Inglese"
        },
        {
          "text": "ita",
          "url": "#",
          "aria-label": "Italiano"
        }
      ]
    }
  },
  "slim-alert": {
    "items": [
      {
        "anchor-text": false,
        "text": "<a href=\"#\">Lavori infrastrutturali</a>"
      }
    ]
  },
  "modifier": "c-header--chinese"
}
  • Content:
    $header-bg: secondary(soft, 100);
    
    .c-header {
      position: relative;
      background-color: $header-bg;
      z-index: $zIndex-header;
      @include shadow(medium);
    }
    
    .c-header__switch:has(input[type="checkbox"]:focus) {
      @include outline;
    }
    
    .c-header__shortcuts+.c-header__switch {
      position: absolute;
      z-index: $zIndex-hamburgerMenu;
      right: remify(8px);
      bottom: remify(-36px);
    
      @include min-screen(bp(tablet-p)) {
        position: absolute;
        overflow: hidden;
        clip: rect(0 0 0 0);
        height: 1px;
        width: 1px;
        margin: -1px;
        padding: 0;
        border: 0;
      }
    
      .c-header--chinese & {
        right: remify(8px);
        top: remify(8px);
    
        @include min-screen(bp(tablet-p)) {
          right: remify(16px);
          top: remify(24px);
        }
      }
    }
    
    .c-header__primary-navigation {
      position: relative;
    }
    
    /*------------------------------------*\
      Modifier c-header--host
    \*------------------------------------*/
    
    .c-header--host {
      @include min-screen(bp(tablet-p)) {
        // padding-bottom: remify(100px);
      }
    }
    
    /*------------------------------------*\
      Modifier c-header--stepbar
    \*------------------------------------*/
    
    // .c-header--progress {
    //   padding-bottom: remify(8px);
    // }
    
    /*------------------------------------*\
      Modifier c-header--withSub
    \*------------------------------------*/
    
    .c-header--withSub {
      .c-header__shortcuts+.c-header__switch {
        bottom: remify(-92px);
      }
    }
    
    /*------------------------------------*\
      Emergency modifier
    \*------------------------------------*/
    
    .c-header--emergency {
      background-color: primary(emergency, 120);
      color: #fff;
    
      a {
        color: #fff;
      }
    
      & .c-toolbar a,
      & .c-orientation a,
      & .c-orientation__utilities,
      & .c-orientation__utilities a,
      .c-navigation-shortcuts a {
        color: #fff;
      }
    }
    
    /*------------------------------------*
      Modifier: c-header--minimal
    *------------------------------------*/
    .c-header--minimal {
    
      .c-header__inner:has(.c-header__toolbar + *) {
        display: flex;
        align-items: center;
        justify-content: space-between;
        max-width: remify($base-page-width);
        margin-inline: auto;
      } 
    
    }
    
    /*------------------------------------*\
      overlay
    \*------------------------------------*/
    
    .c-overlay {
      position: fixed;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      background-color: rgba(0, 0, 0, .5);
      z-index: $z-Index-overlay;
      display: none;
    
      &.is-visible {
        display: block;
      }
      
    }
    
  • URL: /components/raw/header/_header.scss
  • Filesystem Path: src/views/03-organisms/header/_header.scss
  • Size: 2.4 KB

No notes defined.