<header class="header">
    <div class="promo-bar js-promo-bar">
        <div class="promo-bar__inner u-page-width-max">
            <a class="promo-bar__link" href="#">Free shipping and free returns</a>
            <button class="promo-bar__close-button">
      <span class="u-visually-hidden">Close</span>
      <svg class="icon icon--close">
  <use xlink:href="/assets/icons/icons.svg#close"></use>
</svg>

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

    <div class="headroom">
        <nav class="header-nav">
            <ul class="header-nav__primary">
                <li class="header-nav__primary-item header-nav__primary-item--active">
                    <a class="header-nav__primary-link" href="#">Sunglasses</a>
                    <div class="header-nav__secondary-wrapper js-header-nav__secondary-wrapper">
                        <div class="u-page-width-max">
                            <ul class="header-nav__secondary js-header-nav--secondary">
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <button class="header-nav__secondary-button js-header-nav-button">
                    Shop
                    <svg class="icon icon--arrow-right">
  <use xlink:href="/assets/icons/icons.svg#arrow-right"></use>
</svg>

                  </button>
                                    <div class="header-nav__tertiary-wrapper u-page-width-max">
                                        <button class="header-nav__tertiary-back-button js-header-nav-back-button">
                      <svg class="icon icon--arrow-left">
  <use xlink:href="/assets/icons/icons.svg#arrow-left"></use>
</svg>

                      Back
                    </button>
                                        <ul class="header-nav__tertiary header-nav__tertiary--marketing js-header-nav--tertiary">
                                            <li class="header-nav__tertiary-menu">
                                                <span class="header-nav__tertiary-menu-label">Frame Style</span>
                                                <ul class="header-nav__tertiary-menu-items">
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Aviators</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Classic</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Wrap</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Fashion</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Rectangular</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Cat Eye</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Rimless</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Shield</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link header-nav__tertiary-menu-link--accent" href="#">
                              All Frames
                              <svg class="icon icon--arrow-right">
  <use xlink:href="/assets/icons/icons.svg#arrow-right"></use>
</svg>

                            </a>
                                                    </li>
                                                </ul>
                                            </li>
                                            <li class="header-nav__tertiary-menu">
                                                <span class="header-nav__tertiary-menu-label">Activity</span>
                                                <ul class="header-nav__tertiary-menu-items">
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Golf</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Fish</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Surf</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Run</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Drive</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Hike</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Tennis</a>
                                                    </li>
                                                </ul>
                                            </li>
                                            <li class="header-nav__tertiary-menu">
                                                <span class="header-nav__tertiary-menu-label">More</span>
                                                <ul class="header-nav__tertiary-menu-items">
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">New Arrivals</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Best Sellers</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Prescription</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Accessories</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Readers</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Blue Hawaii</a>
                                                    </li>
                                                </ul>
                                            </li>
                                        </ul>
                                        <div class="header-nav__tertiary-marketing-placement">
                                            <a class="header-nav__tertiary-marketing-link" href="#">
                                                <div class="header-nav__tertiary-marketing-image" style="background-image: url('/assets/images/megamenu-marketing-placement.jpg');"></div>
                                                <div class="header-nav__tertiary-marketing-text">
                                                    <span class="header-nav__tertiary-marketing-title">Blue Hawaii</span>
                                                    <span class="header-nav__tertiary-marketing-cta">Shop now</span>
                                                </div>
                                            </a>
                                        </div>
                                    </div>
                                </li>
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <a class="header-nav__secondary-link" href="#">
                    MyMaui
                  </a>
                                </li>
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <a class="header-nav__secondary-link" href="#">
                    Home Try-on
                  </a>
                                </li>
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <a class="header-nav__secondary-link" href="#">
                    Vintage
                  </a>
                                </li>
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <a class="header-nav__secondary-link" href="#">
                    Apparel
                  </a>
                                </li>
                            </ul>
                            <ul class="header-nav__secondary js-header-nav--secondary">
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <a class="header-nav__secondary-link" href="tel:+1800229933">
                    1-888-666-5905
                    <svg class="icon icon--action-phone">
  <use xlink:href="/assets/icons/icons.svg#action-phone"></use>
</svg>

                  </a>
                                </li>
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <a class="header-nav__secondary-link" href="#">
                    Contact Us
                    <svg class="icon icon--action-mail">
  <use xlink:href="/assets/icons/icons.svg#action-mail"></use>
</svg>

                  </a>
                                </li>
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <a class="header-nav__secondary-link" href="#">
                    Find a Retailer
                    <svg class="icon icon--action-location">
  <use xlink:href="/assets/icons/icons.svg#action-location"></use>
</svg>

                  </a>
                                </li>
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <button class="header-nav__secondary-button js-header-nav-button">
                    Customer Service
                    <svg class="icon icon--arrow-right">
  <use xlink:href="/assets/icons/icons.svg#arrow-right"></use>
</svg>

                  </button>
                                    <div class="header-nav__tertiary-wrapper u-page-width-max">
                                        <button class="header-nav__tertiary-back-button js-header-nav-back-button">
                      <svg class="icon icon--arrow-left">
  <use xlink:href="/assets/icons/icons.svg#arrow-left"></use>
