<head>
<title>fake landing page for a travel company</title>
</head>
<div class="container">
<nav class="glass">
<ul>
<li>
<a href="#">
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 457.001 457.001" fill="#fff" role="img" aria-label="fake logo image of mountain">
<path d="M42.755 125.406c.178 2.901 2.583 5.163 5.489 5.163h71.548c2.551 0 4.768-1.754 5.354-4.237.39-1.652.587-3.307.587-4.919 0-11.769-9.575-21.344-21.344-21.344-2.759 0-5.44.523-7.946 1.536-4.61-5.051-11.195-8.036-18.177-8.036-8.98 0-17.272 5.011-21.551 12.753-8.083 2.014-14.012 9.324-14.012 17.935 0 .335.019.664.041.993l.011.156zm18.011-8.62c2.155-.124 4.039-1.497 4.815-3.511 2.01-5.207 7.106-8.705 12.685-8.705 4.883 0 9.417 2.646 11.832 6.905.78 1.376 2.116 2.35 3.665 2.672s3.162-.039 4.427-.99c1.813-1.365 3.956-2.086 6.199-2.086 5.074 0 9.308 3.673 10.179 8.5h-59.21c1.286-1.597 3.215-2.659 5.408-2.785z" />
<path d="M456.383 240.537c-1.397-2.696-4.717-3.75-7.415-2.351l-43.688 22.653-49.223-72.849c-1.205-1.783-3.334-2.701-5.462-2.346l-8.334 1.389-48.065-78.827c-.78-1.278-2.047-2.184-3.509-2.507-1.464-.323-2.992-.037-4.238.794l-7.887 5.258-18.572-22.302h35.1c2.725 0 5.038-1.994 5.439-4.689.239-1.603.351-2.972.351-4.311 0-15.958-12.982-28.94-28.94-28.94-3.243 0-6.464.553-9.516 1.621-6.606-9.072-17.148-14.531-28.574-14.531-11.432 0-21.977 5.459-28.583 14.531-3.052-1.068-6.272-1.621-9.517-1.621-15.952 0-28.931 12.982-28.931 28.94 0 1.339.111 2.708.351 4.311.401 2.695 2.715 4.689 5.439 4.689h43.535l-59.828 76.22-7.766-5.177c-2.42-1.613-5.677-1.064-7.433 1.253l-39.643 52.272-9.948-10.695c-1.723-1.852-4.487-2.29-6.698-1.062l-14.494 8.052-61.072-57.255c-2.216-2.077-5.695-1.966-7.774.251-2.077 2.216-1.965 5.697.251 7.774l64 60c1.744 1.635 4.345 1.957 6.433.795l14.235-7.908 77.066 82.847c1.41 1.515 3.553 2.111 5.538 1.542l11.041-3.154 132.763 121.753c1.057.969 2.389 1.447 3.716 1.447 1.488 0 2.971-.6 4.056-1.783 2.053-2.239 1.902-5.718-.336-7.771l-76.698-70.337 86.023-39.427 11.758 5.039c1.514.649 3.238.585 4.699-.173l108-56c2.695-1.399 3.748-4.718 2.35-7.415zM177.93 78.449c.998-8.954 8.609-15.94 17.82-15.94 3.15 0 6.142.801 8.891 2.379 1.296.744 2.841.929 4.274.512 1.436-.417 2.639-1.401 3.334-2.724 4.236-8.066 12.514-13.077 21.601-13.077 9.081 0 17.354 5.011 21.591 13.077.695 1.323 1.898 2.307 3.334 2.724 1.435.418 2.978.233 4.274-.512 2.749-1.579 5.74-2.379 8.891-2.379 9.216 0 16.832 6.986 17.83 15.94h-38.941l-9.057-10.876c-1.063-1.276-2.616-1.983-4.306-1.98-1.661.024-3.222.797-4.247 2.104l-8.44 10.752H177.93zm165.346 214.54-11.609-4.976c-1.427-.612-3.045-.592-4.459.055l-92.454 42.375-49.537-45.428c-1.41-1.293-3.393-1.76-5.229-1.235l-10.759 3.074-60.15-64.662 37.674-49.677 37.492 26.988c.98.719 2.119 1.065 3.248 1.065 1.692 0 3.362-.779 4.44-2.248 1.796-2.449 1.267-5.891-1.183-7.688l-25.417-18.639 72.336-92.155 32.15 38.605-25.925 22.468c-2.295 1.989-2.543 5.463-.554 7.758 1.088 1.255 2.619 1.898 4.158 1.898 1.277 0 2.56-.442 3.601-1.344l36.683-30.403 47.019 77.11c1.17 1.917 3.385 2.933 5.601 2.562l8.516-1.419 46.529 68.862-52.171 27.054z" />
<path d="m305.05 235.595-16.414 13.679-32.361-20.594c-2.019-1.284-4.636-1.116-6.475.415l-39 32.5c-2.333 1.945-2.648 5.413-.704 7.746 1.088 1.305 2.652 1.979 4.229 1.979 1.241 0 2.49-.418 3.519-1.275l35.914-29.929 32.361 20.594c2.02 1.284 4.636 1.116 6.475-.415l19.5-16.25c2.333-1.945 2.648-5.413.704-7.746-1.945-2.333-5.413-2.648-7.748-.704zm-78.532 137.466-51.366-25.64c-1.432-.715-3.104-.77-4.578-.153l-17.497 7.317-77.613-49.402c-2.561-1.631-5.962-.876-7.593 1.687-1.631 2.563-.876 5.962 1.687 7.593l80.037 50.945c1.519.967 3.415 1.129 5.075.434l17.824-7.454 49.112 24.515c.788.394 1.626.58 2.452.58 2.019 0 3.962-1.116 4.925-3.045 1.356-2.717.252-6.02-2.465-7.377zm120.013-220.145h64.642c3.037 0 5.5-2.462 5.5-5.5 0-12.009-9.77-21.778-21.778-21.778-3.161 0-6.286.701-9.137 2.02-4.88-4.48-11.218-6.976-17.992-6.976-14.741 0-26.734 11.993-26.734 26.734-.001 3.037 2.462 5.5 5.499 5.5zm21.235-21.235c4.981 0 9.566 2.304 12.578 6.32.894 1.19 2.23 1.968 3.707 2.156 1.479.188 2.965-.231 4.128-1.16 1.932-1.544 4.254-2.36 6.716-2.36 3.936 0 7.385 2.12 9.267 5.278h-51.138c2.234-5.971 7.999-10.234 14.742-10.234z" />
</svg>
</a>
</li>
<li>
<a href="#">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill-rule="evenodd" clip-rule="evenodd" role="img" aria-label="menu icon on mobile device">
<path d="M12 16c1.656 0 3 1.344 3 3s-1.344 3-3 3-3-1.344-3-3 1.344-3 3-3zm0 1c1.104 0 2 .896 2 2s-.896 2-2 2-2-.896-2-2 .896-2 2-2zm0-8c1.656 0 3 1.344 3 3s-1.344 3-3 3-3-1.344-3-3 1.344-3 3-3zm0 1c1.104 0 2 .896 2 2s-.896 2-2 2-2-.896-2-2 .896-2 2-2zm0-8c1.656 0 3 1.344 3 3s-1.344 3-3 3-3-1.344-3-3 1.344-3 3-3zm0 1c1.104 0 2 .896 2 2s-.896 2-2 2-2-.896-2-2 .896-2 2-2z" />
</svg>
</a>
</li>
</ul>
<ul>
<li>
<a href="#"> Tours </a>
</li>
<li>
<a href="#"> Testimonials </a>
</li>
<li>
<a href="#"> Gallery </a>
</li>
<li>
<a href="#"> About </a>
</li>
<li>
<a href="#"> Contact </a>
</li>
</ul>
<ul>
<li>
<a href="#" class="cta">
<span> Book a tour </span>
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 457.001 457.001" role="img" aria-label="fake logo image of mountain">
<path d="M42.755 125.406c.178 2.901 2.583 5.163 5.489 5.163h71.548c2.551 0 4.768-1.754 5.354-4.237.39-1.652.587-3.307.587-4.919 0-11.769-9.575-21.344-21.344-21.344-2.759 0-5.44.523-7.946 1.536-4.61-5.051-11.195-8.036-18.177-8.036-8.98 0-17.272 5.011-21.551 12.753-8.083 2.014-14.012 9.324-14.012 17.935 0 .335.019.664.041.993l.011.156zm18.011-8.62c2.155-.124 4.039-1.497 4.815-3.511 2.01-5.207 7.106-8.705 12.685-8.705 4.883 0 9.417 2.646 11.832 6.905.78 1.376 2.116 2.35 3.665 2.672s3.162-.039 4.427-.99c1.813-1.365 3.956-2.086 6.199-2.086 5.074 0 9.308 3.673 10.179 8.5h-59.21c1.286-1.597 3.215-2.659 5.408-2.785z" />
<path d="M456.383 240.537c-1.397-2.696-4.717-3.75-7.415-2.351l-43.688 22.653-49.223-72.849c-1.205-1.783-3.334-2.701-5.462-2.346l-8.334 1.389-48.065-78.827c-.78-1.278-2.047-2.184-3.509-2.507-1.464-.323-2.992-.037-4.238.794l-7.887 5.258-18.572-22.302h35.1c2.725 0 5.038-1.994 5.439-4.689.239-1.603.351-2.972.351-4.311 0-15.958-12.982-28.94-28.94-28.94-3.243 0-6.464.553-9.516 1.621-6.606-9.072-17.148-14.531-28.574-14.531-11.432 0-21.977 5.459-28.583 14.531-3.052-1.068-6.272-1.621-9.517-1.621-15.952 0-28.931 12.982-28.931 28.94 0 1.339.111 2.708.351 4.311.401 2.695 2.715 4.689 5.439 4.689h43.535l-59.828 76.22-7.766-5.177c-2.42-1.613-5.677-1.064-7.433 1.253l-39.643 52.272-9.948-10.695c-1.723-1.852-4.487-2.29-6.698-1.062l-14.494 8.052-61.072-57.255c-2.216-2.077-5.695-1.966-7.774.251-2.077 2.216-1.965 5.697.251 7.774l64 60c1.744 1.635 4.345 1.957 6.433.795l14.235-7.908 77.066 82.847c1.41 1.515 3.553 2.111 5.538 1.542l11.041-3.154 132.763 121.753c1.057.969 2.389 1.447 3.716 1.447 1.488 0 2.971-.6 4.056-1.783 2.053-2.239 1.902-5.718-.336-7.771l-76.698-70.337 86.023-39.427 11.758 5.039c1.514.649 3.238.585 4.699-.173l108-56c2.695-1.399 3.748-4.718 2.35-7.415zM177.93 78.449c.998-8.954 8.609-15.94 17.82-15.94 3.15 0 6.142.801 8.891 2.379 1.296.744 2.841.929 4.274.512 1.436-.417 2.639-1.401 3.334-2.724 4.236-8.066 12.514-13.077 21.601-13.077 9.081 0 17.354 5.011 21.591 13.077.695 1.323 1.898 2.307 3.334 2.724 1.435.418 2.978.233 4.274-.512 2.749-1.579 5.74-2.379 8.891-2.379 9.216 0 16.832 6.986 17.83 15.94h-38.941l-9.057-10.876c-1.063-1.276-2.616-1.983-4.306-1.98-1.661.024-3.222.797-4.247 2.104l-8.44 10.752H177.93zm165.346 214.54-11.609-4.976c-1.427-.612-3.045-.592-4.459.055l-92.454 42.375-49.537-45.428c-1.41-1.293-3.393-1.76-5.229-1.235l-10.759 3.074-60.15-64.662 37.674-49.677 37.492 26.988c.98.719 2.119 1.065 3.248 1.065 1.692 0 3.362-.779 4.44-2.248 1.796-2.449 1.267-5.891-1.183-7.688l-25.417-18.639 72.336-92.155 32.15 38.605-25.925 22.468c-2.295 1.989-2.543 5.463-.554 7.758 1.088 1.255 2.619 1.898 4.158 1.898 1.277 0 2.56-.442 3.601-1.344l36.683-30.403 47.019 77.11c1.17 1.917 3.385 2.933 5.601 2.562l8.516-1.419 46.529 68.862-52.171 27.054z" />
<path d="m305.05 235.595-16.414 13.679-32.361-20.594c-2.019-1.284-4.636-1.116-6.475.415l-39 32.5c-2.333 1.945-2.648 5.413-.704 7.746 1.088 1.305 2.652 1.979 4.229 1.979 1.241 0 2.49-.418 3.519-1.275l35.914-29.929 32.361 20.594c2.02 1.284 4.636 1.116 6.475-.415l19.5-16.25c2.333-1.945 2.648-5.413.704-7.746-1.945-2.333-5.413-2.648-7.748-.704zm-78.532 137.466-51.366-25.64c-1.432-.715-3.104-.77-4.578-.153l-17.497 7.317-77.613-49.402c-2.561-1.631-5.962-.876-7.593 1.687-1.631 2.563-.876 5.962 1.687 7.593l80.037 50.945c1.519.967 3.415 1.129 5.075.434l17.824-7.454 49.112 24.515c.788.394 1.626.58 2.452.58 2.019 0 3.962-1.116 4.925-3.045 1.356-2.717.252-6.02-2.465-7.377zm120.013-220.145h64.642c3.037 0 5.5-2.462 5.5-5.5 0-12.009-9.77-21.778-21.778-21.778-3.161 0-6.286.701-9.137 2.02-4.88-4.48-11.218-6.976-17.992-6.976-14.741 0-26.734 11.993-26.734 26.734-.001 3.037 2.462 5.5 5.499 5.5zm21.235-21.235c4.981 0 9.566 2.304 12.578 6.32.894 1.19 2.23 1.968 3.707 2.156 1.479.188 2.965-.231 4.128-1.16 1.932-1.544 4.254-2.36 6.716-2.36 3.936 0 7.385 2.12 9.267 5.278h-51.138c2.234-5.971 7.999-10.234 14.742-10.234z" />
</svg>
</a>
</li>
</ul>
</nav>
<main>
<section>
<div class="headings">
<h1>MOUNTAINS</h1>
<h2>Discover the beauty of</h2>
<h2>Find your path</h2>
</div>
<div class="banner">
<div class="banner-wrapper">
<div class="glass box">
<p>Hike</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" xml:space="preserve" role="img" aria-label="icon of hiking boot">
<path d="M510.714 460.871c-18.687-27.653-48.469-47.095-81.708-53.342-4.072-.765-7.991 1.915-8.756 5.986-.765 4.071 1.915 7.991 5.986 8.756 24.376 4.581 46.635 17.188 62.907 35.299H17.728c10.094-25.18 35.063-42.06 63.752-42.06 14.954 0 29.163 4.584 41.089 13.256 1.842 1.339 4.194 1.771 6.388 1.168 2.197-.6 4.001-2.166 4.906-4.256 12.95-29.928 40.465-45.363 86.257-48.259v39.135h-12.618c-4.142 0-7.5 3.358-7.5 7.5s3.358 7.5 7.5 7.5h86.405c4.142 0 7.5-3.358 7.5-7.5s-3.358-7.5-7.5-7.5H264.34V378.48c40.348 4.96 65.543 21.67 76.898 50.934.773 1.993 2.36 3.561 4.361 4.311.851.319 1.742.477 2.631.477 1.203 0 2.401-.289 3.489-.861 14.193-7.46 29.565-11.764 45.689-12.794 4.134-.264 7.271-3.829 7.007-7.963-.264-4.134-3.825-7.27-7.963-7.007-15.54.993-30.468 4.676-44.484 10.968-14.849-30.338-44.276-48.182-87.628-53.155v-21.058c0-4.142-3.358-7.5-7.5-7.5s-7.5 3.358-7.5 7.5v74.225h-14.22V295.455c3.358-4.054 5.379-9.254 5.379-14.917s-2.021-10.863-5.379-14.917v-52.994h14.22V316.33c0 4.142 3.358 7.5 7.5 7.5s7.5-3.358 7.5-7.5V212.628h27.721v41.486c0 3.034 1.827 5.768 4.63 6.929.928.384 1.902.571 2.869.571 1.952 0 3.87-.762 5.305-2.197l97.389-97.388c1.407-1.406 2.197-3.314 2.197-5.303s-.79-3.897-2.197-5.303l-97.389-97.388c-2.145-2.145-5.371-2.786-8.173-1.626-2.803 1.161-4.63 3.896-4.63 6.929v41.486H264.34V73.711c0-4.142-3.358-7.5-7.5-7.5h-29.22c-4.142 0-7.5 3.358-7.5 7.5v27.113h-68.846c-4.142 0-7.5 3.358-7.5 7.5V161c0 4.142 3.358 7.5 7.5 7.5s7.5-3.358 7.5-7.5v-45.176h140.787c4.142 0 7.5-3.358 7.5-7.5v-30.88l79.282 79.282-79.282 79.282v-30.88c0-4.142-3.358-7.5-7.5-7.5H158.774v-9.96c0-4.142-3.358-7.5-7.5-7.5s-7.5 3.358-7.5 7.5v17.46c0 4.142 3.358 7.5 7.5 7.5h68.846v44.694c-.996-.13-2.01-.204-3.041-.204-12.914 0-23.42 10.506-23.42 23.42 0 12.914 10.506 23.42 23.42 23.42 1.031 0 2.045-.074 3.041-.204v58.644c-47.922 2.896-79.524 19.112-96.155 49.407-12.823-7.414-27.345-11.295-42.485-11.295-18.937 0-37.479 6.346-52.212 17.867-14.55 11.38-24.872 27.345-29.064 44.956-.532 2.232-.012 4.585 1.411 6.386s3.591 2.851 5.885 2.851h497c2.774 0 5.322-1.532 6.624-3.982 1.301-2.45 1.144-5.418-.41-7.717zM235.12 81.211h14.22v19.613h-14.22V81.211zm-26.461 199.327c0-4.643 3.777-8.42 8.42-8.42s8.42 3.777 8.42 8.42-3.777 8.42-8.42 8.42-8.42-3.777-8.42-8.42z" />
<path d="M311.512 183.256c4.142 0 7.5-3.358 7.5-7.5v-38.061c0-4.142-3.358-7.5-7.5-7.5H182.379c-4.142 0-7.5 3.358-7.5 7.5v38.061c0 4.142 3.358 7.5 7.5 7.5h129.133zm-121.633-38.061h114.133v23.061H189.879v-23.061zm203.822 144.09c0 12.914 10.506 23.42 23.42 23.42s23.42-10.506 23.42-23.42-10.506-23.42-23.42-23.42-23.42 10.507-23.42 23.42zm23.42-8.419c4.643 0 8.42 3.777 8.42 8.42s-3.777 8.42-8.42 8.42-8.42-3.777-8.42-8.42 3.778-8.42 8.42-8.42zM140.135 86.269c12.914 0 23.42-10.506 23.42-23.42s-10.506-23.42-23.42-23.42-23.42 10.506-23.42 23.42 10.507 23.42 23.42 23.42zm0-31.84c4.643 0 8.42 3.777 8.42 8.42s-3.777 8.42-8.42 8.42-8.42-3.777-8.42-8.42 3.778-8.42 8.42-8.42zM94.879 379.088c12.914 0 23.42-10.506 23.42-23.42 0-12.914-10.506-23.42-23.42-23.42s-23.42 10.506-23.42 23.42c0 12.913 10.506 23.42 23.42 23.42zm0-31.841c4.643 0 8.42 3.777 8.42 8.42s-3.777 8.42-8.42 8.42-8.42-3.777-8.42-8.42c0-4.642 3.777-8.42 8.42-8.42z" />
</svg>
</div>
<div class="glass box">
<p>Ski</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 511.98 511.98" xml:space="preserve" role="img" aria-label="icon to show skiing">
<path d="m197.723 247.571-14.473 14.472h-45.267c-.915-2.114-2.219-4.098-3.944-5.824-7.348-7.346-19.301-7.345-26.646 0-7.346 7.347-7.346 19.3 0 26.646 3.673 3.673 8.498 5.51 13.323 5.51 4.825 0 9.651-1.837 13.324-5.51 1.725-1.725 3.029-3.709 3.944-5.823h30.266L6.196 439.088c-8.261 8.262-8.261 21.705 0 29.966l28.31 28.31c4 4 9.319 6.202 14.979 6.202s10.979-2.203 14.978-6.202l90.5-90.5c2.929-2.929 2.929-7.678 0-10.606-2.929-2.929-7.678-2.929-10.606 0l-19.939 19.938-2.846-25.379c-.376-3.355-2.949-6.046-6.284-6.572l-28.529-4.503 53.37-53.367 37.056 37.055-11.208 11.208c-2.929 2.929-2.929 7.678 0 10.606 1.464 1.464 3.384 2.197 5.303 2.197s3.839-.732 5.303-2.197l49.719-49.719v29.837c-2.114.915-4.098 2.219-5.823 3.944-7.346 7.346-7.346 19.299 0 26.647 3.674 3.673 8.499 5.509 13.323 5.509 4.825 0 9.65-1.836 13.323-5.51 7.346-7.347 7.346-19.3 0-26.646-1.725-1.725-3.709-3.029-5.823-3.944v-44.837l14.688-14.688 14.687 14.687v44.838c-2.114.915-4.098 2.219-5.823 3.944-7.346 7.346-7.346 19.299 0 26.646 3.673 3.673 8.498 5.51 13.323 5.51s9.65-1.837 13.324-5.51c7.346-7.347 7.346-19.3 0-26.647-1.725-1.725-3.71-3.029-5.823-3.943v-29.838l161.839 161.839c4 4 9.319 6.202 14.979 6.202s10.979-2.203 14.979-6.202l28.31-28.31c8.262-8.261 8.262-21.704 0-29.966l-88.78-88.78c-2.929-2.929-7.678-2.929-10.606 0-2.929 2.929-2.929 7.678 0 10.606l18.828 18.828-28.532 4.503c-3.335.526-5.908 3.217-6.284 6.572l-2.846 25.379-52.766-52.766 37.059-37.058 14.112 14.112c2.929 2.929 7.678 2.929 10.606 0 2.929-2.929 2.929-7.678 0-10.606l-52.835-52.835h30.258c.915 2.114 2.219 4.099 3.944 5.824 3.674 3.673 8.499 5.509 13.323 5.509 4.825 0 9.65-1.836 13.323-5.51 7.346-7.346 7.346-19.299 0-26.646-7.346-7.347-19.299-7.346-26.647 0-1.725 1.725-3.029 3.71-3.943 5.823H328.74l-14.472-14.472L483.073 78.754c7.782-7.781 12.067-18.128 12.067-29.133s-4.285-21.352-12.065-29.131c-7.781-7.788-18.13-12.076-29.14-12.076-11.01 0-21.358 4.289-29.139 12.074l-5.49 5.49c-2.929 2.929-2.928 7.678 0 10.607 2.93 2.929 7.678 2.928 10.607 0l5.491-5.492c4.948-4.952 11.529-7.679 18.53-7.679 7.001 0 13.582 2.727 18.532 7.681 4.948 4.948 7.673 11.528 7.673 18.527s-2.725 13.579-7.674 18.527l-38.119 38.121-2.846-25.381c-.376-3.355-2.949-6.046-6.284-6.572l-28.533-4.503 12.439-12.439c2.929-2.929 2.929-7.678 0-10.606-2.929-2.929-7.678-2.929-10.606 0L255.99 189.295 162.175 95.48l-.012-.012L87.185 20.49c-7.782-7.788-18.13-12.076-29.14-12.076-11.01 0-21.359 4.289-29.138 12.074-7.782 7.781-12.067 18.128-12.067 29.133s4.285 21.352 12.067 29.133l168.816 168.817zm190.824 19.255c.749-.749 1.733-1.124 2.717-1.124s1.968.374 2.717 1.123c1.498 1.499 1.498 3.936 0 5.434-1.498 1.498-3.936 1.498-5.434 0s-1.498-3.935 0-5.433zm-265.114 5.433c-1.498 1.499-3.935 1.499-5.434 0-1.498-1.498-1.498-3.935 0-5.434 1.498-1.498 3.936-1.498 5.433 0 1.498 1.499 1.499 3.937.001 5.434zm113.086 113.087c-1.498 1.498-3.936 1.498-5.433 0-1.498-1.498-1.499-3.936 0-5.433.749-.749 1.733-1.124 2.717-1.124s1.968.374 2.717 1.123c1.497 1.499 1.497 3.936-.001 5.434zm44.375 0c-1.498 1.498-3.936 1.499-5.434 0-1.498-1.499-1.498-3.936 0-5.434 1.498-1.498 3.936-1.498 5.434 0s1.498 3.936 0 5.434zm123.783 12.824 33.663-5.313 12.321 12.321-28.533 4.503c-3.335.526-5.908 3.217-6.284 6.572l-2.846 25.379-11.865-11.865 3.544-31.597zm-80.488-45.346-58.806-58.806 2.731-2.731 39.394 39.394c1.464 1.464 3.384 2.197 5.303 2.197s3.839-.732 5.303-2.197l20.99-20.99c2.929-2.929 2.929-7.678 0-10.606l-39.394-39.394 2.731-2.731 58.806 58.806-37.058 37.058zm-92.145-70.932-32.874 32.882-10.384-10.383 32.875-32.882 10.383 10.383zm-31.177-52.39 37.059-37.058 53.909 53.909-2.731 2.731-6.791-6.791c-2.929-2.929-7.678-2.929-10.606 0l-20.99 20.99c-2.929 2.929-2.929 7.678 0 10.606l6.791 6.791-2.731 2.731-53.91-53.909zm-27.02-27.02 37.058-37.058 16.414 16.414-37.059 37.058-16.413-16.414zm-27.02-27.02 37.059-37.059 16.414 16.414-37.058 37.058-16.415-16.413zm-27.02-27.02 37.059-37.059 16.414 16.414-37.059 37.059-16.414-16.414zm-28.602-28.603 3.544-31.598 33.663-5.312 17.848 17.848-37.059 37.059-17.996-17.997zm175.422 148.747 10.383-10.383 46.186 46.186-10.383 10.383-46.186-46.186zm34.447-103.162 37.062 37.062-16.413 16.414-37.063-37.063 16.414-16.413zm27.02-27.02 37.061 37.061-16.413 16.414-37.062-37.062 16.414-16.413zm27.02-27.02 37.061 37.061-16.413 16.414-37.062-37.062 16.414-16.413zm62.118-23.143 3.544 31.601-17.995 17.996-37.06-37.06 17.848-17.848 33.663 5.311zM274.054 192.444l37.063 37.063-7.457 7.458-37.063-37.063 7.457-7.458zM31.84 49.621c0-6.999 2.725-13.579 7.675-18.529 4.948-4.952 11.529-7.679 18.53-7.679s13.582 2.727 18.532 7.681l38.719 38.719-28.533 4.503c-3.335.526-5.908 3.217-6.284 6.572l-2.846 25.379-38.12-38.119c-4.948-4.949-7.673-11.528-7.673-18.527zm22.016 437.137c-1.166 1.167-2.718 1.809-4.371 1.809s-3.206-.643-4.372-1.809l-28.31-28.31c-2.413-2.413-2.413-6.34 0-8.753l31.401-31.4 33.662 5.312 3.543 31.598-31.553 31.553zm53.447-88.588 3.543 31.597-11.865 11.865-2.846-25.379c-.376-3.355-2.949-6.046-6.284-6.572l-28.531-4.502 12.322-12.321 33.661 5.312zm43.432-82.401 57.595-57.592 2.724 2.724-38.178 38.187c-2.929 2.929-2.928 7.677 0 10.606l20.99 20.99c1.407 1.407 3.314 2.197 5.304 2.197s3.897-.791 5.303-2.197l38.177-38.186 2.733 2.733-16.883 16.883-.003.003-40.707 40.707-37.055-37.055zm344.442 142.679-28.31 28.31c-1.167 1.166-2.719 1.809-4.372 1.809s-3.205-.642-4.372-1.809l-31.553-31.553 3.544-31.598 33.663-5.312 31.4 31.4c2.413 2.413 2.413 6.339 0 8.753z" />
</svg>
</div>
<div class="glass box">
<p>Explore</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" xml:space="preserve" role="img" aria-label="icon to show exploring mountains">
<path d="M511.693 440.128c-14.213-48.175-29.647-86.776-45.876-114.732-5.636-9.713-11.405-18.165-17.292-25.369 20.116-16.085 31.904-40.341 31.904-66.427 0-10.454-1.871-20.656-5.563-30.325-1.478-3.871-5.817-5.809-9.682-4.332-3.87 1.478-5.81 5.812-4.332 9.682 3.036 7.954 4.576 16.357 4.576 24.975 0 21.825-10.02 42.095-27.072 55.34-13.615-13.047-27.805-19.63-42.438-19.63-4.136 0-8.235.546-12.296 1.597-9.972-34.81-20.434-65.772-31.305-92.675 12.266-9.537 27.337-14.752 42.991-14.752 19.285 0 37.254 7.661 50.599 21.572 1.473 1.536 3.441 2.308 5.413 2.308 1.867 0 3.737-.693 5.191-2.087 2.988-2.868 3.088-7.615.22-10.604-16.199-16.888-38.014-26.188-61.423-26.188-17.646 0-34.681 5.461-48.948 15.508-7.399-17.074-14.974-32.307-22.704-45.622C296.984 72.398 268.098 49.09 237.8 49.09c-36.465 0-70.797 33.778-102.041 100.397-6.947 14.825-13.791 31.369-20.386 49.253-1.195-.187-2.418-.286-3.664-.286-12.998 0-23.572 10.574-23.572 23.572 0 8.912 4.972 16.683 12.287 20.689-1.938 6.165-3.877 12.538-5.876 19.313-1.172 3.973 1.099 8.144 5.071 9.315.708.209 1.423.309 2.125.309 3.239 0 6.228-2.115 7.19-5.38 2.179-7.386 4.286-14.286 6.396-20.953 11.285-1.747 19.951-11.527 19.951-23.293 0-6.29-2.481-12.008-6.51-16.239 4.057-11.087 8.205-21.652 12.414-31.591 5.772 10.859 14.952 16.941 26.419 16.941 17.232 0 23.263-16.813 28.108-30.324 5.227-14.572 9.053-23.42 18.106-23.42 6.48 0 8.867 5.449 12.752 21.822 3.938 16.599 9.331 39.331 35.239 39.331 23.179 0 27.715-20.032 31.359-36.128 3.885-17.156 7.122-28.416 20.119-31.942 7.829 14.004 15.506 30.077 23.002 48.164.067.178.136.355.218.529 11.514 27.852 22.602 60.436 33.164 97.497-20.002 11.405-38.966 36.049-56.622 73.711-5.318 11.345-10.597 24.023-15.688 37.685-1.446 3.881.528 8.2 4.409 9.646 3.881 1.445 8.2-.528 9.647-4.409 2.479-6.652 5-13.058 7.547-19.175 4.898 7.512 12.095 11.673 20.887 11.673 14.828 0 19.844-13.985 23.874-25.223 4.317-12.038 7.012-17.709 13.044-17.709 3.905 0 5.616 3.193 8.719 16.271 3.077 12.974 7.729 32.58 29.618 32.58 19.721 0 23.651-17.36 26.521-30.036 2.848-12.578 5.227-21.008 13.89-24.03 13.586 24.574 26.643 57.17 38.894 97.101h-56.453c-1.457-11.609-11.383-20.622-23.381-20.622-11.997 0-21.923 9.012-23.38 20.622h-93.761c1.455-4.741 2.918-9.365 4.373-13.822 1.285-3.938-.864-8.172-4.803-9.458-3.939-1.285-8.172.866-9.457 4.802-1.93 5.911-3.869 12.109-5.789 18.478h-58.98v-24.426h52.812c3.033 0 5.769-1.827 6.929-4.63 1.161-2.803.52-6.028-1.625-8.173l-33.844-33.844h21.932c3.033 0 5.769-1.827 6.929-4.63 1.161-2.803.52-6.028-1.625-8.173l-37.009-37.008h13.502c3.033 0 5.769-1.827 6.929-4.63 1.161-2.803.52-6.028-1.625-8.173l-50.999-51c-1.407-1.407-3.314-2.197-5.304-2.197s-3.896.79-5.304 2.197l-51 51c-2.145 2.145-2.786 5.371-1.625 8.173 1.16 2.803 3.896 4.63 6.929 4.63h13.503l-37.009 37.008c-2.145 2.145-2.786 5.371-1.625 8.173 1.16 2.803 3.896 4.63 6.929 4.63h21.932l-33.844 33.844c-1.544 1.544-2.294 3.648-2.168 5.751l-12.162-12.161h11.922c3.033 0 5.769-1.827 6.929-4.63 1.161-2.803.52-6.028-1.625-8.173l-24.556-24.555h5.601c3.033 0 5.769-1.827 6.929-4.63 1.161-2.803.52-6.028-1.625-8.173l-15.032-15.032c2.667-10.82 5.275-20.944 7.941-30.822 1.08-3.999-1.286-8.116-5.285-9.196-4.001-1.08-8.116 1.286-9.195 5.286-1.962 7.265-3.892 14.662-5.834 22.359L69.661 302.7c-2.93-2.929-7.678-2.929-10.607 0l-38.249 38.249c-2.145 2.145-2.786 5.371-1.625 8.173 1.16 2.803 3.896 4.63 6.929 4.63h5.6L7.152 378.308c-2.145 2.145-2.786 5.371-1.625 8.173 1.16 2.803 3.896 4.63 6.929 4.63h11.922L2.196 413.292c-2.145 2.145-2.786 5.371-1.625 8.173 1.16 2.803 3.896 4.63 6.929 4.63h37.74v39.815c0 4.142 3.357 7.5 7.5 7.5h23.24c4.143 0 7.5-3.358 7.5-7.5v-16.16h93.31v16.16c0 4.142 3.357 7.5 7.5 7.5h30.99c4.143 0 7.5-3.358 7.5-7.5v-16.16h171.55c4.118 6.894 11.652 11.522 20.248 11.522 8.597 0 16.131-4.628 20.249-11.522H504.5c2.365 0 4.591-1.115 6.007-3.009s1.855-4.345 1.186-6.613zm-399.985-209.53c-4.727 0-8.572-3.845-8.572-8.572s3.846-8.572 8.572-8.572 8.572 3.845 8.572 8.572-3.845 8.572-8.572 8.572zm166.83-71.493c-4.017 17.739-6.499 24.441-16.729 24.441-12.665 0-16.162-8.901-20.645-27.793-3.525-14.863-7.914-33.359-27.347-33.359-20.263 0-26.896 18.495-32.226 33.356-4.55 12.686-7.762 20.388-13.989 20.388-11.743 0-15.865-13.106-17.311-22.278 28.268-59.557 57.704-89.77 87.509-89.77 22.778 0 45.517 17.891 67.677 53.187-19.118 7.364-23.57 26.947-26.939 41.828zm148.461 199.263c-3.27 14.438-5.118 18.349-11.893 18.349-9.083 0-11.553-6.412-15.023-21.042-2.784-11.736-6.597-27.809-23.313-27.809-17.248 0-22.979 15.979-27.163 27.645-3.866 10.781-6.076 15.287-9.755 15.287-8.094 0-11.128-9.266-12.264-16.06 21.945-46.076 45.549-70.427 68.332-70.427 11.947 0 23.932 6.434 35.826 19.183.123.149.255.286.387.424 5.227 5.665 10.437 12.545 15.616 20.642-14.565 6.553-18.073 21.981-20.75 33.808zm-251.078 3.112c2.145-2.145 2.786-5.371 1.625-8.173-1.16-2.803-3.896-4.63-6.929-4.63h-21.932l37.009-37.008c2.145-2.145 2.786-5.371 1.625-8.173-1.16-2.803-3.896-4.63-6.929-4.63h-13.503l32.894-32.893 32.893 32.893h-13.502c-3.033 0-5.769 1.827-6.929 4.63-1.161 2.803-.52 6.028 1.625 8.173l37.009 37.008h-21.932c-3.033 0-5.769 1.827-6.929 4.63-1.161 2.803-.52 6.028 1.625 8.173l33.844 33.844h-42.128c-.026 0-.051-.004-.077-.004s-.051.004-.077.004h-30.835c-.026 0-.051-.004-.077-.004s-.051.004-.077.004h-42.135l33.842-33.844zM49.413 380.741c-1.16-2.803-3.896-4.63-6.929-4.63H30.563l24.556-24.555c2.145-2.145 2.786-5.371 1.625-8.173-1.16-2.803-3.896-4.63-6.929-4.63h-5.6l20.143-20.143 20.144 20.143H78.9c-3.033 0-5.769 1.827-6.929 4.63-1.161 2.803-.52 6.028 1.625 8.173l24.556 24.555H86.231c-3.033 0-5.769 1.827-6.929 4.63-1.161 2.803-.52 6.028 1.625 8.173l22.183 22.182H25.607l22.182-22.182c2.144-2.145 2.785-5.371 1.624-8.173zm19.068 77.67h-8.24v-32.315h8.24v32.315zm15-23.661v-8.655h37.735c3.033 0 5.769-1.827 6.929-4.63 1.161-2.803.52-6.028-1.625-8.173l-3.002-3.002c.152.009.3.034.454.034h52.819v24.426h-93.31zm124.299 23.661h-15.99v-48.086h15.99v48.086zm206.798-12.139c-4.727 0-8.571-3.845-8.571-8.572s3.845-8.572 8.571-8.572 8.572 3.845 8.572 8.572-3.845 8.572-8.572 8.572zm28.678-360.539c12.997 0 23.571-10.574 23.571-23.572s-10.574-23.572-23.571-23.572c-12.998 0-23.572 10.575-23.572 23.572s10.574 23.572 23.572 23.572zm0-32.144c4.727 0 8.571 3.846 8.571 8.572s-3.845 8.572-8.571 8.572-8.572-3.845-8.572-8.572 3.845-8.572 8.572-8.572z" />
<path d="M276.975 267.723c12.998 0 23.572-10.574 23.572-23.572s-10.574-23.572-23.572-23.572c-12.997 0-23.571 10.574-23.571 23.572s10.574 23.572 23.571 23.572zm0-32.144c4.727 0 8.572 3.845 8.572 8.572s-3.846 8.572-8.572 8.572-8.571-3.845-8.571-8.572 3.844-8.572 8.571-8.572zm-178-133.774c12.998 0 23.572-10.574 23.572-23.572s-10.574-23.572-23.572-23.572c-12.997 0-23.571 10.575-23.571 23.572s10.574 23.572 23.571 23.572zm0-32.144c4.727 0 8.572 3.846 8.572 8.572s-3.846 8.572-8.572 8.572-8.571-3.845-8.571-8.572 3.844-8.572 8.571-8.572z" />
</svg>
</div>
</div>
<div class="mountain-list glass">
<h3>
Experience the beauty
</h3>
<ul>
<li>
<img src="https://assets.codepen.io/1149983/tono-graphy-k7SElGCAmgc-unsplash+%281%29.jpg?width=819&height=460&format=webp" alt="image of mountain for decorative purposes only" />
</li>
<li>
<img src="https://assets.codepen.io/1149983/simon-berger-twukN12EN7c-unsplash+%281%29.jpg?width=921&height=592&format=webp" alt="image of mountain for decorative purposes only" />
</li>
<li>
<img src="https://assets.codepen.io/1149983/samsommer-vddccTqwal8-unsplash+%282%29.jpg?width=774&height=518&format=webp" alt="image of mountain for decorative purposes only" />
</li>
<li>
<img src="https://assets.codepen.io/1149983/kerensa-pickett-GjpUV4k76F8-unsplash+%281%29.jpg?width=1680&height=985&format=webp" alt="image of mountain for decorative purposes only" loading="lazy" />
</li>
<li>
<img src="https://assets.codepen.io/1149983/kaidi-guo-jGlqOzrhn9k-unsplash+%281%29.jpg?width=1200&height=675&format=webp" alt="image of mountain for decorative purposes only" loading="lazy" />
</li>
</ul>
</div>
</div>
</section>
</main>
<img src="https://assets.codepen.io/1149983/mountain-lines.svg" class="mountain-lines" alt="image of mountain contour lines for decorative purposes only over the main landing area" />
</div>:root {
--icon-dimensions: 4rem;
--full-w: 100%;
--full-h: 100%;
--default-font: -apple-system, BlinkMacSystemFont, Roboto, helvetica neue,
sans-serif;
--spartan: "LeagueSpartanVariable";
--h1-clamp: clamp(6.5rem, 15vw, 30rem);
--default-font-size: 1.75rem;
--duration: 350ms;
--gap: 0.4rem;
--default-padding: 1.2rem;
--z-20: 20;
--z-30: 30;
// palette
--black: rgb(12, 12, 10);
--white: rgb(255, 255, 255);
--pale-blue: #c1dcee;
--blue: #389dd6;
--dark-blue: #064f99;
--light-blue: #68b0de;
--bg-1: url("https://assets.codepen.io/1149983/alberto-restifo-cFplR9ZGnAk-unsplash+%281%29.jpg");
--bg-2: url("https://assets.codepen.io/1149983/gaetan-meyer-WemqIKiduMo-unsplash+%281%29+%281%29.jpg");
}
@font-face {
font-family: "LeagueSpartanVariable";
src: url("https://assets.codepen.io/1149983/LeagueSpartan-VF.woff2")
format("woff2-variations");
font-weight: 200 900;
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
::selection {
-webkit-background-clip: text;
-webkit-box-direction: clone;
-webkit-text-fill-color: var(--yellow);
background-color: var(--light-blue);
color: var(--dark-blue);
}
html {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
background-color: var(--black);
font-family: var(--spartan), var(--default-font);
font-size: 62.5%;
height: -webkit-fill-available;
text-rendering: optimizelegibility;
text-transform: uppercase;
}
img {
max-width: var(--full-w);
display: block;
}
ul {
gap: var(--default-padding);
}
h1 {
-webkit-background-clip: text;
-webkit-box-decoration-break: clone;
-webkit-text-fill-color: rgba(0, 0, 0, 0);
background-image: var(--bg-2);
background-position: center 75%;
background-repeat: no-repeat;
background-size: cover;
display: inline;
font-size: var(--h1-clamp);
font-variation-settings: "wght" 900;
order: 2;
overflow: hidden;
user-select: none;
}
h1,
h2 {
margin: 0 auto;
}
h1 + h2 {
border-bottom: var(--gap) solid var(--pale-blue);
order: 3;
}
h2 {
align-items: center;
display: grid;
font-size: calc(var(--default-font-size) * 1.25);
font-variation-settings: "wght" 750;
grid-gap: calc(var(--default-padding) * 1.25);
grid-template-columns: calc(var(--default-padding) * 2) auto calc(
var(--default-padding) * 2
);
order: 1;
width: fit-content;
&::before,
&::after {
content: "";
border-top: var(--gap) solid var(--pale-blue);
}
}
h2,
h3 {
color: var(--white);
position: relative;
}
h3 {
align-items: baseline;
display: flex;
font-size: calc(var(--default-font-size) * 1.5);
font-variation-settings: "wght" 600;
padding: calc(var(--default-padding) / 2);
z-index: 2;
}
svg {
fill: var(--white);
mix-blend-mode: exclusion;
width: var(--icon-dimensions);
}
a {
align-items: center;
color: var(--white);
cursor: pointer;
display: flex;
flex-flow: row nowrap;
font-size: var(--default-font-size);
font-variation-settings: "wght" 800;
overflow: hidden;
position: relative;
text-decoration: none;
touch-action: manipulation;
&:hover,
&:focus {
border-color: var(--blue);
}
}
.container {
display: flex;
flex-flow: column wrap;
display: grid;
grid-template-areas:
"nav"
"main";
grid-template-columns: 1fr;
grid-template-rows: 5rem calc(100vh - 5rem);
min-height: 100vh;
min-height: -webkit-fill-available;
overflow: hidden;
position: relative;
&::before {
background-image: var(--bg-1);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
content: "";
height: var(--full-h);
filter: brightness(0.25);
position: absolute;
inset: 0;
width: var(--full-w);
}
}
.mountain-lines {
height: var(--full-h);
left: 0;
mix-blend-mode: luminosity;
object-fit: cover;
opacity: 0.5;
position: absolute;
top: calc(var(--default-padding) * 2);
width: var(--full-w);
}
.cta {
padding: var(--gap);
transition: color 0.3s ease-in-out;
width: max-content;
&::before {
background-color: var(--dark-blue);
border-radius: 1.5rem;
content: "";
display: block;
height: 3rem;
left: 0;
position: absolute;
transition: all 0.3s ease;
width: 3rem;
}
&:hover,
&:focus {
color: var(--white);
width: max-content;
&::before {
color: var(--white);
width: var(--full-w);
}
}
&:active {
transform: scale(1);
}
span,
svg {
z-index: var(--z-20);
}
span {
align-items: center;
display: flex;
position: relative;
text-transform: uppercase;
}
svg {
padding: var(--gap);
}
}
.glass {
background-color: rgb(0 0 0 / 20%);
backdrop-filter: blur(var(--default-padding));
}
nav,
main,
section {
width: var(--full-w);
}
nav {
align-items: center;
display: flex;
grid-area: nav;
grid-template-columns: 1fr;
grid-column: 1 / -1;
padding: 0 var(--default-padding);
overflow: hidden;
z-index: var(--z-20);
ul {
flex-flow: row nowrap;
height: var(--full-h);
transition: opacity var(--duration);
~ * {
align-items: center;
display: flex;
transition: color var(--duration) ease-in,
background-color var(--duration) ease-in-out;
}
&:nth-of-type(1) {
align-items: center;
display: flex;
padding: 0 var(--default-padding);
justify-content: space-between;
width: var(--full-w);
li {
&:nth-of-type(2) {
justify-content: flex-end;
}
}
}
&:not(:nth-of-type(1)) {
display: none;
}
&:nth-of-type(2) {
justify-content: center;
li {
a {
border-bottom: var(--gap) solid transparent;
}
&:hover,
&:focus {
&:not(:hover) {
opacity: 0.33;
}
a {
border-bottom-color: var(--light-blue);
}
}
}
}
}
}
main {
grid-area: main;
z-index: var(--z-30);
}
section {
display: flex;
flex-flow: column nowrap;
height: var(--full-h);
}
.headings {
display: flex;
flex-flow: column wrap;
row-gap: calc(var(--default-padding) * 1.25);
margin: auto 0;
}
.banner {
display: flex;
flex-flow: column wrap;
.banner-wrapper {
align-items: baseline;
display: grid;
grid-auto-flow: column;
grid-column: 1;
grid-template-columns: repeat(auto-fill, minmax(min(12.5rem, 100%), 1fr));
.box {
align-items: center;
box-shadow: inset var(--gap) 0 0 0 var(--dark-blue);
display: flex;
flex-flow: column wrap;
padding: var(--default-padding) calc(var(--default-padding) / 2);
transition: fill var(--duration) ease-in-out;
&:nth-of-type(2) {
box-shadow: inset var(--gap) 0 0 0 var(--blue);
}
&:nth-of-type(3) {
box-shadow: inset var(--gap) 0 0 0 var(--light-blue);
}
&:hover,
&:focus {
svg {
fill: var(--pale-blue);
}
}
}
p {
color: var(--white);
font-size: calc(var(--default-font-size) * 1.25);
font-variation-settings: "wght" 700;
}
svg {
mix-blend-mode: exclusion;
}
}
}
.mountain-list {
box-shadow: inset 0 var(--gap) 0 0 var(--white);
display: flex;
flex-flow: column wrap;
mix-blend-mode: overlay;
padding: var(--default-padding) var(--default-padding) 0
var(--default-padding);
ul {
display: grid;
gap: var(--gap);
grid-auto-flow: column;
overflow-y: auto;
overscroll-behavior-x: contain;
place-items: center;
scroll-snap-type: x mandatory;
width: 100vw;
}
li {
aspect-ratio: 16/9;
padding: 0 calc(var(--default-padding) / 2);
scroll-snap-align: center;
&:hover,
&:focus {
img {
filter: grayscale(0);
}
}
}
img {
border-radius: 1rem;
filter: grayscale(1);
height: 10rem;
max-width: none;
object-fit: contain;
}
}
@media only screen and (min-width: 760px) {
.container {
overflow: hidden;
}
h1 {
filter: drop-shadow(
calc(-1 * var(--default-padding)) var(--default-padding)
calc(var(--default-padding) * 2) var(--black)
);
}
h2 {
font-size: calc(var(--default-font-size) * 1.75);
grid-template-columns: minmax(6rem, 1fr) auto minmax(6rem, 1fr);
letter-spacing: calc(var(--default-padding) / 1.5);
&:nth-of-type(2) {
transform: translatey(-1.75rem);
}
}
nav {
display: grid;
grid-template-columns: auto 1fr auto;
ul {
&:not(:nth-of-type(1)) {
display: flex;
}
&:nth-of-type(1) {
li {
&:nth-of-type(2) {
display: none;
}
}
}
}
li {
height: var(--full-h);
a {
height: var(--full-h);
}
}
}
.headings {
margin: auto;
row-gap: 0;
}
.banner {
display: grid;
grid-template-columns: repeat(2, 1fr);
.banner-wrapper {
align-items: flex-end;
grid-template-columns: repeat(3, minmax(12rem, max-content));
}
}
.mountain-list {
margin-left: auto;
ul {
max-width: 48rem;
}
img {
height: 15rem;
overflow: hidden;
}
}
.mountain-lines {
opacity: 0.33;
}
}
/* ----------------------------------------------
Disable Animation if that is user settings
* ---------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
* {
animation: none;
transition: none;
}
}
External CSS
This Pen doesn't use any external CSS resources.
External JavaScript
This Pen doesn't use any external JavaScript resources.