Scrollspy

Scrollspy watches a scrolling area and highlights the menu link of the section currently in view. Every example below uses a fixed-height scrollable box with data-ui-spy, a target nav and tabindex for keyboard users; scroll inside the boxes to see the navigation follow.

1In a navbar

Scroll the box: the navbar pill for the visible section becomes active.

Intro

Our team has done this many times, so you never have to guess. Friendly reminders make sure you never miss a check-up or a dose. Family plans cover check-ups and vaccinations for everyone under one roof. Start in minutes and get help from a real person whenever you need it.

Video consultations let you speak with a doctor from the comfort of home. Children are welcome, and our paediatric team knows how to make them smile. Friendly people answer your questions quickly, by phone, chat or email.

Details

We keep things simple, so you can focus on what matters to you. We work with most insurance providers and explain any costs upfront. We measure success by how many patients come back and tell their friends.

Our specialists take time to listen and explain every step of your treatment. Book online in two minutes and see a doctor as soon as today. Every detail is handled by people who care about getting it right.

Pricing

Our team has done this many times, so you never have to guess. Your records are private, secure and always available when you need them. Modern equipment means faster diagnoses and more comfortable treatment.

Same-day appointments are available for urgent needs on weekdays. Thousands of patients already trust us, and we work hard to keep it that way. Our clinic is fully accessible, with free parking right outside. We listen first, then build a plan around what you actually need.

<nav id="spy-nav-1121" class="navbar bg-body-tertiary px-3 mb-3 rounded">
  <a class="navbar-brand" href="#">Glowix Studio</a>
  <ul class="nav nav-pills">
    <li class="nav-item"><a class="nav-link" href="#spy-1122">Intro</a></li>
    <li class="nav-item"><a class="nav-link" href="#spy-1123">Details</a></li>
    <li class="nav-item dropdown"><a class="nav-link dropdown-toggle" data-ui-toggle="dropdown" href="#" role="button" aria-expanded="false">More</a><ul class="dropdown-menu"><li><a class="dropdown-item" href="#spy-1124">Pricing</a></li></ul></li>
  </ul>
</nav>
<div class="position-relative border rounded p-3" style="height:220px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1121" data-ui-smooth-scroll="true" tabindex="0">
  <div id="spy-1122" class="pb-3">
    <h3 class="h6">Intro</h3>
    <p class="small">Our team has done this many times, so you never have to guess. Friendly reminders make sure you never miss a check-up or a dose. Family plans cover check-ups and vaccinations for everyone under one roof. Start in minutes and get help from a real person whenever you need it.</p>
    <p class="small">Video consultations let you speak with a doctor from the comfort of home. Children are welcome, and our paediatric team knows how to make them smile. Friendly people answer your questions quickly, by phone, chat or email.</p>
  </div>
  <div id="spy-1123" class="pb-3">
    <h3 class="h6">Details</h3>
    <p class="small">We keep things simple, so you can focus on what matters to you. We work with most insurance providers and explain any costs upfront. We measure success by how many patients come back and tell their friends.</p>
    <p class="small">Our specialists take time to listen and explain every step of your treatment. Book online in two minutes and see a doctor as soon as today. Every detail is handled by people who care about getting it right.</p>
  </div>
  <div id="spy-1124" class="pb-3">
    <h3 class="h6">Pricing</h3>
    <p class="small">Our team has done this many times, so you never have to guess. Your records are private, secure and always available when you need them. Modern equipment means faster diagnoses and more comfortable treatment.</p>
    <p class="small">Same-day appointments are available for urgent needs on weekdays. Thousands of patients already trust us, and we work hard to keep it that way. Our clinic is fully accessible, with free parking right outside. We listen first, then build a plan around what you actually need.</p>
  </div>
</div>

2Horizontal pills

A row of pills above the box tracks the four steps.

Step one

Lab results arrive in your patient portal, usually within 48 hours. Clear prices, honest advice and no surprises along the way. Same-day appointments are available for urgent needs on weekdays. Thousands of patients already trust us, and we work hard to keep it that way.

Step two

Friendly people answer your questions quickly, by phone, chat or email. Book online in two minutes and see a doctor as soon as today. Lab results arrive in your patient portal, usually within 48 hours. Children are welcome, and our paediatric team knows how to make them smile.

Step three

Modern equipment means faster diagnoses and more comfortable treatment. Friendly reminders make sure you never miss a check-up or a dose. Clear prices, honest advice and no surprises along the way. Start in minutes and get help from a real person whenever you need it.

Step four

We listen first, then build a plan around what you actually need. We measure success by how many patients come back and tell their friends. We work with most insurance providers and explain any costs upfront. Video consultations let you speak with a doctor from the comfort of home.

<nav id="spy-nav-1125" class="nav nav-pills mb-2 flex-wrap">
  <a class="nav-link" href="#spy-1126">Step one</a><a class="nav-link" href="#spy-1127">Step two</a><a class="nav-link" href="#spy-1128">Step three</a><a class="nav-link" href="#spy-1129">Step four</a>
</nav>
<div class="position-relative border rounded p-3" style="height:200px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1125" data-ui-smooth-scroll="true" tabindex="0">
  <div id="spy-1126" class="pb-3">
    <h3 class="h6">Step one</h3>
    <p class="small">Lab results arrive in your patient portal, usually within 48 hours. Clear prices, honest advice and no surprises along the way. Same-day appointments are available for urgent needs on weekdays. Thousands of patients already trust us, and we work hard to keep it that way.</p>
  </div>
  <div id="spy-1127" class="pb-3">
    <h3 class="h6">Step two</h3>
    <p class="small">Friendly people answer your questions quickly, by phone, chat or email. Book online in two minutes and see a doctor as soon as today. Lab results arrive in your patient portal, usually within 48 hours. Children are welcome, and our paediatric team knows how to make them smile.</p>
  </div>
  <div id="spy-1128" class="pb-3">
    <h3 class="h6">Step three</h3>
    <p class="small">Modern equipment means faster diagnoses and more comfortable treatment. Friendly reminders make sure you never miss a check-up or a dose. Clear prices, honest advice and no surprises along the way. Start in minutes and get help from a real person whenever you need it.</p>
  </div>
  <div id="spy-1129" class="pb-3">
    <h3 class="h6">Step four</h3>
    <p class="small">We listen first, then build a plan around what you actually need. We measure success by how many patients come back and tell their friends. We work with most insurance providers and explain any costs upfront. Video consultations let you speak with a doctor from the comfort of home.</p>
  </div>
</div>

3Vertical pills

A column of pills beside the content; on phones the menu sits above.

Health check-ups

Our clinic is fully accessible, with free parking right outside. Every detail is handled by people who care about getting it right. Our specialists take time to listen and explain every step of your treatment. We keep things simple, so you can focus on what matters to you.

Physiotherapy

Family plans cover check-ups and vaccinations for everyone under one roof. Your records are private, secure and always available when you need them. Our team has done this many times, so you never have to guess. Clear prices, honest advice and no surprises along the way.

Lab tests

We work with most insurance providers and explain any costs upfront. Friendly reminders make sure you never miss a check-up or a dose. Modern equipment means faster diagnoses and more comfortable treatment.

Questions

Children are welcome, and our paediatric team knows how to make them smile. Your records are private, secure and always available when you need them. Thousands of patients already trust us, and we work hard to keep it that way. Our specialists take time to listen and explain every step of your treatment.