</svg>

                      Back
                    </button>
                                        <ul class="header-nav__tertiary js-header-nav--tertiary">
                                            <li class="header-nav__tertiary-menu">
                                                <ul class="header-nav__tertiary-menu-items">
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Order Status</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Repairs</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Returns</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Product Registration</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Prescription</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Retailers</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">FAQs</a>
                                                    </li>
                                                    <li class="header-nav__tertiary-menu-item">
                                                        <a class="header-nav__tertiary-menu-link" href="#">Shipping Information</a>
                                                    </li>
                                                </ul>
                                            </li>
                                        </ul>
                                    </div>
                                </li>
                            </ul>
                            <ul class="header-nav__secondary js-header-nav--secondary">
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <a class="header-nav__secondary-link" href="#">
                    Your Account
                  </a>
                                </li>
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <a class="header-nav__secondary-link" href="#">
                    Your Orders
                  </a>
                                </li>
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <a class="header-nav__secondary-link" href="#">
                    Your Wishlist
                  </a>
                                </li>
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <a class="header-nav__secondary-link header-nav__secondary-link--logout" href="#">
                    Logout
                  </a>
                                </li>
                            </ul>
                            <ul class="header-nav__secondary js-header-nav--secondary">
                                <li class="header-nav__secondary-item js-header-nav-item">
                                    <a class="header-nav__secondary-link js-modal-open-link" href="#" data-modal-id="country-selector">
                    United States
                    <img src="/assets/images/flag-us.png" alt="United States" width="22" height="14">
                  </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </li>
                <li class="header-nav__primary-item">
                    <a class="header-nav__primary-link" href="#">Eyeglasses</a>
                    <div class="header-nav__secondary-wrapper js-header-nav__secondary-wrapper">
                        <div class="u-page-width-max">
                        </div>
                    </div>
                </li>
            </ul>
        </nav>
        <div class="header-menu-bar"></div>
        <a class="header__logo-wrapper" href="#">
      <img class="header__logo" src="/assets/images/mauijim-brand-logo.png" alt="Maui Jim logo">
    </a>
        <div class="header__menu-icon">
            <button class="hamburger-spring header__icon header__icon--menu  js-header-icon--menu" type="button">
        <span class="u-visually-hidden">Menu</span>
        <span class="hamburger-spring__box">
          <span class="hamburger-spring__inner"></span>
        </span>
      </button>
        </div>
        <div class="header__icons">
            <div class="header__icons-inner">
                <button class="header__icon header__icon--search js-header-icon--search">
          <span class="u-visually-hidden">Search</span>
          <svg class="icon icon--search">
  <use xlink:href="/assets/icons/icons.svg#search"></use>
</svg>

          <svg class="icon icon--close-large">
  <use xlink:href="/assets/icons/icons.svg#close-large"></use>
</svg>

        </button>
                <button class="header__icon header__icon--wishlist">
          <span class="u-visually-hidden">Wishlist</span>
          <svg class="icon icon--heart-item">
  <use xlink:href="/assets/icons/icons.svg#heart-item"></use>
</svg>

        </button>
                <button class="header__icon header__icon--account">
          <span class="u-visually-hidden">Account</span>
          <svg class="icon icon--account">
  <use xlink:href="/assets/icons/icons.svg#account"></use>
</svg>

        </button>
                <button class="header__icon header__icon--cart header__icon--cart--button js-header-icon-empty-cart js-header-icon--cart">
          <span class="u-visually-hidden">Cart</span>
          <svg class="icon icon--cart">
  <use xlink:href="/assets/icons/icons.svg#cart"></use>
</svg>

          <svg class="icon icon--cart-item">
  <use xlink:href="/assets/icons/icons.svg#cart-item"></use>
</svg>

        </button>
                <a href="#" class="header__icon header__icon--cart header__icon--cart--link js-header-icon-empty-cart">
          <span class="u-visually-hidden">Cart</span>
          <svg class="icon icon--cart">
  <use xlink:href="/assets/icons/icons.svg#cart"></use>
</svg>

          <svg class="icon icon--cart-item">
  <use xlink:href="/assets/icons/icons.svg#cart-item"></use>
</svg>

        </a>
                <button class="header-nav__country js-modal-open-link" data-modal-id="country-selector">
          <img class="header-nav__country-image" src="/assets/images/flag-us.png" alt="US" width="31" height="20">
          <span class="header-nav__country-label">US</span>
        </button>
            </div>
        </div>
        <div class="header-search header-flyout header-flyout--search js-header-search">
            <form class="header-search__form">
                <input class="header-search__input js-header-search-input" type="text" placeholder="Search on Maui Jim">
                <button class="header-search__button js-header-search-button" type="reset">
          <span class="u-visually-hidden">Clear</span>
          <svg class="icon icon--search">
  <use xlink:href="/assets/icons/icons.svg#search"></use>
</svg>

          <svg class="icon icon--close-large">
  <use xlink:href="/assets/icons/icons.svg#close-large"></use>
</svg>

        </button>
            </form>
            <div class="header-search__list">
                <span class="header-search__list-label">Latest Search</span>
                <ul class="header-search__list-items">
                    <li class="header-search__list-item">
                        <a class="header-search__list-link js-header-search-list-link" href="#">Koko Head</a>
                    </li>
                    <li class="header-search__list-item">
                        <a class="header-search__list-link js-header-search-list-link" href="#">Tail Slide</a>
                    </li>
                </ul>
            </div>
            <div class="header-search__list">
                <span class="header-search__list-label">Popular Searches</span>
                <ul class="header-search__list-items">
                    <li class="header-search__list-item">
                        <a class="header-search__list-link js-header-search-list-link" href="#">Aviators</a>
                    </li>
                    <li class="header-search__list-item">
                        <a class="header-search__list-link js-header-search-list-link" href="#">Man</a>
                    </li>
                    <li class="header-search__list-item">
                        <a class="header-search__list-link js-header-search-list-link" href="#">Surf</a>
                    </li>
                    <li class="header-search__list-item">
                        <a class="header-search__list-link js-header-search-list-link" href="#">Vintage</a>
                    </li>
                </ul>
            </div>
            <div class="header-search__results">
                <a class="header-search__result-link" href="#">View all results <svg class="icon icon--arrow-right">
  <use xlink:href="/assets/icons/icons.svg#arrow-right"></use>
