UNPKG

rizzo-next

Version:

The next generation of Lonely Planet's style guide and pattern library.

566 lines (511 loc) 32.8 kB
<div hidden> <svg xmlns="http://www.w3.org/2000/svg"> <symbol id="lp-icon-cross" viewBox="0 0 32 32"> <title>cross</title> <path d="M32 1.9l-1.9-1.9-14.1 14.1-14.1-14.1-1.9 1.9 14.1 14.1-14.1 14.1 1.9 1.9 14.1-14.1 14.1 14.1 1.9-1.9-14.1-14.1z"></path> </symbol> <symbol id="lp-icon-hamburger" viewBox="0 0 32 32"> <title>hamburger</title> <path d="M0 6h32v2.6h-32v-2.6z"></path> <path d="M0 14.7h32v2.6h-32v-2.6z"></path> <path d="M0 23.4h32v2.6h-32v-2.6z"></path> </symbol> <symbol id="lp-icon-logo" viewBox="0 0 65 32"> <title>logo</title> <path d="M17.473 19.657c-1.195-0.258-1.987-0.937-2.52-2.116v2.261h-2.245v-4.264c-0.129-0.937-1.454-0.937-1.583 0v4.248h-2.245v-2.39c-0.533 1.454-1.583 2.116-3.182 2.261-1.583 0-2.649-0.791-3.311-2.116v2.261h-2.375v-9.95h2.374v4.91c0.533-1.066 1.195-1.599 2.245-1.987 1.858-0.404 3.44 0.404 4.232 2.116 0.533-1.454 1.583-2.261 3.182-2.261 1.454 0.129 2.52 0.791 2.907 2.261 0.404-1.066 1.324-1.858 2.649-2.116 1.858-0.258 3.182 0.533 3.973 2.116v-5.040h2.374v2.794h2.245v4.345c0 0.791 1.195 0.791 1.195 0v-4.377h2.245v7.575c0 0.791-0.258 1.324-0.791 1.987-0.662 0.662-1.324 0.791-2.245 0.937-1.195 0.129-1.987-0.258-2.907-0.937l1.324-1.728c0.662 0.533 1.712 0.533 2.116-0.258 0.129-0.258 0.129-0.662 0.129-1.066-1.195 1.195-3.037 0.662-3.44-0.937v1.599h-2.374v-3.053h-4.636c0.258 1.066 1.454 1.454 2.374 0.662l1.987 0.258c0.016 0.533-1.050 2.261-3.699 2.003zM6.893 16.201c0-0.791-0.662-1.454-1.454-1.454s-1.454 0.662-1.454 1.454 0.662 1.454 1.454 1.454c0.921 0 1.583-0.662 1.454-1.454zM16.681 15.797h2.907c-0.388-1.454-2.374-1.454-2.907 0z"></path> <path d="M64.572 18.995c0 0.404-1.712 1.066-2.778 0.404s-1.050-1.599-1.050-2.665h-4.765c0.533 1.324 2.116 1.195 2.649 0.533l1.987 0.404c-0.662 2.261-2.649 2.649-4.49 1.987-1.066-0.533-1.583-1.066-1.987-1.987v2.261h-2.245c0-1.454 0-2.924 0-4.377-0.129-0.937-1.583-0.937-1.583 0v4.232h-3.828v-1.324c0-0.533-0.533 1.324-1.324 1.324-1.583 0.129-2.907-0.662-3.57-2.116v2.116h-2.374v-2.132c-0.662 1.454-2.374 2.261-4.103 1.858l-0.258-0.129c0 0 0.129 2.39 0.129 3.053h-2.374v-6.235c0-2.924 3.182-4.652 5.556-2.924 0.404 0.404 0.791 0.937 1.066 1.454v-4.91h2.374v4.91c0.791-1.454 2.245-2.261 3.973-1.987 1.195 0.258 1.987 0.937 2.52 2.116 0.662-1.858 2.374-2.649 4.361-1.987 0.921 0.404 1.324 1.066 1.712 1.987 0.791-1.858 2.649-2.649 4.636-1.987 0.921 0.533 1.583 1.066 1.987 1.987v-3.715h2.245v1.454h1.454v2.116h-1.454c0 0.791-0.129 1.454 0.129 2.116 0.129 0.404 0.791 0.533 1.324 0.129v0l0.081 2.035zM37.582 16.201c0-0.791-0.662-1.454-1.454-1.454s-1.454 0.662-1.454 1.454 0.662 1.454 1.454 1.454 1.454-0.662 1.454-1.454zM46.191 16.201c0-0.791-0.662-1.454-1.454-1.454v0c-0.791 0-1.454 0.662-1.454 1.454s0.662 1.454 1.454 1.454c0.791 0 1.454-0.662 1.454-1.454zM58.757 15.668c-0.404-1.454-2.374-1.324-2.778 0h2.778z"></path> <path d="M18.797 11.42l-1.583-0.662c2.245-6.235 8.076-10.757 14.957-10.757s12.696 4.506 14.812 10.757l-1.583 0.517c-1.858-5.572-7.139-9.417-13.229-9.417s-11.387 3.99-13.374 9.562z"></path> <path d="M45.383 20.852l1.583 0.662c-2.116 6.105-7.931 10.612-14.812 10.483-6.881 0-12.696-4.377-14.812-10.483l1.583-0.517c1.858 5.443 7.139 9.287 13.229 9.287s11.387-3.86 13.229-9.433z"></path> </symbol> <symbol id="lp-icon-logo-ue" viewBox="0 0 234.46 116.98"> <title>lp foods logo</title> <path d="M265.73 157.62v-17.87h-6.52v9.69a6.11 6.11 0 0 0-5.46-3c-3.78 0-6.64 2.66-7.58 6.52-1.07-3.69-4.3-6.52-9.49-6.52s-8.45 2.86-9.51 6.59c-1.06-3.73-4.3-6.59-9.51-6.59-6.46 0-9.89 4.39-9.89 9.38s3.43 9.38 9.89 9.38c5.21 0 8.45-2.89 9.51-6.61 1.06 3.72 4.3 6.61 9.51 6.61s8.44-2.88 9.51-6.58a8.24 8.24 0 0 0 8.17 6.58 6.48 6.48 0 0 0 5.88-3.16l.14.65c.34 1.68 1.65 2.51 3.84 2.51a17.64 17.64 0 0 0 3.1-.35v-5.49c-1.21-.09-1.59-.51-1.59-1.74zm-48.07 2.06c-1.85 0-3.19-1.48-3.19-3.88s1.34-3.89 3.19-3.89 3.2 1.48 3.2 3.89-1.34 3.88-3.2 3.88zm19 0c-1.85 0-3.19-1.48-3.19-3.88s1.34-3.89 3.19-3.89 3.2 1.48 3.2 3.89-1.32 3.88-3.18 3.88zm22.56-1.85a3.68 3.68 0 0 1-3.09 1.85 3.48 3.48 0 0 1-3.57-3.78c0-2.2 1.41-4 3.3-4a3.92 3.92 0 0 1 3.36 2.68zM219 101.6l2.94-1 2.93-1a57.38 57.38 0 0 0-108.71-.09l5.85 2.23a51.35 51.35 0 0 1 97-.09m38.08 16.23a5.34 5.34 0 0 1 10.26 0zm-41 7a5.36 5.36 0 1 1 5.35-5.36 5.37 5.37 0 0 1-5.35 5.36m-31.28 0a5.36 5.36 0 1 1 5.36-5.36 5.38 5.38 0 0 1-5.36 5.36m93.05 6.38c3.63 2.64 10.15.11 10.07-1.6l-.31-7.13-.38.34a2.91 2.91 0 0 1-4.51-.84c-.81-2.41-.39-5-.39-7.56h5.18v-7.58h-5.18v-5.16h-8.18v13.15a12.84 12.84 0 0 0-7.2-7.2c-7-2.49-13.72.44-16.81 7.2a11.39 11.39 0 0 0-6.47-7.33c-6.78-2.38-13.31.44-15.66 7.33-1.87-4.33-4.56-6.6-9.19-7.87a12.83 12.83 0 0 0-14.3 7.32V96.61h-8.47v17.68a14.5 14.5 0 0 0-4-5.12c-8.68-6.3-20.1 0-20.31 10.56v22.43h8.44c0-2.26-.26-11-.26-11l.93.4c6.32 1.6 12.77-1.59 15.23-6.53v7.61h8.47V125a12.77 12.77 0 0 0 12.87 7.74c2.67.17 4.89-6.89 4.9-4.93v4.93H228l8.24-.13V117c0-3.23 5.31-3.51 5.58-.2.07 5.09.05 10.77.05 15.76h8.32v-8.13a13.33 13.33 0 0 0 7 7.15c6.71 2.18 13.71 1.11 16.33-7.07l-7.08-1.15c-1.62 2.44-7.43 3-9.28-1.88h17.07c0 4 .08 7.06 3.7 9.7m-2 3.76H278v3.84h.88V135h2.16v-.53h-5.2zm9.61 2.51c-.17.32-.29.55-.36.71a6.09 6.09 0 0 0-.32-.65l-1.56-3.1H282v4.37h.84v-3.7l1.89 3.7h.77l1.92-3.65v3.65h.85v-4.37h-1.14zm-160.46-19.2h-10.4a5.38 5.38 0 0 1 10.4 0m-51.37 6.45a5.37 5.37 0 1 1 5.36-5.36 5.37 5.37 0 0 1-5.36 5.36m57 .15l-7-1.06c-3.55 2.69-7.6 1.29-8.88-2.27h17v11.08h8.46v-5.69a7.25 7.25 0 0 0 12.33 3.34 13.07 13.07 0 0 1-.52 3.88c-1.27 3.05-5.51 3.05-7.7 1l-5 6.45a14 14 0 0 0 10.6 3.35c3.39-.34 5.55-.94 8.13-3.27a11.17 11.17 0 0 0 3-7.43v-27.52h-8.32v15.74a2.09 2.09 0 1 1-4.17 0v-15.74h-8.31v-10.1h-8.46v18.23c-2.72-5.83-7.87-8.83-14.31-7.93a12.87 12.87 0 0 0-9.72 7.93c-1.6-5.13-5.39-7.84-10.67-8.13-5.59 0-9.76 2.74-11.44 8.13-2.83-6.21-8.47-9.22-15.2-7.69a12.64 12.64 0 0 0-8.31 7.14V96.61h-8.45v36h8.47v-8.08A12.82 12.82 0 0 0 74 132.11c5.73-.34 9.4-3.05 11.71-8.13v8.62h8.19v-15.53c.32-3.39 5.47-3.49 5.78 0v15.53h8.18v-8.13a13.14 13.14 0 0 0 9.27 7.82c9.72.92 13.56-5.76 13.62-7.44" transform="translate(-53.77 -60.51)"/> <path d="M188.3 167.61A51.26 51.26 0 0 1 122 136.4l-2.94 1-2.93 1a57.24 57.24 0 0 0 54.35 39 56.61 56.61 0 0 0 20.34-3.76zM202.53 146.66c0-1.17.51-1.75 1.58-1.75a8 8 0 0 1 2.35.45V140a13 13 0 0 0-3.83-.63c-4 0-6.63 3-6.63 7.49v2h-2.24v4.91H196v11.06h6.53v-11.06h3.95v-4.91h-3.95z" transform="translate(-53.77 -60.51)"/> </symbol> <symbol id="lp-icon-search" viewBox="0 0 32 32"> <title>search</title> <path d="M32 30.2l-8.4-8.4c2-2.4 3-5.3 3-8.4 0-7.4-6-13.4-13.3-13.4s-13.3 6-13.3 13.3 6 13.3 13.3 13.3c3.1 0 6.1-1.1 8.4-3l8.4 8.4 1.9-1.8zM2.6 13.3c0-5.9 4.8-10.7 10.7-10.7s10.7 4.8 10.7 10.7c0 2.8-1.1 5.5-3 7.5-2 2.1-4.8 3.2-7.7 3.2-5.9 0-10.7-4.8-10.7-10.7z"></path> </symbol> </svg> </div> <header class="lp-global-header lp-global-header--narrow lp-global-header--no-images" role="banner"> <div class="lp-global-header__container"> <div class="lp-global-header__inner js-lp-global-header-inner"> <a class="lp-logo lp-logo--narrow" href="https://www.lonelyplanet.com"> <svg class="svg-icon svg-icon--fit" viewBox="0 0 142 72" aria-label="Lonely Planet"> <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#lp-icon-logo"></use> </svg> </a> <a class="lp-global-header__search js-lp-global-header-search" href="/search"> <svg class="svg-icon" aria-hidden="true"> <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#lp-icon-search"></use> </svg> <span class="lp-global-header__search-text">Search Lonely Planet</span> <span class="lp-global-header__search-beyond">and beyond</span> </a> <div class="lp-global-header__navigation"> <nav class="navigation navigation--narrow navigation--no-images" role="navigation"> <ul class="navigation__list"> <li class="js-nav-item navigation__item navigation__item--search js-lp-search " data-lpa-category="Destinations Next" data-lpa-action="Global Navigation Click" data-lpa-label="Search"> <a class="navigation__link " href="https://www.lonelyplanet.com/search"> Search </a> </li> <li class="js-nav-item navigation__item " data-lpa-category="Destinations Next" data-lpa-action="Global Navigation Click" data-lpa-label="Video"> <a class="navigation__link " href="https://www.lonelyplanet.com/video"> Video </a> <div class="sub-navigation"> <a class="sub-navigation-feature" href="https://www.lonelyplanet.com/video/best-in-travel-2019/v/cha/14"> <img class="sub-navigation-feature__image" src="https://lonelyplanetstatic.imgix.net/op-video-sync/assets/bit19_masthead.jpg?w&#x3D;80&amp;h&#x3D;60&amp;fit&#x3D;min" alt="Best in Travel 2019"> <div class="sub-navigation-feature__text"> <div class="sub-navigation-feature__title"> Best in Travel 2019 </div> <div class="sub-navigation-feature__subtitle"> Featured </div> </div> </a> <ul class="sub-navigation__list"> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/adventure-travel/v/cha/1"> Adventure travel </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/art-and-culture/v/cha/2"> Art and culture </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/beaches/v/cha/3"> Beaches, coasts and islands </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/explore-every-day/v/cha/4"> Explore every day </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/food-and-drink/v/cha/7"> Food and drink </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/journeys/v/cha/9"> Journeys </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/tokyo-modern-classic/v/cha/13"> Tokyo Modern | Classic </a> </li> </ul> <a class="sub-navigation__button" href="https://www.lonelyplanet.com/video"> Browse Videos <i class="icon-chevron-right" aria-hidden="true"></i> </a> </div> </li> <li class="js-nav-item navigation__item navigation__item--destinations " data-lpa-category="Destinations Next" data-lpa-action="Global Navigation Click" data-lpa-label="Destinations"> <a class="navigation__link " href="https://www.lonelyplanet.com/places"> Destinations </a> <div class="sub-navigation"> <a class="sub-navigation-feature" href="https://www.lonelyplanet.com/best-in-travel"> <img class="sub-navigation-feature__image" src="https://lonelyplanetstatic.imgix.net/marketing/2018/BIT/BIT-nav-image.jpg?w&#x3D;80&amp;h&#x3D;60&amp;fit&#x3D;min" alt="Best in Travel"> <div class="sub-navigation-feature__text"> <div class="sub-navigation-feature__title"> Best in Travel </div> <div class="sub-navigation-feature__subtitle"> Featured </div> </div> </a> <ul class="sub-navigation__list"> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/africa"> Africa </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/antarctica-1007062"> Antarctica </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/asia"> Asia </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/pacific"> Australia &amp; Pacific </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/caribbean"> Caribbean </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/central-america"> Central America </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/europe"> Europe </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/middle-east"> Middle East </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/north-america"> North America </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/south-america"> South America </a> </li> </ul> <a class="sub-navigation__button" href="https://www.lonelyplanet.com/places"> See All Countries <i class="icon-chevron-right" aria-hidden="true"></i> </a> </div> </li> <li class="js-nav-item navigation__item " data-lpa-category="Destinations Next" data-lpa-action="Global Navigation Click" data-lpa-label="Bookings"> <a class="navigation__link " href="javascript:void(0)"> Bookings </a> <div class="sub-navigation"> <ul class="sub-navigation__list"> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/travel-insurance"> Insurance </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/hotels"> Hotels </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/flights"> Flights </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/adventure-tours"> Adventure tours </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/sightseeing-tours"> Sightseeing tours </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/car-rental"> Car rental </a> </li> </ul> </div> </li> <li class="js-nav-item navigation__item navigation__item--shop js-cart-notification " data-lpa-category="Destinations Next" data-lpa-action="Global Navigation Click" data-lpa-label="Shop"> <a class="navigation__link " href="https://shop.lonelyplanet.com"> Shop </a> </li> <li class="js-nav-item navigation__item navigation__item--user navigation__item--user" data-lpa-category="Destinations Next" data-lpa-action="Global Navigation Click" data-lpa-label="Sign In"> <a class="navigation__link js-gtm-login" href="#login"> Sign In </a> </li> </ul> <nav class="mobile-navigation mobile-navigation--hidden"> <button class="mobile-navigation__close icon-close-small js-close">Close</button> <header class="mobile-navigation__header js-mobile-navigation-header"></header> <ul class="mobile-navigation__list"> <li class="js-nav-item mobile-navigation__item mobile-navigation__item--search js-lp-search" data-lpa-category="Destinations Next" data-lpa-action="Mobile Global Navigation Click" data-lpa-label="Search"> <a class="mobile-navigation__link" href="https://www.lonelyplanet.com/search"> Search </a> </li> <li class="js-nav-item mobile-navigation__item mobile-" data-lpa-category="Destinations Next" data-lpa-action="Mobile Global Navigation Click" data-lpa-label="Video"> <a class="mobile-navigation__link" href="https://www.lonelyplanet.com/video"> Video <i class="icon icon--chevron-down" aria-hidden="true"></i> </a> <div class="mobile-sub-navigation"> <a class="sub-navigation-feature" href="https://www.lonelyplanet.com/video/best-in-travel-2019/v/cha/14"> <img class="sub-navigation-feature__image" src="https://lonelyplanetstatic.imgix.net/op-video-sync/assets/bit19_masthead.jpg?w&#x3D;80&amp;h&#x3D;60&amp;fit&#x3D;min" alt="Best in Travel 2019"> <div class="sub-navigation-feature__text"> <div class="sub-navigation-feature__title"> Best in Travel 2019 </div> <div class="sub-navigation-feature__subtitle"> Featured </div> </div> </a> <ul class="sub-navigation__list"> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/adventure-travel/v/cha/1"> Adventure travel </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/art-and-culture/v/cha/2"> Art and culture </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/beaches/v/cha/3"> Beaches, coasts and islands </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/explore-every-day/v/cha/4"> Explore every day </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/food-and-drink/v/cha/7"> Food and drink </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/journeys/v/cha/9"> Journeys </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video/tokyo-modern-classic/v/cha/13"> Tokyo Modern | Classic </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/video"> Browse Videos </a> </li> </ul> </div> </li> <li class="js-nav-item mobile-navigation__item mobile-navigation__item--destinations" data-lpa-category="Destinations Next" data-lpa-action="Mobile Global Navigation Click" data-lpa-label="Destinations"> <a class="mobile-navigation__link" href="https://www.lonelyplanet.com/places"> Destinations <i class="icon icon--chevron-down" aria-hidden="true"></i> </a> <div class="mobile-sub-navigation"> <a class="sub-navigation-feature" href="https://www.lonelyplanet.com/best-in-travel"> <img class="sub-navigation-feature__image" src="https://lonelyplanetstatic.imgix.net/marketing/2018/BIT/BIT-nav-image.jpg?w&#x3D;80&amp;h&#x3D;60&amp;fit&#x3D;min" alt="Best in Travel"> <div class="sub-navigation-feature__text"> <div class="sub-navigation-feature__title"> Best in Travel </div> <div class="sub-navigation-feature__subtitle"> Featured </div> </div> </a> <ul class="sub-navigation__list"> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/africa"> Africa </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/antarctica-1007062"> Antarctica </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/asia"> Asia </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/pacific"> Australia &amp; Pacific </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/caribbean"> Caribbean </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/central-america"> Central America </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/europe"> Europe </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/middle-east"> Middle East </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/north-america"> North America </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/south-america"> South America </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/places"> See All Countries </a> </li> </ul> </div> </li> <li class="js-nav-item mobile-navigation__item mobile-" data-lpa-category="Destinations Next" data-lpa-action="Mobile Global Navigation Click" data-lpa-label="Bookings"> <a class="mobile-navigation__link" href="javascript:void(0)"> Bookings <i class="icon icon--chevron-down" aria-hidden="true"></i> </a> <div class="mobile-sub-navigation"> <ul class="sub-navigation__list"> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/travel-insurance"> Insurance </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/hotels"> Hotels </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/flights"> Flights </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/adventure-tours"> Adventure tours </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/sightseeing-tours"> Sightseeing tours </a> </li> <li class="sub-navigation__item"> <a class="sub-navigation__link" href="https://www.lonelyplanet.com/car-rental"> Car rental </a> </li> </ul> </div> </li> <li class="js-nav-item mobile-navigation__item mobile-navigation__item--shop js-cart-notification" data-lpa-category="Destinations Next" data-lpa-action="Mobile Global Navigation Click" data-lpa-label="Shop"> <a class="mobile-navigation__link" href="https://shop.lonelyplanet.com"> Shop </a> </li> <li class="js-nav-item mobile-navigation__item mobile-navigation__item--user" data-lpa-category="Destinations Next" data-lpa-action="Mobile Global Navigation Click" data-lpa-label="Sign In"> <a class="mobile-navigation__link" href="#login"> Sign In </a> </li> </ul> </nav> </nav> </div> <div class="lp-global-header__mobile lp-global-header__mobile--left"> <a class="lp-global-header__mobile-search js-lp-global-header-search" href="/search"> <svg class="svg-icon" aria-label="Search"> <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#lp-icon-search"></use> </svg> </a> </div> <div class="lp-global-header__mobile lp-global-header__mobile--right js-lp-global-header-mobile"> <a class="lp-global-header__mobile-menu js-menu" href="#footer"> <span class="menu-icon" aria-label="Menu"></span> </a> </div> </div> </div> </header>