<div class="row g-3">
  <div class="col-sm-4">
    <nav id="spy-nav-1130" class="nav nav-pills flex-column">
      <a class="nav-link" href="#spy-1131">Health check-ups</a><a class="nav-link" href="#spy-1132">Physiotherapy</a><a class="nav-link" href="#spy-1133">Lab tests</a><a class="nav-link" href="#spy-1134">Questions</a>
    </nav>
  </div>
  <div class="col-sm-8">
    <div class="position-relative border rounded p-3" style="height:240px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1130" data-ui-smooth-scroll="true" tabindex="0">
      <div id="spy-1131" class="pb-3">
        <h3 class="h6">Health check-ups</h3>
        <p class="small">Our clinic is fully accessible, with free parking right outside. Every detail is handled by people who care about getting it right. Our specialists take time to listen and explain every step of your treatment. We keep things simple, so you can focus on what matters to you.</p>
      </div>
      <div id="spy-1132" class="pb-3">
        <h3 class="h6">Physiotherapy</h3>
        <p class="small">Family plans cover check-ups and vaccinations for everyone under one roof. Your records are private, secure and always available when you need them. Our team has done this many times, so you never have to guess. Clear prices, honest advice and no surprises along the way.</p>
      </div>
      <div id="spy-1133" class="pb-3">
        <h3 class="h6">Lab tests</h3>
        <p class="small">We work with most insurance providers and explain any costs upfront. Friendly reminders make sure you never miss a check-up or a dose. Modern equipment means faster diagnoses and more comfortable treatment.</p>
      </div>
      <div id="spy-1134" class="pb-3">
        <h3 class="h6">Questions</h3>
        <p class="small">Children are welcome, and our paediatric team knows how to make them smile. Your records are private, secure and always available when you need them. Thousands of patients already trust us, and we work hard to keep it that way. Our specialists take time to listen and explain every step of your treatment.</p>
      </div>
    </div>
  </div>
</div>

4Nested navigation

Sub-items are indented under their parent and both highlight while you scroll.

Getting started

Friendly people answer your questions quickly, by phone, chat or email. Lab results arrive in your patient portal, usually within 48 hours. Same-day appointments are available for urgent needs on weekdays.

Install

Start in minutes and get help from a real person whenever you need it. We keep things simple, so you can focus on what matters to you. Book online in two minutes and see a doctor as soon as today.

Configure

Our clinic is fully accessible, with free parking right outside. We measure success by how many patients come back and tell their friends. Video consultations let you speak with a doctor from the comfort of home.

Usage

Every detail is handled by people who care about getting it right. Family plans cover check-ups and vaccinations for everyone under one roof. We listen first, then build a plan around what you actually need.

Examples

Our team has done this many times, so you never have to guess. Book online in two minutes and see a doctor as soon as today. Start in minutes and get help from a real person whenever you need it. Clear prices, honest advice and no surprises along the way.

<div class="row g-3">
  <div class="col-sm-4">
    <nav id="spy-nav-1135" class="h-100 flex-column align-items-stretch">
      <nav class="nav nav-pills flex-column">
        <a class="nav-link" href="#spy-1136">Getting started</a>
        <nav class="nav nav-pills flex-column">
          <a class="nav-link ms-3 my-1" href="#spy-1137">Install</a><a class="nav-link ms-3 my-1" href="#spy-1138">Configure</a>
        </nav>
        <a class="nav-link" href="#spy-1139">Usage</a>
        <nav class="nav nav-pills flex-column">
          <a class="nav-link ms-3 my-1" href="#spy-1140">Examples</a>
        </nav>
      </nav>
    </nav>
  </div>
  <div class="col-sm-8">
    <div class="position-relative border rounded p-3" style="height:260px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1135" data-ui-smooth-scroll="true" tabindex="0">
      <div id="spy-1136" class="pb-3">
        <h3 class="h6">Getting started</h3>
        <p class="small">Friendly people answer your questions quickly, by phone, chat or email. Lab results arrive in your patient portal, usually within 48 hours. Same-day appointments are available for urgent needs on weekdays.</p>
      </div>
      <div id="spy-1137" class="pb-3">
        <h3 class="h6">Install</h3>
        <p class="small">Start in minutes and get help from a real person whenever you need it. We keep things simple, so you can focus on what matters to you. Book online in two minutes and see a doctor as soon as today.</p>
      </div>
      <div id="spy-1138" class="pb-3">
        <h3 class="h6">Configure</h3>
        <p class="small">Our clinic is fully accessible, with free parking right outside. We measure success by how many patients come back and tell their friends. Video consultations let you speak with a doctor from the comfort of home.</p>
      </div>
      <div id="spy-1139" class="pb-3">
        <h3 class="h6">Usage</h3>
        <p class="small">Every detail is handled by people who care about getting it right. Family plans cover check-ups and vaccinations for everyone under one roof. We listen first, then build a plan around what you actually need.</p>
      </div>
      <div id="spy-1140" class="pb-3">
        <h3 class="h6">Examples</h3>
        <p class="small">Our team has done this many times, so you never have to guess. Book online in two minutes and see a doctor as soon as today. Start in minutes and get help from a real person whenever you need it. Clear prices, honest advice and no surprises along the way.</p>
      </div>
    </div>
  </div>
</div>

5List group

List group items as the spy menu - clear active state with no extra styling.

Morning Midday Afternoon Evening

Morning

Every detail is handled by people who care about getting it right. We measure success by how many patients come back and tell their friends. Lab results arrive in your patient portal, usually within 48 hours. Thousands of patients already trust us, and we work hard to keep it that way.

Midday

Our team has done this many times, so you never have to guess. Our specialists take time to listen and explain every step of your treatment. We work with most insurance providers and explain any costs upfront.

Afternoon

Children are welcome, and our paediatric team knows how to make them smile. Friendly reminders make sure you never miss a check-up or a dose. Video consultations let you speak with a doctor from the comfort of home. Our clinic is fully accessible, with free parking right outside.

Evening

We listen first, then build a plan around what you actually need. We keep things simple, so you can focus on what matters to you. Same-day appointments are available for urgent needs on weekdays.

<div class="row g-3">
  <div class="col-sm-4">
    <div id="spy-nav-1141" class="list-group">
      <a class="list-group-item list-group-item-action" href="#spy-1142">Morning</a><a class="list-group-item list-group-item-action" href="#spy-1143">Midday</a><a class="list-group-item list-group-item-action" href="#spy-1144">Afternoon</a><a class="list-group-item list-group-item-action" href="#spy-1145">Evening</a>
    </div>
  </div>
  <div class="col-sm-8">
    <div class="position-relative border rounded p-3" style="height:220px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1141" data-ui-smooth-scroll="true" tabindex="0">
      <div id="spy-1142" class="pb-3">
        <h3 class="h6">Morning</h3>
        <p class="small">Every detail is handled by people who care about getting it right. We measure success by how many patients come back and tell their friends. Lab results arrive in your patient portal, usually within 48 hours. Thousands of patients already trust us, and we work hard to keep it that way.</p>
      </div>
      <div id="spy-1143" class="pb-3">
        <h3 class="h6">Midday</h3>
        <p class="small">Our team has done this many times, so you never have to guess. Our specialists take time to listen and explain every step of your treatment. We work with most insurance providers and explain any costs upfront.</p>
      </div>
      <div id="spy-1144" class="pb-3">
        <h3 class="h6">Afternoon</h3>
        <p class="small">Children are welcome, and our paediatric team knows how to make them smile. Friendly reminders make sure you never miss a check-up or a dose. Video consultations let you speak with a doctor from the comfort of home. Our clinic is fully accessible, with free parking right outside.</p>
      </div>
      <div id="spy-1145" class="pb-3">
        <h3 class="h6">Evening</h3>
        <p class="small">We listen first, then build a plan around what you actually need. We keep things simple, so you can focus on what matters to you. Same-day appointments are available for urgent needs on weekdays.</p>
      </div>
    </div>
  </div>