</svg>
</a>
                <div class="search-autocomplete-result">
                    <a class="search-autocomplete-result__link" href="#">
            <span class="search-autocomplete-result__image-container">
              <img class="search-autocomplete-result__image" src="/assets/images/search-autocomplete-medium.jpg" sizes="(min-width: 681px) 50vw, 25vw"
                srcset="/assets/images/search-autocomplete-small.jpg 75w, /assets/images/search-autocomplete-medium.jpg 340w">
            </span>
            <span class="search-autocomplete-result__title">Ho&#x27;okipa Reader Universal Fit</span>
          </a>
                </div>
                <div class="search-autocomplete-result">
                    <a class="search-autocomplete-result__link" href="#">
            <span class="search-autocomplete-result__image-container">
              <img class="search-autocomplete-result__image" src="/assets/images/search-autocomplete-medium.jpg" sizes="(min-width: 681px) 50vw, 25vw"
                srcset="/assets/images/search-autocomplete-small.jpg 75w, /assets/images/search-autocomplete-medium.jpg 340w">
            </span>
            <span class="search-autocomplete-result__title">Sandy Beach Universal Fit</span>
          </a>
                </div>
                <div class="search-autocomplete-result">
                    <a class="search-autocomplete-result__link" href="#">
            <span class="search-autocomplete-result__image-container">
              <img class="search-autocomplete-result__image" src="/assets/images/search-autocomplete-medium.jpg" sizes="(min-width: 681px) 50vw, 25vw"
                srcset="/assets/images/search-autocomplete-small.jpg 75w, /assets/images/search-autocomplete-medium.jpg 340w">
            </span>
            <span class="search-autocomplete-result__title">Hanalei Universal Fit</span>
          </a>
                </div>
            </div>
        </div>
        <div class="header-cart header-cart--default header-cart--tax header-flyout header-flyout--cart js-header-cart">
            <div class="header-cart__header">
                <span class="header-cart__title">Your Cart <svg class="icon icon--arrow-right">
  <use xlink:href="/assets/icons/icons.svg#arrow-right"></use>
</svg>
</span>
                <span class="header-cart__item-count header-cart__item-count--empty">0 items</span>
            </div>
            <div class="header-cart__empty">
                <div class="header-cart__empty-inner">
                    <img class="header-cart__empty-brand-logo" src="/assets/images/mauijim-brand-mark-grey-small.png">
                    <span class="header-cart__empty-label">Your Shopping Cart is Empty</span>
                    <a class="header-cart__empty-button button button--primary">Shop Now</a>
                </div>
            </div>
        </div>
        <div class="header-flyout-overlay js-header-flyout-overlay"></div>
    </div>
</header>

