Log in UI
My Listers Log in UI.
<div class="c-hero c-hero--horizontal c-hero--overlay c-hero--mylisters">
<div class="c-hero__media">
<picture class="c-hero__picture">
<source srcset="/assets/img/content/sign-up/half_hero--mobile.avif" media="(max-width: 414px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--mobile-lg.avif" media="(min-width: 415px) and (max-width: 582px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--tablet.avif" media="(min-width: 582px) and (max-width: 834px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--tablet-lg.avif" media="(min-width: 835px) and (max-width: 1024px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--laptop.avif" media="(min-width: 1024px) and (max-width: 1264px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--desktop.avif" media="(min-width: 1265px)" type="image/avif">
<img class="c-hero__img c-img | o-fit" src="/assets/img/content/sign-up/half_hero--mobile.avif" width="800" height="1024" alt>
</picture>
</div>
<div class="c-hero__media-body">
<div class="c-hero__media-content">
<a class="c-logo c-logo--white | u-w-5 u-my" href="#">
<span class="u-hidden">Listers</span>
<svg class="c-logo__img | u-w-100%" width="72" height="21" viewBox="0 0 185 56" aria-hidden="true">
<g class="c-logo__type" id="type_paths">
<path d="M0 23.231h5.653v27.124h16.914v5.167h-22.567v-32.291"></path>
<path d="M28.22 23.231h5.654v32.291h-5.654z"></path>
<path d="M39.755 50.817l3.401-4.059c3.079 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.287-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.034 4.29c-2.895-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.803 1.66 10.341 4.105 10.341 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
<path d="M78.001 28.49h-10.204v-5.259h26.107v5.259h-10.204v27.032h-5.699v-27.032"></path>
<path d="M99.327 23.231h23.854v5.075h-18.201v8.396h16.133v5.075h-16.133v8.672h18.431v5.074h-24.084v-32.291"></path>
<path d="M129.569 23.231h14.341c4.045 0 7.216 1.2 9.284 3.229 1.7 1.753 2.666 4.152 2.666 6.966v.093c0 5.305-3.171 8.488-7.676 9.779l8.687 12.225h-6.665l-7.906-11.256h-7.078v11.256h-5.654v-32.291zm13.927 16.007c4.045 0 6.618-2.122 6.618-5.397v-.092c0-3.46-2.482-5.351-6.665-5.351h-8.227v10.841h8.273z"></path>
<path d="M160.088 50.817l3.401-4.059c3.08 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.286-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.033 4.29c-2.896-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.802 1.66 10.342 4.105 10.342 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
</g>
<g class="c-logo__swoosh" id="swoosh">
<path d="M159 24.028c-9.933-13.657-40.214-8.746-49.653-7.636-25.232-22.557-56.296-4.543-82.347-1.835 30.766-7.17 51.259-23.836 81.689-7.837 2.728 1.436 6.811 3.652 6.811 3.652 9.439-1.113 40.474-3.428 43.5 13.657z"></path>
</g>
</svg>
</a>
</div>
</div>
<div class="c-hero__body">
<div class="c-hero__body-header">
<a class="c-logo | u-w-5 u-my" href="#">
<span class="u-hidden">Listers</span>
<svg class="c-logo__img | u-w-100%" width="72" height="21" viewBox="0 0 185 56" aria-hidden="true">
<g class="c-logo__type" id="type_paths">
<path d="M0 23.231h5.653v27.124h16.914v5.167h-22.567v-32.291"></path>
<path d="M28.22 23.231h5.654v32.291h-5.654z"></path>
<path d="M39.755 50.817l3.401-4.059c3.079 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.287-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.034 4.29c-2.895-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.803 1.66 10.341 4.105 10.341 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
<path d="M78.001 28.49h-10.204v-5.259h26.107v5.259h-10.204v27.032h-5.699v-27.032"></path>
<path d="M99.327 23.231h23.854v5.075h-18.201v8.396h16.133v5.075h-16.133v8.672h18.431v5.074h-24.084v-32.291"></path>
<path d="M129.569 23.231h14.341c4.045 0 7.216 1.2 9.284 3.229 1.7 1.753 2.666 4.152 2.666 6.966v.093c0 5.305-3.171 8.488-7.676 9.779l8.687 12.225h-6.665l-7.906-11.256h-7.078v11.256h-5.654v-32.291zm13.927 16.007c4.045 0 6.618-2.122 6.618-5.397v-.092c0-3.46-2.482-5.351-6.665-5.351h-8.227v10.841h8.273z"></path>
<path d="M160.088 50.817l3.401-4.059c3.08 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.286-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.033 4.29c-2.896-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.802 1.66 10.342 4.105 10.342 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
</g>
<g class="c-logo__swoosh" id="swoosh">
<path d="M159 24.028c-9.933-13.657-40.214-8.746-49.653-7.636-25.232-22.557-56.296-4.543-82.347-1.835 30.766-7.17 51.259-23.836 81.689-7.837 2.728 1.436 6.811 3.652 6.811 3.652 9.439-1.113 40.474-3.428 43.5 13.657z"></path>
</g>
</svg>
</a>
</div>
<div class="c-hero__body-description | o-flow | u-max-30">
<div class="c-sub-header | t-sub-header--primary | u-mb-lg">
<div class="c-sub-header__description">
<div class="c-sub-header__heading">
<h1 class="c-hero-heading u-heading u-alpha">Log in</h1>
</div>
</div>
</div>
<form class="o-grid">
<label class="c-label | o-grid__item | u-col-12" for="user-name">
<span class="c-label__text | u-epsilon">User Name</span>
<span class="c-label__input">
<input class="c-input c-input--text" id="user-name" type="text" required autofocus>
</span>
</label>
<label class="c-label | o-grid__item | u-col-12" for="current-password" x-data="show_password($refs.input, $refs.btn)">
<span class="c-label__text | u-epsilon">
<span class="o-split">
<span class="o-split__title">Password</span>
<a class="u-size-sm" href="#forgot">Forgot Password?</a>
</span>
</span>
<span class="c-label__input">
<input class="c-input c-input--password" id="current-password" type="password" autocomplete="current-password" required x-ref="input">
<button class="c-label__btn | u-tc-blue-600 u-tc-:hover-blue-800" type="button" x-data x-bind="trigger" x-ref="btn" aria-label="Warning: this will display your password on screen." x-tooltip.content="Show/Hide Password" aria-expanded="false">
<svg class="c-icon" viewBox="0 0 16 16" aria-hidden="true" x-show.important="show == false">
<path fill-rule="nonzero" d="M8 3.002a8.43 8.43 0 0 1 3.559.739c.862.4 1.636.953 2.28 1.63a7.456 7.456 0 0 1 1.585 2.404l.075.226-.08.226C14.245 11.143 11.28 13.05 8 13 4.76 13 1.472 11.07.576 8.227L.501 8l.08-.226a7.57 7.57 0 0 1 1.58-2.404 7.534 7.534 0 0 1 2.28-1.63A8.429 8.429 0 0 1 8 3ZM8 4.43C5.447 4.354 3.104 5.77 2.089 8 3.104 10.234 5.447 11.649 8 11.573c2.553.076 4.895-1.34 5.911-3.571C12.897 5.768 10.553 4.352 8 4.43ZM8 10a2 2 0 1 0 0-4 2 2 0 0 0 0 4Z"></path>
</svg>
<svg class="c-icon" viewBox="0 0 16 16" aria-hidden="true" x-show.important="show" style="display: none !important;">
<path fill-rule="nonzero" d="m4.177.249 1.585 2.44A9.038 9.038 0 0 1 8 2.437a8.993 8.993 0 0 1 3.797.789 8.038 8.038 0 0 1 2.433 1.738 7.955 7.955 0 0 1 1.69 2.566l.08.24-.084.241c-.75 1.862-2.184 3.338-3.964 4.212l1.362 2.098a.5.5 0 0 1-.147.692l-.652.423a.5.5 0 0 1-.692-.147L2.686 1.218a.5.5 0 0 1 .147-.692l.652-.424a.5.5 0 0 1 .692.147ZM2.9 3.984l.837 1.287A6.375 6.375 0 0 0 1.694 7.77c1.06 2.333 3.481 3.83 6.14 3.813l.973 1.496c-.266.02-.536.029-.807.025-3.456 0-6.965-2.06-7.92-5.093L0 7.77l.084-.241a8.076 8.076 0 0 1 1.687-2.566 8.01 8.01 0 0 1 1.13-.98ZM8 3.96a6.974 6.974 0 0 0-1.355.091l1.262 1.943L8 5.991c.933 0 1.698.718 1.772 1.632l.006.146c0 .29-.07.565-.194.808l1.536 2.365c1.396-.648 2.542-1.756 3.186-3.173C13.224 5.387 10.724 3.877 8 3.96Z"></path>
</svg>
</button>
</span>
</label>
<div class="o-grid__item | u-col-12">
<label class="c-label c-label--checkbox | u-align-middle" for="remember">
<input class="c-input c-input--checkbox" id="remember" type="checkbox">
<span class="c-label__text | u-flex u-align-middle">
Remember me
<button class="c-btn c-btn--muted c-btn--sm | u-ml-xs" type="button" x-data x-tooltip.content="Ticking this will remember your username so you only have to enter your password for subsequent log ins.">
<svg class="c-icon | u-tc-slate-600" viewbox="0 0 16 16" width="16" height="16" aria-hidden="true">
<path fill="none" stroke-width="1.5" d="M7.993 15a7 7 0 1 1 .014-14 7 7 0 0 1-.014 14Z"/>
<path fill-rule="evenodd" d="M8 4.75c-.462 0-.866.25-1.083.626a.75.75 0 0 1-1.298-.752A2.75 2.75 0 0 1 10.75 6a2.75 2.75 0 0 1-1.684 2.536.75.75 0 0 1-.2.053.25.25 0 0 0-.116.211v.7a.75.75 0 1 1-1.5 0v-.7c0-.83.578-1.525 1.354-1.705A1.25 1.25 0 0 0 8 4.75Zm.75 6.75a.75.75 0 0 0-1.5 0v.05a.75.75 0 0 0 1.5 0v-.05Z" clip-rule="evenodd"/>
</svg>
</button>
</span>
</label>
</div>
<div class="o-grid__item | u-col-12">
<button class="c-btn c-btn--positive c-btn--lg" type="button">
Log in
<svg class="c-icon | u-ml-xs" viewBox="0 0 16 16" width="16" height="16" aria-hidden="true">
<path fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M1.5 8h7m-3-3.5L9 8l-3.5 3.5m4-10h3.2a1.8 1.8 0 0 1 1.8 1.8v9.4a1.8 1.8 0 0 1-1.8 1.8H9.5h0"></path>
</svg>
</button>
</div>
</form>
<p class="u-fs-sm u-mt-sm">Not a member? <a href="#sign-up">Sign Up</a></p>
</div>
</div>
</div>
Forgotten Password UI
My Listers Forgotten Password UI.
Check your Email
We have sent a verification email to { email }. Check your inbox and follow the instructions to reset your password.
Didn’t receive the email link? Resend email.
<div class="c-hero c-hero--horizontal c-hero--overlay c-hero--mylisters">
<div class="c-hero__media">
<picture class="c-hero__picture">
<source srcset="/assets/img/content/sign-up/half_hero--mobile.avif" media="(max-width: 414px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--mobile-lg.avif" media="(min-width: 415px) and (max-width: 582px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--tablet.avif" media="(min-width: 582px) and (max-width: 834px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--tablet-lg.avif" media="(min-width: 835px) and (max-width: 1024px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--laptop.avif" media="(min-width: 1024px) and (max-width: 1264px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--desktop.avif" media="(min-width: 1265px)" type="image/avif">
<img class="c-hero__img c-img | o-fit" src="/assets/img/content/sign-up/half_hero--mobile.avif" width="800" height="1024" alt="">
</picture>
</div>
<div class="c-hero__media-body">
<div class="c-hero__media-content">
<a class="c-logo c-logo--white | u-w-5 u-my" href="#">
<span class="u-hidden">Listers</span>
<svg class="c-logo__img | u-w-100%" width="72" height="21" viewBox="0 0 185 56" aria-hidden="true">
<g class="c-logo__type" id="type_paths">
<path d="M0 23.231h5.653v27.124h16.914v5.167h-22.567v-32.291"></path>
<path d="M28.22 23.231h5.654v32.291h-5.654z"></path>
<path d="M39.755 50.817l3.401-4.059c3.079 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.287-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.034 4.29c-2.895-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.803 1.66 10.341 4.105 10.341 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
<path d="M78.001 28.49h-10.204v-5.259h26.107v5.259h-10.204v27.032h-5.699v-27.032"></path>
<path d="M99.327 23.231h23.854v5.075h-18.201v8.396h16.133v5.075h-16.133v8.672h18.431v5.074h-24.084v-32.291"></path>
<path d="M129.569 23.231h14.341c4.045 0 7.216 1.2 9.284 3.229 1.7 1.753 2.666 4.152 2.666 6.966v.093c0 5.305-3.171 8.488-7.676 9.779l8.687 12.225h-6.665l-7.906-11.256h-7.078v11.256h-5.654v-32.291zm13.927 16.007c4.045 0 6.618-2.122 6.618-5.397v-.092c0-3.46-2.482-5.351-6.665-5.351h-8.227v10.841h8.273z"></path>
<path d="M160.088 50.817l3.401-4.059c3.08 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.286-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.033 4.29c-2.896-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.802 1.66 10.342 4.105 10.342 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
</g>
<g class="c-logo__swoosh" id="swoosh">
<path d="M159 24.028c-9.933-13.657-40.214-8.746-49.653-7.636-25.232-22.557-56.296-4.543-82.347-1.835 30.766-7.17 51.259-23.836 81.689-7.837 2.728 1.436 6.811 3.652 6.811 3.652 9.439-1.113 40.474-3.428 43.5 13.657z"></path>
</g>
</svg>
</a>
</div>
</div>
<div class="c-hero__body">
<div class="c-hero__body-header">
<a class="c-logo | u-w-5 u-my" href="#">
<span class="u-hidden">Listers</span>
<svg class="c-logo__img | u-w-100%" width="72" height="21" viewBox="0 0 185 56" aria-hidden="true">
<g class="c-logo__type" id="type_paths">
<path d="M0 23.231h5.653v27.124h16.914v5.167h-22.567v-32.291"></path>
<path d="M28.22 23.231h5.654v32.291h-5.654z"></path>
<path d="M39.755 50.817l3.401-4.059c3.079 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.287-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.034 4.29c-2.895-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.803 1.66 10.341 4.105 10.341 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
<path d="M78.001 28.49h-10.204v-5.259h26.107v5.259h-10.204v27.032h-5.699v-27.032"></path>
<path d="M99.327 23.231h23.854v5.075h-18.201v8.396h16.133v5.075h-16.133v8.672h18.431v5.074h-24.084v-32.291"></path>
<path d="M129.569 23.231h14.341c4.045 0 7.216 1.2 9.284 3.229 1.7 1.753 2.666 4.152 2.666 6.966v.093c0 5.305-3.171 8.488-7.676 9.779l8.687 12.225h-6.665l-7.906-11.256h-7.078v11.256h-5.654v-32.291zm13.927 16.007c4.045 0 6.618-2.122 6.618-5.397v-.092c0-3.46-2.482-5.351-6.665-5.351h-8.227v10.841h8.273z"></path>
<path d="M160.088 50.817l3.401-4.059c3.08 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.286-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.033 4.29c-2.896-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.802 1.66 10.342 4.105 10.342 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
</g>
<g class="c-logo__swoosh" id="swoosh">
<path d="M159 24.028c-9.933-13.657-40.214-8.746-49.653-7.636-25.232-22.557-56.296-4.543-82.347-1.835 30.766-7.17 51.259-23.836 81.689-7.837 2.728 1.436 6.811 3.652 6.811 3.652 9.439-1.113 40.474-3.428 43.5 13.657z"></path>
</g>
</svg>
</a>
</div>
<div class="c-hero__body-description | u-max-35">
<div class="c-card-@bp2 c-card--shadow-@bp2 | o-flow | u-p-md-@bp2">
<div class="c-sub-header | t-sub-header--primary">
<div class="c-sub-header__description">
<span class="c-sub-header__heading">
<h1 class="c-hero-heading u-heading u-beta">Forgot your password?</h1>
</span>
<p class="c-sub-header__lead">Enter the email address associated with your account and we’ll send you a link to reset your password.</p>
</div>
</div>
<form class="o-grid">
<label class="c-label | o-grid__item | u-col-12" for="username">
<span class="c-label__text | u-epsilon">Email</span>
<span class="c-label__input">
<input class="c-input c-input--text" id="username" type="email" autocomplete="current-user" required>
</span>
</label>
<div class="o-grid__item | u-col-12">
<button class="c-btn c-btn--positive c-btn--lg" type="button">Continue</button>
<p class="u-fs-sm u-mt-sm">Remember Password? <a href="#login">Log in</a></p>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="c-hero c-hero--horizontal c-hero--overlay c-hero--mylisters">
<div class="c-hero__media">
<picture class="c-hero__picture">
<source srcset="/assets/img/content/sign-up/half_hero--mobile.avif" media="(max-width: 414px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--mobile-lg.avif" media="(min-width: 415px) and (max-width: 582px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--tablet.avif" media="(min-width: 582px) and (max-width: 834px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--tablet-lg.avif" media="(min-width: 835px) and (max-width: 1024px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--laptop.avif" media="(min-width: 1024px) and (max-width: 1264px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--desktop.avif" media="(min-width: 1265px)" type="image/avif">
<img class="c-hero__img c-img | o-fit" src="/assets/img/content/sign-up/half_hero--mobile.avif" width="800" height="1024" alt>
</picture>
</div>
<div class="c-hero__media-body">
<div class="c-hero__media-content">
<a class="c-logo c-logo--white | u-w-5 u-my" href="#">
<span class="u-hidden">Listers</span>
<svg class="c-logo__img | u-w-100%" width="72" height="21" viewBox="0 0 185 56" aria-hidden="true">
<g class="c-logo__type" id="type_paths">
<path d="M0 23.231h5.653v27.124h16.914v5.167h-22.567v-32.291"></path>
<path d="M28.22 23.231h5.654v32.291h-5.654z"></path>
<path d="M39.755 50.817l3.401-4.059c3.079 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.287-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.034 4.29c-2.895-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.803 1.66 10.341 4.105 10.341 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
<path d="M78.001 28.49h-10.204v-5.259h26.107v5.259h-10.204v27.032h-5.699v-27.032"></path>
<path d="M99.327 23.231h23.854v5.075h-18.201v8.396h16.133v5.075h-16.133v8.672h18.431v5.074h-24.084v-32.291"></path>
<path d="M129.569 23.231h14.341c4.045 0 7.216 1.2 9.284 3.229 1.7 1.753 2.666 4.152 2.666 6.966v.093c0 5.305-3.171 8.488-7.676 9.779l8.687 12.225h-6.665l-7.906-11.256h-7.078v11.256h-5.654v-32.291zm13.927 16.007c4.045 0 6.618-2.122 6.618-5.397v-.092c0-3.46-2.482-5.351-6.665-5.351h-8.227v10.841h8.273z"></path>
<path d="M160.088 50.817l3.401-4.059c3.08 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.286-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.033 4.29c-2.896-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.802 1.66 10.342 4.105 10.342 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
</g>
<g class="c-logo__swoosh" id="swoosh">
<path d="M159 24.028c-9.933-13.657-40.214-8.746-49.653-7.636-25.232-22.557-56.296-4.543-82.347-1.835 30.766-7.17 51.259-23.836 81.689-7.837 2.728 1.436 6.811 3.652 6.811 3.652 9.439-1.113 40.474-3.428 43.5 13.657z"></path>
</g>
</svg>
</a>
</div>
</div>
<div class="c-hero__body">
<div class="c-hero__body-header">
<a class="c-logo | u-w-5 u-my" href="#">
<span class="u-hidden">Listers</span>
<svg class="c-logo__img | u-w-100%" width="72" height="21" viewBox="0 0 185 56" aria-hidden="true">
<g class="c-logo__type" id="type_paths">
<path d="M0 23.231h5.653v27.124h16.914v5.167h-22.567v-32.291"></path>
<path d="M28.22 23.231h5.654v32.291h-5.654z"></path>
<path d="M39.755 50.817l3.401-4.059c3.079 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.287-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.034 4.29c-2.895-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.803 1.66 10.341 4.105 10.341 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
<path d="M78.001 28.49h-10.204v-5.259h26.107v5.259h-10.204v27.032h-5.699v-27.032"></path>
<path d="M99.327 23.231h23.854v5.075h-18.201v8.396h16.133v5.075h-16.133v8.672h18.431v5.074h-24.084v-32.291"></path>
<path d="M129.569 23.231h14.341c4.045 0 7.216 1.2 9.284 3.229 1.7 1.753 2.666 4.152 2.666 6.966v.093c0 5.305-3.171 8.488-7.676 9.779l8.687 12.225h-6.665l-7.906-11.256h-7.078v11.256h-5.654v-32.291zm13.927 16.007c4.045 0 6.618-2.122 6.618-5.397v-.092c0-3.46-2.482-5.351-6.665-5.351h-8.227v10.841h8.273z"></path>
<path d="M160.088 50.817l3.401-4.059c3.08 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.286-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.033 4.29c-2.896-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.802 1.66 10.342 4.105 10.342 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
</g>
<g class="c-logo__swoosh" id="swoosh">
<path d="M159 24.028c-9.933-13.657-40.214-8.746-49.653-7.636-25.232-22.557-56.296-4.543-82.347-1.835 30.766-7.17 51.259-23.836 81.689-7.837 2.728 1.436 6.811 3.652 6.811 3.652 9.439-1.113 40.474-3.428 43.5 13.657z"></path>
</g>
</svg>
</a>
</div>
<div class="c-hero__body-description | u-max-35">
<div class="c-card-@bp2 c-card--shadow-@bp2 | o-flow | u-p-md-@bp2">
<div class="c-sub-header | t-sub-header--primary">
<div class="c-sub-header__description">
<span class="c-sub-header__heading">
<h1 class="c-hero-heading u-heading u-beta">Check your Email</h1>
</span>
<p class="c-sub-header__lead">We have sent a verification email to <span>{ email }</span>. Check your inbox and follow the instructions to reset your password.</p>
</div>
</div>
<p class="u-fs-sm"><b>Didn’t receive the email link?</b> <a class="#resend">Resend email</a>.</p>
</div>
</div>
</div>
</div>
Reset Password
My Listers Reset Password UI.
<div class="c-hero c-hero--horizontal c-hero--overlay c-hero--mylisters">
<div class="c-hero__media">
<picture class="c-hero__picture">
<source srcset="/assets/img/content/sign-up/half_hero--mobile.avif" media="(max-width: 414px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--mobile-lg.avif" media="(min-width: 415px) and (max-width: 582px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--tablet.avif" media="(min-width: 582px) and (max-width: 834px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--tablet-lg.avif" media="(min-width: 835px) and (max-width: 1024px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--laptop.avif" media="(min-width: 1024px) and (max-width: 1264px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--desktop.avif" media="(min-width: 1265px)" type="image/avif">
<img class="c-hero__img c-img | o-fit" src="/assets/img/content/sign-up/half_hero--mobile.avif" width="800" height="1024" alt="">
</picture>
</div>
<div class="c-hero__media-body">
<div class="c-hero__media-content">
<a class="c-logo c-logo--white | u-w-5 u-my" href="/web/">
<span class="u-hidden">Listers</span>
<svg class="c-logo__img | u-w-100%" width="72" height="21" viewBox="0 0 185 56" aria-hidden="true">
<g class="c-logo__type" id="type_paths">
<path d="M0 23.231h5.653v27.124h16.914v5.167h-22.567v-32.291"></path>
<path d="M28.22 23.231h5.654v32.291h-5.654z"></path>
<path d="M39.755 50.817l3.401-4.059c3.079 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.287-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.034 4.29c-2.895-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.803 1.66 10.341 4.105 10.341 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
<path d="M78.001 28.49h-10.204v-5.259h26.107v5.259h-10.204v27.032h-5.699v-27.032"></path>
<path d="M99.327 23.231h23.854v5.075h-18.201v8.396h16.133v5.075h-16.133v8.672h18.431v5.074h-24.084v-32.291"></path>
<path d="M129.569 23.231h14.341c4.045 0 7.216 1.2 9.284 3.229 1.7 1.753 2.666 4.152 2.666 6.966v.093c0 5.305-3.171 8.488-7.676 9.779l8.687 12.225h-6.665l-7.906-11.256h-7.078v11.256h-5.654v-32.291zm13.927 16.007c4.045 0 6.618-2.122 6.618-5.397v-.092c0-3.46-2.482-5.351-6.665-5.351h-8.227v10.841h8.273z"></path>
<path d="M160.088 50.817l3.401-4.059c3.08 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.286-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.033 4.29c-2.896-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.802 1.66 10.342 4.105 10.342 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
</g>
<g class="c-logo__swoosh" id="swoosh">
<path d="M159 24.028c-9.933-13.657-40.214-8.746-49.653-7.636-25.232-22.557-56.296-4.543-82.347-1.835 30.766-7.17 51.259-23.836 81.689-7.837 2.728 1.436 6.811 3.652 6.811 3.652 9.439-1.113 40.474-3.428 43.5 13.657z"></path>
</g>
</svg>
</a>
</div>
</div>
<div class="c-hero__body">
<div class="c-hero__body-header">
<a class="c-logo | u-w-5 u-my" href="/web/">
<span class="u-hidden">Listers</span>
<svg class="c-logo__img | u-w-100%" width="72" height="21" viewBox="0 0 185 56" aria-hidden="true">
<g class="c-logo__type" id="type_paths">
<path d="M0 23.231h5.653v27.124h16.914v5.167h-22.567v-32.291"></path>
<path d="M28.22 23.231h5.654v32.291h-5.654z"></path>
<path d="M39.755 50.817l3.401-4.059c3.079 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.287-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.034 4.29c-2.895-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.803 1.66 10.341 4.105 10.341 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
<path d="M78.001 28.49h-10.204v-5.259h26.107v5.259h-10.204v27.032h-5.699v-27.032"></path>
<path d="M99.327 23.231h23.854v5.075h-18.201v8.396h16.133v5.075h-16.133v8.672h18.431v5.074h-24.084v-32.291"></path>
<path d="M129.569 23.231h14.341c4.045 0 7.216 1.2 9.284 3.229 1.7 1.753 2.666 4.152 2.666 6.966v.093c0 5.305-3.171 8.488-7.676 9.779l8.687 12.225h-6.665l-7.906-11.256h-7.078v11.256h-5.654v-32.291zm13.927 16.007c4.045 0 6.618-2.122 6.618-5.397v-.092c0-3.46-2.482-5.351-6.665-5.351h-8.227v10.841h8.273z"></path>
<path d="M160.088 50.817l3.401-4.059c3.08 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.286-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.033 4.29c-2.896-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.802 1.66 10.342 4.105 10.342 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
</g>
<g class="c-logo__swoosh" id="swoosh">
<path d="M159 24.028c-9.933-13.657-40.214-8.746-49.653-7.636-25.232-22.557-56.296-4.543-82.347-1.835 30.766-7.17 51.259-23.836 81.689-7.837 2.728 1.436 6.811 3.652 6.811 3.652 9.439-1.113 40.474-3.428 43.5 13.657z"></path>
</g>
</svg>
</a>
</div>
<div class="c-hero__body-description | u-max-35">
<div class="c-card-@bp2 c-card--shadow-@bp2 | o-flow | u-p-md-@bp2">
<div class="c-sub-header | t-sub-header--primary">
<div class="c-sub-header__description">
<span class="c-sub-header__heading">
<h1 class="c-hero-heading u-heading u-beta">Reset your Password</h1>
</span>
<p class="c-sub-header__lead">Create your new password below, it must be different from any of your previous passwords.</p>
</div>
</div>
<form class="o-grid">
<label class="c-label | o-grid__item | u-col-12" for="current-password" x-data="show_password($refs.input, $refs.btn)">
<span class="c-label__text | u-epsilon">Current Password</span>
<span class="c-label__input">
<input class="c-input c-input--password" id="current-password" type="password" autocomplete="current-password" required x-ref="input">
<button class="c-label__btn | u-tc-blue-600 u-tc:hover-blue-800" type="button" x-bind="trigger" x-ref="btn" aria-label="Warning: this will display your password on screen." x-tooltip.content="Show/Hide Password">
<svg class="c-icon" viewBox="0 0 16 16" aria-hidden="true" x-show.important="show == false">
<path fill-rule="nonzero" d="M8 3.002a8.43 8.43 0 0 1 3.559.739c.862.4 1.636.953 2.28 1.63a7.456 7.456 0 0 1 1.585 2.404l.075.226-.08.226C14.245 11.143 11.28 13.05 8 13 4.76 13 1.472 11.07.576 8.227L.501 8l.08-.226a7.57 7.57 0 0 1 1.58-2.404 7.534 7.534 0 0 1 2.28-1.63A8.429 8.429 0 0 1 8 3ZM8 4.43C5.447 4.354 3.104 5.77 2.089 8 3.104 10.234 5.447 11.649 8 11.573c2.553.076 4.895-1.34 5.911-3.571C12.897 5.768 10.553 4.352 8 4.43ZM8 10a2 2 0 1 0 0-4 2 2 0 0 0 0 4Z"></path>
</svg>
<svg class="c-icon" viewBox="0 0 16 16" aria-hidden="true" x-show.important="show" style="display: none !important;">
<path fill-rule="nonzero" d="m4.177.249 1.585 2.44A9.038 9.038 0 0 1 8 2.437a8.993 8.993 0 0 1 3.797.789 8.038 8.038 0 0 1 2.433 1.738 7.955 7.955 0 0 1 1.69 2.566l.08.24-.084.241c-.75 1.862-2.184 3.338-3.964 4.212l1.362 2.098a.5.5 0 0 1-.147.692l-.652.423a.5.5 0 0 1-.692-.147L2.686 1.218a.5.5 0 0 1 .147-.692l.652-.424a.5.5 0 0 1 .692.147ZM2.9 3.984l.837 1.287A6.375 6.375 0 0 0 1.694 7.77c1.06 2.333 3.481 3.83 6.14 3.813l.973 1.496c-.266.02-.536.029-.807.025-3.456 0-6.965-2.06-7.92-5.093L0 7.77l.084-.241a8.076 8.076 0 0 1 1.687-2.566 8.01 8.01 0 0 1 1.13-.98ZM8 3.96a6.974 6.974 0 0 0-1.355.091l1.262 1.943L8 5.991c.933 0 1.698.718 1.772 1.632l.006.146c0 .29-.07.565-.194.808l1.536 2.365c1.396-.648 2.542-1.756 3.186-3.173C13.224 5.387 10.724 3.877 8 3.96Z"></path>
</svg>
</button>
</span>
</label>
<label class="c-label | o-grid__item | u-col-12" for="new-password" x-data="show_password($refs.input, $refs.btn)">
<span class="c-label__text | u-epsilon">New Password</span>
<span class="c-label__input">
<input class="c-input c-input--text" id="new-password" type="password" autocomplete="new-password" required x-ref="input">
<button class="c-label__btn | u-tc-blue-600 u-tc:hover-blue-800" type="button" x-bind="trigger" x-ref="btn" aria-label="Warning: this will display your password on screen." x-tooltip.content="Show/Hide Password">
<svg class="c-icon" viewBox="0 0 16 16" aria-hidden="true" x-show.important="show == false">
<path fill-rule="nonzero" d="M8 3.002a8.43 8.43 0 0 1 3.559.739c.862.4 1.636.953 2.28 1.63a7.456 7.456 0 0 1 1.585 2.404l.075.226-.08.226C14.245 11.143 11.28 13.05 8 13 4.76 13 1.472 11.07.576 8.227L.501 8l.08-.226a7.57 7.57 0 0 1 1.58-2.404 7.534 7.534 0 0 1 2.28-1.63A8.429 8.429 0 0 1 8 3ZM8 4.43C5.447 4.354 3.104 5.77 2.089 8 3.104 10.234 5.447 11.649 8 11.573c2.553.076 4.895-1.34 5.911-3.571C12.897 5.768 10.553 4.352 8 4.43ZM8 10a2 2 0 1 0 0-4 2 2 0 0 0 0 4Z"></path>
</svg>
<svg class="c-icon" viewBox="0 0 16 16" aria-hidden="true" x-show.important="show" style="display: none !important;">
<path fill-rule="nonzero" d="m4.177.249 1.585 2.44A9.038 9.038 0 0 1 8 2.437a8.993 8.993 0 0 1 3.797.789 8.038 8.038 0 0 1 2.433 1.738 7.955 7.955 0 0 1 1.69 2.566l.08.24-.084.241c-.75 1.862-2.184 3.338-3.964 4.212l1.362 2.098a.5.5 0 0 1-.147.692l-.652.423a.5.5 0 0 1-.692-.147L2.686 1.218a.5.5 0 0 1 .147-.692l.652-.424a.5.5 0 0 1 .692.147ZM2.9 3.984l.837 1.287A6.375 6.375 0 0 0 1.694 7.77c1.06 2.333 3.481 3.83 6.14 3.813l.973 1.496c-.266.02-.536.029-.807.025-3.456 0-6.965-2.06-7.92-5.093L0 7.77l.084-.241a8.076 8.076 0 0 1 1.687-2.566 8.01 8.01 0 0 1 1.13-.98ZM8 3.96a6.974 6.974 0 0 0-1.355.091l1.262 1.943L8 5.991c.933 0 1.698.718 1.772 1.632l.006.146c0 .29-.07.565-.194.808l1.536 2.365c1.396-.648 2.542-1.756 3.186-3.173C13.224 5.387 10.724 3.877 8 3.96Z"></path>
</svg>
</button>
</span>
</label>
<div class="o-grid__item | u-col-12">
<button class="c-btn c-btn--positive c-btn--lg" type="button">Reset Password</button>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="c-hero c-hero--horizontal c-hero--overlay c-hero--mylisters">
<div class="c-hero__media">
<picture class="c-hero__picture">
<source srcset="/assets/img/content/sign-up/half_hero--mobile.avif" media="(max-width: 414px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--mobile-lg.avif" media="(min-width: 415px) and (max-width: 582px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--tablet.avif" media="(min-width: 582px) and (max-width: 834px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--tablet-lg.avif" media="(min-width: 835px) and (max-width: 1024px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--laptop.avif" media="(min-width: 1024px) and (max-width: 1264px)" type="image/avif">
<source srcset="/assets/img/content/sign-up/half_hero--desktop.avif" media="(min-width: 1265px)" type="image/avif">
<img class="c-hero__img c-img | o-fit" src="/assets/img/content/sign-up/half_hero--mobile.avif" width="800" height="1024" alt="">
</picture>
</div>
<div class="c-hero__media-body">
<div class="c-hero__media-content">
<a class="c-logo c-logo--white | u-w-5 u-my" href="/web/">
<span class="u-hidden">Listers</span>
<svg class="c-logo__img | u-w-100%" width="72" height="21" viewBox="0 0 185 56" aria-hidden="true">
<g class="c-logo__type" id="type_paths">
<path d="M0 23.231h5.653v27.124h16.914v5.167h-22.567v-32.291"></path>
<path d="M28.22 23.231h5.654v32.291h-5.654z"></path>
<path d="M39.755 50.817l3.401-4.059c3.079 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.287-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.034 4.29c-2.895-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.803 1.66 10.341 4.105 10.341 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
<path d="M78.001 28.49h-10.204v-5.259h26.107v5.259h-10.204v27.032h-5.699v-27.032"></path>
<path d="M99.327 23.231h23.854v5.075h-18.201v8.396h16.133v5.075h-16.133v8.672h18.431v5.074h-24.084v-32.291"></path>
<path d="M129.569 23.231h14.341c4.045 0 7.216 1.2 9.284 3.229 1.7 1.753 2.666 4.152 2.666 6.966v.093c0 5.305-3.171 8.488-7.676 9.779l8.687 12.225h-6.665l-7.906-11.256h-7.078v11.256h-5.654v-32.291zm13.927 16.007c4.045 0 6.618-2.122 6.618-5.397v-.092c0-3.46-2.482-5.351-6.665-5.351h-8.227v10.841h8.273z"></path>
<path d="M160.088 50.817l3.401-4.059c3.08 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.286-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.033 4.29c-2.896-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.802 1.66 10.342 4.105 10.342 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
</g>
<g class="c-logo__swoosh" id="swoosh">
<path d="M159 24.028c-9.933-13.657-40.214-8.746-49.653-7.636-25.232-22.557-56.296-4.543-82.347-1.835 30.766-7.17 51.259-23.836 81.689-7.837 2.728 1.436 6.811 3.652 6.811 3.652 9.439-1.113 40.474-3.428 43.5 13.657z"></path>
</g>
</svg>
</a>
</div>
</div>
<div class="c-hero__body">
<div class="c-hero__body-header">
<a class="c-logo | u-w-5 u-my" href="/web/">
<span class="u-hidden">Listers</span>
<svg class="c-logo__img | u-w-100%" width="72" height="21" viewBox="0 0 185 56" aria-hidden="true">
<g class="c-logo__type" id="type_paths">
<path d="M0 23.231h5.653v27.124h16.914v5.167h-22.567v-32.291"></path>
<path d="M28.22 23.231h5.654v32.291h-5.654z"></path>
<path d="M39.755 50.817l3.401-4.059c3.079 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.287-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.034 4.29c-2.895-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.803 1.66 10.341 4.105 10.341 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
<path d="M78.001 28.49h-10.204v-5.259h26.107v5.259h-10.204v27.032h-5.699v-27.032"></path>
<path d="M99.327 23.231h23.854v5.075h-18.201v8.396h16.133v5.075h-16.133v8.672h18.431v5.074h-24.084v-32.291"></path>
<path d="M129.569 23.231h14.341c4.045 0 7.216 1.2 9.284 3.229 1.7 1.753 2.666 4.152 2.666 6.966v.093c0 5.305-3.171 8.488-7.676 9.779l8.687 12.225h-6.665l-7.906-11.256h-7.078v11.256h-5.654v-32.291zm13.927 16.007c4.045 0 6.618-2.122 6.618-5.397v-.092c0-3.46-2.482-5.351-6.665-5.351h-8.227v10.841h8.273z"></path>
<path d="M160.088 50.817l3.401-4.059c3.08 2.676 6.159 4.198 10.158 4.198 3.493 0 5.699-1.615 5.699-4.059v-.093c0-2.306-1.286-3.552-7.262-4.936-6.848-1.661-10.709-3.691-10.709-9.641v-.092c0-5.536 4.596-9.365 10.985-9.365 4.688 0 8.411 1.43 11.674 4.059l-3.033 4.29c-2.896-2.168-5.791-3.322-8.733-3.322-3.309 0-5.24 1.707-5.24 3.829v.092c0 2.491 1.471 3.598 7.63 5.075 6.802 1.66 10.342 4.105 10.342 9.457v.092c0 6.043-4.734 9.641-11.491 9.641-4.918 0-9.56-1.707-13.421-5.167"></path>
</g>
<g class="c-logo__swoosh" id="swoosh">
<path d="M159 24.028c-9.933-13.657-40.214-8.746-49.653-7.636-25.232-22.557-56.296-4.543-82.347-1.835 30.766-7.17 51.259-23.836 81.689-7.837 2.728 1.436 6.811 3.652 6.811 3.652 9.439-1.113 40.474-3.428 43.5 13.657z"></path>
</g>
</svg>
</a>
</div>
<div class="c-hero__body-description | u-max-35">
<div class="c-card-@bp2 c-card--shadow-@bp2 | o-flow | u-p-md-@bp2">
<div class="c-sub-header | t-sub-header--primary">
<div class="c-sub-header__description">
<span class="c-sub-header__heading">
<h1 class="c-hero-heading u-heading u-beta">Password Reset</h1>
</span>
<p class="c-sub-header__lead">Your password has been successfully reset. Continue to log in.</p>
</div>
</div>
<form>
<button class="c-btn c-btn--positive c-btn--lg" type="button">
Log in
<svg class="c-icon | u-ml-xs" viewBox="0 0 16 16" width="16" height="16" aria-hidden="true">
<path fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M1.5 8h7m-3-3.5L9 8l-3.5 3.5m4-10h3.2a1.8 1.8 0 0 1 1.8 1.8v9.4a1.8 1.8 0 0 1-1.8 1.8H9.5h0"/>
</svg>
</button>
</form>
</div>
</div>
</div>
</div>