</div>

6Simple anchors

Any links work as targets; style the active one with a scoped class.

Alpha Beta Gamma

Alpha

Family plans cover check-ups and vaccinations for everyone under one roof. Modern equipment means faster diagnoses and more comfortable treatment. Your records are private, secure and always available when you need them. Friendly people answer your questions quickly, by phone, chat or email.

Beta

Children are welcome, and our paediatric team knows how to make them smile. Start in minutes and get help from a real person whenever you need it. Your records are private, secure and always available when you need them.

Gamma

Our team has done this many times, so you never have to guess. Clear prices, honest advice and no surprises along the way. We work with most insurance providers and explain any costs upfront.

<div class="row g-3 cb-spy-plain">
  <div class="col-4">
    <div id="spy-nav-1146" class="d-flex flex-column gap-2 small">
      <a class="p-1 rounded link-body-emphasis text-decoration-none" href="#spy-1147">Alpha</a><a class="p-1 rounded link-body-emphasis text-decoration-none" href="#spy-1148">Beta</a><a class="p-1 rounded link-body-emphasis text-decoration-none" href="#spy-1149">Gamma</a>
    </div>
  </div>
  <div class="col-8">
    <div class="position-relative border rounded p-3" style="height:200px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1146" data-ui-smooth-scroll="true" tabindex="0">
      <div id="spy-1147" class="pb-3">
        <h3 class="h6">Alpha</h3>
        <p class="small">Family plans cover check-ups and vaccinations for everyone under one roof. Modern equipment means faster diagnoses and more comfortable treatment. Your records are private, secure and always available when you need them. Friendly people answer your questions quickly, by phone, chat or email.</p>
      </div>
      <div id="spy-1148" class="pb-3">
        <h3 class="h6">Beta</h3>
        <p class="small">Children are welcome, and our paediatric team knows how to make them smile. Start in minutes and get help from a real person whenever you need it. Your records are private, secure and always available when you need them.</p>
      </div>
      <div id="spy-1149" class="pb-3">
        <h3 class="h6">Gamma</h3>
        <p class="small">Our team has done this many times, so you never have to guess. Clear prices, honest advice and no surprises along the way. We work with most insurance providers and explain any costs upfront.</p>
      </div>
    </div>
  </div>
</div>

7Underline tabs

An underline nav as a sticky-looking section switcher above a product page.

Overview

We measure success by how many patients come back and tell their friends. Friendly reminders make sure you never miss a check-up or a dose. Video consultations let you speak with a doctor from the comfort of home. Modern equipment means faster diagnoses and more comfortable treatment.

Features

Book online in two minutes and see a doctor as soon as today. Every detail is handled by people who care about getting it right. Friendly people answer your questions quickly, by phone, chat or email.

Reviews

Thousands of patients already trust us, and we work hard to keep it that way. We listen first, then build a plan around what you actually need. Same-day appointments are available for urgent needs on weekdays. We keep things simple, so you can focus on what matters to you.

FAQ

Family plans cover check-ups and vaccinations for everyone under one roof. Our clinic is fully accessible, with free parking right outside. Lab results arrive in your patient portal, usually within 48 hours.

<nav id="spy-nav-1150" class="nav nav-underline mb-2 border-bottom">
  <a class="nav-link" href="#spy-1151">Overview</a><a class="nav-link" href="#spy-1152">Features</a><a class="nav-link" href="#spy-1153">Reviews</a><a class="nav-link" href="#spy-1154">FAQ</a>
</nav>
<div class="position-relative border rounded p-3 border-0 px-0" style="height:220px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1150" data-ui-smooth-scroll="true" tabindex="0">
  <div id="spy-1151" class="pb-3">
    <h3 class="h6">Overview</h3>
    <p class="small">We measure success by how many patients come back and tell their friends. Friendly reminders make sure you never miss a check-up or a dose. Video consultations let you speak with a doctor from the comfort of home. Modern equipment means faster diagnoses and more comfortable treatment.</p>
  </div>
  <div id="spy-1152" class="pb-3">
    <h3 class="h6">Features</h3>
    <p class="small">Book online in two minutes and see a doctor as soon as today. Every detail is handled by people who care about getting it right. Friendly people answer your questions quickly, by phone, chat or email.</p>
  </div>
  <div id="spy-1153" class="pb-3">
    <h3 class="h6">Reviews</h3>
    <p class="small">Thousands of patients already trust us, and we work hard to keep it that way. We listen first, then build a plan around what you actually need. Same-day appointments are available for urgent needs on weekdays. We keep things simple, so you can focus on what matters to you.</p>
  </div>
  <div id="spy-1154" class="pb-3">
    <h3 class="h6">FAQ</h3>
    <p class="small">Family plans cover check-ups and vaccinations for everyone under one roof. Our clinic is fully accessible, with free parking right outside. Lab results arrive in your patient portal, usually within 48 hours.</p>
  </div>
</div>

8Table of contents on the right

Documentation layout: content first, a small contents list on the right on larger screens.

Summary

Our specialists take time to listen and explain every step of your treatment. We work with most insurance providers and explain any costs upfront. Video consultations let you speak with a doctor from the comfort of home.

Background

Same-day appointments are available for urgent needs on weekdays. We keep things simple, so you can focus on what matters to you. Our clinic is fully accessible, with free parking right outside. Clear prices, honest advice and no surprises along the way.

Method

Thousands of patients already trust us, and we work hard to keep it that way. Modern equipment means faster diagnoses and more comfortable treatment. Start in minutes and get help from a real person whenever you need it. Your records are private, secure and always available when you need them.

Results

Friendly reminders make sure you never miss a check-up or a dose. Book online in two minutes and see a doctor as soon as today. Children are welcome, and our paediatric team knows how to make them smile.

On this page

<div class="row g-3">
  <div class="col-md-9">
    <div class="position-relative border rounded p-3" style="height:240px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1155" data-ui-smooth-scroll="true" tabindex="0">
      <div id="spy-1156" class="pb-3">
        <h3 class="h6">Summary</h3>
        <p class="small">Our specialists take time to listen and explain every step of your treatment. We work with most insurance providers and explain any costs upfront. Video consultations let you speak with a doctor from the comfort of home.</p>
      </div>
      <div id="spy-1157" class="pb-3">
        <h3 class="h6">Background</h3>
        <p class="small">Same-day appointments are available for urgent needs on weekdays. We keep things simple, so you can focus on what matters to you. Our clinic is fully accessible, with free parking right outside. Clear prices, honest advice and no surprises along the way.</p>
      </div>
      <div id="spy-1158" class="pb-3">
        <h3 class="h6">Method</h3>
        <p class="small">Thousands of patients already trust us, and we work hard to keep it that way. Modern equipment means faster diagnoses and more comfortable treatment. Start in minutes and get help from a real person whenever you need it. Your records are private, secure and always available when you need them.</p>
      </div>
      <div id="spy-1159" class="pb-3">
        <h3 class="h6">Results</h3>
        <p class="small">Friendly reminders make sure you never miss a check-up or a dose. Book online in two minutes and see a doctor as soon as today. Children are welcome, and our paediatric team knows how to make them smile.</p>
      </div>
    </div>
  </div>
  <div class="col-md-3 order-first order-md-last">
    <p class="small fw-semibold text-uppercase text-body-secondary mb-2">On this page</p>
    <nav id="spy-nav-1155" class="nav nav-pills flex-column small">
      <a class="nav-link py-1" href="#spy-1156">Summary</a><a class="nav-link py-1" href="#spy-1157">Background</a><a class="nav-link py-1" href="#spy-1158">Method</a><a class="nav-link py-1" href="#spy-1159">Results</a>
    </nav>
  </div>