<main class="main">
    <h2 class="page-title page-title--contact-us">Need Assistance? Contact Us</h2>
    <form class="contact-us js-contact-us u-page-width-max-restricted">
        <div class="contact-us__form-items">
            <div class="form-item form-item--text form-item--contact-us-first-name form-item--required">
                <label for="contact-us-first-name" class="label label--text label--required">First name</label>
                <input type="text" id="contact-us-first-name" name="first-name" class="input input--text" autocomplete="given-name">
            </div>
            <div class="form-item form-item--text form-item--contact-us-last-name form-item--required">
                <label for="contact-us-last-name" class="label label--text label--required">Last name</label>
                <input type="text" id="contact-us-last-name" name="last-name" class="input input--text" autocomplete="family-name">
            </div>
            <div class="form-item form-item--text form-item--contact-us-company">
                <label for="contact-us-company" class="label label--text">Company</label>
                <input type="text" id="contact-us-company" name="company" class="input input--text" placeholder="Optional" autocomplete="organization">
            </div>
            <div class="form-item form-item--email form-item--contact-us-email form-item--required">
                <label for="contact-us-email" class="label label--email label--required">Email address</label>
                <input type="email" id="contact-us-email" name="email" class="input input--email" autocomplete="email">
            </div>
            <div class="form-item form-item--select form-item--required">
                <label for="contact-us-inquiry-reason" class="label label--required">Reason of inquiry</label>
                <div class="select-wrapper">
                    <select id="contact-us-inquiry-reason" name="inquiry-reason" class="select js-select">
          <option value="">Select</option>
          <option value="repair">Repair</option>
          <option value="corporate">Corporate gift</option>
          <option value="golf">Golf event</option>
          <option value="general">General Questions</option>
        </select>
                </div>
            </div>
            <div class="contact-us__additional-options js-contact-us-additional-options js-hidden" data-options-id="repair">
                <div class="form-item form-item--select form-item--required">
                    <label for="contact-us-repair-prescription" class="label label--required">Are your sunglasses prescription?</label>
                    <div class="select-wrapper">
                        <select id="contact-us-repair-prescription" name="repair-prescription" class="select js-select">
            <option value="">Select</option>
            <option value="yes">Yes</option>
            <option value="no">No</option>
          </select>
                    </div>
                </div>
            </div>
            <div class="contact-us__additional-options js-contact-us-additional-options js-hidden" data-options-id="corporate">
                <div class="form-item form-item--text form-item--contact-us-order-address1 form-item--required">
                    <label for="contact-us-order-address1" class="label label--text label--required">Address 1</label>
                    <input type="text" id="contact-us-order-address1" name="order-address1" class="input input--text" autocomplete="address-line1">
                </div>
                <div class="form-item form-item--text form-item--contact-us-order-address2">
                    <label for="contact-us-order-address2" class="label label--text">Address 2</label>
                    <input type="text" id="contact-us-order-address2" name="order-address2" class="input input--text" placeholder="Optional" autocomplete="address-line2">
                </div>
                <div class="form-item form-item--text form-item--contact-us-order-city form-item--required">
                    <label for="contact-us-order-city" class="label label--text label--required">City</label>
                    <input type="text" id="contact-us-order-city" name="order-city" class="input input--text" autocomplete="address-level2">
                </div>
                <div class="form-item form-item--select form-item--required">
                    <label for="contact-us-order-state" class="label label--required">State</label>
                    <div class="select-wrapper">
                        <select id="contact-us-order-state" name="order-state" class="select js-select" autocomplete="address-level1">
            <option value="">Select</option>
            <option value="AL">Alabama</option>
            <option value="AK">Alaska</option>
            <option value="AS">American Samoa</option>
            <option value="AZ">Arizona</option>
            <option value="AR">Arkansas</option>
            <option value="CA">California</option>
            <option value="CO">Colorado</option>
            <option value="CT">Connecticut</option>
            <option value="DE">Delaware</option>
            <option value="DC">District Of Columbia</option>
            <option value="FM">Federated States Of Micronesia</option>
            <option value="FL">Florida</option>
            <option value="GA">Georgia</option>
            <option value="GU">Guam</option>
            <option value="HI">Hawaii</option>
            <option value="ID">Idaho</option>
            <option value="IL">Illinois</option>
            <option value="IN">Indiana</option>
            <option value="IA">Iowa</option>
            <option value="KS">Kansas</option>
            <option value="KY">Kentucky</option>
            <option value="LA">Louisiana</option>
            <option value="ME">Maine</option>
            <option value="MH">Marshall Islands</option>
            <option value="MD">Maryland</option>
            <option value="MA">Massachusetts</option>
            <option value="MI">Michigan</option>
            <option value="MN">Minnesota</option>
            <option value="MS">Mississippi</option>
            <option value="MO">Missouri</option>
            <option value="MT">Montana</option>
            <option value="NE">Nebraska</option>
            <option value="NV">Nevada</option>
            <option value="NH">New Hampshire</option>
            <option value="NJ">New Jersey</option>
            <option value="NM">New Mexico</option>
            <option value="NY">New York</option>
            <option value="NC">North Carolina</option>
            <option value="ND">North Dakota</option>
            <option value="MP">Northern Mariana Islands</option>
            <option value="OH">Ohio</option>
            <option value="OK">Oklahoma</option>
            <option value="OR">Oregon</option>
            <option value="PW">Palau</option>
            <option value="PA">Pennsylvania</option>
            <option value="PR">Puerto Rico</option>
            <option value="RI">Rhode Island</option>
            <option value="SC">South Carolina</option>
            <option value="SD">South Dakota</option>
            <option value="TN">Tennessee</option>
            <option value="TX">Texas</option>
            <option value="UT">Utah</option>
            <option value="VT">Vermont</option>
            <option value="VI">Virgin Islands</option>
            <option value="VA">Virginia</option>
            <option value="WA">Washington</option>
            <option value="WV">West Virginia</option>
            <option value="WI">Wisconsin</option>
            <option value="WY">Wyoming</option>
          </select>
                    </div>
                </div>
                <div class="form-item form-item--text form-item--contact-us-order-zip-code form-item--required">
                    <label for="contact-us-order-zip-code" class="label label--text label--required">ZIP code</label>
                    <input type="text" id="contact-us-order-zip-code" name="order-zip-code" class="input input--text" autocomplete="postal-code">
                </div>
                <div class="form-item form-item--select form-item--required">
                    <label for="contact-us-order-country" class="label label--required">Country</label>
                    <div class="select-wrapper">
                        <select id="contact-us-order-country" name="order-country" class="select js-select" autocomplete="country">
            <option value="">Select</option>
            <option value="USA">United States</option>
            <option value="AUS">Australia</option>
            <option value="CAN">Canada</option>
            <option value="FRA">France</option>
            <option value="GER">Germany</option>
            <option value="HK">Hong Kong</option>
            <option value="IND">India</option>
            <option value="IRE">Ireland</option>
            <option value="ITA">Italy</option>
            <option value="MEX">Mexico</option>
            <option value="NZE">New Zealand</option>
            <option value="SAF">South Africa</option>
            <option value="SPA">Spain</option>
            <option value="SWE">Sweden</option>
            <option value="UAE">United Arab Emirates</option>
            <option value="UK">United Kingdom</option>
          </select>
                    </div>
                </div>
                <div class="form-item form-item--tel form-item--contact-us-order-phone form-item--required">
                    <label for="contact-us-order-phone" class="label label--tel label--required">Phone number</label>
                    <input type="tel" id="contact-us-order-phone" name="order-phone" class="input input--tel" autocomplete="tel">
                </div>
            </div>
            <div class="contact-us__additional-options js-contact-us-additional-options js-hidden" data-options-id="golf">
                <div class="contact-us__options-group form-item form-item--checkboxes">
                    <label for="" class="label label--required">How can we help you? (Select all that apply)</label>
                    <div class="form-item form-item--checkbox">
                        <input type="checkbox" id="contact-us-golf-help-contact" name="golf-help" class="checkbox checkbox--default">
                        <label for="contact-us-golf-help-contact">
            Have a Maui Jim representative contact me
            
          </label>
                    </div>
                    <div class="form-item form-item--checkbox">
                        <input type="checkbox" id="contact-us-golf-help-catalog" name="golf-help" class="checkbox checkbox--default">
                        <label for="contact-us-golf-help-catalog">
            Send me a catalog
            
          </label>
                    </div>
                </div>
                <div class="contact-us__options-group">
                    <div class="form-item form-item--select">
                        <label for="contact-us-golf-id" class="label">I am a... (Select one)</label>
                        <div class="select-wrapper">
                            <select id="contact-us-golf-id" name="golf-id" class="select js-select">
              <option value="">Select</option>
              <option value="charity-event">Charity event</option>
              <option value="member-guest">Member guest</option>
              <option value="golf-pro">Golf pro</option>
              <option value="current-account">Current account</option>
              <option value="end-user">End user</option>
              <option value="other">Other</option>
            </select>
                        </div>
                    </div>
                    <div class="form-item form-item--text form-item--contact-us-golf-id-other">
                        <label for="contact-us-golf-id-other" class="label label--text">Other</label>
                        <input type="text" id="contact-us-golf-id-other" name="golf-id-other" class="input input--text">
                    </div>
                </div>
                <div class="contact-us__options-group">
                    <div class="form-item form-item--text form-item--contact-us-golf-address1 form-item--required">
                        <label for="contact-us-golf-address1" class="label label--text label--required">Address 1</label>
                        <input type="text" id="contact-us-golf-address1" name="golf-address1" class="input input--text" autocomplete="address-line1">
                    </div>
                    <div class="form-item form-item--text form-item--contact-us-golf-address2">
                        <label for="contact-us-golf-address2" class="label label--text">Address 2</label>
                        <input type="text" id="contact-us-golf-address2" name="golf-address2" class="input input--text" placeholder="Optional" autocomplete="address-line2">
                    </div>
                    <div class="form-item form-item--text form-item--contact-us-golf-city form-item--required">
                        <label for="contact-us-golf-city" class="label label--text label--required">City</label>
                        <input type="text" id="contact-us-golf-city" name="golf-city" class="input input--text" autocomplete="address-level2">
                    </div>
                    <div class="form-item form-item--select form-item--required">
                        <label for="contact-us-golf-state" class="label label--required">State</label>
                        <div class="select-wrapper">
                            <select id="contact-us-golf-state" name="golf-state" class="select js-select" autocomplete="address-level1">
              <option value="">Select</option>
              <option value="AL">Alabama</option>
              <option value="AK">Alaska</option>
              <option value="AS">American Samoa</option>
              <option value="AZ">Arizona</option>
              <option value="AR">Arkansas</option>
              <option value="CA">California</option>
              <option value="CO">Colorado</option>
              <option value="CT">Connecticut</option>
              <option value="DE">Delaware</option>
              <option value="DC">District Of Columbia</option>
              <option value="FM">Federated States Of Micronesia</option>
              <option value="FL">Florida</option>
              <option value="GA">Georgia</option>
              <option value="GU">Guam</option>
              <option value="HI">Hawaii</option>
              <option value="ID">Idaho</option>
              <option value="IL">Illinois</option>
              <option value="IN">Indiana</option>
              <option value="IA">Iowa</option>
              <option value="KS">Kansas</option>
              <option value="KY">Kentucky</option>
              <option value="LA">Louisiana</option>
              <option value="ME">Maine</option>
              <option value="MH">Marshall Islands</option>
              <option value="MD">Maryland</option>
              <option value="MA">Massachusetts</option>
              <option value="MI">Michigan</option>
              <option value="MN">Minnesota</option>
              <option value="MS">Mississippi</option>
              <option value="MO">Missouri</option>
              <option value="MT">Montana</option>
              <option value="NE">Nebraska</option>
              <option value="NV">Nevada</option>
              <option value="NH">New Hampshire</option>
              <option value="NJ">New Jersey</option>
              <option value="NM">New Mexico</option>
              <option value="NY">New York</option>
              <option value="NC">North Carolina</option>
              <option value="ND">North Dakota</option>
              <option value="MP">Northern Mariana Islands</option>
              <option value="OH">Ohio</option>
              <option value="OK">Oklahoma</option>
              <option value="OR">Oregon</option>
              <option value="PW">Palau</option>
              <option value="PA">Pennsylvania</option>
              <option value="PR">Puerto Rico</option>
              <option value="RI">Rhode Island</option>
              <option value="SC">South Carolina</option>
              <option value="SD">South Dakota</option>
              <option value="TN">Tennessee</option>
              <option value="TX">Texas</option>
              <option value="UT">Utah</option>
              <option value="VT">Vermont</option>
              <option value="VI">Virgin Islands</option>
              <option value="VA">Virginia</option>
              <option value="WA">Washington</option>
              <option value="WV">West Virginia</option>
              <option value="WI">Wisconsin</option>
              <option value="WY">Wyoming</option>
            </select>
                        </div>
                    </div>
                    <div class="form-item form-item--text form-item--contact-us-golf-zip-code form-item--required">
                        <label for="contact-us-golf-zip-code" class="label label--text label--required">ZIP code</label>
                        <input type="text" id="contact-us-golf-zip-code" name="golf-zip-code" class="input input--text" autocomplete="postal-code">
                    </div>
                    <div class="form-item form-item--select form-item--required">
                        <label for="contact-us-golf-country" class="label label--required">Country</label>
                        <div class="select-wrapper">
                            <select id="contact-us-golf-country" name="golf-country" class="select js-select" autocomplete="country">
              <option value="">Select</option>
              <option value="USA">United States</option>
              <option value="AUS">Australia</option>
              <option value="CAN">Canada</option>
              <option value="FRA">France</option>
              <option value="GER">Germany</option>
              <option value="HK">Hong Kong</option>
              <option value="IND">India</option>
              <option value="IRE">Ireland</option>
              <option value="ITA">Italy</option>
              <option value="MEX">Mexico</option>
              <option value="NZE">New Zealand</option>
              <option value="SAF">South Africa</option>
              <option value="SPA">Spain</option>
              <option value="SWE">Sweden</option>
              <option value="UAE">United Arab Emirates</option>
              <option value="UK">United Kingdom</option>
            </select>
                        </div>
                    </div>
                    <div class="form-item form-item--tel form-item--contact-us-golf-phone form-item--required">
                        <label for="contact-us-golf-phone" class="label label--tel label--required">Phone number</label>
                        <input type="tel" id="contact-us-golf-phone" name="golf-phone" class="input input--tel" autocomplete="tel">
                    </div>
                </div>
            </div>
            <div class="form-item form-item--textarea form-item--required">
                <label for="contact-us-comments" class="label label--required">Comments</label>
                <textarea id="contact-us-comments" class="textarea"></textarea>
            </div>
        </div>
        <div class="contact-us__actions">
            <button class="button button--primary">Submit</button>
        </div>
    </form>

    <div class="contact-info contact-info--email u-page-width-max-restricted">
        <h2 class="contact-info__title">Contact Information</h2>
        <div class="contact-info__section-group">
            <div class="contact-info__section">
                <div class="contact-info__item">
                    <span class="contact-info__item-label">For general questions and information:</span>
                    <a class="contact-info__item-value" href="mailto:sales.us@mauijim.com">
          <svg class="icon icon--action-mail">
  <use xlink:href="/assets/icons/icons.svg#action-mail"></use>
