Markup for 2022 3rd Party Header
<script>document.getElementsByTagName("html")[0].className += " js";</script>
<link rel="stylesheet" href="https://cluballiance.aaa.com/css/third-party-header-redesign.css">
<div id="aaa-third-party-header" class="header-wrap">
<header id="desktop-menu-main" class="mega-nav mega-nav--mobile mega-nav--desktop@md position-relative js-mega-nav">
<div class="mega-nav__container">
<a href="https://cluballiance.aaa.com/" class="mega-nav__logo" aria-label="Cluballince Logo">
<img src="https://cluballiance.aaa.com/img/menu-icons/aaa-logo.svg" alt="cluballiance logo">
</a>
<button class="hamburger hamburger--3dx btn-open first show-tablet" type="button">
<span class="hide-mobile bold" aria-haspopup="true" aria-controls="mobile menu">Menu</span>
<span class="hide-desktop hamburger-box">
<span class="hamburger-inner"></span>
<span class="visuallyhidden">menu button</span>
</span>
</button>
<div class="mega-nav__nav js-mega-nav__nav" id="mega-nav-navigation" role="navigation"
aria-label="Main">
<nav class="mega-nav__nav-inner" aria-label="main menu">
<ul class="mega-nav__items show-desktop" role="menubar">
<li class="mega-nav__label">Menu</li>
<li class="mega-nav__item js-mega-nav__item">
<a href="https://cluballiance.aaa.com/automotive" class="reset mega-nav__control js-mega-nav__control js-tab-focus">
<span>Auto</span>
</a>
</li>
<li class="mega-nav__item js-mega-nav__item">
<a href="https://cluballiance.aaa.com/insurance" class="reset mega-nav__control js-mega-nav__control js-tab-focus">
<span>Insurance</span>
</a>
</li>
<li class="mega-nav__item js-mega-nav__item">
<a href="https://cluballiance.aaa.com/money" class="reset mega-nav__control js-mega-nav__control js-tab-focus">
<span>Money</span>
</a>
</li>
<li class="mega-nav__item js-mega-nav__item">
<a href="https://shop.cluballiance.aaa.com/" class="reset mega-nav__control js-mega-nav__control js-tab-focus">
<span>Shop</span>
</a>
</li>
<li class="mega-nav__item js-mega-nav__item">
<a href="https://cluballiance.aaa.com/travel" class="reset mega-nav__control js-mega-nav__control js-tab-focus">
<span>Travel</span>
</a>
</li>
</ul>
</nav>
</div>
</div>
</header>
<div class="overlay"></div>
<div id="mobile-menu-main" class="zeynep first third-party-mobile-menu" aria-labelledby="mobile menu">
<div class="wrap"
style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 2.5rem;">
<a href="#" class="mobile-mm-logo"><img src="https://cluballiance.aaa.com/img/menu-icons/aaa-logo.svg" alt="cluballiance logo"></a>
<button class="zeynep-close" aria-label="close">
<span>close</span>
</button>
</div>
<ul class="mobile-link-list">
<li>
<a href="https://cluballiance.aaa.com/automotive">Auto</a>
</li>
<li>
<a href="https://cluballiance.aaa.com/insurance">Insurance</a>
</li>
<li>
<a href="https://cluballiance.aaa.com/money">Money</a>
</li>
<li>
<a href="https://shop.cluballiance.aaa.com/">Shop</a>
</li>
<li>
<a href="https://cluballiance.aaa.com/travel" data-submenu="travel">Travel</a>
</li>
<li>
<a href="https://cluballiance.aaa.com/the-extra-mile" data-submenu="tem">The Extra Mile</a>
</li>
</ul>
</div>
</div>
<script src="https://cluballiance.aaa.com/scripts/jquery-3.6.0.min.js"></script>
<script src="https://cluballiance.aaa.com/js/aaa-third-party-header-menu.js"></script>