</div>

9Numbered steps

<code>.list-group-numbered</code> turns the spy menu into a step counter.

Create an account Set up your profile Invite the team Go live

Create an account

Our team has done this many times, so you never have to guess. Family plans cover check-ups and vaccinations for everyone under one roof. Friendly people answer your questions quickly, by phone, chat or email. Lab results arrive in your patient portal, usually within 48 hours.

Set up your profile

We measure success by how many patients come back and tell their friends. We listen first, then build a plan around what you actually need. Every detail is handled by people who care about getting it right. Our specialists take time to listen and explain every step of your treatment.

Invite the team

Our team has done this many times, so you never have to guess. Video consultations let you speak with a doctor from the comfort of home. Every detail is handled by people who care about getting it right. Clear prices, honest advice and no surprises along the way.

Go live

Modern equipment means faster diagnoses and more comfortable treatment. Our specialists take time to listen and explain every step of your treatment. Children are welcome, and our paediatric team knows how to make them smile.

<div class="row g-3">
  <div class="col-sm-5">
    <div id="spy-nav-1160" class="list-group list-group-numbered">
      <a class="list-group-item list-group-item-action" href="#spy-1161">Create an account</a><a class="list-group-item list-group-item-action" href="#spy-1162">Set up your profile</a><a class="list-group-item list-group-item-action" href="#spy-1163">Invite the team</a><a class="list-group-item list-group-item-action" href="#spy-1164">Go live</a>
    </div>
  </div>
  <div class="col-sm-7">
    <div class="position-relative border rounded p-3" style="height:220px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1160" data-ui-smooth-scroll="true" tabindex="0">
      <div id="spy-1161" class="pb-3">
        <h3 class="h6">Create an account</h3>
        <p class="small">Our team has done this many times, so you never have to guess. Family plans cover check-ups and vaccinations for everyone under one roof. Friendly people answer your questions quickly, by phone, chat or email. Lab results arrive in your patient portal, usually within 48 hours.</p>
      </div>
      <div id="spy-1162" class="pb-3">
        <h3 class="h6">Set up your profile</h3>
        <p class="small">We measure success by how many patients come back and tell their friends. We listen first, then build a plan around what you actually need. Every detail is handled by people who care about getting it right. Our specialists take time to listen and explain every step of your treatment.</p>
      </div>
      <div id="spy-1163" class="pb-3">
        <h3 class="h6">Invite the team</h3>
        <p class="small">Our team has done this many times, so you never have to guess. Video consultations let you speak with a doctor from the comfort of home. Every detail is handled by people who care about getting it right. Clear prices, honest advice and no surprises along the way.</p>
      </div>
      <div id="spy-1164" class="pb-3">
        <h3 class="h6">Go live</h3>
        <p class="small">Modern equipment means faster diagnoses and more comfortable treatment. Our specialists take time to listen and explain every step of your treatment. Children are welcome, and our paediatric team knows how to make them smile.</p>
      </div>
    </div>
  </div>
</div>

10Timeline by year

Year buttons follow a scrolling company timeline.

2023

Five things we learned this year

Friendly reminders make sure you never miss a check-up or a dose. Lab results arrive in your patient portal, usually within 48 hours. Book online in two minutes and see a doctor as soon as today. Our clinic is fully accessible, with free parking right outside.

2024

Simple habits for a healthier back

Your records are private, secure and always available when you need them. We keep things simple, so you can focus on what matters to you. We work with most insurance providers and explain any costs upfront. Friendly people answer your questions quickly, by phone, chat or email.

2025

Looking back at a busy season

Thousands of patients already trust us, and we work hard to keep it that way. We listen first, then build a plan around what you actually need. Start in minutes and get help from a real person whenever you need it.

2026

How often should you have a health check-up?

Same-day appointments are available for urgent needs on weekdays. Family plans cover check-ups and vaccinations for everyone under one roof. We measure success by how many patients come back and tell their friends. Your records are private, secure and always available when you need them.

<nav id="spy-nav-1165" class="nav nav-pills nav-fill mb-2 small">
  <a class="nav-link" href="#spy-1166">2023</a><a class="nav-link" href="#spy-1167">2024</a><a class="nav-link" href="#spy-1168">2025</a><a class="nav-link" href="#spy-1169">2026</a>
</nav>
<div class="position-relative border rounded p-3" style="height:220px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1165" data-ui-smooth-scroll="true" tabindex="0">
  <div id="spy-1166" class="ps-3 pb-4 border-start border-2 border-primary-subtle">
    <span class="badge text-bg-primary mb-2">2023</span>
    <h3 class="h6">Five things we learned this year</h3>
    <p class="small mb-0">Friendly reminders make sure you never miss a check-up or a dose. Lab results arrive in your patient portal, usually within 48 hours. Book online in two minutes and see a doctor as soon as today. Our clinic is fully accessible, with free parking right outside.</p>
  </div>
  <div id="spy-1167" class="ps-3 pb-4 border-start border-2 border-primary-subtle">
    <span class="badge text-bg-primary mb-2">2024</span>
    <h3 class="h6">Simple habits for a healthier back</h3>
    <p class="small mb-0">Your records are private, secure and always available when you need them. We keep things simple, so you can focus on what matters to you. We work with most insurance providers and explain any costs upfront. Friendly people answer your questions quickly, by phone, chat or email.</p>
  </div>
  <div id="spy-1168" class="ps-3 pb-4 border-start border-2 border-primary-subtle">
    <span class="badge text-bg-primary mb-2">2025</span>
    <h3 class="h6">Looking back at a busy season</h3>
    <p class="small mb-0">Thousands of patients already trust us, and we work hard to keep it that way. We listen first, then build a plan around what you actually need. Start in minutes and get help from a real person whenever you need it.</p>
  </div>
  <div id="spy-1169" class="ps-3 pb-4 border-start border-2 border-primary-subtle">
    <span class="badge text-bg-primary mb-2">2026</span>
    <h3 class="h6">How often should you have a health check-up?</h3>
    <p class="small mb-0">Same-day appointments are available for urgent needs on weekdays. Family plans cover check-ups and vaccinations for everyone under one roof. We measure success by how many patients come back and tell their friends. Your records are private, secure and always available when you need them.</p>
  </div>
</div>

11FAQ sections

Question groups in a scrollable panel with topic links.

Orders

A parent's guide to childhood vaccinations?: Our specialists take time to listen and explain every step of your treatment.
What our patients asked us most?: Modern equipment means faster diagnoses and more comfortable treatment.
How to choose the right service?: Every detail is handled by people who care about getting it right.

Shipping

A beginner's guide to getting started?: Lab results arrive in your patient portal, usually within 48 hours.
Our favourite tips for busy weeks?: We listen first, then build a plan around what you actually need.
Understanding your blood test results?: Our clinic is fully accessible, with free parking right outside.

Returns

The small habits that make a big difference?: Same-day appointments are available for urgent needs on weekdays.
Sleep tips our doctors actually use?: Clear prices, honest advice and no surprises along the way.
What to expect at your first dental visit?: We keep things simple, so you can focus on what matters to you.