</svg>

          sales.us@mauijim.com
        </a>
                </div>
                <div class="contact-info__item">
                    <span class="contact-info__item-label">For employment questions and information:</span>
                    <a class="contact-info__item-value" href="mailto:hr.us@mauijim.com">
          <svg class="icon icon--action-mail">
  <use xlink:href="/assets/icons/icons.svg#action-mail"></use>
</svg>

          hr.us@mauijim.com
        </a>
                </div>
            </div>
            <div class="contact-info__section">
                <div class="contact-info__item">
                    <span class="contact-info__item-label">For product repairs:</span>
                    <a class="contact-info__item-value" href="mailto:repair.us@mauijim.com">
          <svg class="icon icon--action-mail">
  <use xlink:href="/assets/icons/icons.svg#action-mail"></use>
</svg>

          repair.us@mauijim.com
        </a>
                </div>
                <div class="contact-info__item">
                    <span class="contact-info__item-label">For website concerns and technical help:</span>
                    <a class="contact-info__item-value" href="mailto:webmamster.us@mauijim.com">
          <svg class="icon icon--action-mail">
  <use xlink:href="/assets/icons/icons.svg#action-mail"></use>
</svg>

          webmaster.us@mauijim.com
        </a>
                </div>
            </div>
        </div>
    </div>

    <div class="contact-info contact-info--phone-address u-page-width-max-restricted">
        <div class="contact-info__section-group">
            <div class="contact-info__section">
                <h3 class="contact-info__section-label">Mainland US</h3>
                <div class="contact-info__item">
                    <span class="contact-info__item-label">General Questions</span>
                    <a class="contact-info__item-value" href="tel:+8886665905">
          <svg class="icon icon--action-phone">
  <use xlink:href="/assets/icons/icons.svg#action-phone"></use>
</svg>

          888-666-5905
        </a>
                </div>
                <div class="contact-info__item">
                    <span class="contact-info__item-label">Repairs</span>
                    <a class="contact-info__item-value" href="tel:+8886665602">
          <svg class="icon icon--action-phone">
  <use xlink:href="/assets/icons/icons.svg#action-phone"></use>
</svg>

          888-666-5602
        </a>
                </div>
                <div class="contact-info__item">
                    <span class="contact-info__item-value">
          <svg class="icon icon--action-location">
  <use xlink:href="/assets/icons/icons.svg#action-location"></use>
</svg>

          One Aloha Lane Peoria, IL 61615
        </span>
                </div>
            </div>
            <div class="contact-info__section">
                <h3 class="contact-info__section-label">Hawaii</h3>
                <div class="contact-info__item">
                    <span class="contact-info__item-label">General Questions</span>
                    <a class="contact-info__item-value" href="tel:+8883522001">
          <svg class="icon icon--action-phone">
  <use xlink:href="/assets/icons/icons.svg#action-phone"></use>
</svg>

          888-352-2001
        </a>
                </div>
                <div class="contact-info__item">
                    <span class="contact-info__item-label">Repairs</span>
                    <a class="contact-info__item-value" href="tel:+8883522002">
          <svg class="icon icon--action-phone">
  <use xlink:href="/assets/icons/icons.svg#action-phone"></use>
</svg>

          888-352-2002
        </a>
                </div>
                <div class="contact-info__item">
                    <span class="contact-info__item-value">
          <svg class="icon icon--action-location">
  <use xlink:href="/assets/icons/icons.svg#action-location"></use>