<div class="row g-3">
  <div class="col-sm-3">
    <nav id="spy-nav-1170" class="nav nav-pills flex-sm-column">
      <a class="nav-link" href="#spy-1171">Orders</a><a class="nav-link" href="#spy-1172">Shipping</a><a class="nav-link" href="#spy-1173">Returns</a>
    </nav>
  </div>
  <div class="col-sm-9">
    <div class="position-relative border rounded p-3" style="height:240px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1170" data-ui-smooth-scroll="true" tabindex="0">
      <div id="spy-1171" class="pb-3">
        <h3 class="h6"><i class="bi bi-question-circle" aria-hidden="true"></i> Orders</h3>
        <dl>
          <dt class="small">A parent&#39;s guide to childhood vaccinations?</dt>
          <dd class="small text-body-secondary">Our specialists take time to listen and explain every step of your treatment.</dd>
          <dt class="small">What our patients asked us most?</dt>
          <dd class="small text-body-secondary">Modern equipment means faster diagnoses and more comfortable treatment.</dd>
          <dt class="small">How to choose the right service?</dt>
          <dd class="small text-body-secondary">Every detail is handled by people who care about getting it right.</dd>
        </dl>
      </div>
      <div id="spy-1172" class="pb-3">
        <h3 class="h6"><i class="bi bi-question-circle" aria-hidden="true"></i> Shipping</h3>
        <dl>
          <dt class="small">A beginner&#39;s guide to getting started?</dt>
          <dd class="small text-body-secondary">Lab results arrive in your patient portal, usually within 48 hours.</dd>
          <dt class="small">Our favourite tips for busy weeks?</dt>
          <dd class="small text-body-secondary">We listen first, then build a plan around what you actually need.</dd>
          <dt class="small">Understanding your blood test results?</dt>
          <dd class="small text-body-secondary">Our clinic is fully accessible, with free parking right outside.</dd>
        </dl>
      </div>
      <div id="spy-1173" class="pb-3">
        <h3 class="h6"><i class="bi bi-question-circle" aria-hidden="true"></i> Returns</h3>
        <dl>
          <dt class="small">The small habits that make a big difference?</dt>
          <dd class="small text-body-secondary">Same-day appointments are available for urgent needs on weekdays.</dd>
          <dt class="small">Sleep tips our doctors actually use?</dt>
          <dd class="small text-body-secondary">Clear prices, honest advice and no surprises along the way.</dd>
          <dt class="small">What to expect at your first dental visit?</dt>
          <dd class="small text-body-secondary">We keep things simple, so you can focus on what matters to you.</dd>
        </dl>
      </div>
    </div>
  </div>
</div>

12Icon menu

Each spy link starts with an icon - nice for spec sheets.

Performance

Start in minutes and get help from a real person whenever you need it. Children are welcome, and our paediatric team knows how to make them smile. Thousands of patients already trust us, and we work hard to keep it that way.

Battery

Video consultations let you speak with a doctor from the comfort of home. We work with most insurance providers and explain any costs upfront. Family plans cover check-ups and vaccinations for everyone under one roof.

Connectivity

Book online in two minutes and see a doctor as soon as today. Our team has done this many times, so you never have to guess. We measure success by how many patients come back and tell their friends.

Security

Friendly people answer your questions quickly, by phone, chat or email. Friendly reminders make sure you never miss a check-up or a dose. Thousands of patients already trust us, and we work hard to keep it that way.

<div class="row g-3">
  <div class="col-sm-4">
    <nav id="spy-nav-1174" class="nav nav-pills flex-column">
      <a class="nav-link d-flex align-items-center gap-2" href="#spy-1175"><i class="bi bi-cpu" aria-hidden="true"></i>Performance</a><a class="nav-link d-flex align-items-center gap-2" href="#spy-1176"><i class="bi bi-battery-half" aria-hidden="true"></i>Battery</a><a class="nav-link d-flex align-items-center gap-2" href="#spy-1177"><i class="bi bi-wifi" aria-hidden="true"></i>Connectivity</a><a class="nav-link d-flex align-items-center gap-2" href="#spy-1178"><i class="bi bi-shield-check" aria-hidden="true"></i>Security</a>
    </nav>
  </div>
  <div class="col-sm-8">
    <div class="position-relative border rounded p-3" style="height:220px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1174" data-ui-smooth-scroll="true" tabindex="0">
      <div id="spy-1175" class="pb-3">
        <h3 class="h6">Performance</h3>
        <p class="small">Start in minutes and get help from a real person whenever you need it. Children are welcome, and our paediatric team knows how to make them smile. Thousands of patients already trust us, and we work hard to keep it that way.</p>
      </div>
      <div id="spy-1176" class="pb-3">
        <h3 class="h6">Battery</h3>
        <p class="small">Video consultations let you speak with a doctor from the comfort of home. We work with most insurance providers and explain any costs upfront. Family plans cover check-ups and vaccinations for everyone under one roof.</p>
      </div>
      <div id="spy-1177" class="pb-3">
        <h3 class="h6">Connectivity</h3>
        <p class="small">Book online in two minutes and see a doctor as soon as today. Our team has done this many times, so you never have to guess. We measure success by how many patients come back and tell their friends.</p>
      </div>
      <div id="spy-1178" class="pb-3">
        <h3 class="h6">Security</h3>
        <p class="small">Friendly people answer your questions quickly, by phone, chat or email. Friendly reminders make sure you never miss a check-up or a dose. Thousands of patients already trust us, and we work hard to keep it that way.</p>
      </div>
    </div>
  </div>
</div>

13Pricing plans

Spy over a stack of plan cards; the pill row shows which plan is in view.

Starter

$12.44 / mo

Same-day appointments
Insurance friendly
Family plans

Team

$34.34 / mo

Same-day appointments
Certified specialists
Online results

Business

$60.86 / mo

Family plans
Certified specialists
Reminders

<nav id="spy-nav-1179" class="nav nav-pills justify-content-center mb-2">
  <a class="nav-link" href="#spy-1180">Starter</a><a class="nav-link" href="#spy-1181">Team</a><a class="nav-link" href="#spy-1182">Business</a>
</nav>
<div class="position-relative border rounded p-3 bg-body-tertiary" style="height:230px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1179" data-ui-smooth-scroll="true" tabindex="0">
  <div id="spy-1180" class="card mb-3">
    <div class="card-body">
      <h3 class="h6 card-title">Starter</h3>
      <p class="fs-4 fw-bold mb-1">$12.44<small class="fs-6 text-body-secondary"> / mo</small></p>
      <ul class="small mb-0">
        <li>Same-day appointments</li>
        <li>Insurance friendly</li>
        <li>Family plans</li>
      </ul>
    </div>
  </div>
  <div id="spy-1181" class="card mb-3">
    <div class="card-body">
      <h3 class="h6 card-title">Team</h3>
      <p class="fs-4 fw-bold mb-1">$34.34<small class="fs-6 text-body-secondary"> / mo</small></p>
      <ul class="small mb-0">
        <li>Same-day appointments</li>
        <li>Certified specialists</li>
        <li>Online results</li>
      </ul>
    </div>
  </div>
  <div id="spy-1182" class="card mb-3">
    <div class="card-body">
      <h3 class="h6 card-title">Business</h3>
      <p class="fs-4 fw-bold mb-1">$60.86<small class="fs-6 text-body-secondary"> / mo</small></p>
      <ul class="small mb-0">
        <li>Family plans</li>
        <li>Certified specialists</li>
        <li>Reminders</li>
      </ul>
    </div>
  </div>
</div>

14Chapter reader

A reading pane with chapter links in a small dropdown-free list above.

Chapter 1: A simple monthly skin check