</svg>

          721 Wainee St. Lahaina, HI 96761
        </span>
                </div>
            </div>
        </div>
    </div>

    <div class="contact-info contact-info--block u-page-width-max-restricted">
        <h2 class="contact-info__title">Customer Support</h2>
        <div class="contact-info__section-group">
            <div class="contact-info__section">
                <h3 class="contact-info__section-label">Warranty</h3>
                <div class="contact-info__item">
                    <span class="contact-info__item-value">
          
          Our sunglasses are warranted to the original purchaser for two years from the date of purchase against any defect in materials and workmanship. Nose pads and temples are free as long as the parts are available. We’ll repair or replace at our option, any pair of Maui Jims found to be defective and exclusive of damage caused by improper or unreasonable use.
        </span>
                </div>
            </div>
            <div class="contact-info__section">
                <h3 class="contact-info__section-label">Returns</h3>
                <div class="contact-info__item">
                    <span class="contact-info__item-value">
          
          Our satisfaction is our priority. You may return your merchandise purchased from the Maui Jim website for credit within 30 days of your purchase.  All returns must be in the original case and/or packaging and in perfect resalable condition for credit.
        </span>
                </div>
                <a class="contact-info__call-to-action button button--outlined" href="callToAction.path">Start Your Return</a>
            </div>
        </div>
        <div class="contact-info__section-group">
            <div class="contact-info__section">
                <h3 class="contact-info__section-label">Repairs</h3>
                <div class="contact-info__item">
                    <span class="contact-info__item-value">
          
          Need to repair your sunglasses?
        </span>
                </div>
                <a class="contact-info__call-to-action button button--outlined" href="callToAction.path">Need a Repair?</a>
            </div>
            <div class="contact-info__section">
                <h3 class="contact-info__section-label">FAQs</h3>
                <div class="contact-info__item">
                    <span class="contact-info__item-value">
          
          Check out our Frequently Asked Questions.
        </span>
                </div>
                <a class="contact-info__call-to-action button button--outlined" href="callToAction.path">FAQS</a>
            </div>
        </div>
    </div>

</main>
<div class="subscribe">
    <div class="u-page-width-max">
        <div class="subscribe__text">
            <h5 class="subscribe__header">Subscribe to our &#x27;ohana</h5>
            <span class="subscribe__description">Keep up with the Latest Products and News.</span>
        </div>
        <div class="subscribe-form-wrapper subscribe-form-wrapper--default js-subscribe-form js-subscribe-form--default">
            <form class="subscribe-form">
                <input class="subscribe-form__input js-subscribe-form-input" type="text" placeholder="Your Email" autocomplete="email">
                <button class="subscribe-form__submit button button--primary">
      <span class="subscribe-form__submit-label">Subscribe</span>
      <svg class="icon icon--submit-mail">
  <use xlink:href="/assets/icons/icons.svg#submit-mail"></use>
</svg>

    </button>
            </form>
            <div class="subscribe-form-status">
                <span class="subscribe-form-status__message js-subscribe-status-message"></span>
                <span class="subscribe-form-status__close js-subscribe-status-close-button">
      <svg class="icon icon--close-large">
  <use xlink:href="/assets/icons/icons.svg#close-large"></use>
</svg>

    </span>
            </div>
            <span class="subscribe-form-legal">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. <a class="subscribe-form-legal__link" href="#">Privacy Policy</a>
  </span>
        </div>

    </div>
</div>

<footer class="footer footer--default">
    <div class="footer-nav u-page-width-max">
        <a class="footer-nav__action footer-nav__action--phone" href="tel:+1800229933">
      1-888-666-5905
      <svg class="icon icon--action-phone">
  <use xlink:href="/assets/icons/icons.svg#action-phone"></use>
</svg>

    </a>
        <a class="footer-nav__action footer-nav__action--contact" href="#">
      Contact Us
      <svg class="icon icon--action-mail">
  <use xlink:href="/assets/icons/icons.svg#action-mail"></use>
</svg>

    </a>
        <a class="footer-nav__action footer-nav__action--retailers" href="#">
      Find a Retailer
      <svg class="icon icon--action-location">
  <use xlink:href="/assets/icons/icons.svg#action-location"></use>
</svg>

    </a>
        <div class="footer-nav__menus">
            <div class="footer-nav__menu-column">
                <div class="footer-nav__menu js-footer-nav-menu">
                    <button class="footer-nav__menu-button js-footer-nav-button">
            Maui Jim
            <svg class="icon icon--arrow-up">
  <use xlink:href="/assets/icons/icons.svg#arrow-up"></use>
</svg>

            <svg class="icon icon--arrow-right">
  <use xlink:href="/assets/icons/icons.svg#arrow-right"></use>
</svg>

            <svg class="icon icon--arrow-down">
  <use xlink:href="/assets/icons/icons.svg#arrow-down"></use>
</svg>

          </button>
                    <ul class="footer-nav__menu-items">
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">About Us</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Contact Us</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Technology</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Golf Events</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Corporate Gifts</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link js-modal-open-link" href="#" data-modal-id="data-protection">Careers</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Austine Wood Comarow Polage ® Art</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Trade Login</a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="footer-nav__menu-column">
                <div class="footer-nav__menu js-footer-nav-menu">
                    <button class="footer-nav__menu-button js-footer-nav-button">
            Customer Service
            <svg class="icon icon--arrow-up">
  <use xlink:href="/assets/icons/icons.svg#arrow-up"></use>
</svg>

            <svg class="icon icon--arrow-right">
  <use xlink:href="/assets/icons/icons.svg#arrow-right"></use>
</svg>

            <svg class="icon icon--arrow-down">
  <use xlink:href="/assets/icons/icons.svg#arrow-down"></use>
</svg>

          </button>
                    <ul class="footer-nav__menu-items">
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Order Status</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Repairs</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Returns</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Product Registration</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Prescription</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Retailers</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">FAQs</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Shipping Information</a>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="footer-nav__menu-column">
                <div class="footer-nav__menu js-footer-nav-menu">
                    <button class="footer-nav__menu-button js-footer-nav-button">
            Legal
            <svg class="icon icon--arrow-up">
  <use xlink:href="/assets/icons/icons.svg#arrow-up"></use>
</svg>

            <svg class="icon icon--arrow-right">
  <use xlink:href="/assets/icons/icons.svg#arrow-right"></use>
</svg>

            <svg class="icon icon--arrow-down">
  <use xlink:href="/assets/icons/icons.svg#arrow-down"></use>