We measure success by how many patients come back and tell their friends. Family plans cover check-ups and vaccinations for everyone under one roof. Our clinic is fully accessible, with free parking right outside. Clear prices, honest advice and no surprises along the way.

Book online in two minutes and see a doctor as soon as today. We listen first, then build a plan around what you actually need. Video consultations let you speak with a doctor from the comfort of home. Start in minutes and get help from a real person whenever you need it.

Chapter 2: When to choose a video consultation

We keep things simple, so you can focus on what matters to you. Our team has done this many times, so you never have to guess. Friendly reminders make sure you never miss a check-up or a dose.

Same-day appointments are available for urgent needs on weekdays. Lab results arrive in your patient portal, usually within 48 hours. Every detail is handled by people who care about getting it right.

Chapter 3: Staying active after an injury

Modern equipment means faster diagnoses and more comfortable treatment. Children are welcome, and our paediatric team knows how to make them smile. Friendly people answer your questions quickly, by phone, chat or email.

We work with most insurance providers and explain any costs upfront. Your records are private, secure and always available when you need them. Our specialists take time to listen and explain every step of your treatment. Thousands of patients already trust us, and we work hard to keep it that way.

Chapter 4: Inside our new heart screening clinic

Our clinic is fully accessible, with free parking right outside. Your records are private, secure and always available when you need them. Friendly people answer your questions quickly, by phone, chat or email.

Start in minutes and get help from a real person whenever you need it. We listen first, then build a plan around what you actually need. Lab results arrive in your patient portal, usually within 48 hours.

<nav id="spy-nav-1183" class="nav nav-tabs mb-0 small">
  <a class="nav-link" href="#spy-1184">Chapter 1</a><a class="nav-link" href="#spy-1185">Chapter 2</a><a class="nav-link" href="#spy-1186">Chapter 3</a><a class="nav-link" href="#spy-1187">Chapter 4</a>
</nav>
<div class="position-relative border rounded p-3 border-top-0 rounded-top-0 lh-lg" style="height:240px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1183" data-ui-smooth-scroll="true" tabindex="0">
  <div id="spy-1184" class="pb-3">
    <h3 class="h6">Chapter 1: A simple monthly skin check</h3>
    <p class="small">We measure success by how many patients come back and tell their friends. Family plans cover check-ups and vaccinations for everyone under one roof. Our clinic is fully accessible, with free parking right outside. Clear prices, honest advice and no surprises along the way.</p>
    <p class="small">Book online in two minutes and see a doctor as soon as today. We listen first, then build a plan around what you actually need. Video consultations let you speak with a doctor from the comfort of home. Start in minutes and get help from a real person whenever you need it.</p>
  </div>
  <div id="spy-1185" class="pb-3">
    <h3 class="h6">Chapter 2: When to choose a video consultation</h3>
    <p class="small">We keep things simple, so you can focus on what matters to you. Our team has done this many times, so you never have to guess. Friendly reminders make sure you never miss a check-up or a dose.</p>
    <p class="small">Same-day appointments are available for urgent needs on weekdays. Lab results arrive in your patient portal, usually within 48 hours. Every detail is handled by people who care about getting it right.</p>
  </div>
  <div id="spy-1186" class="pb-3">
    <h3 class="h6">Chapter 3: Staying active after an injury</h3>
    <p class="small">Modern equipment means faster diagnoses and more comfortable treatment. Children are welcome, and our paediatric team knows how to make them smile. Friendly people answer your questions quickly, by phone, chat or email.</p>
    <p class="small">We work with most insurance providers and explain any costs upfront. Your records are private, secure and always available when you need them. Our specialists take time to listen and explain every step of your treatment. Thousands of patients already trust us, and we work hard to keep it that way.</p>
  </div>
  <div id="spy-1187" class="pb-3">
    <h3 class="h6">Chapter 4: Inside our new heart screening clinic</h3>
    <p class="small">Our clinic is fully accessible, with free parking right outside. Your records are private, secure and always available when you need them. Friendly people answer your questions quickly, by phone, chat or email.</p>
    <p class="small">Start in minutes and get help from a real person whenever you need it. We listen first, then build a plan around what you actually need. Lab results arrive in your patient portal, usually within 48 hours.</p>
  </div>
</div>

15Settings form

A long settings form split into sections with a side menu that follows along.

Profile Notifications Privacy

Profile

Display name

City

Children are welcome, and our paediatric team knows how to make them smile. We keep things simple, so you can focus on what matters to you. We work with most insurance providers and explain any costs upfront. Book online in two minutes and see a doctor as soon as today.

Notifications

Product news

Weekly digest

Every detail is handled by people who care about getting it right. Clear prices, honest advice and no surprises along the way. Our team has done this many times, so you never have to guess. Friendly reminders make sure you never miss a check-up or a dose.

Privacy

Hide my profile from search

Our specialists take time to listen and explain every step of your treatment. We measure success by how many patients come back and tell their friends. Modern equipment means faster diagnoses and more comfortable treatment. Same-day appointments are available for urgent needs on weekdays.

<div class="row g-3">
  <div class="col-sm-4">
    <div id="spy-nav-1188" class="list-group list-group-flush border rounded">
      <a class="list-group-item list-group-item-action" href="#spy-1189">Profile</a><a class="list-group-item list-group-item-action" href="#spy-1190">Notifications</a><a class="list-group-item list-group-item-action" href="#spy-1191">Privacy</a>
    </div>
  </div>
  <div class="col-sm-8">
    <div class="position-relative border rounded p-3" style="height:240px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1188" data-ui-smooth-scroll="true" tabindex="0">
      <div id="spy-1189" class="pb-3">
        <h3 class="h6">Profile</h3>
        <div class="mb-2">
          <label for="spy-in-1192" class="form-label small">Display name</label>
          <input class="form-control form-control-sm" id="spy-in-1192" value="Felix Moreau">
        </div>
        <div class="mb-2">
          <label for="spy-in-1193" class="form-label small">City</label>
          <input class="form-control form-control-sm" id="spy-in-1193" value="Kyoto">
        </div>
        <p class="small">Children are welcome, and our paediatric team knows how to make them smile. We keep things simple, so you can focus on what matters to you. We work with most insurance providers and explain any costs upfront. Book online in two minutes and see a doctor as soon as today.</p>
      </div>
      <div id="spy-1190" class="pb-3">
        <h3 class="h6">Notifications</h3>
        <div class="form-check form-switch">
          <input class="form-check-input" type="checkbox" role="switch" id="spy-sw-1194" checked>
          <label class="form-check-label small" for="spy-sw-1194">Product news</label>
        </div>
        <div class="form-check form-switch">
          <input class="form-check-input" type="checkbox" role="switch" id="spy-sw-1195">
          <label class="form-check-label small" for="spy-sw-1195">Weekly digest</label>
        </div>
        <p class="small">Every detail is handled by people who care about getting it right. Clear prices, honest advice and no surprises along the way. Our team has done this many times, so you never have to guess. Friendly reminders make sure you never miss a check-up or a dose.</p>
      </div>
      <div id="spy-1191" class="pb-3">
        <h3 class="h6">Privacy</h3>
        <div class="form-check">
          <input class="form-check-input" type="checkbox" id="spy-sw-1196">
          <label class="form-check-label small" for="spy-sw-1196">Hide my profile from search</label>
        </div>
        <p class="small">Our specialists take time to listen and explain every step of your treatment. We measure success by how many patients come back and tell their friends. Modern equipment means faster diagnoses and more comfortable treatment. Same-day appointments are available for urgent needs on weekdays.</p>
      </div>
    </div>
  </div>
</div>

16Team directory

Department links track a scrolling list of people.