</svg>

          </button>
                    <ul class="footer-nav__menu-items">
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Terms of Use</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Privacy Policy</a>
                        </li>
                    </ul>
                </div>
                <div class="footer-nav__menu js-footer-nav-menu">
                    <button class="footer-nav__menu-button js-footer-nav-button">
            Gift Cards
            <svg class="icon icon--arrow-up">
  <use xlink:href="/assets/icons/icons.svg#arrow-up"></use>
</svg>

            <svg class="icon icon--arrow-right">
  <use xlink:href="/assets/icons/icons.svg#arrow-right"></use>
</svg>

            <svg class="icon icon--arrow-down">
  <use xlink:href="/assets/icons/icons.svg#arrow-down"></use>
</svg>

          </button>
                    <ul class="footer-nav__menu-items">
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">VIP &amp; Gift Cardholder</a>
                        </li>
                        <li class="footer-nav__menu-item">
                            <a class="footer-nav__menu-link" href="#">Shop Gift Card</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="footer-nav__forms">
            <form class="footer__retailer-form">
                <label class="footer__retailer-label" for="footer__retailer-input">Retailers</label>
                <input class="footer__retailer-input" name="footer__retailer-input" type="text" placeholder="ZIP code or City" />
                <button class="footer__retailer-submit" type="submit">
          <svg class="icon icon--angle-right">
  <use xlink:href="/assets/icons/icons.svg#angle-right"></use>
</svg>

        </button>
            </form>
            <div class="subscribe-form-wrapper subscribe-form-wrapper--mini js-subscribe-form js-subscribe-form--default">
                <form class="subscribe-form">
                    <input class="subscribe-form__input js-subscribe-form-input" type="text" placeholder="Subscribe to Our &#x27;Ohana" autocomplete="email">
                    <button class="subscribe-form__submit button button--primary">
      <span class="subscribe-form__submit-label">Subscribe</span>
      <svg class="icon icon--submit-mail">
  <use xlink:href="/assets/icons/icons.svg#submit-mail"></use>
</svg>

    </button>
                </form>
                <div class="subscribe-form-status">
                    <span class="subscribe-form-status__message js-subscribe-status-message"></span>
                    <span class="subscribe-form-status__close js-subscribe-status-close-button">
      <svg class="icon icon--close-large">
  <use xlink:href="/assets/icons/icons.svg#close-large"></use>
</svg>

    </span>
                </div>
                <span class="subscribe-form-legal">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. <a class="subscribe-form-legal__link" href="#">Privacy Policy</a>
  </span>
            </div>

        </div>
    </div>
    <div class="footer__bottom">
        <div class="u-page-width-max">
            <a class="footer__geo footer__geo--country js-modal-open-link" data-modal-id="country-selector" href="#">
        <span class="footer__geo-label">Country:</span>
        <span class="footer__geo-current">
          United Arab Emirates
          <svg class="icon icon--arrow-right">
  <use xlink:href="/assets/icons/icons.svg#arrow-right"></use>
</svg>

        </span>
      </a>
            <a class="footer__geo footer__geo--language js-modal-open-link" data-modal-id="language-selector" href="#">
        <span class="footer__geo-current">
          English
          <svg class="icon icon--arrow-right">
  <use xlink:href="/assets/icons/icons.svg#arrow-right"></use>
</svg>

        </span>
      </a>
            <ul class="social-icons">
                <li class="social-icons__item">
                    <a class="social-icons__link" href="#"><svg class="icon icon--social-twitter">
  <use xlink:href="/assets/icons/icons.svg#social-twitter"></use>
</svg>
</a>
                </li>
                <li class="social-icons__item">
                    <a class="social-icons__link" href="#"><svg class="icon icon--social-facebook">
  <use xlink:href="/assets/icons/icons.svg#social-facebook"></use>
</svg>
</a>
                </li>
                <li class="social-icons__item">
                    <a class="social-icons__link" href="#"><svg class="icon icon--social-instagram">
  <use xlink:href="/assets/icons/icons.svg#social-instagram"></use>
</svg>
</a>
                </li>
            </ul>

        </div>
    </div>
    <div class="footer__copyright">
        <img class="footer__copyright-logo" src="/assets/images/mauijim-brand-logo-monochromatic.svg">
        <span class="footer__copyright-text">©2016 Maui Jim, Inc. Lahana, Hawaii</span>
    </div>
</footer>
{{render '@header--maui-jim--empty-cart'}}
<main class="main">
  <h2 class="page-title page-title--contact-us">Need Assistance? Contact Us</h2>
  {{render '@contact-us'}}
  {{render '@contact-info--email'}}
  {{render '@contact-info--phone-address'}}
  {{render '@contact-info--customer-support'}}
</main>
{{render '@subscribe'}}
{{render '@footer'}}
/* No context defined for this component. */
  • Content:
    .page-title--contact-us {
      margin: 0;
      padding-top: 30px;
      border: 0;
      font-size: 2.4rem;
      font-weight: $font-weight-bold;
      letter-spacing: 3px;
      line-height: 2.8rem;
      text-align: center;
      text-transform: uppercase;
    
      @include breakpoint($breakpoint-md) {
        font-size: 2.7rem;
        letter-spacing: 3px;
        line-height: 3.2rem;
      }
    
      @include breakpoint($breakpoint-xl) {
        padding-top: 80px;
        font-size: 5.7rem;
        letter-spacing: $contact-us-title-letter-spacing-xl;
        line-height: 6.8rem;
      }
    }
    
  • URL: /components/raw/contact-us-page/contact-us-page.scss
  • Filesystem Path: src/components/03-pages/contact-us-page/contact-us-page.scss
  • Size: 518 Bytes

There are no notes for this item.