Human Resources

Zoe Lindqvist
QA Engineer
Maya Brennan
Data Analyst
Kai Sato
Backend Engineer

Legal

Theo Alvarez
Product Designer
Liam Ortega
Art Director
Nadia Quinn
Operations Manager

Marketing

Lea Nguyen
Project Manager
Felix Haddad
Frontend Engineer
Arjun Carter
Project Manager

<nav id="spy-nav-1197" class="nav nav-pills mb-2 small flex-wrap">
  <a class="nav-link" href="#spy-1198">Human Resources</a><a class="nav-link" href="#spy-1199">Legal</a><a class="nav-link" href="#spy-1200">Marketing</a>
</nav>
<div class="position-relative border rounded p-3" style="height:230px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1197" data-ui-smooth-scroll="true" tabindex="0">
  <div id="spy-1198" class="pb-3">
    <h3 class="h6">Human Resources</h3>
    <ul class="list-unstyled">
      <li class="d-flex align-items-center gap-2 mb-2"><img src="../assets/img/avatar-5.svg" class="rounded-circle" width="36" height="36" alt="Zoe Lindqvist"><div><div class="small fw-semibold">Zoe Lindqvist</div><div class="small text-body-secondary">QA Engineer</div></div></li>
      <li class="d-flex align-items-center gap-2 mb-2"><img src="../assets/img/avatar-1.svg" class="rounded-circle" width="36" height="36" alt="Maya Brennan"><div><div class="small fw-semibold">Maya Brennan</div><div class="small text-body-secondary">Data Analyst</div></div></li>
      <li class="d-flex align-items-center gap-2 mb-2"><img src="../assets/img/avatar-6.svg" class="rounded-circle" width="36" height="36" alt="Kai Sato"><div><div class="small fw-semibold">Kai Sato</div><div class="small text-body-secondary">Backend Engineer</div></div></li>
    </ul>
  </div>
  <div id="spy-1199" class="pb-3">
    <h3 class="h6">Legal</h3>
    <ul class="list-unstyled">
      <li class="d-flex align-items-center gap-2 mb-2"><img src="../assets/img/avatar-8.svg" class="rounded-circle" width="36" height="36" alt="Theo Alvarez"><div><div class="small fw-semibold">Theo Alvarez</div><div class="small text-body-secondary">Product Designer</div></div></li>
      <li class="d-flex align-items-center gap-2 mb-2"><img src="../assets/img/avatar-5.svg" class="rounded-circle" width="36" height="36" alt="Liam Ortega"><div><div class="small fw-semibold">Liam Ortega</div><div class="small text-body-secondary">Art Director</div></div></li>
      <li class="d-flex align-items-center gap-2 mb-2"><img src="../assets/img/avatar-11.svg" class="rounded-circle" width="36" height="36" alt="Nadia Quinn"><div><div class="small fw-semibold">Nadia Quinn</div><div class="small text-body-secondary">Operations Manager</div></div></li>
    </ul>
  </div>
  <div id="spy-1200" class="pb-3">
    <h3 class="h6">Marketing</h3>
    <ul class="list-unstyled">
      <li class="d-flex align-items-center gap-2 mb-2"><img src="../assets/img/avatar-7.svg" class="rounded-circle" width="36" height="36" alt="Lea Nguyen"><div><div class="small fw-semibold">Lea Nguyen</div><div class="small text-body-secondary">Project Manager</div></div></li>
      <li class="d-flex align-items-center gap-2 mb-2"><img src="../assets/img/avatar-10.svg" class="rounded-circle" width="36" height="36" alt="Felix Haddad"><div><div class="small fw-semibold">Felix Haddad</div><div class="small text-body-secondary">Frontend Engineer</div></div></li>
      <li class="d-flex align-items-center gap-2 mb-2"><img src="../assets/img/avatar-2.svg" class="rounded-circle" width="36" height="36" alt="Arjun Carter"><div><div class="small fw-semibold">Arjun Carter</div><div class="small text-body-secondary">Project Manager</div></div></li>
    </ul>
  </div>
</div>

17Catalogue categories

Category pills over a scrolling price list.

Dermatology

Sports injury clinic$115.99
Skin check$92.00
Teeth whitening$239.00

Cardiology

Child check-up$67.99
Dental cleaning$93.99
Skin check$95.00

Pediatrics

Video consult$36.00
Teeth whitening$266.00
Physio session$70.99

<nav id="spy-nav-1201" class="nav nav-pills nav-fill mb-2 small">
  <a class="nav-link" href="#spy-1202">Dermatology</a><a class="nav-link" href="#spy-1203">Cardiology</a><a class="nav-link" href="#spy-1204">Pediatrics</a>
</nav>
<div class="position-relative border rounded p-3" style="height:220px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1201" data-ui-smooth-scroll="true" tabindex="0">
  <div id="spy-1202" class="pb-3">
    <h3 class="h6">Dermatology</h3>
    <ul class="list-unstyled">
      <li class="d-flex justify-content-between border-bottom py-2 small"><span>Sports injury clinic</span><span class="fw-semibold">$115.99</span></li>
      <li class="d-flex justify-content-between border-bottom py-2 small"><span>Skin check</span><span class="fw-semibold">$92.00</span></li>
      <li class="d-flex justify-content-between border-bottom py-2 small"><span>Teeth whitening</span><span class="fw-semibold">$239.00</span></li>
    </ul>
  </div>
  <div id="spy-1203" class="pb-3">
    <h3 class="h6">Cardiology</h3>
    <ul class="list-unstyled">
      <li class="d-flex justify-content-between border-bottom py-2 small"><span>Child check-up</span><span class="fw-semibold">$67.99</span></li>
      <li class="d-flex justify-content-between border-bottom py-2 small"><span>Dental cleaning</span><span class="fw-semibold">$93.99</span></li>
      <li class="d-flex justify-content-between border-bottom py-2 small"><span>Skin check</span><span class="fw-semibold">$95.00</span></li>
    </ul>
  </div>
  <div id="spy-1204" class="pb-3">
    <h3 class="h6">Pediatrics</h3>
    <ul class="list-unstyled">
      <li class="d-flex justify-content-between border-bottom py-2 small"><span>Video consult</span><span class="fw-semibold">$36.00</span></li>
      <li class="d-flex justify-content-between border-bottom py-2 small"><span>Teeth whitening</span><span class="fw-semibold">$266.00</span></li>
      <li class="d-flex justify-content-between border-bottom py-2 small"><span>Physio session</span><span class="fw-semibold">$70.99</span></li>
    </ul>
  </div>
</div>

18Inside a card

Card header pills spy on the scrolling card body.

Today

Family plans cover check-ups and vaccinations for everyone under one roof. Video consultations let you speak with a doctor from the comfort of home. Friendly people answer your questions quickly, by phone, chat or email.

This week

Same-day appointments are available for urgent needs on weekdays. Thousands of patients already trust us, and we work hard to keep it that way. We listen first, then build a plan around what you actually need. Friendly reminders make sure you never miss a check-up or a dose.

Later

Our clinic is fully accessible, with free parking right outside. Modern equipment means faster diagnoses and more comfortable treatment. Children are welcome, and our paediatric team knows how to make them smile. Your records are private, secure and always available when you need them.

<div class="card">
  <div class="card-header">
    <nav id="spy-nav-1205" class="nav nav-pills card-header-pills">
      <a class="nav-link" href="#spy-1206">Today</a><a class="nav-link" href="#spy-1207">This week</a><a class="nav-link" href="#spy-1208">Later</a>
    </nav>
  </div>
  <div class="card-body p-0">
    <div class="position-relative border rounded p-3 border-0 rounded-0" style="height:200px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1205" data-ui-smooth-scroll="true" tabindex="0">
      <div id="spy-1206" class="pb-3">
        <h3 class="h6">Today</h3>
        <p class="small">Family plans cover check-ups and vaccinations for everyone under one roof. Video consultations let you speak with a doctor from the comfort of home. Friendly people answer your questions quickly, by phone, chat or email.</p>
      </div>
      <div id="spy-1207" class="pb-3">
        <h3 class="h6">This week</h3>
        <p class="small">Same-day appointments are available for urgent needs on weekdays. Thousands of patients already trust us, and we work hard to keep it that way. We listen first, then build a plan around what you actually need. Friendly reminders make sure you never miss a check-up or a dose.</p>
      </div>
      <div id="spy-1208" class="pb-3">
        <h3 class="h6">Later</h3>
        <p class="small">Our clinic is fully accessible, with free parking right outside. Modern equipment means faster diagnoses and more comfortable treatment. Children are welcome, and our paediatric team knows how to make them smile. Your records are private, secure and always available when you need them.</p>
      </div>
    </div>
  </div>
</div>

19Dark theme

The whole widget inside <code>data-ui-theme="dark"</code>.

Launch

Lab results arrive in your patient portal, usually within 48 hours. Book online in two minutes and see a doctor as soon as today. We keep things simple, so you can focus on what matters to you. Clear prices, honest advice and no surprises along the way.

Orbit

Video consultations let you speak with a doctor from the comfort of home. Every detail is handled by people who care about getting it right. Our specialists take time to listen and explain every step of your treatment.

Landing

We measure success by how many patients come back and tell their friends. We work with most insurance providers and explain any costs upfront. Start in minutes and get help from a real person whenever you need it. Family plans cover check-ups and vaccinations for everyone under one roof.

<div data-ui-theme="dark" class="bg-dark text-body rounded p-3">
  <nav id="spy-nav-1209" class="nav nav-pills mb-2">
    <a class="nav-link" href="#spy-1210">Launch</a><a class="nav-link" href="#spy-1211">Orbit</a><a class="nav-link" href="#spy-1212">Landing</a>
  </nav>
  <div class="position-relative border rounded p-3 border-secondary" style="height:200px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1209" data-ui-smooth-scroll="true" tabindex="0">
    <div id="spy-1210" class="pb-3">
      <h3 class="h6">Launch</h3>
      <p class="small">Lab results arrive in your patient portal, usually within 48 hours. Book online in two minutes and see a doctor as soon as today. We keep things simple, so you can focus on what matters to you. Clear prices, honest advice and no surprises along the way.</p>
    </div>
    <div id="spy-1211" class="pb-3">
      <h3 class="h6">Orbit</h3>
      <p class="small">Video consultations let you speak with a doctor from the comfort of home. Every detail is handled by people who care about getting it right. Our specialists take time to listen and explain every step of your treatment.</p>
    </div>
    <div id="spy-1212" class="pb-3">
      <h3 class="h6">Landing</h3>
      <p class="small">We measure success by how many patients come back and tell their friends. We work with most insurance providers and explain any costs upfront. Start in minutes and get help from a real person whenever you need it. Family plans cover check-ups and vaccinations for everyone under one roof.</p>
    </div>
  </div>
</div>

20Changelog

Version links on the left follow release notes with coloured change badges.

v3.2 Sep 25, 2026

NewOur team has done this many times, so you never have to guess.
ImprovedThousands of patients already trust us, and we work hard to keep it that way.
FixedFamily plans cover check-ups and vaccinations for everyone under one roof.

v3.1 May 22, 2026

NewSame-day appointments are available for urgent needs on weekdays.
ImprovedWe work with most insurance providers and explain any costs upfront.
FixedModern equipment means faster diagnoses and more comfortable treatment.

v3.0 May 5, 2026

NewVideo consultations let you speak with a doctor from the comfort of home.
ImprovedFriendly reminders make sure you never miss a check-up or a dose.
FixedFriendly people answer your questions quickly, by phone, chat or email.

v2.9 Oct 8, 2026

NewOur specialists take time to listen and explain every step of your treatment.
ImprovedClear prices, honest advice and no surprises along the way.
FixedYour records are private, secure and always available when you need them.

<div class="row g-3">
  <div class="col-3">
    <nav id="spy-nav-1213" class="nav nav-pills flex-column small">
      <a class="nav-link" href="#spy-1214">v3.2</a><a class="nav-link" href="#spy-1215">v3.1</a><a class="nav-link" href="#spy-1216">v3.0</a><a class="nav-link" href="#spy-1217">v2.9</a>
    </nav>
  </div>
  <div class="col-9">
    <div class="position-relative border rounded p-3" style="height:240px;overflow-y:auto" data-ui-spy="scroll" data-ui-target="#spy-nav-1213" data-ui-smooth-scroll="true" tabindex="0">
      <div id="spy-1214" class="pb-3">
        <h3 class="h6">v3.2 <small class="text-body-secondary fw-normal">Sep 25, 2026</small></h3>
        <ul class="list-unstyled small">
          <li class="mb-1"><span class="badge text-bg-success me-1">New</span>Our team has done this many times, so you never have to guess.</li>
          <li class="mb-1"><span class="badge text-bg-primary me-1">Improved</span>Thousands of patients already trust us, and we work hard to keep it that way.</li>
          <li class="mb-1"><span class="badge text-bg-danger me-1">Fixed</span>Family plans cover check-ups and vaccinations for everyone under one roof.</li>
        </ul>
      </div>
      <div id="spy-1215" class="pb-3">
        <h3 class="h6">v3.1 <small class="text-body-secondary fw-normal">May 22, 2026</small></h3>
        <ul class="list-unstyled small">
          <li class="mb-1"><span class="badge text-bg-success me-1">New</span>Same-day appointments are available for urgent needs on weekdays.</li>
          <li class="mb-1"><span class="badge text-bg-primary me-1">Improved</span>We work with most insurance providers and explain any costs upfront.</li>
          <li class="mb-1"><span class="badge text-bg-danger me-1">Fixed</span>Modern equipment means faster diagnoses and more comfortable treatment.</li>
        </ul>
      </div>
      <div id="spy-1216" class="pb-3">
        <h3 class="h6">v3.0 <small class="text-body-secondary fw-normal">May 5, 2026</small></h3>
        <ul class="list-unstyled small">
          <li class="mb-1"><span class="badge text-bg-success me-1">New</span>Video consultations let you speak with a doctor from the comfort of home.</li>
          <li class="mb-1"><span class="badge text-bg-primary me-1">Improved</span>Friendly reminders make sure you never miss a check-up or a dose.</li>
          <li class="mb-1"><span class="badge text-bg-danger me-1">Fixed</span>Friendly people answer your questions quickly, by phone, chat or email.</li>
        </ul>
      </div>
      <div id="spy-1217" class="pb-3">
        <h3 class="h6">v2.9 <small class="text-body-secondary fw-normal">Oct 8, 2026</small></h3>
        <ul class="list-unstyled small">
          <li class="mb-1"><span class="badge text-bg-success me-1">New</span>Our specialists take time to listen and explain every step of your treatment.</li>
          <li class="mb-1"><span class="badge text-bg-primary me-1">Improved</span>Clear prices, honest advice and no surprises along the way.</li>
          <li class="mb-1"><span class="badge text-bg-danger me-1">Fixed</span>Your records are private, secure and always available when you need them.</li>
        </ul>
      </div>
    </div>
  </div>
</div>