back in the saddle. todos.

Turns out that my last week of git pushes for github weren't working. My work account was the active GH account and my gitea account was getting the updates as expected. Good to know that with multiple git remotes, if there's no repo, there are also no warnings.
Backed up Walmart Supplier's templates. Downloaded BuilderTrend's as well as they have just been assigned to me.
2025-01-02 16:58:31 -05:00 · 2024-12-30 11:55:40 -05:00 · 2024-12-20 13:32:45 -05:00 · 2024-12-19 15:57:45 -05:00 · 2024-12-18 15:41:44 -05:00
157 changed files with 7052 additions and 214 deletions
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,66 @@
+<div class="np-hidden-mobile">
+  <p>{% t .description %}</p>
+  <p>{% t .requirements %}</p>
+</div>
+
+<img
+  alt=""
+  class="np-account-avatar-image"
+  src="{{ form.gravatar_url }}?s=200"
+  id="{{version}}_gravatar_img"
+  {% unless form.use_gravatar? %}style="display: none"{% endunless %}
+/>
+<img
+  alt=""
+  class="np-account-avatar-image"
+  src="{{ form.secure_custom_avatar_url }}"
+  id="{{version}}_custom_avatar_img"
+  {% if form.use_gravatar? %}style="display: none"{% endif %}
+/>
+
+<div class="np-account-avatar-choice">
+  <div class="np-form-field">
+    <label class="radio radio-before np-input-label" for="{{version}}_learner_use_gravatar_true">
+      <span class="radio__input">
+        <input
+          id="{{version}}_learner_use_gravatar_true"
+          name="learner[use_gravatar]"
+          type="radio"
+          value="true"
+          {% if form.use_gravatar? %}checked{% endif %}
+        />
+        <span class="np-button-color radio__control"></span>
+      </span>
+      <span class="radio__label">
+        {% t .use_gravatar %}
+      </span>
+    </label>
+  </div>
+
+  <div class="np-form-field">
+    <label class="radio radio-before np-input-label" for="{{version}}_learner_use_gravatar_false">
+      <span class="radio__input">
+        <input
+          id="{{version}}_learner_use_gravatar_false"
+          name="learner[use_gravatar]"
+          type="radio"
+          value="false"
+          {% unless form.use_gravatar? %}checked{% endunless %}
+        />
+        <span class="np-button-color radio__control"></span>
+      </span>
+      <span class="radio__label">
+        {% t .upload_custom_photo %}
+      </span>
+    </label>
+  </div>
+  <div>
+    <button
+      id="{{version}}_upload_avatar"
+      type="button"
+      class="np-button np-button-secondary" {% if form.use_gravatar? %}style="visibility: hidden"{% endif %}
+    >
+      {% t .upload %}
+    </button>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,19 @@
+<form class="np-form" action="{{ form.options.action }}" method="post" id="desktop_edit_learner" novalidate>
+  <input type="hidden" name="_method" value="{{ form.options.http_method }}">
+  {% form_authenticity_token %}
+  <div class="np-card">
+    <div class="np-card-container np-card-padding">
+      <div class="row">
+        <div class="col-sm-7 np-account-form">
+          {% render "account_form", form: form, version: "desktop" %}
+          <button type="submit" class="np-button np-button-big np-button-large-font np-form-action">
+            {% t shared.account.save %}
+          </button>
+        </div>
+        <div class="col-sm-5 np-account-avatar">
+          {% include "account_avatar", version: "desktop" %}
+        </div>
+      </div>
+    </div>
+  </div>
+</form>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,139 @@
+<div class="np-resource-title">
+  {% t .header %}
+</div>
+<div class="np-form-field {% if form.errors contains 'email' %}np-account-form-field-error{% endif %}">
+  <label class="np-input-label" for="{{version}}_learner_email">{% t shared.email %} *</label>
+  <input
+    {% if form.options.invite? %} disabled {% endif %}
+    autofocus="autofocus"
+    class="np-input"
+    id="{{version}}_learner_email"
+    name="learner[email]"
+    type="email"
+    value="{{ form.email }}"
+  />
+</div>
+<div class="np-form-field {% if form.errors contains 'first_name' %}np-account-form-field-error{% endif %}">
+  <label class="np-input-label" for="{{version}}_learner_first_name">
+    {% t shared.first_name %} *
+  </label>
+  <input
+    class="np-input"
+    id="{{version}}_learner_first_name"
+    name="learner[first_name]"
+    value="{{ form.first_name }}"
+  />
+</div>
+<div class="np-form-field {% if form.errors contains 'last_name' %}np-account-form-field-error{% endif %}">
+  <label class="np-input-label" for="{{version}}_learner_last_name">
+    {% t shared.last_name %} *
+  </label>
+  <input
+    class="np-input"
+    id="{{version}}_learner_last_name"
+    name="learner[last_name]"
+    value="{{ form.last_name }}"
+  />
+</div>
+<div class="np-form-field {% if form.errors contains 'display_name' %}np-account-form-field-error{% endif %}">
+  <label class="np-input-label" for="{{version}}_learner_display_name">
+    {% t .display_name %}
+  </label>
+  <input
+    class="np-input"
+    id="{{version}}_learner_display_name"
+    name="learner[display_name]"
+    value="{{ form.display_name }}"
+  />
+</div>
+
+{% unless form.options.invite?  %}
+  <div class="np-form-field {% if form.errors contains 'current_password' %}np-account-form-field-error{% endif %}">
+    <label class="np-input-label" for="{{version}}_learner_current_password">
+      {% t .current_password %} *
+    </label>
+    <input
+      class="np-input"
+      id="{{version}}_learner_current_password"
+      name="learner[current_password]"
+      type="password"
+    />
+  </div>
+
+  <div class="np-form-field {% if form.errors contains 'password' %}np-account-form-field-error{% endif %}">
+    <label class="np-input-label" for="{{version}}_learner_password">
+      {% t .new_password %} *
+    </label>
+    <input
+      class="np-input"
+      id="{{version}}_learner_password"
+      name="learner[password]"
+      type="password"
+    />
+  </div>
+
+  <div class="np-form-field {% if form.errors contains 'password_confirmation' %}np-account-form-field-error{% endif %}">
+    <label class="np-input-label" for="{{version}}_learner_password_confirmation">
+      {% t .confirm_new_password %} *
+    </label>
+    <input
+      class="np-input"
+      id="{{version}}_learner_password_confirmation"
+      name="learner[password_confirmation]"
+      type="password"
+    />
+  </div>
+{% endunless %}
+
+{% if form.options.invite?  %}
+  <div class="np-form-field {% if form.errors contains 'password' %}np-account-form-field-error{% endif %}">
+    <label class="np-input-label" for="{{version}}_learner_password">
+      {% t shared.password %} *
+    </label>
+    <input
+      class="np-input"
+      id="{{version}}_learner_password"
+      name="learner[password]"
+      type="password"
+    />
+  </div>
+
+  {% if form.terms_of_service_required? %}
+    <div class="np-form-field terms-of-service {% if form.errors contains 'terms_of_service_accepted' %}np-account-form-field-error{% endif %}">
+      <input
+        id="{{version}}_learner_terms_of_service"
+        name="learner[terms_of_service_accepted]"
+        type="checkbox"
+      />
+      <div class="label">
+        {% t .terms_of_service %}
+        <a
+          target="_blank"
+          href={{ form.terms_of_service_url }}
+        >
+          {% t .terms_link %}
+        </a>
+      </div>
+    </div>
+  {% else %}
+    <div class="np-margin-top">
+      <span class="np-form-terms ">
+        {% t .terms %}
+        <a
+          class="np-form-link np-button-color"
+          target="_blank"
+          href={{ form.terms_of_service_url }}
+        >
+          {% t .terms_link %}
+        </a>
+      </span>
+    </div>
+  {% endif %}
+
+  <input
+    id="{{version}}_invite_token"
+    name="learner[token]"
+    value="{{ form.invite_token }}"
+    type="hidden"
+  />
+{% endif %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,17 @@
+<form class="np-form" action="{{ form.options.action }}" method="post" id="mobile_edit_learner" novalidate>
+  <input type="hidden" name="_method" value="{{ form.options.http_method }}">
+  {% form_authenticity_token %}
+  <div class="np-card np-account-form">
+    <div class="np-card-container np-card-padding">
+      {% render "account_form", form: form, version: "mobile" %}
+    </div>
+  </div>
+  <div class="np-card np-account-avatar">
+    <div class="np-card-container np-card-padding">
+      {% include "account_avatar", version: "mobile" %}
+    </div>
+  </div>
+  <button type="submit" class="np-button np-button-big np-button-large-font np-form-action">
+    {% t shared.account.save %}
+  </button>
+</form>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,23 @@
+{% capture settings_path %}{% route account %}{% endcapture %}
+{% capture transcript_path %}{% route transcript %}{% endcapture %}
+
+{% if current_person.signed_in? %}
+{% unless current_school.sso_active? %}
+  <nav class="np-tabs np-account-tabs">
+    <div class="np-tabs-content">
+      <div class="np-tab{% if page.path == settings_path %} np-tab-active{% endif %}">
+        <a class="np-tab-link" href="{{ settings_path}}">
+          {% t .profile_settings %}
+        </a>
+        <div class="np-tab-indicator np-button-background-color"></div>
+      </div>
+      <div class="np-tab{% if page.path == transcript_path %} np-tab-active{% endif %}">
+        <a class="np-tab-link" href="{{ transcript_path }}">
+          {% t .transcript %}
+        </a>
+        <div class="np-tab-indicator np-button-background-color"></div>
+      </div>
+    </div>
+  </nav>
+{% endunless %}
+{% endif %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,48 @@
+{% assign activity_count = 0 %}
+{% for section in course.sections %}
+{% assign activity_count = activity_count | plus: section.activities.size %}
+{% endfor %}
+<div class="np-card">
+  <div class="np-card-container">
+    {% if course.ribbon %}
+      <div class="np-card-ribbon">
+        {{ course.ribbon }}
+      </div>
+    {% endif %}
+    <img
+      class="np-card-image"
+      alt="{{ course.name }}"
+      src="{{ course.image_url }}"
+    >
+    <div class="card-activity-count">{{ activity_count }}<br><span class="activity-label">Activities</span></div>
+    <div class="np-card-content np-card-content-vertical np-card-padding">
+      <h3 class="np-card-content-title">
+        {{ course.name }}
+      </h3>
+      <div class="np-card-content-subtitle">
+        {{ course.instructor_names }}
+      </div>
+      <div class="np-card-content-footer">
+        <div class="np-card-content-progress np-button-color">
+          {% if course.progress > 0 and course.progress < 100 %}
+            <div class="circle-progress" style="--percentage:{{ course.progress }}%;"></div> {% t shared.progress, count: course.progress %}
+            {% elsif course.progress == 100 %}
+              <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" style="margin-right: 10px;">
+<circle cx="10" cy="10" r="9.9" fill="#202227" stroke="#001A43" stroke-width="0.2"/>
+<path d="M14.8965 6.39644C15.0917 6.20118 15.4083 6.20119 15.6036 6.39645C15.7838 6.5767 15.7977 6.86032 15.6451 7.05646L15.6035 7.10356L8.60355 14.1033C8.42331 14.2835 8.13971 14.2973 7.94357 14.1448L7.89646 14.1033L4.39646 10.6036C4.20119 10.4083 4.20118 10.0917 4.39643 9.89646C4.57666 9.71621 4.86028 9.70234 5.05643 9.85484L5.10354 9.89643L8.2495 13.0422L14.8965 6.39644Z" fill="white"/>
+</svg> {% t shared.progress, count: course.progress %}
+            {% else %}
+          {% t shared.progress, count: course.progress %}
+          {% endif %}
+        </div>
+        {% capture course_path %}{% route course, id: course.id %}{% endcapture %}
+        {% if course.has_to_restart? %}
+          {% include "course_version_outdated_popup", path: course_path %}
+        {% endif %}
+        <a class="np-button np-button-wide" href="{{ course_path }}">
+          {% t shared.view %}
+        </a>
+      </div>
+    </div>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,93 @@
+<div class="np-card np-no-horizontal-padding">
+  <div class="np-card-container">
+    <div class="np-learning-path">
+      <div class="np-learning-image">
+      <span class="np-hidden-mobile np-learning-path-items">
+        <span class="np-learning-path-items-count">
+          {{ learning_path.items.count }} {% t .items %}
+        </span>
+      </span>
+      <img alt="{{ learning_path.name }}" class="np-card-image np-learning-path-image"
+        src="{{ learning_path.image_url }}" />
+        </div>
+      <div class="np-card-text-wrapper">
+        <div class="np-hidden-desktop np-card-header">
+          <i class="np-card-header-icon far fa-road"></i>
+          <div class="np-card-header-type">{% t shared.learning_path.title %}</div>
+          
+          <div class="np-hidden-desktop  np-card-header-items-count">
+            {{ learning_path.items.count }} {% t .items %}
+          </div>
+        </div>
+
+        <div class="np-card-content np-card-padding np-card-content-vertical">
+          <h3 class="np-card-content-title">
+            {{ learning_path.name }}
+          </h3>
+
+          <div class="np-card-content-subtitle">
+            {{ learning_path.instructor_names }}
+          </div>
+
+          <div class="np-hidden-mobile np-card-content-description">
+            {{ learning_path.description }}
+          </div>
+
+          <div class="np-hidden-mobile np-card-content-progress
+          np-button-color">
+            {% t shared.progress, count: learning_path.progress %}
+          </div>
+          <div class="progress-cta-container">
+            <div class="np-hidden-mobile np-card-progress-bar-container">
+              <div style="width: {{ learning_path.progress }}%" class="np-button-background-color np-card-progress-bar">
+              </div>
+            </div>
+
+            <div class="np-card-content-footer">
+              <div class="np-hidden-desktop np-card-content-progress
+            np-button-color">
+                {% t shared.progress, count: learning_path.progress %}
+              </div>
+              <a class="np-button" href="{% route learning_path, id: learning_path.id %}">
+                {% t shared.view %}
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="np-card-stack">
+    <div class="np-card-stack-level-1"></div>
+    <div class="np-card-stack-level-2"></div>
+  </div>
+</div>
+<style>
+  .np-learning-image{
+    background: #FFEFDE;
+    max-width: 345px;
+    align-content: center;
+  }
+  @media screen and (min-width: 768px){
+    .progress-cta-container{
+      display: flex;
+      flex-direction: row;
+      gap: 20px;
+    }
+    .np-card-content-footer{
+      margin-top: 0;
+    }
+    .np-learning-path-items{
+      bottom: 20px;
+      top: auto;
+    }
+    .np-learning-paths .np-card-content{
+      height: calc(100% - 16px);
+      padding-top: 24px;
+    }
+    .np-learning-paths .np-learning-path-image{
+      min-height: auto;
+      width: 100%;
+    }
+  }
+</style>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,53 @@
+<div class="np-card np-card-training-event">
+  <div class="np-card-container">
+    <div class="np-card-content-training-event">
+      <h3 class="np-card-content-title">
+        {{ training_event.title }}
+      </h3>
+      <div class="np-card-content-subtitle">
+        <i class="far {{ training_event.event_type_icon }} np-training-session-icon"></i>
+        {% t shared.event_types, key: training_event.event_type %}
+        <span class="np-card-training-sessions-separator">•</span>
+        <i class="np-card-training-sessions-icon far fa-calendar-star"></i>
+        <span class="np-card-training-sessions-label">
+          {% t .sessions, count: training_event.sessions.size %}
+        </span>
+      </div>
+      <div class="np-card-training-session">
+        <span class="np-card-content-label">
+          {% t .next_session %} -
+          <span class="{{ training_event.sessions.first.status.type}}">
+            {{ training_event.sessions.first.status.label}}
+          </span>
+        </span>
+        <div class="np-card-training-session-date">
+          <div class="np-button-background-color np-card-training-session-date-bar"></div>
+          <div class="np-card-training-session-date-label">
+            <div class="np-card-training-session-date-day">
+              {{ training_event.sessions.first.day }}
+            </div>
+            <div>
+              <div class="np-card-training-session-date-month">
+                {{ training_event.sessions.first.month }}
+              </div>
+              <div class="np-card-training-session-date-year">
+                {{ training_event.sessions.first.year }}
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="np-card-content np-card-content-vertical np-card-content-training-event">
+      <div class="np-card-training-sessions">
+
+        <a
+          class="np-button np-button-wide"
+          href="{% route training_session, id: training_event.sessions.first.id %}"
+        >
+          {% t shared.view %}
+        </a>
+      </div>
+    </div>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,97 @@
+<div class="filter-container">
+  <div class="filter-content">
+      <h4 class=" filtter-topic difficulty-filter" style="">
+        Difficulty
+      </h4>
+      {% assign sorted_categories = current_school.filterable_categories | sort: "name" %}
+          {% for category in sorted_categories %}
+            {% if category.name contains '[Difficulty]' %}
+            <div class="category-filter-container">
+                <input type="checkbox" class="category-filter" data-filter-type="category" value="{{ category.id }}" id="{{category.id}}">
+                {{category.name | remove: "[Difficulty]"}}
+            </div>
+            {% endif %}
+        {% endfor %}  
+      <h4 class=" filtter-topic plan-filter" style="">
+        Feature
+      </h4>
+      {% assign sorted_categories = current_school.filterable_categories | sort: "name" %}
+          {% for category in sorted_categories %}
+            {% if category.name contains '[Feature]' %}
+            <div class="category-filter-container">
+                <input type="checkbox" class="category-filter" data-filter-type="category" value="{{ category.id }}" id="{{category.id}}">
+                {{category.name | remove: "[Feature]"}}
+            </div>
+            {% endif %}
+        {% endfor %}  
+      <h4 class=" filtter-topic difficulty-filter" style="">
+        Role
+      </h4>
+      {% assign sorted_categories = current_school.filterable_categories | sort: "name" %}
+          {% for category in sorted_categories %}
+            {% if category.name contains '[Role]' %}
+            <div class="category-filter-container">
+                <input type="checkbox" class="category-filter" data-filter-type="category" value="{{ category.id }}" id="{{category.id}}">
+                {{category.name | remove: "[Role]"}}
+            </div>
+            {% endif %}
+        {% endfor %}  
+  </div>
+</div>
+
+
+{% comment %} Javascript to handle on click of checkbox is in Catlog.html.luquid {% endcomment %}
+
+
+<style>
+  .active-checkbox {
+    color: red
+  }
+
+  .filter-container {
+    width: 90%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    padding: 30px 0 0 30px;
+    border-right: 1px solid #DFDFDF;
+    max-width: 285px;
+    
+  }
+  .filter-heading {
+    margin-bottom: 1rem;
+    font-weight: 600;
+    font-size: 12px;
+    color: #808080;
+    letter-spacing: 0.1em;
+    text-transform: uppercase;
+    width: 100%;
+  }
+  .filtter-topic {
+    margin-top: 18px;
+    margin-bottom: 14px;
+    padding-bottom: 8px;
+    text-transform: uppercase;
+    font-weight: 400;
+    border-bottom: 1px solid #DBDBDB;
+  }
+  .category-filter-container {
+    display: flex;
+    margin: 0.3rem 0;
+    
+  }
+  .filteer-btns {
+    display: flex; 
+    gap: 1rem;
+    margin: 1rem 0;
+  }
+  .category-filter {
+    margin-right: 0.5rem;
+  }
+  .filter-content {
+    text-align: left;
+    width: 100%;
+    font-size: 14px;
+  }
+</style>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,4 @@
+<div class="col-xs-12 col-md-4 spacing-clear">
+  {% include "certificates_verification" %}
+  {% include "certificates_metadata" %}
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,59 @@
+<div class="np-card spacing-clear">
+  <div class="np-card-container padding-spacing-8">
+    <div class="row np-certificate-metadata-row">
+      <div class="col-xs-6 col-md-6">
+        <p class="np-certificate-metadata-title" >
+          {% t .learner %}
+        </p>
+      </div>
+      <div class="col-xs-6 col-md-6">
+        <p class="np-certificate-metadata-value">
+          {{certificate.learner_name}}
+        </p>
+      </div>
+    </div>
+    <div class="line"></div>
+
+    {% if certificate.issuer_name_enabled? %}
+      <div class="row  np-certificate-metadata-row">
+        <div class="col-xs-6 col-md-6">
+          <p class="np-certificate-metadata-title">
+            {% t .issued_by %}
+          </p>
+        </div>
+        <div class="col-xs-6 col-md-6">
+          <p class="np-certificate-metadata-value">
+            {{ certificate.issuer_name }}
+          </p>
+        </div>
+      </div>
+      <div class="line"></div>
+    {% endif %}
+
+    <div class="row np-certificate-metadata-row">
+      <div class="col-xs-6 col-md-6">
+        <p class="np-certificate-metadata-title" >
+          {% t .issued_on %}
+        </p>
+      </div>
+      <div class="col-xs-6 col-md-6">
+        <p class="np-certificate-metadata-value">
+          {{ certificate.issue_date }}
+        </p>
+      </div>
+    </div>
+    <div class="line"></div>
+    <div class="row np-certificate-metadata-row">
+      <div class="col-xs-6 col-md-6">
+        <p class="np-certificate-metadata-title" >
+          {% t .expires_on %}
+        </p>
+      </div>
+      <div class="col-xs-6 col-md-6">
+        <p class="np-certificate-metadata-value">
+          {{ certificate.expiration_date_translation }}
+        </p>
+      </div>
+    </div>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,35 @@
+<script type="text/javascript">
+  const resizeIframe = () => {
+    const combinedPadding = 16;
+    const previewIframe = document.getElementById("previewIframe");
+    const previewIFrameCard = document.getElementById("previewIFrameCard");
+    const templateInPreviewContainer = previewIframe.contentWindow.document.querySelector('.np-certificate-container');
+    const previewIframeContentHeight = templateInPreviewContainer.offsetHeight;
+    const previewIframeContentWidth = templateInPreviewContainer.offsetWidth;
+    const certificateRatio = previewIframeContentHeight / previewIframeContentWidth;
+
+    templateInPreviewContainer.style.margin = 0;
+    previewIFrameCard.style.height = `${previewIFrameCard.offsetWidth * certificateRatio}px`;
+
+    const scaledIframeWidth = previewIFrameCard.offsetWidth - combinedPadding;
+    const scaledIframeHeight = scaledIframeWidth * certificateRatio;
+    const scale = scaledIframeHeight / previewIframeContentHeight;
+
+    previewIframe.style.transform = `scale(${scale})`;
+  }
+
+  window.onresize = resizeIframe;
+</script>
+
+<div class="col-xs-12 col-md-8 np-certificate-iframe-container">
+  <div class="np-card spacing-clear">
+    <div id="previewIFrameCard" class="np-card-container np-certificate-card">
+      <iframe
+        id="previewIframe"
+        onload="resizeIframe()"
+        class="np-certificate-iframe-preview"
+        srcdoc="{{ certificate.certificate_template_html }}"
+      ></iframe>
+    </div>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,44 @@
+<div class="top-bar np-certificate-top-bar-spacing">
+  <div class="top-bar__container uk-container uk-container-center uk-padding-horizontal np-max-width">
+    <div class="top-bar__col">
+      <h2 class="np-certificate-title" >
+        {{certificate.certificate_name}}
+      </h2>
+    </div>
+    <div class="button-container np-certificate-button-container">
+      {% if certificate.linkedin_sharing_enabled and current_person.signed_in? and certificate.learner_uuid == current_person.id %}
+        <a
+          class="np-button np-certificate-button np-certificate-button-secondary"
+          href="{{certificate.linkedin_share_url}}"
+          target="_blank"
+        >
+          <i class="fab fa-linkedin np-certificate-share-icon"></i>
+          {% t .share %}
+        </a>
+      {% endif %}
+      <button
+        id="print"
+        type="button"
+        class="np-button np-certificate-button np-certificate-button-secondary np-certificate-button-print"
+      >
+        {% t .print %}
+      </button>
+      {% if certificate.generating_pdf %}
+        <div class="np-button np-certificate-button np-certificate-button-primary np-certificate-spinner-container">
+          <i class="loader fad fa-spinner-third fa-spin np-certificate-spinner-icon np-button-font-color"></i>
+        </div>
+      {% else %}
+        <a
+        href="{{ certificate.download_url }}"
+        aria-label="{% t .download %}"
+        target="_blank"
+        rel="noopener noreferrer"
+        download
+        class="np-button np-certificate-button np-certificate-button-primary np-button-font-color"
+        >
+          {% t .download %}
+        </a>
+      {% endif %}
+    </div>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,15 @@
+<div class="np-card spacing-clear np-certificate-verification-card">
+  <div class="np-card-container np-certificate-verification-container">
+    <div class="np-certificate-verification-icon-container np-certificate-verification-icon-container-{{certificate.verification_status}}">
+      <i class="far fa-{{certificate.verification_icon}} np-certificate-verification-icon"></i>
+    </div>
+    <div class="np-certificate-verification-info-container">
+      <h2 class="np-certificate-verification-info-status spacing-clear">
+       {{certificate.verification_title}}
+      </h2>
+      <p class="np-certificate-verification-info-description spacing-clear">
+        {{certificate.verification_description}}
+      </p>
+    </div>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,4 @@
+<i class="far fa-lock-alt np-course-outline-content-activity-icon-locked"></i>
+<span class="np-course-outline-content-activity-title">
+  {{ activity.title }}
+</span>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,15 @@
+{% if course.enrolled? %}
+  <a
+    href="{% route activity_viewer,
+      id: activity.id,
+      course_id: params.course_id,
+      learning_path_id: params.learning_path_id
+    %}" class="{{ class }}"
+  >
+    {{ activity.title }}
+  </a>
+{% else%}
+  <span class="{{ class }}">
+    {{ activity.title }}
+  </span>
+{% endif %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,10 @@
+<h3 class="np-card-heading">
+  {% t .header %}
+</h3>
+<div class="np-flex">
+  {% for category in course.categories %}
+    <div class="np-content-categories-content-item">
+      {{ category.name }}
+    </div>
+  {% endfor %}
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,6 @@
+<h3 class="np-card-heading">
+  {% t .header, key: current_school.course_vocabulary %}
+</h3>
+<div class="np-card-text">
+  {{ course.full_description }}
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,58 @@
+<div class="np-card-container">
+  
+    {% include "course_header" %}
+ 
+  <div class="row np-course-content np-card-padding-dynamic">
+    <div class="col-xs-12 col-sm-6">
+      {% comment %} <img
+        src="{{ course.image_url }}"
+        class="np-top-image np-top-image-spacing"
+        alt="{{ course.name }}"
+      /> {% endcomment %}
+      {% include "course_description" %}
+
+      {% comment %} {% if course.categories.any? %}
+        <div class="np-card-content-divider">
+          {% include "course_categories" %}
+        </div>
+      {% endif %} {% endcomment %}
+
+      {% if course.instructors.any? %}
+        <div class="np-card-content-divider">
+          {% include "course_instructors" %}
+        </div>
+      {% endif %}
+
+      {% if course.events.any? %}
+        <div class="np-card-content-divider">
+          {% include "course_events" %}
+        </div>
+      {% endif %}
+    </div>
+    <div class="np-grid-spacing col-xs-12 col-sm-6">
+      <div class="np-top-cta">
+        {% include "course_progress_and_cta" %}
+      </div>
+      {% include "course_outline" %}
+    </div>
+  </div>
+</div>
+<style>
+  .np-card-container{
+    border-radius: 0;
+    box-shadow: none;
+  }
+  .certificate-header{
+    background-color: #FFEEEA;
+  }
+  .course-header{
+    background-color: #E6F6FF;
+  }
+  .np-course-header{
+    padding: 32px;
+    margin-bottom: 9px;
+  }
+  .np-icon-back{
+    color: #202227;
+  }
+</style>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,28 @@
+<h3 class="np-card-heading">
+  {% t .header %}
+</h3>
+<div class="np-flex-column">
+  {% for event in course.events %}
+    <div class="np-course-events-content-item">
+      <div class="np-course-events-content-date np-button-background-color">
+        <div class="np-course-events-content-month">
+          {{ event.sessions.first.abbreviated_month }}
+        </div>
+        <div class="np-course-events-content-day">
+          {{ event.sessions.first.day }}
+        </div>
+      </div>
+      <div class="np-course-events-content-details">
+        <div class="np-course-events-content-name">
+          {{ event.title }}
+        </div>
+        <div class="np-course-events-content-type np-text-light">
+          {% t shared.event_types, key: event.event_type %}
+        </div>
+        <div class="np-course-events-content-time np-button-color">
+          {{ event.sessions.first.time_period }} {{ event.sessions.first.time_zone }}
+        </div>
+      </div>
+    </div>
+  {% endfor %}
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,60 @@
+{% assign activity_count = 0 %}
+{% for section in course.sections %}
+{% assign activity_count = activity_count | plus: section.activities.size %}
+{% endfor %}
+{% if course.has_certificate? %}
+<div class="np-resource-header np-course-header np-card-padding-large certificate-header">
+  <div style="width: 100%;">
+    <div class="np-top-title">
+      <a href="#" onclick="window.history.back();" class="np-back-button" aria-label="{% t shared.go_back %}">
+        <i class="far fa-arrow-left np-hidden-mobile np-icon-back"></i>
+      </a>
+      {{ course.name }}
+    </div>
+    <div class="card-activity-count">{{ activity_count }}<br><span class="activity-label">Activities</span></div>
+  </div>
+  <div class="np-top-vocabulary np-text-title np-text-muted">
+    <svg xmlns="http://www.w3.org/2000/svg" width="71" height="61" viewBox="0 0 71 61" fill="none">
+      <path
+        d="M33 30.5C33 31.163 32.7366 31.7989 32.2678 32.2678C31.7989 32.7366 31.163 33 30.5 33H15.5C14.837 33 14.2011 32.7366 13.7322 32.2678C13.2634 31.7989 13 31.163 13 30.5C13 29.837 13.2634 29.2011 13.7322 28.7322C14.2011 28.2634 14.837 28 15.5 28H30.5C31.163 28 31.7989 28.2634 32.2678 28.7322C32.7366 29.2011 33 29.837 33 30.5ZM30.5 18H15.5C14.837 18 14.2011 18.2634 13.7322 18.7322C13.2634 19.2011 13 19.837 13 20.5C13 21.163 13.2634 21.7989 13.7322 22.2678C14.2011 22.7366 14.837 23 15.5 23H30.5C31.163 23 31.7989 22.7366 32.2678 22.2678C32.7366 21.7989 33 21.163 33 20.5C33 19.837 32.7366 19.2011 32.2678 18.7322C31.7989 18.2634 31.163 18 30.5 18ZM65.5 38.4594V58C65.504 58.4407 65.3913 58.8747 65.1735 59.2579C64.9557 59.6411 64.6405 59.9599 64.2598 60.1819C63.8791 60.404 63.4464 60.5215 63.0056 60.5225C62.5649 60.5235 62.1317 60.4079 61.75 60.1875L54.25 55.8937L46.75 60.1875C46.3683 60.4079 45.9351 60.5235 45.4944 60.5225C45.0536 60.5215 44.6209 60.404 44.2402 60.1819C43.8595 59.9599 43.5443 59.6411 43.3265 59.2579C43.1087 58.8747 42.996 58.4407 43 58V50.5H5.5C4.17392 50.5 2.90215 49.9732 1.96447 49.0355C1.02678 48.0979 0.5 46.8261 0.5 45.5V5.5C0.5 4.17392 1.02678 2.90215 1.96447 1.96447C2.90215 1.02678 4.17392 0.5 5.5 0.5H60.5C61.8261 0.5 63.0979 1.02678 64.0355 1.96447C64.9732 2.90215 65.5 4.17392 65.5 5.5V15.0406C67.0804 16.554 68.338 18.3716 69.1972 20.384C70.0564 22.3964 70.4993 24.5619 70.4993 26.75C70.4993 28.9381 70.0564 31.1036 69.1972 33.116C68.338 35.1284 67.0804 36.946 65.5 38.4594ZM43 45.5V38.4594C40.2757 35.832 38.5539 32.336 38.1318 28.5747C37.7098 24.8135 38.6139 21.0228 40.6882 17.857C42.7625 14.6911 45.8768 12.3486 49.4937 11.2337C53.1106 10.1188 57.0033 10.3014 60.5 11.75V5.5H5.5V45.5H43ZM60.5 41.75C58.5201 42.5772 56.3957 43.0031 54.25 43.0031C52.1043 43.0031 49.9799 42.5772 48 41.75V53.6937L53 50.8312C53.3778 50.6153 53.8055 50.5017 54.2406 50.5017C54.6758 50.5017 55.1034 50.6153 55.4813 50.8312L60.4813 53.6937L60.5 41.75ZM65.5 26.75C65.5 24.525 64.8402 22.3499 63.604 20.4998C62.3679 18.6498 60.6109 17.2078 58.5552 16.3564C56.4995 15.5049 54.2375 15.2821 52.0552 15.7162C49.8729 16.1502 47.8684 17.2217 46.2951 18.795C44.7217 20.3684 43.6502 22.3729 43.2162 24.5552C42.7821 26.7375 43.0049 28.9995 43.8564 31.0552C44.7078 33.1109 46.1498 34.8679 47.9998 36.104C49.8499 37.3402 52.025 38 54.25 38C55.7274 38 57.1903 37.709 58.5552 37.1436C59.9201 36.5783 61.1603 35.7496 62.2049 34.7049C63.2496 33.6603 64.0783 32.4201 64.6436 31.0552C65.209 29.6903 65.5 28.2274 65.5 26.75Z"
+        fill="#FF9886" />
+    </svg>
+  </div>
+  <img src="{{ course.image_url }}" class="np-top-image np-hidden-desktop" alt="{{ course.name }}" />
+</div>
+{% else %}
+<div class="np-resource-header np-course-header np-card-padding-large course-header">
+  <div style="width: 100%;">
+    <div class="np-top-title">
+      <a href="#" onclick="window.history.back();" class="np-back-button" aria-label="{% t shared.go_back %}">
+        <i class="far fa-arrow-left np-hidden-mobile np-icon-back"></i>
+      </a>
+      {{ course.name }}
+    </div>
+    <div class="card-activity-count">{{ activity_count }}<br><span class="activity-label">Activities</span></div>
+  </div>
+  <div class="np-top-vocabulary np-text-title np-text-muted">
+    <svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 80 80" fill="none">
+      <path
+        d="M78.6749 27.7938L41.1749 7.79376C40.8132 7.60116 40.4097 7.50043 40 7.50043C39.5902 7.50043 39.1867 7.60116 38.825 7.79376L1.32495 27.7938C0.924965 28.0069 0.590453 28.3248 0.357201 28.7134C0.123949 29.1021 0.000732422 29.5468 0.000732422 30C0.000732422 30.4533 0.123949 30.898 0.357201 31.2866C0.590453 31.6752 0.924965 31.9931 1.32495 32.2063L9.99995 36.8344V51.9656C9.99735 53.1936 10.4493 54.3791 11.2687 55.2938C15.3625 59.8531 24.5343 67.5 40 67.5C45.1279 67.5424 50.2175 66.6136 55 64.7625V75C55 75.663 55.2633 76.2989 55.7322 76.7678C56.201 77.2366 56.8369 77.5 57.5 77.5C58.163 77.5 58.7989 77.2366 59.2677 76.7678C59.7366 76.2989 60 75.663 60 75V62.3469C63.26 60.465 66.2059 58.0852 68.7312 55.2938C69.5506 54.3791 70.0025 53.1936 70 51.9656V36.8344L78.6749 32.2063C79.0749 31.9931 79.4094 31.6752 79.6427 31.2866C79.876 30.898 79.9992 30.4533 79.9992 30C79.9992 29.5468 79.876 29.1021 79.6427 28.7134C79.4094 28.3248 79.0749 28.0069 78.6749 27.7938ZM40 62.5C26.4781 62.5 18.525 55.8938 15 51.9656V39.5L38.825 52.2063C39.1867 52.3989 39.5902 52.4996 40 52.4996C40.4097 52.4996 40.8132 52.3989 41.1749 52.2063L55 44.8344V59.3156C51.0625 61.1531 46.0999 62.5 40 62.5ZM65 51.9531C63.5013 53.6161 61.8246 55.1094 60 56.4063V42.1656L65 39.5V51.9531ZM58.75 37.1688L58.6812 37.1281L41.1812 27.7938C40.5973 27.4955 39.9197 27.4386 39.2942 27.6352C38.6688 27.8319 38.1456 28.2663 37.8374 28.845C37.5293 29.4236 37.4607 30.1002 37.6466 30.7289C37.8325 31.3577 38.2579 31.8882 38.8312 32.2063L53.4375 40L40 47.1656L7.81245 30L40 12.8344L72.1875 30L58.75 37.1688Z"
+        fill="#80C4FF" />
+    </svg>
+    </i>
+  </div>
+  <img src="{{ course.image_url }}" class="np-top-image np-hidden-desktop" alt="{{ course.name }}" />
+</div>
+{% endif %}
+<style>
+  .np-resource-header {
+    flex-direction: row;
+  }
+  .np-course-header{
+    padding-right: 132px;
+  }
+  .card-activity-count {
+    padding-left: 42px;
+    padding-top: 32px;
+    padding-bottom: 0;
+    margin-top: 0;
+  }
+</style>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,22 @@
+<h3 class="np-card-heading">
+  {% t .header %}
+</h3>
+<div class="np-flex">
+  {% for instructor in course.instructors %}
+    <div class="np-content-instructors-content-item">
+      <img
+        src="{{ instructor.avatar_url }}"
+        class="np-content-instructors-content-image"
+        alt="{{ instructor.name }}"
+      />
+      <div class="np-content-instructors-content-description">
+        <div class="np-content-instructors-content-name">
+          {{ instructor.name }}
+        </div>
+        <div class="np-content-instructors-content-info np-text-light">
+          {{ instructor.title }}
+        </div>
+      </div>
+    </div>
+  {% endfor %}
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,40 @@
+<div class="np-card-container np-card-padding-large">
+  {% include "course_header" %}
+  <div class="np-top-cta">
+    {% include "course_progress_and_cta" %}
+  </div>
+</div>
+
+{% if course.progress == 0 %}
+  <div class="np-card-container np-card-padding np-card-spacing">
+    {% include "course_description" %}
+  </div>
+  <div class="np-card-container np-card-padding np-card-spacing">
+    {% include "course_outline" %}
+  </div>
+{% else %}
+  <div class="np-card-container np-card-padding np-card-spacing">
+    {% include "course_outline" %}
+  </div>
+  <div class="np-card-container np-card-padding np-card-spacing">
+    {% include "course_description" %}
+  </div>
+{% endif %}
+
+{% if course.categories.any? %}
+  <div class="np-card-container np-card-padding np-card-spacing">
+    {% include "course_categories" %}
+  </div>
+{% endif %}
+
+{% if course.instructors.any? %}
+  <div class="np-card-container np-card-padding np-card-spacing">
+    {% include "course_instructors" %}
+  </div>
+{% endif %}
+
+{% if course.events.any? %}
+  <div class="np-card-container np-card-padding np-card-spacing">
+    {% include "course_events" %}
+  </div>
+{% endif %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,40 @@
+<div class="np-course-outline">
+  <div class="np-text-title np-course-outline-title">
+    {% t .header, key: current_school.course_vocabulary %}
+  </div>
+  <div class="np-course-outline-content">
+    <ol class="np-course-outline-content-section">
+      {% for section in course.sections %}
+        <li class="np-course-outline-content-section-list">
+          <div class="np-course-outline-content-section-name np-text-title-bold np-text-title-bold">
+            {{ section.name }}
+          </div>
+          <ol class="np-course-outline-content-activity">
+            {% for activity in section.activities %}
+
+              <li class="np-course-outline-content-activity-list">
+                {% if activity.completed? %}
+                  <i class="fas fa-circle np-course-outline-content-activity-icon np-button-color"></i>
+                  {% if activity.locked? %}
+                    {% include "course_activity_locked" %}
+                  {% else %}
+                    {% include "course_activity_unlocked", class: "np-course-outline-content-activity-link-completed" %}
+                  {% endif %}
+                  <div class="np-button-background-color np-course-outline-content-activity-list-bar"></div>
+                {% else %}
+                  <i class="far fa-circle np-course-outline-content-activity-icon"></i>
+                  {% if activity.locked? %}
+                    {% include "course_activity_locked" %}
+                  {% else %}
+                    {% include "course_activity_unlocked", class: "np-course-outline-content-activity-link" %}
+                  {% endif %}
+                  <div class="np-course-outline-content-activity-list-bar"></div>
+                {% endif %}
+              </li>
+            {% endfor %}
+          </ol>
+        </li>
+      {% endfor %}
+    </ol>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,46 @@
+<div class="np-top-cta-progress-content">
+  <div class="np-top-cta-progress-title np-text-title">
+    {% t .header %}
+  </div>
+  <div class="np-progress-bar-container">
+    <div
+      style="width: {{ course.progress }}%"
+      class="np-button-background-color np-card-progress-bar">
+    </div>
+  </div>
+
+  <div class="np-top-cta-progress-text
+    {% if course.completed? %} np-color-success {% else %} np-button-color {% endif %}
+  ">
+    {% t shared.progress, count: course.progress %}
+  </div>
+</div>
+
+{% if course.learner_can_retake? %}
+  <form action="{% route course_retake, id: course.id %}" method="POST">
+    {% form_authenticity_token %}
+    <button type="submit" class="np-top-button np-button-font-color np-button np-button-big np-outline-button">
+      Restart course
+    </button>
+  </form>
+{% else %}
+  <a
+    class="np-top-button np-button-font-color np-button np-button-big"
+  {% if course.enrolled? %}
+      href="{% route course_viewer, course_id: course.id, learning_path_id: params.learning_path_id %}"
+  {% else %}
+      href="{% route course_enrollment, code: course.enrollment_code %}"
+  {% endif %}
+  >
+    {% if course.enrolled? == false %}
+      {% t shared.enroll %}
+    {% elsif course.started? == false %}
+      {% t shared.course.start, key: current_school.course_vocabulary %}
+    {% elsif course.completed? %}
+      {% t shared.course.view, key: current_school.course_vocabulary %}
+    {% else %}
+      {% t shared.continue %}
+    {% endif %}
+  </a>
+{% endif %}
+
--- a/External/_course_version_outdated_alert.html.liquid
+++ b/External/_course_version_outdated_alert.html.liquid
@ -0,0 +1,7 @@
+{% if courses.include_courses_to_restart? %}
+  <div role="alert" class="np-alert np-alert-global np-alert-info">
+    <div class="np-alert-container uk-container uk-container-center">
+      {% t .content %}
+    </div>
+  </div>
+{% endif %}
--- a/External/_course_version_outdated_popup.html.liquid
+++ b/External/_course_version_outdated_popup.html.liquid
@ -0,0 +1,33 @@
+<div class="np-course-version-outdated-popup np-popup">
+  <div class="np-popup-positioner">
+    <i
+      class="np-course-version-outdated-popup-trigger fas fa-exclamation-circle"
+      data-toggle-class-on-target="np-popup-tooltip--visible"
+      data-toggle-target-parent=".np-popup-tooltip"
+      data-toggle-outside
+    ></i>
+    <div
+      class="np-popup-tooltip"
+      role="tooltip"
+      aria-hidden="true"
+    >
+      <header class="np-popup-header">
+        <i class="np-popup-header-icon fas fa-exclamation-circle"></i>
+        <h3 class="np-popup-header-title">
+          {% t .title %}
+        </h3>
+      </header>
+      <div class="np-popup-body">
+        <h4>{% t .body.header %}</h4>
+        <p>{% t .body.content %}</p>
+        <a
+          class="np-popup-body-button"
+          href="{{ path }}"
+        >
+          {% t .body.button %}
+        </a>
+      </div>
+      <div class="np-popup-tail"></div>
+    </div>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,60 @@
+{% if courses.in_catalog.any? %}
+  <div class="np-catalog-courses row row-with-thumbnails">
+    {% for course in courses.in_catalog %}
+        {%  if page.path == "/app/certifications" %} 
+            {%  if course.has_certificate? %} 
+              <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content catalog-content"
+              data-categories='{% for category in course.categories %}{{ category.id }},{% endfor %}'>
+                {% include "cards_course" with course %}
+              </div>
+            {% endif %} 
+        {% elsif page.path == "/app/ptestimates" %}  
+          {% for category in course.categories %}  
+            {%  if category.name == "[Popular Topics] Estimates" %} 
+              <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content catalog-content"
+              data-categories='{% for category in course.categories %}{{ category.id }},{% endfor %}'>
+                {% include "cards_course" with course %}
+              </div>
+            {% endif %} 
+          {% endfor %}
+      {% elsif page.path == "/app/ptowner-invoices" %}  
+        {% for category in course.categories %}  
+          {%  if category.name == "[Popular Topics] Owner Invoices" %} 
+            <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content catalog-content"
+            data-categories='{% for category in course.categories %}{{ category.id }},{% endfor %}'>
+              {% include "cards_course" with course %}
+            </div>
+          {% endif %} 
+        {% endfor %}
+      {% elsif page.path == "/app/ptschedule" %}  
+        {% for category in course.categories %}  
+          {%  if category.name == "[Popular Topics] Schedule" %} 
+            <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content catalog-content"
+            data-categories='{% for category in course.categories %}{{ category.id }},{% endfor %}'>
+              {% include "cards_course" with course %}
+            </div>
+          {% endif %} 
+        {% endfor %}  
+      {% elsif page.path == "/app/ptdaily-logs" %}  
+        {% for category in course.categories %}  
+          {%  if category.name == "[Popular Topics] Daily Logs" %} 
+            <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content catalog-content"
+            data-categories='{% for category in course.categories %}{{ category.id }},{% endfor %}'>
+              {% include "cards_course" with course %}
+            </div>
+          {% endif %} 
+        {% endfor %}    
+      {% else %}
+        <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content catalog-content"
+          data-categories='{% for category in course.categories %}{{ category.id }},{% endfor %}'>
+        {% include "cards_course" with course %}
+        </div>
+      {% endif %} 
+    {% endfor %}
+  </div>
+{% else %}
+    {% capture message %}
+      {% t shared.zero_state.courses.catalog, key: current_school.course_vocabulary %}
+    {% endcapture %}
+  {% include "courses_zero_state", message: message %}
+{% endif %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,16 @@
+{% if courses.enrolled.any? %}
+  <div class="row row-with-thumbnails">
+    {% for course in courses.enrolled %}
+      <div class="{{ class }}">
+        {% include "cards_course" with course %}
+      </div>
+    {% endfor %}
+  </div>
+{% else %}
+  {% capture message %}
+    {% t shared.zero_state.courses.index,
+      key: current_school.course_vocabulary
+    %}
+  {% endcapture %}
+  {% include "courses_zero_state", message: message %}
+{% endif %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,6 @@
+<div class="np-dashboard-resources-container">
+  <div class="np-zero-state-text">
+    {{ message }}
+  </div>
+  <img class="np-zero-state-courses" alt="{{ message }}" />
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,10 @@
+<input
+  id={{value}}
+  name={{ name }}
+  value={{ value }}
+  type="checkbox"
+  {% if selected %} checked="checked" {% endif %}
+/>
+<label for={{value}}>
+  {{label}}
+</label>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,33 @@
+<div class="np-filter">
+  <div class="dropdown">
+    <button
+      class="np-button dropdown-button"
+      data-toggle-class="is-open"
+      data-toggle-escape
+      data-toggle-outside
+      data-toggle-target-next
+      type="button"
+    >
+      {% t shared.filters.filter %}
+    </button>
+
+    <div class="dropdown-menu" data-test="modal">
+      <form method="get">
+        {%
+          include "filter_select",
+          filters: filters,
+          key: key,
+          label: label
+        %}
+
+        <button
+          class="np-button dropdown-button-apply"
+          data-toggle-trigger-off
+          type="submit"
+        >
+          {% t shared.filters.apply %}
+        </button>
+      </form>
+    </div>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,22 @@
+{% if params.q %}
+  <input type="hidden" name="q" value="{{ params.q }}">
+{% endif %}
+
+<label class="dropdown-label" for="filter[category_uuid][in][]">
+  {{ label }}
+</label>
+
+<select
+  class="np-filter-select"
+  multiple
+  name="filter[{{ key }}][in][]"
+>
+  {% for filter in filters %}
+    <option
+      value="{{ filter.value }}"
+      {% if filter.selected? %} selected="selected" {% endif %}
+    >
+      {{ filter.name }}
+    </option>
+  {% endfor %}
+</select>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,123 @@
+<footer class="np-footer">
+  <div class="np-footer-top">
+    {% if website_footer.show_navigation_links? %}
+      <div class="np-footer-navigation">
+        <ul class="np-footer-navigation-list">          
+          <li class="np-footer-navigation-item">
+            <a
+              class="np-footer-navigation-link np-button-color"
+              href="https://buildertrend.northpass.com/app">                
+              Home
+            </a>
+          </li>                   
+          <li class="np-footer-navigation-item">
+            <a
+              class="np-footer-navigation-link np-button-color"
+              href="https://buildertrend.northpass.com/app/catalog">                
+              Courses
+            </a>
+          </li>         
+           
+          <li class="np-footer-navigation-item">
+            <a
+              class="np-footer-navigation-link np-button-color"
+              href="https://buildertrend.northpass.com/app/learning_paths">                
+              Learning Paths
+            </a>
+          </li>         
+             
+          <li class="np-footer-navigation-item">
+            <a
+              class="np-footer-navigation-link np-button-color"
+              href="https://buildertrend.northpass.com/app/certifications">                
+              Certifications
+            </a>
+          </li>         
+             
+          <li class="np-footer-navigation-item">
+            <a
+              class="np-footer-navigation-link np-button-color"
+              href="https://buildertrend.northpass.com/app/training_events">                
+              Virtual Training
+            </a>
+          </li>         
+      </ul>
+       
+      </div>
+    {% endif %}
+    {% if current_school.logo_url %}
+      <h2 class="np-footer-logo">
+        <a href="{% route home %}">
+          <img
+            alt="{{ current_school.name }}"
+            class="np-footer-logo-image"
+            src="{{ current_school.logo_url }}"
+          />
+        </a>
+      </h2>
+    {% else %}
+      <div class="np-school-name np-header-font-color">
+        {{ current_school.name }}
+      </div>
+    {% endif %}
+  </div>
+
+  <div class="np-footer-bottom">
+    <nav class="np-footer-social-links">
+        <ul class="np-footer-social-links-list">
+            <li class="np-footer-social-links-item">
+              <a
+                class="np-footer-social-links-link np-button-color"
+                href="https://www.instagram.com/buildertrend/"
+                target="_blank" title="Instagram"
+              >
+              <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+              <path d="M16 10C14.8133 10 13.6533 10.3519 12.6666 11.0112C11.6799 11.6705 10.9108 12.6075 10.4567 13.7039C10.0026 14.8003 9.88378 16.0067 10.1153 17.1705C10.3468 18.3344 10.9182 19.4035 11.7574 20.2426C12.5965 21.0818 13.6656 21.6532 14.8295 21.8847C15.9933 22.1162 17.1997 21.9974 18.2961 21.5433C19.3925 21.0892 20.3295 20.3201 20.9888 19.3334C21.6481 18.3467 22 17.1867 22 16C21.9983 14.4092 21.3657 12.884 20.2408 11.7592C19.116 10.6343 17.5908 10.0017 16 10ZM16 20C15.2089 20 14.4355 19.7654 13.7777 19.3259C13.1199 18.8864 12.6072 18.2616 12.3045 17.5307C12.0017 16.7998 11.9225 15.9956 12.0769 15.2196C12.2312 14.4437 12.6122 13.731 13.1716 13.1716C13.731 12.6122 14.4437 12.2312 15.2196 12.0769C15.9956 11.9225 16.7998 12.0017 17.5307 12.3045C18.2616 12.6072 18.8864 13.1199 19.3259 13.7777C19.7654 14.4355 20 15.2089 20 16C20 17.0609 19.5786 18.0783 18.8284 18.8284C18.0783 19.5786 17.0609 20 16 20ZM22 3H10C8.14409 3.00199 6.36477 3.74012 5.05245 5.05245C3.74012 6.36477 3.00199 8.14409 3 10V22C3.00199 23.8559 3.74012 25.6352 5.05245 26.9476C6.36477 28.2599 8.14409 28.998 10 29H22C23.8559 28.998 25.6352 28.2599 26.9476 26.9476C28.2599 25.6352 28.998 23.8559 29 22V10C28.998 8.14409 28.2599 6.36477 26.9476 5.05245C25.6352 3.74012 23.8559 3.00199 22 3ZM27 22C27 23.3261 26.4732 24.5979 25.5355 25.5355C24.5979 26.4732 23.3261 27 22 27H10C8.67392 27 7.40215 26.4732 6.46447 25.5355C5.52678 24.5979 5 23.3261 5 22V10C5 8.67392 5.52678 7.40215 6.46447 6.46447C7.40215 5.52678 8.67392 5 10 5H22C23.3261 5 24.5979 5.52678 25.5355 6.46447C26.4732 7.40215 27 8.67392 27 10V22ZM24 9.5C24 9.79667 23.912 10.0867 23.7472 10.3334C23.5824 10.58 23.3481 10.7723 23.074 10.8858C22.7999 10.9994 22.4983 11.0291 22.2074 10.9712C21.9164 10.9133 21.6491 10.7704 21.4393 10.5607C21.2296 10.3509 21.0867 10.0836 21.0288 9.79264C20.9709 9.50166 21.0007 9.20006 21.1142 8.92597C21.2277 8.65189 21.42 8.41762 21.6666 8.2528C21.9133 8.08797 22.2033 8 22.5 8C22.8978 8 23.2794 8.15804 23.5607 8.43934C23.842 8.72064 24 9.10218 24 9.5Z" fill="black"/>
+              </svg>
+              </a>
+            </li>
+            <li class="np-footer-social-links-item">
+              <a
+                class="np-footer-social-links-link np-button-color"
+                href="https://www.facebook.com/buildertrend/"
+                target="_blank" title="Facebook"
+              >
+              <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+<path d="M16 3C13.4288 3 10.9154 3.76244 8.77759 5.1909C6.63975 6.61935 4.97351 8.64968 3.98957 11.0251C3.00563 13.4006 2.74819 16.0144 3.2498 18.5362C3.75141 21.0579 4.98953 23.3743 6.80762 25.1924C8.6257 27.0105 10.9421 28.2486 13.4638 28.7502C15.9856 29.2518 18.5995 28.9944 20.9749 28.0104C23.3503 27.0265 25.3807 25.3603 26.8091 23.2224C28.2376 21.0846 29 18.5712 29 16C28.9964 12.5533 27.6256 9.24882 25.1884 6.81163C22.7512 4.37445 19.4467 3.00364 16 3ZM17 26.9538V19H20C20.2652 19 20.5196 18.8946 20.7071 18.7071C20.8946 18.5196 21 18.2652 21 18C21 17.7348 20.8946 17.4804 20.7071 17.2929C20.5196 17.1054 20.2652 17 20 17H17V14C17 13.4696 17.2107 12.9609 17.5858 12.5858C17.9609 12.2107 18.4696 12 19 12H21C21.2652 12 21.5196 11.8946 21.7071 11.7071C21.8946 11.5196 22 11.2652 22 11C22 10.7348 21.8946 10.4804 21.7071 10.2929C21.5196 10.1054 21.2652 10 21 10H19C17.9391 10 16.9217 10.4214 16.1716 11.1716C15.4214 11.9217 15 12.9391 15 14V17H12C11.7348 17 11.4804 17.1054 11.2929 17.2929C11.1054 17.4804 11 17.7348 11 18C11 18.2652 11.1054 18.5196 11.2929 18.7071C11.4804 18.8946 11.7348 19 12 19H15V26.9538C12.181 26.6964 9.56971 25.3622 7.7093 23.2287C5.8489 21.0952 4.8826 18.3266 5.0114 15.4988C5.1402 12.671 6.35419 10.0017 8.40085 8.04613C10.4475 6.09057 13.1693 4.9993 16 4.9993C18.8307 4.9993 21.5525 6.09057 23.5992 8.04613C25.6458 10.0017 26.8598 12.671 26.9886 15.4988C27.1174 18.3266 26.1511 21.0952 24.2907 23.2287C22.4303 25.3622 19.819 26.6964 17 26.9538Z" fill="black"/>
+</svg>
+              </a>
+            </li>
+            <li class="np-footer-social-links-item">
+              <a
+                class="np-footer-social-links-link np-button-color"
+                href="https://www.youtube.com/@buildertrend"
+                target="_blank" title="YouTube"
+              >
+              <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+<path d="M20.555 15.1675L14.555 11.1675C14.4044 11.067 14.2293 11.0093 14.0484 11.0005C13.8675 10.9918 13.6877 11.0323 13.528 11.1177C13.3684 11.2032 13.2349 11.3304 13.1419 11.4858C13.0489 11.6412 12.9999 11.8189 13 12V20C12.9999 20.1811 13.0489 20.3588 13.1419 20.5142C13.2349 20.6696 13.3684 20.7968 13.528 20.8823C13.6877 20.9677 13.8675 21.0082 14.0484 20.9995C14.2293 20.9907 14.4044 20.933 14.555 20.8325L20.555 16.8325C20.6922 16.7412 20.8047 16.6175 20.8825 16.4722C20.9603 16.327 21.001 16.1648 21.001 16C21.001 15.8352 20.9603 15.673 20.8825 15.5278C20.8047 15.3826 20.6922 15.2588 20.555 15.1675ZM15 18.1313V13.875L18.1975 16L15 18.1313ZM29.2913 8.69C29.1735 8.22919 28.9478 7.80298 28.6329 7.44654C28.318 7.09011 27.9228 6.81366 27.48 6.64C23.195 4.985 16.375 5 16 5C15.625 5 8.805 4.985 4.52 6.64C4.0772 6.81366 3.68204 7.09011 3.36712 7.44654C3.05219 7.80298 2.82653 8.22919 2.70875 8.69C2.385 9.9375 2 12.2175 2 16C2 19.7825 2.385 22.0625 2.70875 23.31C2.82636 23.771 3.05194 24.1975 3.36687 24.5542C3.68181 24.9108 4.07706 25.1875 4.52 25.3613C8.625 26.945 15.05 27 15.9175 27H16.0825C16.95 27 23.3787 26.945 27.48 25.3613C27.9229 25.1875 28.3182 24.9108 28.6331 24.5542C28.9481 24.1975 29.1736 23.771 29.2913 23.31C29.615 22.06 30 19.7825 30 16C30 12.2175 29.615 9.9375 29.2913 8.69ZM27.355 22.815C27.3169 22.9684 27.243 23.1105 27.1394 23.2298C27.0357 23.3491 26.9053 23.4421 26.7588 23.5013C22.8025 25.0288 16.0738 25.0013 16.0088 25.0013H16C15.9325 25.0013 9.20875 25.0263 5.25 23.5013C5.10346 23.4421 4.97303 23.3491 4.86938 23.2298C4.76574 23.1105 4.69184 22.9684 4.65375 22.815C4.35 21.6738 4 19.5713 4 16C4 12.4288 4.35 10.3263 4.645 9.19125C4.68239 9.03698 4.75596 8.89382 4.85965 8.77362C4.96333 8.65342 5.09413 8.55963 5.24125 8.5C9.05625 7.02625 15.4487 7 15.9725 7H16.0063C16.0738 7 22.8038 6.9775 26.7563 8.5C26.9028 8.55915 27.0332 8.65217 27.1369 8.77146C27.2405 8.89074 27.3144 9.03289 27.3525 9.18625C27.65 10.3263 28 12.4288 28 16C28 19.5713 27.65 21.6738 27.355 22.8088V22.815Z" fill="black"/>
+</svg>
+              </a>
+            </li>
+        </ul>
+    </nav>
+
+    {% if website_footer.show_customer_service_email? and
+      website_footer.school_customer_service_email
+    %}
+      <div class="np-footer-support">
+        <div class="np-footer-support-item np-footer-support-help">
+          {% t .need_help %}
+        </div>
+        <div class="np-footer-support-item np-footer-support-email">
+          {% t .email %}
+        </div>
+        <a
+          class="np-footer-support-item np-footer-support-link np-button-color"
+          href="mailto:{{ website_footer.school_customer_service_email }}"
+        >
+          {{ website_footer.school_customer_service_email }}
+        </a>
+      </div>
+    {% endif %}
+  </div>
+</footer>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,27 @@
+{% styles default %}
+{% styles colors %}
+{% styles custom %}
+{% include "popup_additional_info" %}
+    <script src="https://code.jquery.com/jquery-3.6.3.min.js"
+  integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU=" crossorigin="anonymous"></script>
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/easy-toggle-state/1.16.0/easy-toggle-state.min.js"
+  integrity="sha512-hG7MyW8uOh26+C0KutsTVCJm8waH4iA9vSa8gOsosTHdIh6JjOE/MRn8vmcFg2rLGTnpVWmSKcDJF48cB89/3w=="
+  crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
+
+<!-- jQuery Modal -->
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.js"></script>
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-modal/0.9.1/jquery.modal.min.css" />
+
+<script>
+  $(".kMBnZE").attr("src", "https://s3.us-east-1.amazonaws.com/static.northpass.com/buildertrend/Buildertrend_Horiz_Reversed_RGB.svg")
+</script>
+<!-- Google Tag Manager -->
+<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+})(window,document,'script','dataLayer','GTM-W8MJQGK');</script>
+<!-- End Google Tag Manager -->
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,163 @@
+<!-- Google Tag Manager (noscript) -->
+<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-W8MJQGK"
+height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+<!-- End Google Tag Manager (noscript) -->
+<header class="np-header np-header-color">
+  <div class="np-header-content">
+    <div class="np-hidden-desktop np-header-mobile-menu-nav">
+      {% if current_person.signed_in? %}
+      <button data-toggle-class="np-hidden"
+        class="np-header-mobile-menu-nav-button fal fa-times np-hidden np-header-font-color" data-toggle-target=".np-header-mobile-avatar-menu,
+          .np-header-mobile-menu-content, .np-main, .np-footer"></button>
+      <button data-test="open-mobile-menu" data-toggle-class="np-hidden"
+        class="np-header-mobile-menu-nav-button np-header-mobile-avatar-menu"
+        data-toggle-target=".fa-times, .np-header-mobile-menu-content, .np-main, .np-footer">
+        <img alt="{{ current_person.name }}" class="np-header-avatar-image" src="{{ current_person.avatar_url }}" />
+      </button>
+      {% endif %}
+    </div>
+    {% if current_school.logo_url %}
+    <h1 class="np-header-logo">
+      <a href="{% route home %}">
+        <img alt="{{ current_school.name }}" class="np-header-logo-image" src="{{ current_school.logo_url }}" />
+      </a>
+    </h1>
+    {% else %}
+    <a href="{% route home %}" class="np-school-name np-header-font-color">
+      {{ current_school.name }}
+    </a>
+    {% endif %}
+
+    <div class="np-hidden-mobile np-header-desktop-nav">
+      <ul class="np-header-desktop-nav-list">
+        {% for website_navigation in navigations.header_navigations_external %}
+        <li class="np-header-desktop-nav-item">
+          <a href="{{ website_navigation.path }}" class="np-header-desktop-nav-link np-header-font-color"
+            target="_blank">
+            {{ website_navigation.name }}
+          </a>
+        </li>
+        {% endfor %}
+      </ul>
+    </div>
+
+    {% if current_person.signed_in? %}
+    <div class="np-hidden-mobile np-header-search np-header-search-expanded">
+      <form action="{% route search %}" method="get" data-test="desktop-search">
+        <input aria-label="{% t .search %}" class="np-header-search-input np-header-font-background-color" type="text"
+          name="q" placeholder="{% t .search %}" />
+        <i class="np-header-search-icon far fa-search"></i>
+      </form>
+    </div>
+    <div class="np-hidden-mobile np-header-avatar">
+      <a class="np-header-avatar-button" href="https://helpcenter.buildertrend.net/en/" target="_blank" style="text-decoration: unset;" >
+
+        <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+<path d="M17.5 22.5C17.5 22.7967 17.412 23.0867 17.2472 23.3334C17.0824 23.58 16.8481 23.7723 16.574 23.8858C16.2999 23.9993 15.9983 24.0291 15.7074 23.9712C15.4164 23.9133 15.1491 23.7704 14.9393 23.5607C14.7296 23.3509 14.5867 23.0836 14.5288 22.7926C14.471 22.5017 14.5007 22.2001 14.6142 21.926C14.7277 21.6519 14.92 21.4176 15.1667 21.2528C15.4133 21.088 15.7033 21 16 21C16.3978 21 16.7794 21.158 17.0607 21.4393C17.342 21.7206 17.5 22.1022 17.5 22.5ZM16 9C13.2425 9 11 11.0188 11 13.5V14C11 14.2652 11.1054 14.5196 11.2929 14.7071C11.4804 14.8946 11.7348 15 12 15C12.2652 15 12.5196 14.8946 12.7071 14.7071C12.8946 14.5196 13 14.2652 13 14V13.5C13 12.125 14.3463 11 16 11C17.6538 11 19 12.125 19 13.5C19 14.875 17.6538 16 16 16C15.7348 16 15.4804 16.1054 15.2929 16.2929C15.1054 16.4804 15 16.7348 15 17V18C15 18.2652 15.1054 18.5196 15.2929 18.7071C15.4804 18.8946 15.7348 19 16 19C16.2652 19 16.5196 18.8946 16.7071 18.7071C16.8946 18.5196 17 18.2652 17 18V17.91C19.28 17.4913 21 15.6725 21 13.5C21 11.0188 18.7575 9 16 9ZM29 16C29 18.5712 28.2376 21.0846 26.8091 23.2224C25.3807 25.3603 23.3503 27.0265 20.9749 28.0104C18.5995 28.9944 15.9856 29.2518 13.4638 28.7502C10.9421 28.2486 8.6257 27.0105 6.80762 25.1924C4.98953 23.3743 3.75141 21.0579 3.2498 18.5362C2.74819 16.0144 3.00563 13.4006 3.98957 11.0251C4.97351 8.64968 6.63975 6.61935 8.77759 5.1909C10.9154 3.76244 13.4288 3 16 3C19.4467 3.00364 22.7512 4.37445 25.1884 6.81163C27.6256 9.24882 28.9964 12.5533 29 16ZM27 16C27 13.8244 26.3549 11.6977 25.1462 9.88873C23.9375 8.07979 22.2195 6.66989 20.2095 5.83733C18.1995 5.00476 15.9878 4.78692 13.854 5.21136C11.7202 5.6358 9.76021 6.68345 8.22183 8.22183C6.68345 9.7602 5.63581 11.7202 5.21137 13.854C4.78693 15.9878 5.00477 18.1995 5.83733 20.2095C6.66989 22.2195 8.07979 23.9375 9.88873 25.1462C11.6977 26.3549 13.8244 27 16 27C18.9164 26.9967 21.7123 25.8367 23.7745 23.7745C25.8367 21.7123 26.9967 18.9164 27 16Z" fill="#202227"/>
+</svg>
+        <span>Help</span>
+      </a>
+      <button class="np-header-avatar-button" data-test="open-desktop-menu" data-toggle-class-on-target="np-hidden"
+        data-toggle-target=".np-header-avatar-tooltip" data-toggle-outside>
+
+        <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+<path d="M16 3C13.4288 3 10.9154 3.76244 8.77759 5.1909C6.63975 6.61935 4.97351 8.64968 3.98957 11.0251C3.00563 13.4006 2.74819 16.0144 3.2498 18.5362C3.75141 21.0579 4.98953 23.3743 6.80762 25.1924C8.6257 27.0105 10.9421 28.2486 13.4638 28.7502C15.9856 29.2518 18.5995 28.9944 20.9749 28.0104C23.3503 27.0265 25.3807 25.3603 26.8091 23.2224C28.2376 21.0846 29 18.5712 29 16C28.9964 12.5533 27.6256 9.24882 25.1884 6.81163C22.7512 4.37445 19.4467 3.00364 16 3ZM9.26001 24.6875C9.98342 23.5561 10.98 22.625 12.1579 21.9801C13.3358 21.3351 14.6571 20.9971 16 20.9971C17.3429 20.9971 18.6642 21.3351 19.8421 21.9801C21.02 22.625 22.0166 23.5561 22.74 24.6875C20.8129 26.1862 18.4413 26.9999 16 26.9999C13.5587 26.9999 11.1871 26.1862 9.26001 24.6875ZM12 15C12 14.2089 12.2346 13.4355 12.6741 12.7777C13.1137 12.1199 13.7384 11.6072 14.4693 11.3045C15.2002 11.0017 16.0044 10.9225 16.7804 11.0769C17.5563 11.2312 18.269 11.6122 18.8284 12.1716C19.3878 12.731 19.7688 13.4437 19.9231 14.2196C20.0775 14.9956 19.9983 15.7998 19.6955 16.5307C19.3928 17.2616 18.8801 17.8864 18.2223 18.3259C17.5645 18.7654 16.7911 19 16 19C14.9391 19 13.9217 18.5786 13.1716 17.8284C12.4214 17.0783 12 16.0609 12 15ZM24.22 23.3013C23.1047 21.6851 21.5365 20.4348 19.7125 19.7075C20.6923 18.9358 21.4072 17.878 21.7579 16.6811C22.1086 15.4843 22.0776 14.2079 21.6693 13.0294C21.2609 11.851 20.4955 10.8291 19.4794 10.1059C18.4634 9.38262 17.2472 8.99397 16 8.99397C14.7528 8.99397 13.5366 9.38262 12.5206 10.1059C11.5045 10.8291 10.7391 11.851 10.3307 13.0294C9.92238 14.2079 9.8914 15.4843 10.2421 16.6811C10.5928 17.878 11.3077 18.9358 12.2875 19.7075C10.4635 20.4348 8.89529 21.6851 7.78001 23.3013C6.37072 21.7165 5.4496 19.7581 5.12756 17.6619C4.80553 15.5657 5.09631 13.4211 5.9649 11.4864C6.83349 9.55163 8.24285 7.90922 10.0233 6.75692C11.8037 5.60462 13.8792 4.99156 16 4.99156C18.1208 4.99156 20.1963 5.60462 21.9768 6.75692C23.7572 7.90922 25.1665 9.55163 26.0351 11.4864C26.9037 13.4211 27.1945 15.5657 26.8724 17.6619C26.5504 19.7581 25.6293 21.7165 24.22 23.3013Z" fill="#202227"/>
+</svg>
+        <span>Profile</span>
+      </button>
+      <div class="np-header-avatar-tooltip np-hidden" role="tooltip">
+        <span class="np-header-avatar-tooltip-arrow-up"></span>
+        <div class="np-header-avatar-tooltip-learner">
+          <div class="np-header-avatar-tooltip-learner-name">
+            {{ current_person.name }}
+          </div>
+          <div class="np-header-avatar-tooltip-learner-email">
+            {{ current_person.email }}
+          </div>
+        </div>
+        <nav class="np-header-avatar-tooltip-navigation">
+          {% unless current_school.sso_active? %}
+          <a class="np-header-avatar-tooltip-navigation-link" href="{% route account %}">
+            {% t .profile_settings %}
+          </a>
+          {% endunless %}
+          {% if current_person.signed_in? %}
+          <a class="np-header-avatar-tooltip-navigation-link" href="{% route transcript %}">
+            {% t .transcript %}
+          </a>
+          {% endif %}
+          <a class="np-header-avatar-tooltip-navigation-link np-danger" href="{% route logout %}">
+            {% t .sign_out %}
+          </a>
+        </nav>
+      </div>
+    </div>
+    {% else %}
+    <a class="np-header-sign-in np-header-desktop-nav-link np-header-font-color" aria-label="{% t shared.sign_in %}"
+      href="{% route login %}">
+      {% t shared.sign_in %}
+    </a>
+    {% endif %}
+  </div>
+</header>
+
+<div class="np-hidden-desktop">
+  <div class="np-header-mobile-menu-content np-hidden">
+    {% if current_person.signed_in? %}
+    <img alt="{{ current_person.name }}" class="np-header-mobile-menu-content-avatar"
+      src="{{ current_person.avatar_url }}" />
+    <div class="np-header-mobile-menu-content-name">
+      {{ current_person.name }}
+    </div>
+    {% endif %}
+    <div class="np-header-mobile-menu-content-nav">
+      <form class="np-header-search" data-test="mobile-search" method="get" action="{% route search %}">
+        <input aria-label="{% t .search %}" class="np-header-search-input" type="text" name="q"
+          placeholder="{% t .search %}" />
+        <i class="np-header-search-icon far fa-search"></i>
+      </form>
+      {% for website_navigation in navigations.header_navigations %}
+      <a href="{{ website_navigation.path }}" class="np-header-mobile-menu-content-button" {% if
+        website_navigation.external? %} target="_blank" {% endif %}>
+        {{ website_navigation.name }}
+      </a>
+      {% endfor %}
+      <div class="np-header-mobile-menu-content-line"></div>
+      {% unless current_school.sso_active? %}
+      <a class="np-header-mobile-menu-content-button" href="{% route account %}">
+        {% t .profile_settings %}
+      </a>
+      {% endunless %}
+      {% if current_person.signed_in? %}
+      <a class="np-header-mobile-menu-content-button" href="{% route transcript %}">
+        {% t .transcript %}
+      </a>
+      {% endif %}
+      <a class="np-header-mobile-menu-content-button np-danger" href="{% route logout %}">
+        {% t .sign_out %}
+      </a>
+    </div>
+  </div>
+</div>
+
+{% include "messages" %}
+<style>
+  .np-header-avatar-image {
+    border-radius: 50%;
+    cursor: pointer;
+    display: block;
+    height: 44px;
+    font-size: 40px;
+  }
+  .np-header-font-background-color {
+    background: #ffffff;
+    
+}
+  .fa-search:before {
+    content: "\f002";
+    color: black;
+}
+  .np-header-avatar-button {
+    width: 50px;
+  }
+</style>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,17 @@
+<header class="np-box-header np-header-color">
+  <a class="np-box-header-link" href="{% route home %}">
+    {% if current_school.logo_url %}
+      <img
+        alt="{{ current_school.name }}"
+        src="{{ current_school.logo_url }}"
+        class="np-box-header-logo"
+      />
+    {% else %}
+      <span class="np-school-name np-header-font-color">
+        {{ current_school.name }}
+      </span>
+    {% endif %}
+  </a>
+</header>
+
+{% include "messages" %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,5 @@
+{% if learning_path.new_content_available? %}
+  {% include "learning_path_new_content_banner" %}
+{% else %}
+  {% include "learning_path_completed_banner" %}
+{% endif %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,17 @@
+{% if learning_path.has_certificate? %}
+  {% if learning_path.certificate_completed? %}
+    <div class="np-learning-path-outline-bar np-hidden-mobile"></div>
+    <a
+      class="np-learning-path-certificate-link"
+      href="{{ learning_path.certificate_link }}"
+    >
+      <div class="np-learning-path-certificate">
+        {% include "learning_path_certificate_content" %}
+      </div>
+    </a>
+  {% else %}
+    <div class="np-learning-path-certificate np-learning-path-certificate--inactive">
+      {% include "learning_path_certificate_content" %}
+    </div>
+  {% endif %}
+{% endif %}
--- a/External/_learning_path_certificate_content.html.liquid
+++ b/External/_learning_path_certificate_content.html.liquid
@ -0,0 +1,19 @@
+<div class="np-learning-path-certificate-content">
+  <div class="np-learning-path-certificate-avatar" role="img">
+    <i class="np-learning-path-certificate-avatar-icon fal fa-award"></i>
+    <h5 class="np-learning-path-certificate-avatar-title">
+      {% t .avatar_title %}
+    </h5>
+  </div>
+  <h4 class="np-learning-path-certificate-name">
+    {{ learning_path.certificate_name }}
+  </h4>
+  {% if learning_path.certificate_completed? %}
+    <time
+      class="np-learning-path-certificate-issue-date"
+      datetime="{{ learning_path.certificate_issue_date }}"
+    >
+      {{ learning_path.certificate_issue_date | date: "%B %d, %Y" }}
+    </time>
+  {% endif  %}
+</div>
--- a/External/_learning_path_completed_banner.html.liquid
+++ b/External/_learning_path_completed_banner.html.liquid
@ -0,0 +1,22 @@
+<div class="np-learning-path-completed-banner np-learning-path-banner" style="background-color: #001A43;">
+  <img class="np-learning-path-banner-image" src="https://s3.amazonaws.com/static.northpass.com/images/stars-completed.svg" style="filter:brightness(0) invert(1);"/>
+  <div class="np-learning-path-banner-content">
+    <h3 class="np-learning-path-banner-headline">{% t .headline %}</h3>
+    <p class="np-learning-path-banner-description">{% t .description %}</p>
+    <div class="np-learning-path-banner-actions">
+      {% if learning_path.certificate_link %}
+        <a href="{{ learning_path.certificate_link }}" class="np-learning-path-banner-action np-learning-path-banner-action--primary">{% t .actions.certificate %}</a>
+      {% endif %}
+      <a href="/app/catalog" class="np-learning-path-banner-action np-learning-path-banner-action--secondary">{% t .actions.more_courses %}</a>
+    </div>
+  </div>
+</div>
+<style>
+  .np-learning-path-completed-banner .np-learning-path-banner-headline, .np-learning-path-banner-description{
+    color: #FFFFFF;
+  }
+  .np-learning-path-completed-banner .np-learning-path-banner-action--secondary{
+    color: #FFFFFF;
+    border-color: #FFFFFF;
+  }
+</style>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,56 @@
+{% if learning_path.enrolled? and course.unlocked? %}
+  <div class="np-learning-path-outline-bar np-hidden-mobile"></div>
+  <a
+    class="np-learning-path-outline-item np-card-container"
+    href="{% route learning_path_course, learning_path_id: learning_path.id, id: course.id %}"
+  >
+    <div class="np-card-content np-card-padding">
+      <img
+        src="{{ item.image }}"
+        alt="{{ course.name }}"
+        class="np-learning-path-outline-course-image"
+      >
+      <div class="np-learning-path-outline-content">
+        <div class="np-learning-path-outline-name np-top-title">
+          {{ course.name }}
+        </div>
+        {% if course.instructors %}
+          <div class="np-learning-path-outline-caption">
+            {{ course.instructors }}
+          </div>
+        {% endif %}
+        <div class="np-learning-path-outline-progress
+          {% if course.completed? %} np-color-success {% else %} np-button-color {% endif %}
+        ">
+          {% t shared.progress, count: course.progress %}
+        </div>
+      </div>
+      <i class="fas fa-chevron-right np-learning-path-outline-icon"></i>
+      {% if course.optional? %}
+        <div class="np-optional-ribbon">
+          {% t shared.optional %}
+        </div>
+      {% endif %}
+    </div>
+  </a>
+{% else %}
+  <div class="np-learning-path-outline-item np-learning-path-outline-inactive-item np-card-container">
+    <div class="np-card-content np-card-padding">
+      <img
+        src="{{ item.image }}"
+        alt="{{ course.name }}"
+        class="np-learning-path-outline-course-image"
+      >
+      <div class="np-learning-path-outline-content">
+        <div class="np-learning-path-outline-name np-top-title">
+          {{ course.name }}
+        </div>
+      </div>
+      {% if course.optional? %}
+        <div class="np-optional-ribbon">
+          {% t shared.optional %}
+        </div>
+      {% endif %}
+    </div>
+  </div>
+{% endif %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,6 @@
+<h3 class="np-card-heading">
+  {% t .about %}
+</h3>
+<div class="np-card-text">
+  {{ learning_path.description }}
+</div>
--- a/External/_learning_path_desktop_content.html.liquid
+++ b/External/_learning_path_desktop_content.html.liquid
@ -0,0 +1,22 @@
+<div class="row">
+  <div class="col-xs-12 col-sm-6">
+    <div class="np-card-container">
+      <div class="np-card-padding-dynamic">
+        {% include "learning_path_description" %}
+        {% include "learning_path_instructors" %}
+      </div>
+    </div>
+  </div>
+  <div class="col-xs-12 col-sm-6 np-grid-spacing">
+    <div class="np-top-cta">
+      {% include "learning_path_progress_and_cta" %}
+    </div>
+    {% include "learning_path_outline" %}
+  </div>
+</div>
+<style>
+  .np-card-container{
+    border-radius: 0;
+    box-shadow: none;
+  }
+</style>
--- a/External/_learning_path_desktop_header.html.liquid
+++ b/External/_learning_path_desktop_header.html.liquid
@ -0,0 +1,38 @@
+<div class="np-resource-header np-resource-header-card np-card-padding-large">
+  <div style="width: 100%;">
+    <div class="np-top-title">
+      <a href="#" onclick="window.history.back();" class="np-back-button" aria-label="Go Back">
+        <i class="far fa-arrow-left np-icon-back"></i>
+      </a>
+      {{ learning_path.name }}
+    </div>
+    <div class="card-activity-count">{{ learning_path.items.size }}<br><span class="activity-label">Items</span></div>
+  </div>
+  <div class="np-top-vocabulary np-text-title">
+    <svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 80 80" fill="none">
+      <path
+        d="M73.7248 62.1875C73.4378 62.3493 73.1216 62.4528 72.7944 62.492C72.4673 62.5312 72.1356 62.5053 71.8184 62.4159C71.5013 62.3264 71.205 62.1752 70.9465 61.9708C70.688 61.7664 70.4725 61.513 70.3123 61.225L48.5373 22.5H42.4998V25C42.4998 25.663 42.2364 26.2989 41.7676 26.7678C41.2988 27.2366 40.6629 27.5 39.9998 27.5C39.3368 27.5 38.7009 27.2366 38.2321 26.7678C37.7632 26.2989 37.4998 25.663 37.4998 25V22.5H31.4623L9.68733 61.225C9.36244 61.8052 8.82039 62.2325 8.18042 62.413C7.54045 62.5935 6.85499 62.5124 6.27483 62.1875C5.69467 61.8626 5.26733 61.3206 5.08683 60.6806C4.90632 60.0406 4.98744 59.3552 5.31233 58.775L25.7248 22.5H7.49983C6.83679 22.5 6.2009 22.2366 5.73206 21.7678C5.26322 21.2989 4.99983 20.663 4.99983 20C4.99983 19.337 5.26322 18.7011 5.73206 18.2322C6.2009 17.7634 6.83679 17.5 7.49983 17.5H72.4998C73.1629 17.5 73.7988 17.7634 74.2676 18.2322C74.7364 18.7011 74.9998 19.337 74.9998 20C74.9998 20.663 74.7364 21.2989 74.2676 21.7678C73.7988 22.2366 73.1629 22.5 72.4998 22.5H54.2748L74.6873 58.775C74.8492 59.062 74.9526 59.3782 74.9918 59.7054C75.031 60.0326 75.0051 60.3643 74.9157 60.6814C74.8262 60.9985 74.675 61.2949 74.4706 61.5533C74.2662 61.8118 74.0128 62.0273 73.7248 62.1875ZM39.9998 35C39.3368 35 38.7009 35.2634 38.2321 35.7322C37.7632 36.2011 37.4998 36.837 37.4998 37.5V42.5C37.4998 43.163 37.7632 43.7989 38.2321 44.2678C38.7009 44.7366 39.3368 45 39.9998 45C40.6629 45 41.2988 44.7366 41.7676 44.2678C42.2364 43.7989 42.4998 43.163 42.4998 42.5V37.5C42.4998 36.837 42.2364 36.2011 41.7676 35.7322C41.2988 35.2634 40.6629 35 39.9998 35ZM39.9998 52.5C39.3368 52.5 38.7009 52.7634 38.2321 53.2322C37.7632 53.7011 37.4998 54.337 37.4998 55V60C37.4998 60.663 37.7632 61.2989 38.2321 61.7678C38.7009 62.2366 39.3368 62.5 39.9998 62.5C40.6629 62.5 41.2988 62.2366 41.7676 61.7678C42.2364 61.2989 42.4998 60.663 42.4998 60V55C42.4998 54.337 42.2364 53.7011 41.7676 53.2322C41.2988 52.7634 40.6629 52.5 39.9998 52.5Z"
+        fill="#FFA44A" />
+    </svg>
+  </div>
+</div>
+<style>
+  .np-resource-header {
+    flex-direction: row;
+  }
+  .np-resource-header-card {
+    background: #FFEFDE;
+    box-shadow: none;
+    padding-right: 132px;
+  }
+
+  .np-icon-back {
+    color: #202227;
+  }
+  .card-activity-count {
+    padding-left: 42px;
+    padding-top: 32px;
+    padding-bottom: 0;
+    margin-top: 0;
+  }
+</style>
--- a/External/_learning_path_desktop_view.html.liquid
+++ b/External/_learning_path_desktop_view.html.liquid
@ -0,0 +1,2 @@
+{% include "learning_path_desktop_header" %}
+{% include "learning_path_desktop_content" %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,26 @@
+{% if learning_path.instructors.any? %}
+  <div class="np-card-content-divider">
+    <h3 class="np-card-heading">
+      {% t shared.instructors %}
+    </h3>
+    <div class="np-content-instructors-content row">
+      {% for instructor in learning_path.instructors %}
+        <div class="np-content-instructors-content-item col-xs-12 col-lg">
+          <img
+            src="{{ instructor.avatar_url }}"
+            class="np-content-instructors-content-image"
+            alt="{{ instructor.name }}"
+          >
+          <div class="np-content-instructors-content-description">
+            <div class="np-content-instructors-content-name">
+              {{ instructor.name }}
+            </div>
+            <div class="np-content-instructors-content-info np-text-light">
+              {{ instructor.title }}
+            </div>
+          </div>
+        </div>
+      {% endfor %}
+    </div>
+  </div>
+{% endif %}
--- a/External/_learning_path_mobile_content.html.liquid
+++ b/External/_learning_path_mobile_content.html.liquid
@ -0,0 +1,19 @@
+{% if learning_path.in_progress? %}
+  {% include "learning_path_outline" %}
+  <div class="np-card-container np-card-padding np-card-spacing">
+    {% include "learning_path_description" %}
+  </div>
+{% else %}
+  <div class="np-card-container np-card-padding np-card-spacing">
+    {% include "learning_path_description" %}
+  </div>
+  <div class="np-card-spacing">
+    {% include "learning_path_outline" %}
+  </div>
+{% endif %}
+
+{% if learning_path.instructors.any? %}
+  <div class="np-card-container np-card-padding np-card-spacing">
+    {% include "learning_path_instructors" %}
+  </div>
+{% endif %}
--- a/External/_learning_path_mobile_header.html.liquid
+++ b/External/_learning_path_mobile_header.html.liquid
@ -0,0 +1,17 @@
+<div class="np-resource-header np-card-padding-vertical">
+  <div class="np-top-vocabulary np-text-title">
+    {% t shared.learning_path.title %}
+    <i class="far fa-road np-button-color np-learning-path-icon"></i>
+  </div>
+  <div class="np-top-title">
+    {{ learning_path.name }}
+  </div>
+  <img
+    src="{{ learning_path.image_url }}"
+    class="np-top-image"
+    alt="{{ learning_path.name }}"
+  />
+  <div class="np-top-cta">
+    {% include "learning_path_progress_and_cta" %}
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,2 @@
+{% include "learning_path_mobile_header" %}
+{% include "learning_path_mobile_content" %}
--- a/External/_learning_path_new_content_banner.html.liquid
+++ b/External/_learning_path_new_content_banner.html.liquid
@ -0,0 +1,12 @@
+<div class="np-learning-path-new-content-banner np-learning-path-banner">
+  <div class="np-learning-path-banner-content">
+    <h3 class="np-learning-path-banner-headline">{% t .headline %}</h3>
+    <p class="np-learning-path-banner-description">{% t .description %}</p>
+    <div class="np-learning-path-banner-actions">
+      {% learning_path_next_step_button learning_path, class: "np-learning-path-banner-action np-learning-path-banner-action--primary" %}
+      {% if learning_path.certificate_link %}
+        <a href="{{ learning_path.certificate_link }}" class="np-learning-path-banner-action np-learning-path-banner-action--secondary">{% t .actions.view_certificate %}</a>
+      {% endif %}
+    </div>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,10 @@
+<div class="np-learning-path-outline">
+  {% for item in learning_path.items %}
+    {% if item.course? %}
+      {% include "learning_path_course", course: item %}
+    {% elsif item.training_event? %}
+      {% include "learning_path_training_session", training_session: item %}
+    {% endif %}
+  {% endfor %}
+  {% include "learning_path_certificate" %}
+</div>
--- a/External/_learning_path_progress_and_cta.html.liquid
+++ b/External/_learning_path_progress_and_cta.html.liquid
@ -0,0 +1,20 @@
+{% if learning_path.enrolled? %}
+  <div class="np-top-cta-progress-content">
+    <div class="np-top-cta-progress-title np-text-title">
+      {% t .progress %}
+    </div>
+    <div class="np-progress-bar-container">
+      <div
+        style="width: {{ learning_path.progress }}%"
+        class="np-button-background-color np-card-progress-bar">
+      </div>
+    </div>
+    <div class="np-top-cta-progress-text
+      {% if learning_path.completed? %} np-color-success {% else %} np-button-color {% endif %}
+    ">
+      {% t shared.progress, count: learning_path.progress %}
+    </div>
+  </div>
+{% endif %}
+
+{% learning_path_next_step_button learning_path, class: "np-top-button np-button-font-color np-button np-button-big" %}
--- a/External/_learning_path_summary_desktop_view.html.liquid
+++ b/External/_learning_path_summary_desktop_view.html.liquid
@ -0,0 +1,3 @@
+{% include "learning_path_desktop_header" %}
+{% include "learning_path_banners" %}
+{% include "learning_path_desktop_content" %}
--- a/External/_learning_path_summary_mobile_view.html.liquid
+++ b/External/_learning_path_summary_mobile_view.html.liquid
@ -0,0 +1,5 @@
+<div class="np-card-padding">
+  {% include "learning_path_banners" %}
+</div>
+{% include "learning_path_mobile_header" %}
+{% include "learning_path_mobile_content" %}
--- a/External/_learning_path_training_session.html.liquid
+++ b/External/_learning_path_training_session.html.liquid
@ -0,0 +1,53 @@
+{% if learning_path.enrolled? and training_session.unlocked? %}
+  <div class="np-learning-path-outline-bar np-hidden-mobile"></div>
+  <a
+    class="np-learning-path-outline-item np-card-container"
+    href="{% route training_session, id: training_session.id %}"
+  >
+    <div class="np-card-content np-card-padding">
+      <div class="np-events-content-date np-button-background-color">
+        <div class="np-events-content-month">
+          {{ training_session.month }}
+        </div>
+        <div class="np-events-content-day">
+          {{ training_session.day }}
+        </div>
+      </div>
+      <div class="np-learning-path-outline-content">
+        <div class="np-learning-path-outline-name np-top-title">{{ training_session.name }}</div>
+        <div class="np-learning-path-outline-caption">{{ training_session.instructors }}</div>
+        <div class="np-events-content-time np-learning-path-outline-time np-button-color">
+          {{ training_session.time }} {{ training_session.time_zone }}
+        </div>
+      </div>
+      <i class="fas fa-chevron-right np-learning-path-outline-icon"></i>
+      {% if training_session.optional? %}
+        <div class="np-optional-ribbon">
+          {% t shared.optional %}
+        </div>
+      {% endif %}
+    </div>
+  </a>
+{% else %}
+  <div class="np-learning-path-outline-item np-card-container np-learning-path-outline-inactive-item">
+    <div class="np-card-content np-card-padding">
+      <div class="np-events-content-date np-button-background-color">
+        <div class="np-events-content-month">
+          {{ training_session.month }}
+        </div>
+        <div class="np-events-content-day">
+          {{ training_session.day }}
+        </div>
+      </div>
+      <div class="np-learning-path-outline-content">
+        <div class="np-learning-path-outline-name np-top-title">{{ training_session.name }}</div>
+        <div class="np-learning-path-outline-caption">{{ training_session.caption }}</div>
+      </div>
+      {% if training_session.optional? %}
+        <div class="np-optional-ribbon">
+          {% t shared.optional %}
+        </div>
+      {% endif %}
+    </div>
+  </div>
+{% endif %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,46 @@
+
+<div class="np-learning-paths-main">
+
+      {% assign isLPProgressHeader = false %}
+      {% for learning_path in learning_paths.enrolled %}
+        {% if learning_path.progress > 0 and learning_path.progress < 100 %}
+          {% if isLPProgressHeader == false %}
+            <div class="np-resource-title">In progress</div>
+            {% assign isLPProgressHeader = true %}
+          {% endif %}
+          <div class="np-learning-paths-resources">
+            {% include "cards_learning_path" with learning_path %}
+          </div>
+        {% endif %}
+      {% endfor %}
+    </div>
+    <div class="np-learning-paths-main">
+      <div class="np-resource-title">
+        Learning paths
+      </div>
+      {% for learning_path in items %}
+        {% if learning_path.progress == 0 %}
+          <div class="np-learning-paths-resources">
+          {% include "cards_learning_path" with learning_path %}
+          </div>
+        {% endif %}
+      {% endfor %}
+    </div>
+    <div class="np-learning-paths-main">
+      {% assign isLPCompletedHeader = false %}
+      {% for learning_path in items %}
+        {% if learning_path.progress == 100 %}
+          {% if isLPCompletedHeader == false %}
+            <div class="np-resource-title">Completed learning paths</div>
+            {% assign isLPCompletedHeader = true %}
+          {% endif %}
+          <div class="np-learning-paths-resources">
+          {% include "cards_learning_path" with learning_path %}
+          </div>
+        {% endif %}
+      {% endfor %}
+    </div>
+
+
+
+
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,144 @@
+{% assign strquizCategories = current_person.properties.qiuz_answers | strip %}
+{% if  strquizCategories  == "" %}
+  <div class="np-homepage-hero">
+    <div class="np-homepage-hero-wrapper">
+    <div class="np-homepage-hero-content np-container">
+      <div class="np-homepage-headline np-header-font-color" style="color:white; margin-top: 0;">
+        {{ homepage.headline }}
+      </div>
+      <div class="np-homepage-subheadline np-header-font-color">
+        {{ homepage.subheadline }}
+      
+      </div>
+      <div class="quizz" data-toggle-outside data-toggle-outside-event="click" data-toggle-class-on-target data-backdrop="static" data-toggle-target="#divModelPage1" data-toggle-escape data-toggle-modal>
+        Take a quiz to help guide your education &nbsp;<i class="far fa-regular fa-arrow-right"></i>     
+      </div>
+    </div>
+      <div class="np-masthead-hero-image" style="padding: 20px 20px; max-width: 400px;">
+        <div class="bla-card">
+          <div class="bla-header">In-Person Training</div>
+          <div class="bla-content">
+            <p class="bla-title">Buildertrend University: deep dive our software at our headquarters</p>
+            <p class="bla-date">January 8–9, 2025<br>January 29–30, 2025</p>
+            <button class="bla-cta"><a href="https://buildertrend.com/events/buildertrend-university/?addsrc=add-serve" target="_blank">Register now</a></button>
+            <p class="bla-allsessions"><a href="https://buildertrend.com/events/buildertrend-university/?addsrc=add-serve" target="_blank">See all sessions</a></p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+ {% else %} 
+    <div class="np-allpage-hero" style="background-color: #001a43;">
+    <div class="np-container">
+      <div class="np-homepage-headline np-header-font-color" style="font-size: 3rem; color:white;">
+        Welcome back, {{ current_person.first_name }}
+      </div>
+    </div>
+    </div>
+{% endif %}
+
+  <style>
+    .quizz {
+      font-family: 'GT Walsheim', sans-serif;
+    
+      color: #00d8d9;
+      font-size: 20px !important;
+      line-height: 24px;
+      margin-top: 12px;
+      cursor: pointer;
+    }
+.np-homepage-hero-wrapper{
+    max-width: 1100px;
+    margin: 0 auto;
+    display: flex;
+    padding: 40px 0 30px;
+  }
+  .np-homepage-hero {
+    background: #001A43;
+  }
+  .np-masthead-hero-image img{
+    width:100%;
+    max-width: 388px;
+  }
+  .np-homepage-hero-content {
+    flex-basis: 60%;
+    flex-grow: 0;
+    position: relative;
+    text-align: left;
+  }
+  .np-homepage-hero .np-homepage-headline {
+    font-family: 'GT Walsheim', sans-serif;
+    font-size: 2.65rem;
+    line-height: 3.35rem;
+    font-weight: 700;
+  }
+  .np-homepage-subheadline {
+    font-size: 16px!important;
+    line-height: 24px;
+    margin-top: 12px;
+    color: #FFFFFF;
+    opacity: 1;
+}
+.bla-card {
+  border-radius: 12px;
+  box-shadow: 2px 2px 20px 0px rgba(0, 17, 44, 0.25);
+  background-color: #FFFFFF;
+}
+.bla-header{
+  background-color:  #0763FB;
+  font-family: 'Inter', sans-serif;
+  font-size: 18px;
+  font-weight: 500;
+  line-height: 24px;
+  color: #FFFFFF;
+  padding: 8px 0 8px 19px;
+  border-radius: 12px 12px 0 0;
+}
+.bla-content{
+  text-align: center;
+  padding: 20px;
+}
+.bla-title{
+  font-family: 'GT Walsheim', sans-serif;
+  font-size: 22px;
+  font-weight: 500;
+}
+.bla-date{
+  font-family: 'Inter', sans-serif;
+  font-size: 18px;
+  text-align: center;
+}
+.bla-cta{
+  border-radius: 10px;
+  border: 2px solid rgba(255, 255, 255, 0.10);
+  background: var(--color-blue-60, #0763FB);
+  box-shadow: 0px 2px 2px -1px rgba(0, 0, 0, 0.08), 0px 0px 0px 1px rgba(0, 0, 0, 0.08);
+  padding: 9px 18px;
+  color: white;
+  font-size: 18px;
+  font-weight: 700;
+  margin: 0 auto;
+}
+.bla-allsessions{
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 25px;
+  color: #004FD6;
+  position: relative;
+  margin-top: 7px;
+}
+.bla-cta a {
+  text-decoration: none;
+  color: #FFFFFF;
+}
+.bla-allsessions a{
+  text-decoration: none;
+  color: #004FD6;
+}
+.bla-allsessions a::after{
+  content: url('https://buildertrend.com/wp-content/uploads/2024/12/CTA-Arrow.svg');
+  margin-left: 7px;
+  bottom: -2px;
+  position: absolute;
+}
+</style>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,19 @@
+{% if messages.alert.size > 0 %}
+  <div class="np-alert np-alert-error">
+    <div class="np-alert-wrapper">
+      {% for message in messages.alert %}
+        <div>{{ message }}</div>
+      {% endfor %}
+    </div>
+  </div>
+{% endif %}
+
+{% if messages.notice.size > 0 %}
+  <div class="np-alert np-alert-success">
+    <div class="np-alert-wrapper">
+      {% for message in messages.notice %}
+        <div>{{ message }}</div>
+      {% endfor %}
+    </div>
+  </div>
+{% endif %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,572 @@
+<style>
+  .info-form {
+    position: fixed;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 900;
+    display: flex;
+    padding: 1em;
+    background-color: rgba(0, 0, 0, .75);
+    visibility: hidden;
+    opacity: 0;
+    pointer-events: none;
+    transition: .25s ease-out;
+    overflow: scroll;
+  }
+</style>
+
+<div class="info-form" id="divModelPage1">
+  <section class="info-form-container">
+    <div class="info-form-content">
+      <div class="modal-intro">
+        <div class="close"data-toggle-trigger-off="#divModelPage1"  data-toggle-class-on-target  >
+          <i class="fas fa-times closesize"></i>
+        </div>
+        <div class="header">Help us better understand what you want to learn</div>
+        <p>By taking this quiz, we can better understand your business goals and how you use Buildertrend so that we can recommend the best content for you.</p>
+        <p>Select all answers that apply..</p>
+        <p  id="errorPage1" class="errorText" style="display:none" ><i class="far fa-exclamation-triangle"></i> Select at least 1 answer !! <i class="far fa-exclamation-triangle"></i></p>
+      </div>
+      <div  class="question" >1. How do you typically interact with Buildertrend?</div>
+      <div class="form-container">        
+        <div class="checkbox-wrapper">
+          <div class="round"> 
+            <input type="checkbox" class="requiredgrp1"  value="1a" id="interact_desktopview" />
+            <label for="interact_desktopview"></label>
+            
+          </div>
+          <span class="chkLbl">In the office using the desktop version</span>
+        </div>
+        <div class="checkbox-wrapper">
+          <div class="round">
+            <input type="checkbox" class="requiredgrp1" value="1b" id="interact_mobileapp" />
+            <label for="interact_mobileapp"></label>
+            
+          </div>
+          <span class="chkLbl">In the field using the mobile app</span>
+        </div>
+        <div class="checkbox-wrapper">
+          <div class="round">
+            <input type="checkbox" class="requiredgrp1" value="1c" id="interact_webbrowser" />
+            <label for="interact_webbrowser"></label>
+            
+          </div>
+          <span class="chkLbl">In the field using the web browser (.net)</span>
+        </div>
+        <div class="checkbox-wrapper">
+          <div class="round">
+            <input type="checkbox" class="requiredgrp1" value="1d" id="interact_mobileappanddesktop" />
+            <label for="interact_mobileappanddesktop"></label>              
+          </div>
+          <span class="chkLbl">I use a combination of mobile app and desktop</span>
+        </div>
+      </div>
+      <div class="buttonwrapper">
+        <button type="button" onclick="validate('#errorPage1','.requiredgrp1')" class="submit-btn" data-toggle-trigger-off="#divModelPage1" 
+          data-toggle-class-on-target  data-toggle-target="#divModelPage2" 
+          data-toggle-escape data-toggle-modal>Next</button>
+      </div> 
+    </div>
+  </section>
+</div>
+
+<div class="info-form" id="divModelPage2">
+  <section class="info-form-container">
+    <div class="info-form-content">
+      <div class="modal-intro">
+        <div class="close"data-toggle-trigger-off="#divModelPage2"  data-toggle-class-on-target  >
+          <i class="fas fa-times closesize"></i>
+        </div>
+        <div class="header">Help us better understand what you want to learn</div>
+        <p>By taking this quiz, we can better understand your business goals and how you use Buildertrend so that we can recommend the best content for you.</p>
+        <p>Select all answers that apply..</p>
+        <p  id="errorPage2" class="errorText" style="display:none" ><i class="far fa-exclamation-triangle"></i> Select at least 1 answer !! <i class="far fa-exclamation-triangle"></i></p>
+      </div>
+      <div  class="question" >2. How do you typically engage with your company's financials?</div>
+      <div class="form-container">        
+        <div class="checkbox-wrapper">
+          <div class="round">
+            <input type="checkbox" class="requiredgrp2"  value="2a" id="engagefinancials_integrationandbookkeeping" />
+            <label for="engagefinancials_integrationandbookkeeping"></label>
+            
+          </div>
+          <span class="chkLbl">I handle accounting integration and bookkeeping</span>
+        </div>
+        <div class="checkbox-wrapper">
+          <div class="round">
+            <input type="checkbox" class="requiredgrp2" value="2b" id="engagefinancials_createestimatesandmanageproject" />
+            <label for="engagefinancials_createestimatesandmanageproject"></label>
+            
+          </div>
+          <span class="chkLbl">I create estimates and manage the project budget</span>
+        </div>
+        <div class="checkbox-wrapper">
+          <div class="round">
+            <input type="checkbox" class="requiredgrp2" value="2c" id="engagefinancials_overseeprojectexpenses" />
+            <label for="engagefinancials_overseeprojectexpenses"></label>
+            
+          </div>
+          <span class="chkLbl">I oversee project expenses</span>
+        </div>
+        <div class="checkbox-wrapper">
+          <div class="round">
+            <input type="checkbox" class="requiredgrp2" value="2d" id="engagefinancials_donotintractwithfinacials" />
+            <label for="engagefinancials_donotintractwithfinacials"></label>              
+          </div>
+          <span class="chkLbl">I do not interact with the financials</span>
+        </div>
+      </div>
+      <div class="buttonwrapper">
+        <button type="button" class="submit-btn" data-toggle-trigger-off="#divModelPage2" 
+          data-toggle-class-on-target  data-toggle-target="#divModelPage1" 
+          data-toggle-escape data-toggle-modal>Back</button>
+        <button type="button" onclick="validate('#errorPage2','.requiredgrp2')" class="submit-btn" data-toggle-trigger-off="#divModelPage2" 
+          data-toggle-class-on-target  data-toggle-target="#divModelPage3" 
+          data-toggle-escape data-toggle-modal>Next</button>
+      </div>
+    </div>
+  </section>
+</div>
+
+<div class="info-form" id="divModelPage3">
+  <section class="info-form-container">
+    <div class="info-form-content">
+        <div class="modal-intro"><div class="close"data-toggle-trigger-off="#divModelPage3"  data-toggle-class-on-target  >
+          <i class="fas fa-times closesize"></i>
+        </div>
+        <div class="header">Help us better understand what you want to learn</div>
+        <p>By taking this quiz, we can better understand your business goals and how you use Buildertrend so that we can recommend the best content for you.</p>
+        <p>Select all answers that apply..</p>
+        <p  id="errorPage3" class="errorText" style="display:none" ><i class="far fa-exclamation-triangle"></i> Select at least 1 answer !! <i class="far fa-exclamation-triangle"></i></p>
+      </div>
+      <div  class="question" >3. How do you typically engage with project management?</div>
+      <div class="form-container">        
+        <div class="checkbox-wrapper">
+          <div class="round">
+            <input type="checkbox" class="requiredgrp3" value="3a" id="engageprojectmanagment_buildandmanagescheduleandoverseeoperations" />
+            <label for="engageprojectmanagment_buildandmanagescheduleandoverseeoperations"></label>
+            
+          </div>
+          <span class="chkLbl">I build and manage project schedule and oversee operations</span>
+        </div>
+        <div class="checkbox-wrapper">
+          <div class="round">
+            <input type="checkbox" class="requiredgrp3" value="3b" id="engageprojectmanagment_collaboratehomeownersondesignandcommunication" />
+            <label for="engageprojectmanagment_collaboratehomeownersondesignandcommunication"></label>
+            
+          </div>
+          <span class="chkLbl">I collaborate with homeowners on project design and communication</span>
+        </div>
+        <div class="checkbox-wrapper">
+          <div class="round">
+            <input type="checkbox" class="requiredgrp3" value="3c" id="engageprojectmanagment_workinfield" />
+            <label for="engageprojectmanagment_workinfield"></label>
+            
+          </div>
+          <span class="chkLbl">I work in the field and manage my own time and tasks</span>
+        </div>
+        <div class="checkbox-wrapper">
+          <div class="round">
+            <input type="checkbox" class="requiredgrp3" value="3d" id="engageprojectmanagment_donotengage" />
+            <label for="engageprojectmanagment_donotengage"></label>              
+          </div>
+          <span class="chkLbl">I do not engage with project management</span>
+        </div>
+      </div>
+      <div class="buttonwrapper">
+        <button type="button" class="submit-btn" data-toggle-trigger-off="#divModelPage3" 
+        data-toggle-class-on-target  data-toggle-target="#divModelPage2" 
+        data-toggle-escape data-toggle-modal>Back</button>
+        <button type="button" onclick="validate('#errorPage3','.requiredgrp3')" id="submitButton"  data-toggle-target="#divModelPage3" 
+         class="submit-btn" style="width: auto;">Submit Answers</button>
+      </div>
+    </div>      
+  </section>
+</div>
+ 
+</div>
+<script src="https://code.jquery.com/jquery-3.6.3.min.js"
+  integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU=" crossorigin="anonymous"></script>
+<script>
+
+$(document).ready(function(){
+  //blinker();
+  
+});
+
+
+
+
+  function validate(errorElement,validateElement)
+  {
+    var strSelectedAnswers="";
+    const allCheckboxes = document.querySelectorAll(validateElement)
+    console.log(allCheckboxes.length)
+    const selectedAnswers = Array.from(allCheckboxes)
+        .filter(cb => cb.checked)
+        .map(cb => cb.value);
+        selectedAnswers.forEach(chkValue => {
+          strSelectedAnswers = strSelectedAnswers + chkValue + "_";
+
+        })
+      if (strSelectedAnswers=="")
+      {
+        console.log(errorElement)
+        $(errorElement).show()
+        
+        event.stopImmediatePropagation();
+        return;
+      }
+      else
+      {
+        $(errorElement).hide()
+        if (errorElement=="#errorPage3")
+        submitAnswers();
+      }
+  }
+  function hitEscapeKey() {
+    let enterEvent = new KeyboardEvent("keydown", {
+      key: "Escape",
+      keyCode: 27,
+      which: 27
+    });
+   document.dispatchEvent(enterEvent);
+   }
+
+function submitAnswers() {
+  const allCheckboxes = document.querySelectorAll("input[type='checkbox']")
+  var strSelectedAnswers="";
+  const selectedAnswers = Array.from(allCheckboxes)
+        .filter(cb => cb.checked)
+        .map(cb => cb.value);
+
+        selectedAnswers.forEach(chkValue => {
+          strSelectedAnswers = strSelectedAnswers + chkValue + "_";
+
+        })
+  if (strSelectedAnswers=="")
+  {
+    alert("Please select atleast from each question !! ");
+    return;
+  }
+
+  strSelectedAnswers = strSelectedAnswers.substring(0,strSelectedAnswers.length-1);
+  console.log(strSelectedAnswers);
+  storeDatalocally(strSelectedAnswers);
+
+}
+
+  function storeDatalocally(strSelectedAnswers) {
+
+    let userData = {
+      "uuid": '{{current_person.id}}',
+      "answers": strSelectedAnswers    
+
+    }
+
+
+    if (userData.learner_uuid) {
+      localStorage.setItem("learnerCompletedQuiz", "true");
+      localStorage.setItem("submissionValues", JSON.stringify(userData));
+    }
+
+    console.log("UserData: ", userData)
+    submitValidatedDataToWorkato(userData)
+  }
+
+  function submitValidatedDataToWorkato(data) {
+    console.log("submitting user data to Workato")
+    const secondaryInfoStored = localStorage.getItem("learnerCompletedAdditionalInfo")
+
+    $("body").addClass("body_overlay");
+    $("<div id='myloading' class='custom_loading'>Please wait while data is saving...  </div>").insertAfter($("body"));
+    $("#myloading").css("top",($(window).height() - $("#myloading").outerHeight())/2);
+    $("#myloading").css("left",($(window).width() - $("#myloading").outerWidth())/2);
+
+    $.ajax({
+      url: "https://webhooks.workato.com/webhooks/rest/be2ef65f-5714-4fa6-899a-9b4e73a72f83/submit_answers",
+      data: JSON.stringify(data),
+      method: 'POST',
+      success: function (res) {
+        console.log(res)
+        setTimeout(function () {
+          document.querySelector(".info-form-trigger").click()
+        }, 1000)
+        window.location.reload();
+        $("body").removeClass("body_overlay");
+        $("#myloading").remove();
+        //hitEscapeKey();
+       
+      },
+      error: function (xhr, status, error) {
+        console.error("Error posting to workato!");
+
+        if (secondaryInfoStored == "true") {
+          console.log("secondary information completed and stored in local storage")
+
+          
+        }
+      }
+    });
+  }
+
+
+
+
+
+</script>
+
+<style>
+
+.body_overlay{
+background-color:#9c9c9c;
+position: fixed;
+width: 100%;
+height: 100%;
+z-index: 1000;
+top: 0px;
+left: 0px;
+opacity: .5; /* in FireFox */
+filter: alpha(opacity=50); /* in IE */
+pointer-events:none;
+}
+.custom_loading{
+position:absolute;
+border:1px solid lightgray;
+background-color:white;
+z-index:9999;
+padding:20px 50px;
+font-size:14px;
+}
+
+/* Check box styling */
+.chkLbl {
+    font-size: 18px;
+    font-family: "GT Walsheim", sans-serif;
+    padding-left: 8px;
+}
+.checkbox-wrapper {
+  width: 440px;
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    border: 1px solid;
+    padding: 8px;
+    margin: 10px;
+}
+.checkbox-wrapper .round {
+    position: relative;
+  }
+
+  .checkbox-wrapper .round label {
+    color: black;
+    background-color: #fff;
+    border: 2px solid black;
+    border-radius: 50%;
+    cursor: pointer;
+    height: 28px;
+    width: 28px;
+    display: block;
+  }
+
+  .checkbox-wrapper .round label:after {
+    border: 2px solid #001a43;
+    border-top: none;
+    border-right: none;
+    content: "";
+    height: 6px;
+    left: 8px;
+    opacity: 0;
+    position: absolute;
+    top: 9px;
+    transform: rotate(-45deg);
+    width: 12px;
+  }
+
+  .checkbox-wrapper .round input[type="checkbox"] {
+    visibility: hidden;
+    display: none;
+    opacity: 0;
+  }
+
+  .checkbox-wrapper .round input[type="checkbox"]:checked + label {
+    background-color: #fff;
+    border-color: #202227;
+  }
+
+  .checkbox-wrapper .round input[type="checkbox"]:checked + label:after {
+    opacity: 1;
+  }
+
+  
+
+  /* Form Syyles */
+.close {
+  position: absolute;
+    left: 95%;
+    top: 4%;
+    cursor: pointer;
+}
+.closesize {
+  font-size: 34px;
+  font-weight: 100;
+}
+  .errorText {
+    font-size: 18px;
+    font-family: "GT Walsheim", sans-serif;    
+    font-weight: bold;
+    color: red; 
+  }
+  
+.buttonwrapper {
+  display: flex;
+    flex-direction: row;
+    justify-content: center;
+
+}
+.question {
+  font-size: 19px;
+  font-family: "Inter", sans-serif;
+  font-weight: 700;
+  padding-left: 8px;
+  margin: 20px 32px 10px 30px;
+}
+
+  .form-container {
+   
+    display: flex;
+    max-width: 100%;
+    margin: 0 auto;
+    background-color: #ffffff;
+    padding: 20px;
+    border-radius: 8px;
+    
+    flex-wrap: wrap;
+  }
+
+  .form-group {
+    margin-bottom: 15px;
+  }
+
+  label {
+    display: block;
+    margin-bottom: 5px;
+  }
+
+  select
+   {
+    width: 100%;
+    padding: 8px;
+    font-size: 1em;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+  }
+
+  .privacy-notice {
+    display: flex;
+    align-items: center;
+    margin-top: 15px;
+    align-items: baseline;
+    margin-bottom: 15px;
+  }
+
+  .submit-btn {
+    width: 100px;
+    padding: 10px;
+    font-size: 1em;
+    background-color: #001a43;
+    color: white;
+    border: none;
+    border-radius: 4px;
+    cursor: pointer;
+    margin: 10px;
+    
+  }
+
+  /* Popup Styles */
+  .info-form-trigger {
+    color: #015893;
+    opacity: 0;
+  }
+
+  .info-form-trigger:hover,
+  .info-form-trigger:focus {
+    text-decoration: none;
+  }
+
+  .info-form.is-active {
+    visibility: visible;
+    opacity: 1;
+    pointer-events: auto;
+  }
+
+  .info-form-container {
+    width: 70rem;
+    max-width: 770rem;
+    margin: auto;
+    transform: translateY(-1em) scale(.95);
+    background-color: white;
+    transition: transform .25s ease-out;
+    border-radius: 20px;
+    height: auto;
+  }
+
+  .info-form.is-active .info-form-container {
+    transform: translateY(0) scale(1);
+  }
+
+  .info-form-header,
+  .info-form-content,
+  .info-form-footer {
+    padding: 16px;
+  }
+
+  .info-form-footer {
+    background-color: whitesmoke;
+    text-align: right;
+  }
+
+  .info-form-footer button {
+    display: inline-block;
+    padding: .25em .5em;
+    border: none;
+    background-color: #001a43;
+    color: white;
+  }
+
+  .info-form-footer button:hover,
+  .info-form-footer button:focus {
+    background-color: white;
+    color: #fff;
+  }
+
+  .modal-intro {
+    text-align: center;
+    margin: 12px 32px 32px;
+  }
+
+  .modal-intro .header {
+    font-size: 26px;
+    font-weight: 700;
+  }
+
+  .info-form-content {
+    max-height: 90vh;
+    overflow: auto;
+  }
+
+  @media (min-width:768px) {
+
+    .info-form-header,
+    .info-form-content,
+    .info-form-footer {
+      padding: 32px 64px;
+    }
+
+    .info-form-content .input-wrapper {
+      margin-bottom: 22px;
+    }
+  }
+</style>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,20 @@
+{% if result.activity.type != "video" and result.activity.type != "richtext" and result.activity.type != "quiz" %} 
+<div class="np-card np-search-result col-xs-12 col-sm-6 col-lg-3">
+  <div class="np-card-container">
+    <div class="np-card-content">
+      <img
+        class="np-search-result-image"
+        alt="{{ result.name }}"
+        src="{{ result.image_url }}"
+      />
+      <div class="np-search-result-content">
+        <div class="np-search-result-title">
+            {{ result.name }}
+            
+        </div>
+        <a href="{{ result.path }}" class="np-button np-button-wide" style="margin-top: 16px;">View</a>
+      </div>
+    </div>
+  </div>
+</div>
+{% endif %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,56 @@
+<div class="np-card np-search-zero-state">
+  <h1>
+    We’re sorry. We didn’t find any matches for that.
+  </h1>
+  <div class="content-wrapper" style="padding-top: 10px;">
+    <div class="col-md-6 col-xs-12">
+      <h4>Try these suggestions to get better results:</h4>
+      <ul>
+        <li>Check your search for typos</li>
+        <li>Try a new search</li>
+        <li>Use more generic search terms</li>
+        <li>Limit your search to one or two words</li>
+        <li>Need guidance? Visit our Help Center</li>
+      </ul>
+      <a class="np-button np-button-wide" href="/app">Browse all education</a>
+    </div>
+
+    <div class="col-md-6 col-xs-12"><img src="https://buildertrend.com/wp-content/uploads/2024/05/404-tools.webp"
+        alt="404" style="max-width: 350px;"></div>
+  </div>
+</div>
+<style>
+  h1 {
+    font-family: 'GT Walsheim', sans-serif;
+    font-size: 36px;
+    font-weight: 500;
+    line-height: 48px;
+    color: #202227;
+    text-align: center;
+  }
+
+  h4 {
+    font-family: 'GT Walsheim', sans-serif;
+    font-size: 20px;
+    font-weight: 500;
+    line-height: 28px;
+    color: #202227;
+    margin-top: 0;
+  }
+   ul{
+    padding-left: 15px;
+    padding-bottom: 10px;
+  }
+  li {
+    line-height: 30px;
+  }
+
+ .content-wrapper {
+    display: flex;
+    max-width: 815px;
+    gap: 20px;
+  }
+  .np-button.np-button-wide{
+    padding: 10px 21px;
+  }
+</style>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,93 @@
+<nav class="np-sub-navigation">
+  <div class="np-sub-navigation-content">
+  
+
+
+    <div class=" np-sub-navigation-content-item">
+      <a class="np-sub-navigation-content-item-link" href="/app">
+
+      <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M30 26.0003H28V17.0003L28.2925 17.2928C28.4805 17.4805 28.7353 17.5857 29.0009 17.5855C29.2665 17.5853 29.5211 17.4795 29.7087 17.2916C29.8964 17.1036 30.0017 16.8488 30.0014 16.5832C30.0012 16.3176 29.8955 16.063 29.7075 15.8753L17.4137 3.58532C17.0387 3.21053 16.5302 3 16 3C15.4698 3 14.9613 3.21053 14.5863 3.58532L2.2925 15.8753C2.10503 16.063 1.99977 16.3174 1.99989 16.5826C2 16.8479 2.10548 17.1022 2.29312 17.2897C2.48077 17.4772 2.7352 17.5824 3.00044 17.5823C3.26569 17.5822 3.52003 17.4767 3.7075 17.2891L4 17.0003V26.0003H2C1.73478 26.0003 1.48043 26.1057 1.29289 26.2932C1.10536 26.4808 1 26.7351 1 27.0003C1 27.2655 1.10536 27.5199 1.29289 27.7074C1.48043 27.895 1.73478 28.0003 2 28.0003H30C30.2652 28.0003 30.5196 27.895 30.7071 27.7074C30.8946 27.5199 31 27.2655 31 27.0003C31 26.7351 30.8946 26.4808 30.7071 26.2932C30.5196 26.1057 30.2652 26.0003 30 26.0003ZM6 15.0003L16 5.00032L26 15.0003V26.0003H20V19.0003C20 18.7351 19.8946 18.4808 19.7071 18.2932C19.5196 18.1057 19.2652 18.0003 19 18.0003H13C12.7348 18.0003 12.4804 18.1057 12.2929 18.2932C12.1054 18.4808 12 18.7351 12 19.0003V26.0003H6V15.0003ZM18 26.0003H14V20.0003H18V26.0003Z" fill="#666D7C"/>
+      </svg>
+        Home
+      </a>
+      <div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
+    </div>
+    <div class=" np-sub-navigation-content-item">
+      <a class="np-sub-navigation-content-item-link" href="/app/catalog">
+
+      <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+<path d="M31.4701 11.1173L16.4701 3.11733C16.3254 3.04029 16.164 3 16.0001 3C15.8361 3 15.6747 3.04029 15.5301 3.11733L0.530054 11.1173C0.370059 11.2026 0.236255 11.3298 0.142954 11.4852C0.0496529 11.6407 0.000366211 11.8185 0.000366211 11.9998C0.000366211 12.1811 0.0496529 12.359 0.142954 12.5145C0.236255 12.6699 0.370059 12.7971 0.530054 12.8823L4.00005 14.7336V20.7861C3.99901 21.2773 4.17979 21.7515 4.50755 22.1173C6.14505 23.9411 9.8138 26.9998 16.0001 26.9998C18.0512 27.0168 20.0871 26.6453 22.0001 25.9048V29.9998C22.0001 30.2651 22.1054 30.5194 22.2929 30.7069C22.4805 30.8945 22.7348 30.9998 23.0001 30.9998C23.2653 30.9998 23.5196 30.8945 23.7072 30.7069C23.8947 30.5194 24.0001 30.2651 24.0001 29.9998V24.9386C25.3041 24.1858 26.4824 23.2339 27.4926 22.1173C27.8203 21.7515 28.0011 21.2773 28.0001 20.7861V14.7336L31.4701 12.8823C31.63 12.7971 31.7639 12.6699 31.8572 12.5145C31.9505 12.359 31.9997 12.1811 31.9997 11.9998C31.9997 11.8185 31.9505 11.6407 31.8572 11.4852C31.7639 11.3298 31.63 11.2026 31.4701 11.1173ZM16.0001 24.9998C10.5913 24.9998 7.41005 22.3573 6.00005 20.7861V15.7998L15.5301 20.8823C15.6747 20.9594 15.8361 20.9997 16.0001 20.9997C16.164 20.9997 16.3254 20.9594 16.4701 20.8823L22.0001 17.9336V23.7261C20.4251 24.4611 18.4401 24.9998 16.0001 24.9998ZM26.0001 20.7811C25.4006 21.4463 24.7299 22.0436 24.0001 22.5623V16.8661L26.0001 15.7998V20.7811ZM23.5001 14.8673L23.4726 14.8511L16.4726 11.1173C16.239 10.998 15.9679 10.9753 15.7178 11.0539C15.4676 11.1326 15.2583 11.3064 15.1351 11.5378C15.0118 11.7693 14.9844 12.0399 15.0587 12.2914C15.1331 12.5429 15.3032 12.7551 15.5326 12.8823L21.3751 15.9998L16.0001 18.8661L3.12505 11.9998L16.0001 5.13358L28.8751 11.9998L23.5001 14.8673Z" fill="#666D7C"/>
+</svg>
+        Courses
+      </a>
+      <div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
+    </div>
+    <div class=" np-sub-navigation-content-item">
+      <a class="np-sub-navigation-content-item-link" href="/app/learning_paths">
+
+      <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+<path d="M29.4901 24.875C29.3752 24.9397 29.2488 24.9811 29.1179 24.9968C28.987 25.0125 28.8543 25.0021 28.7275 24.9663C28.6006 24.9306 28.4821 24.8701 28.3787 24.7883C28.2753 24.7066 28.1891 24.6052 28.1251 24.49L19.4151 9H17.0001V10C17.0001 10.2652 16.8947 10.5196 16.7072 10.7071C16.5196 10.8946 16.2653 11 16.0001 11C15.7348 11 15.4805 10.8946 15.2929 10.7071C15.1054 10.5196 15.0001 10.2652 15.0001 10V9H12.5851L3.87505 24.49C3.7451 24.7221 3.52828 24.893 3.27229 24.9652C3.0163 25.0374 2.74212 25.005 2.51005 24.875C2.27799 24.745 2.10705 24.5282 2.03485 24.2722C1.96265 24.0162 1.9951 23.7421 2.12505 23.51L10.2901 9H3.00005C2.73484 9 2.48048 8.89464 2.29295 8.70711C2.10541 8.51957 2.00005 8.26522 2.00005 8C2.00005 7.73478 2.10541 7.48043 2.29295 7.29289C2.48048 7.10536 2.73484 7 3.00005 7H29.0001C29.2653 7 29.5196 7.10536 29.7072 7.29289C29.8947 7.48043 30.0001 7.73478 30.0001 8C30.0001 8.26522 29.8947 8.51957 29.7072 8.70711C29.5196 8.89464 29.2653 9 29.0001 9H21.7101L29.8751 23.51C29.9398 23.6248 29.9812 23.7513 29.9969 23.8822C30.0125 24.013 30.0022 24.1457 29.9664 24.2726C29.9306 24.3994 29.8701 24.5179 29.7884 24.6213C29.7066 24.7247 29.6052 24.8109 29.4901 24.875ZM16.0001 14C15.7348 14 15.4805 14.1054 15.2929 14.2929C15.1054 14.4804 15.0001 14.7348 15.0001 15V17C15.0001 17.2652 15.1054 17.5196 15.2929 17.7071C15.4805 17.8946 15.7348 18 16.0001 18C16.2653 18 16.5196 17.8946 16.7072 17.7071C16.8947 17.5196 17.0001 17.2652 17.0001 17V15C17.0001 14.7348 16.8947 14.4804 16.7072 14.2929C16.5196 14.1054 16.2653 14 16.0001 14ZM16.0001 21C15.7348 21 15.4805 21.1054 15.2929 21.2929C15.1054 21.4804 15.0001 21.7348 15.0001 22V24C15.0001 24.2652 15.1054 24.5196 15.2929 24.7071C15.4805 24.8946 15.7348 25 16.0001 25C16.2653 25 16.5196 24.8946 16.7072 24.7071C16.8947 24.5196 17.0001 24.2652 17.0001 24V22C17.0001 21.7348 16.8947 21.4804 16.7072 21.2929C16.5196 21.1054 16.2653 21 16.0001 21Z" fill="#666D7C"/>
+</svg>
+        Learning Paths
+      </a>
+      <div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
+    </div>
+    <div class=" np-sub-navigation-content-item">
+      <a class="np-sub-navigation-content-item-link" href="/app/certifications">
+
+      <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M16 17C16 17.2652 15.8946 17.5196 15.7071 17.7071C15.5196 17.8946 15.2652 18 15 18H9C8.73478 18 8.48043 17.8946 8.29289 17.7071C8.10536 17.5196 8 17.2652 8 17C8 16.7348 8.10536 16.4804 8.29289 16.2929C8.48043 16.1054 8.73478 16 9 16H15C15.2652 16 15.5196 16.1054 15.7071 16.2929C15.8946 16.4804 16 16.7348 16 17ZM15 12H9C8.73478 12 8.48043 12.1054 8.29289 12.2929C8.10536 12.4804 8 12.7348 8 13C8 13.2652 8.10536 13.5196 8.29289 13.7071C8.48043 13.8946 8.73478 14 9 14H15C15.2652 14 15.5196 13.8946 15.7071 13.7071C15.8946 13.5196 16 13.2652 16 13C16 12.7348 15.8946 12.4804 15.7071 12.2929C15.5196 12.1054 15.2652 12 15 12ZM29 20.1838V28C29.0016 28.1763 28.9565 28.3499 28.8694 28.5032C28.7823 28.6564 28.6562 28.7839 28.5039 28.8728C28.3516 28.9616 28.1786 29.0086 28.0023 29.009C27.826 29.0094 27.6527 28.9632 27.5 28.875L24.5 27.1575L21.5 28.875C21.3473 28.9632 21.174 29.0094 20.9977 29.009C20.8214 29.0086 20.6484 28.9616 20.4961 28.8728C20.3438 28.7839 20.2177 28.6564 20.1306 28.5032C20.0435 28.3499 19.9984 28.1763 20 28V25H5C4.46957 25 3.96086 24.7893 3.58579 24.4142C3.21071 24.0391 3 23.5304 3 23V7C3 6.46957 3.21071 5.96086 3.58579 5.58579C3.96086 5.21071 4.46957 5 5 5H27C27.5304 5 28.0391 5.21071 28.4142 5.58579C28.7893 5.96086 29 6.46957 29 7V10.8162C29.6321 11.4216 30.1352 12.1487 30.4789 12.9536C30.8225 13.7586 30.9997 14.6248 30.9997 15.5C30.9997 16.3752 30.8225 17.2414 30.4789 18.0464C30.1352 18.8513 29.6321 19.5784 29 20.1838ZM20 23V20.1838C18.9103 19.1328 18.2216 17.7344 18.0527 16.2299C17.8839 14.7254 18.2456 13.2091 19.0753 11.9428C19.905 10.6764 21.1507 9.73945 22.5975 9.29348C24.0443 8.84751 25.6013 8.92055 27 9.5V7H5V23H20ZM27 21.5C26.208 21.8309 25.3583 22.0013 24.5 22.0013C23.6417 22.0013 22.792 21.8309 22 21.5V26.2775L24 25.1325C24.1511 25.0461 24.3222 25.0007 24.4963 25.0007C24.6703 25.0007 24.8414 25.0461 24.9925 25.1325L26.9925 26.2775L27 21.5ZM29 15.5C29 14.61 28.7361 13.74 28.2416 12.9999C27.7471 12.2599 27.0443 11.6831 26.2221 11.3425C25.3998 11.0019 24.495 10.9128 23.6221 11.0865C22.7492 11.2601 21.9474 11.6887 21.318 12.318C20.6887 12.9474 20.2601 13.7492 20.0865 14.6221C19.9128 15.495 20.0019 16.3998 20.3425 17.2221C20.6831 18.0443 21.2599 18.7471 21.9999 19.2416C22.74 19.7361 23.61 20 24.5 20C25.0909 20 25.6761 19.8836 26.2221 19.6575C26.768 19.4313 27.2641 19.0998 27.682 18.682C28.0998 18.2641 28.4313 17.768 28.6575 17.2221C28.8836 16.6761 29 16.0909 29 15.5Z" fill="#666D7C"/>
+      </svg>
+        Certifications
+      </a>
+      <div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
+    </div>
+    <div class=" np-sub-navigation-content-item">
+      <a class="np-sub-navigation-content-item-link" href="/app/training_events">
+
+      <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M27 5H5C4.46957 5 3.96086 5.21071 3.58579 5.58579C3.21071 5.96086 3 6.46957 3 7V25C3 25.5304 3.21071 26.0391 3.58579 26.4142C3.96086 26.7893 4.46957 27 5 27H27C27.5304 27 28.0391 26.7893 28.4142 26.4142C28.7893 26.0391 29 25.5304 29 25V7C29 6.46957 28.7893 5.96086 28.4142 5.58579C28.0391 5.21071 27.5304 5 27 5ZM27 15H21V7H27V15ZM5 7H19V25H5V7ZM27 25H21V17H27V25ZM22.5 11C22.5 10.7033 22.588 10.4133 22.7528 10.1666C22.9176 9.91997 23.1519 9.72771 23.426 9.61418C23.7001 9.50065 24.0017 9.47094 24.2926 9.52882C24.5836 9.5867 24.8509 9.72956 25.0607 9.93934C25.2704 10.1491 25.4133 10.4164 25.4712 10.7074C25.5291 10.9983 25.4993 11.2999 25.3858 11.574C25.2723 11.8481 25.08 12.0824 24.8334 12.2472C24.5867 12.412 24.2967 12.5 24 12.5C23.6022 12.5 23.2206 12.342 22.9393 12.0607C22.658 11.7794 22.5 11.3978 22.5 11ZM25.5 21C25.5 21.2967 25.412 21.5867 25.2472 21.8334C25.0824 22.08 24.8481 22.2723 24.574 22.3858C24.2999 22.4993 23.9983 22.5291 23.7074 22.4712C23.4164 22.4133 23.1491 22.2704 22.9393 22.0607C22.7296 21.8509 22.5867 21.5836 22.5288 21.2926C22.4709 21.0017 22.5007 20.7001 22.6142 20.426C22.7277 20.1519 22.92 19.9176 23.1666 19.7528C23.4133 19.588 23.7033 19.5 24 19.5C24.3978 19.5 24.7794 19.658 25.0607 19.9393C25.342 20.2206 25.5 20.6022 25.5 21ZM16.9688 20.75C16.6452 19.5418 15.8779 18.5 14.82 17.8325C15.3818 17.274 15.7651 16.5614 15.9214 15.7848C16.0777 15.0082 15.9998 14.2027 15.6978 13.4704C15.3957 12.7381 14.8831 12.112 14.2248 11.6714C13.5664 11.2309 12.7921 10.9957 12 10.9957C11.2079 10.9957 10.4336 11.2309 9.77525 11.6714C9.11693 12.112 8.60426 12.7381 8.30221 13.4704C8.00016 14.2027 7.92234 15.0082 8.07861 15.7848C8.23488 16.5614 8.61821 17.274 9.18 17.8325C8.12282 18.5007 7.35575 19.5422 7.03125 20.75C6.96495 21.0069 7.00342 21.2797 7.13821 21.5082C7.27301 21.7368 7.49307 21.9024 7.75 21.9688C8.00693 22.0351 8.27967 21.9966 8.50823 21.8618C8.73679 21.727 8.90245 21.5069 8.96875 21.25C9.29875 19.9688 10.6013 19 12 19C13.3988 19 14.7025 19.9662 15.0312 21.25C15.0976 21.5069 15.2632 21.727 15.4918 21.8618C15.7203 21.9966 15.9931 22.0351 16.25 21.9688C16.5069 21.9024 16.727 21.7368 16.8618 21.5082C16.9966 21.2797 17.0351 21.0069 16.9688 20.75ZM10 15C10 14.6044 10.1173 14.2178 10.3371 13.8889C10.5568 13.56 10.8692 13.3036 11.2346 13.1522C11.6001 13.0009 12.0022 12.9613 12.3902 13.0384C12.7781 13.1156 13.1345 13.3061 13.4142 13.5858C13.6939 13.8655 13.8844 14.2219 13.9616 14.6098C14.0387 14.9978 13.9991 15.3999 13.8478 15.7654C13.6964 16.1308 13.44 16.4432 13.1111 16.6629C12.7822 16.8827 12.3956 17 12 17C11.4696 17 10.9609 16.7893 10.5858 16.4142C10.2107 16.0391 10 15.5304 10 15Z" fill="#666D7C"/>
+      </svg>
+        Virtual Training
+      </a>
+      <div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
+    </div>
+
+</nav>
+
+<script>
+  const subNavItems = document.querySelectorAll('.np-sub-navigation-content-item-link');
+  const currentURL = window.location.pathname;
+
+  subNavItems.forEach( subNavItem => {
+    if (subNavItem.getAttribute('href') === currentURL){
+      subNavItem.classList.add('current');
+    }
+  });
+  
+</script>
+<style>
+  .np-sub-navigation-content-item-link {
+    align-items: center;
+    color: #666D7C;
+    display: flex;
+    flex-direction: column;
+    font-size: 20px;
+    font-family: "GT Walsheim", sans-serif;
+    font-weight: 500;
+    line-height: 28px;
+    height: 80px;
+    text-decoration: none;
+    transition: all .2s;
+  }
+  .np-sub-navigation-content-item-link:hover, .np-sub-navigation-content-item-link.current{
+    border-bottom: 6px solid #202227;
+    color: #202227;
+    font-weight: 700;
+    transition: all .2s;
+  }
+  .np-sub-navigation-content-item-link:hover path, .np-sub-navigation-content-item-link.current path{
+    fill: #202227;
+  }
+</style>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,9 @@
+<div class="np-dashboard-resources">
+  {% if training_events.enrolled.any? %}
+    {% for training_event in training_events.enrolled %}
+      {% include "cards_training_event" with training_event %}
+    {% endfor %}
+  {% else %}
+    {% include "training_events_zero_state" %}
+  {% endif %}
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,24 @@
+{% if training_events.enrolled.any? %}
+<div class="np-resource-title">
+  Registered
+</div>
+<div class="np-dashboard-resources">
+  <div class="row row-with-thumbnails">
+    {% for training_event in training_events.enrolled %}
+    <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content">
+      {% include "cards_training_event" with training_event %}
+    </div>
+    {% endfor %}
+  </div>
+</div>
+{% endif %}
+ <script>
+window.onload = function(){
+  const registered_label = document.querySelectorAll('.success');
+  registered_label.forEach( registered_label => {
+    if (registered_label.textContent.includes('registered')){
+      registered_label.classList.add('success_green');
+    }
+  })
+};
+</script> 
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,53 @@
+<div class="np-filter">
+  <div class="dropdown">
+    <button
+      class="np-button dropdown-button"
+      data-toggle-class="is-open"
+      data-toggle-escape
+      data-toggle-outside
+      data-toggle-target-next
+      type="button"
+    >
+      {% t shared.filters.filter %}
+    </button>
+
+    <div class="dropdown-menu" data-test="modal">
+      <form method="get">
+        <span class="dropdown-label">
+          {% t shared.filters.by_event_type %}
+        </span>
+        <ul class="dropdown-checkboxes">
+          {% for event_type in training_events.filters.event_types %}
+            {% capture label %}
+              {% t shared.event_types, key: event_type.value %}
+            {% endcapture %}
+            <li>
+              {% include "filter_checkbox",
+                  label: label,
+                  name: event_type.name,
+                  value: event_type.value
+                  selected: event_type.selected?
+              %}
+            </li>
+          {% endfor %}
+        </ul>
+
+        {% capture label %}{% t shared.filters.by_course %}{% endcapture %}
+        {%
+          include "filter_select",
+          filters: training_events.filters.courses,
+          key: "courses_uuid",
+          label: label
+        %}
+
+        <button
+          class="np-button dropdown-button-apply"
+          data-toggle-trigger-off
+          type="submit"
+        >
+          {% t shared.filters.apply %}
+        </button>
+      </form>
+    </div>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,21 @@
+<div class="np-dashboard-resources">
+  {% if training_events.available.any? %}
+    <div class="row row-with-thumbnails">
+      {% for training_event in training_events.available %}
+        {% assign eventMatch = false %}
+        {% for enrolled_event in training_events.enrolled %} 
+          {% if training_event.sessions.first.id == enrolled_event.sessions.first.id %}
+            {% assign eventMatch = true %}
+          {% endif %}
+        {% endfor %}
+        {% if eventMatch == false %}
+          <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content">
+          {% include "cards_training_event" with training_event %}
+        </div>
+        {% endif %}
+      {% endfor %}
+    </div>
+  {% else %
+    {% include "training_events_zero_state" %}
+  {% endif %}
+</div>
--- a/External/_training_events_zero_state.html.liquid
+++ b/External/_training_events_zero_state.html.liquid
@ -0,0 +1,9 @@
+<div class="np-dashboard-resources-container">
+  <div class="np-zero-state-text">
+    {% t .empty %}
+  </div>
+  <img
+    class="np-zero-state-training-events"
+    alt="{% t .empty %}"
+  />
+</div>
--- a/External/_training_session_calendars.html.liquid
+++ b/External/_training_session_calendars.html.liquid
@ -0,0 +1,52 @@
+<div class="dropdown dropdown-calendar">
+  <button
+    class="np-top-button np-button-font-color np-button np-button-big dropdown-calendar-button"
+    data-toggle-class="is-open"
+    data-toggle-escape
+    data-toggle-outside
+    data-toggle-target-next
+    type="button"
+  >
+    {% t .add_to_calendar %}
+    <i class="fas fa-chevron-down dropdown-calendar-button-chevron"></i>
+  </button>
+
+  <ul class="dropdown-calendar-menu">
+    <li class="dropdown-calendar-item">
+      <a
+        class="dropdown-calendar-item-element np-button-background-color-on-hover np-button-font-color-on-hover"
+        href="{{ training_session.google_calendar_url }}"
+        target="_blank"
+      >
+          {% t .google_calendar %}
+      </a>
+    </li>
+    <li class="dropdown-calendar-item">
+      <a
+        class="dropdown-calendar-item-element np-button-background-color-on-hover np-button-font-color-on-hover"
+        href="{{ training_session.outlook_calendar_url }}"
+        target="_blank"
+      >
+          {% t .outlook_calendar %}
+      </a>
+    </li>
+    <li class="dropdown-calendar-item">
+      <a
+        class="dropdown-calendar-item-element np-button-background-color-on-hover np-button-font-color-on-hover"
+        href="{{ training_session.outlook_office_calendar_url }}"
+        target="_blank"
+      >
+          {% t .office_calendar %}
+      </a>
+    </li>
+    <li class="dropdown-calendar-item">
+      <a
+        class="dropdown-calendar-item-element np-button-background-color-on-hover np-button-font-color-on-hover"
+        href="{{ training_session.ical_calendar_url }}"
+        target="_blank"
+      >
+          {% t .ical_calendar %}
+      </a>
+    </li>
+  </ul>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,35 @@
+<div class="np-training-session-cta">
+  <div class="np-training-session-cta-buttons">
+    <form
+      action="{{ training_session.cta.url }}"
+      method="post"
+    >
+      {% form_authenticity_token %}
+
+      {% if training_session.show_calendar_links? %}
+        {% include "training_session_calendars" %}
+      {% endif %}
+
+      {% if training_session.cta.undo? %}
+        <input type="hidden" name="_method" value="delete" />
+      {% endif %}
+
+      {% if training_session.cta.label %}
+        <button
+          type="submit"
+          class="
+            np-top-button
+            np-button
+            np-button-big
+
+            {% if training_session.show_calendar_links? %}
+              np-button-secondary
+            {% endif %}
+          "
+        >
+          {{ training_session.cta.label }}
+        </button>
+      {% endif %}
+    </form>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,16 @@
+<div class="np-card-training-session-date">
+  <div class="np-button-background-color np-card-training-session-date-bar"></div>
+  <div class="np-card-training-session-date-label">
+    <div class="np-card-training-session-date-day">
+      {{ training_session.day }}
+    </div>
+    <div>
+      <div class="np-card-training-session-date-month">
+        {{ training_session.month }}
+      </div>
+      <div class="np-card-training-session-date-year">
+        {{ training_session.year }}
+      </div>
+    </div>
+  </div>
+</div>
--- a/External/_training_session_description.html.liquid
+++ b/External/_training_session_description.html.liquid
@ -0,0 +1,6 @@
+<h3 class="np-card-heading">
+  {% t .header %}
+</h3>
+<div class="np-card-text">
+  {{ training_event.description }}
+</div>
--- a/External/_training_session_desktop_view.html.liquid
+++ b/External/_training_session_desktop_view.html.liquid
@ -0,0 +1,43 @@
+<div class="np-resource-header np-resource-header-card np-card-padding-large">
+  {% include "training_session_header" %}
+</div>
+<div class="row np-training-session-row">
+  <div class="col-xs-12 col-sm-8">
+    <div class="np-card-container">
+      <div class="np-card-padding-large">
+        <div>
+          {% include "training_session_status" %}
+          {% include "training_session_date" %}
+        </div>
+        <div class="np-training-session-details">
+          {% include "training_session_details" %}
+          {% include "training_session_cta" %}
+        </div>
+      </div>
+      <div class="np-card-content-divider"></div>
+      <div class="np-card-padding-large">
+        {% include "training_session_description" %}
+      </div>
+    </div>
+  </div>
+  <div class="col-xs-12 col-sm-4 np-grid-spacing">
+    <div class="np-training-session-container">
+        <div class="np-training-session-sessions-title">
+          {% t shared.more_sessions %}
+        </div>
+        {% if training_event.sessions.size > 1 %}
+          {% include "training_session_more_sessions" %}
+        {% else %}
+          <div class="np-training-session-zero-state">
+            <img
+              alt="{% t .empty %}"
+              class="np-zero-state-training-sessions"
+            />
+            <div class="np-training-session-zero-state-text">
+              {% t .empty %}
+            </div>
+          </div>
+        {% endif %}
+    </div>
+  </div>
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,23 @@
+<div class="np-training-session-info">
+
+  <div class="np-training-session-time">
+    <i class="fal fa-clock np-button-color np-training-session-icon"></i>
+    <time>{{ training_session.time_period }} {{ training_session.time_zone }}</time>
+  </div>
+
+  {% if training_session.approved? and training_session.location %}
+    <div class="np-training-session-location">
+      <i class="fal fa-map-marker-alt np-button-color np-training-session-icon"></i>
+      {{ training_session.location }}
+    </div>
+  {% endif %}
+
+  {% if training_session.approved? and training_session.session_url %}
+    <div class="np-training-session-location">
+      <i class="fal fa-map-marker-alt np-button-color np-training-session-icon"></i>
+      <a href="{{ training_session.session_url }}" class="np-button-color" target="_blank" >
+        {{ training_session.session_url }}
+      </a>
+    </div>
+  {% endif %}
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,12 @@
+<div class="np-top-vocabulary np-text-title">
+  <span style="padding-right: 10px;">Virtual Training</span>
+  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 32 32" fill="none">
+<path d="M27 5H5C4.46957 5 3.96086 5.21071 3.58579 5.58579C3.21071 5.96086 3 6.46957 3 7V25C3 25.5304 3.21071 26.0391 3.58579 26.4142C3.96086 26.7893 4.46957 27 5 27H27C27.5304 27 28.0391 26.7893 28.4142 26.4142C28.7893 26.0391 29 25.5304 29 25V7C29 6.46957 28.7893 5.96086 28.4142 5.58579C28.0391 5.21071 27.5304 5 27 5ZM27 15H21V7H27V15ZM5 7H19V25H5V7ZM27 25H21V17H27V25ZM22.5 11C22.5 10.7033 22.588 10.4133 22.7528 10.1666C22.9176 9.91997 23.1519 9.72771 23.426 9.61418C23.7001 9.50065 24.0017 9.47094 24.2926 9.52882C24.5836 9.5867 24.8509 9.72956 25.0607 9.93934C25.2704 10.1491 25.4133 10.4164 25.4712 10.7074C25.5291 10.9983 25.4993 11.2999 25.3858 11.574C25.2723 11.8481 25.08 12.0824 24.8334 12.2472C24.5867 12.412 24.2967 12.5 24 12.5C23.6022 12.5 23.2206 12.342 22.9393 12.0607C22.658 11.7794 22.5 11.3978 22.5 11ZM25.5 21C25.5 21.2967 25.412 21.5867 25.2472 21.8334C25.0824 22.08 24.8481 22.2723 24.574 22.3858C24.2999 22.4993 23.9983 22.5291 23.7074 22.4712C23.4164 22.4133 23.1491 22.2704 22.9393 22.0607C22.7296 21.8509 22.5867 21.5836 22.5288 21.2926C22.4709 21.0017 22.5007 20.7001 22.6142 20.426C22.7277 20.1519 22.92 19.9176 23.1666 19.7528C23.4133 19.588 23.7033 19.5 24 19.5C24.3978 19.5 24.7794 19.658 25.0607 19.9393C25.342 20.2206 25.5 20.6022 25.5 21ZM16.9688 20.75C16.6452 19.5418 15.8779 18.5 14.82 17.8325C15.3818 17.274 15.7651 16.5614 15.9214 15.7848C16.0777 15.0082 15.9998 14.2027 15.6978 13.4704C15.3957 12.7381 14.8831 12.112 14.2248 11.6714C13.5664 11.2309 12.7921 10.9957 12 10.9957C11.2079 10.9957 10.4336 11.2309 9.77525 11.6714C9.11693 12.112 8.60426 12.7381 8.30221 13.4704C8.00016 14.2027 7.92234 15.0082 8.07861 15.7848C8.23488 16.5614 8.61821 17.274 9.18 17.8325C8.12282 18.5007 7.35575 19.5422 7.03125 20.75C6.96495 21.0069 7.00342 21.2797 7.13821 21.5082C7.27301 21.7368 7.49307 21.9024 7.75 21.9688C8.00693 22.0351 8.27967 21.9966 8.50823 21.8618C8.73679 21.727 8.90245 21.5069 8.96875 21.25C9.29875 19.9688 10.6013 19 12 19C13.3988 19 14.7025 19.9662 15.0312 21.25C15.0976 21.5069 15.2632 21.727 15.4918 21.8618C15.7203 21.9966 15.9931 22.0351 16.25 21.9688C16.5069 21.9024 16.727 21.7368 16.8618 21.5082C16.9966 21.2797 17.0351 21.0069 16.9688 20.75ZM10 15C10 14.6044 10.1173 14.2178 10.3371 13.8889C10.5568 13.56 10.8692 13.3036 11.2346 13.1522C11.6001 13.0009 12.0022 12.9613 12.3902 13.0384C12.7781 13.1156 13.1345 13.3061 13.4142 13.5858C13.6939 13.8655 13.8844 14.2219 13.9616 14.6098C14.0387 14.9978 13.9991 15.3999 13.8478 15.7654C13.6964 16.1308 13.44 16.4432 13.1111 16.6629C12.7822 16.8827 12.3956 17 12 17C11.4696 17 10.9609 16.7893 10.5858 16.4142C10.2107 16.0391 10 15.5304 10 15Z" fill="#666D7C"/>
+</svg>
+</div>
+<div class="np-top-title">
+  <a href="#" onclick="window.history.back();" class="np-back-button" aria-label="Go Back">
+    <i class="far fa-arrow-left np-hidden-mobile np-icon-back"></i>
+  </a>
+  {{ training_event.title }}
+</div>
--- a/External/_training_session_mobile_view.html.liquid
+++ b/External/_training_session_mobile_view.html.liquid
@ -0,0 +1,27 @@
+<div class="np-training-session-view">
+  <div class="np-training-session-view-header">
+    {% include "training_session_header" %}
+  </div>
+
+  <div class="np-card-container np-training-session-view-details np-card-padding np-card-spacing">
+    {% include "training_session_status" %}
+    {% include "training_session_date" %}
+    {% include "training_session_details" %}
+    <div class="np-card-padding-large">
+      {% include "training_session_cta" %}
+    </div>
+    {% include "training_session_description" %}
+  </div>
+
+  {% if training_event.sessions.size > 1 %}
+    <div class="np-card-spacing">
+      <div class="np-training-session-container">
+        <div class="np-training-session-sessions-title">
+          {% t shared.more_sessions %}
+        </div>
+        {% include "training_session_more_sessions" %}
+      </div>
+    </div>
+  {% endif %}
+
+</div>
--- a/External/_training_session_more_sessions.html.liquid
+++ b/External/_training_session_more_sessions.html.liquid
@ -0,0 +1,3 @@
+{% for session in training_event.sessions %}
+  {% include "training_session_tile", current_session: training_session %}
+{% endfor %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,6 @@
+<div class="np-training-session-cta-note np-training-session-tile-badge np-training-session-tile-badge-{{ training_session.status.type }}">
+    {% if training_session.approved? %}
+        <i class="far fa-check np-training-session-icon"></i>
+    {% endif %}
+    {{ training_session.status.label }}
+</div>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,24 @@
+{% if current_session.id != session.id %}
+  <a
+    class="np-training-session-tile"
+    href="{% route training_session, id: session.id %}"
+  >
+    <div class="np-training-session-tile-header">
+        <i class="far fa-calendar-star np-training-session-tile-icon"></i>
+        <div class="np-training-session-tile-badge np-training-session-tile-badge-{{ session.status.type }}">
+            {{ session.status.label }}
+        </div>
+    </div>
+    <div class="np-training-session-tile-content">
+      <div>
+          <div class="np-training-session-tile-date">
+              {{ session.month }} {{ session.day }}, {{ session.year }}
+          </div>
+          <div class="np-training-session-tile-time">
+              {{ session.time_period }} {{ session.time_zone }}
+          </div>
+      </div>
+      <i class="fas fa-arrow-right np-training-session-tile-chevron"></i>
+    </div>
+  </a>
+{% endif %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,15 @@
+{% include "header" %}
+{% include "account_tabs" %}
+
+<main class="np-main np-subpage-container np-account">
+  <div class="np-hidden-desktop">
+    {% include "account_mobile_view", form: form %}
+  </div>
+
+  <div class="np-hidden-mobile np-flex np-flex-center">
+    {% include "account_desktop_view", form: form %}
+  </div>
+</main>
+
+{% include "footer" %}
+
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,59 @@
+<main class="np-box-container np-open-access">
+  <div class="np-box">
+    {% include "header_minimal" %}
+    <div class="np-box-content-container">
+      <form class="np-form np-box-content" action="{{ form.url }}" method="get" novalidate>
+        {% form_authenticity_token %}
+        <div class="np-form-headline">
+          {% t shared.welcome_to_school, school_name: current_school.name %}
+        </div>
+        <div class="np-form-subheadline">
+          {% t .headline, key: current_school.course_vocabulary %}
+        </div>
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_first_name">
+            {% t shared.first_name %}
+          </label>
+          <input
+            class="np-input"
+            autofocus="autofocus"
+            type="text"
+            name="first_name"
+            id="learner_first_name"
+            value="{{ form.first_name }}"
+          />
+        </div>
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_last_name">
+            {% t shared.last_name %}
+          </label>
+          <input
+            class="np-input"
+            type="text"
+            name="last_name"
+            id="learner_last_name"
+            value="{{ form.last_name }}"
+          />
+        </div>
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_email">
+            {% t shared.email_address %}
+          </label>
+          <input
+            class="np-input"
+            type="text"
+            name="email"
+            id="learner_email"
+            value="{{ form.email }}"
+          />
+        </div>
+        <input
+          type="submit"
+          name="commit"
+          value="{% t shared.enter %}"
+          class="np-button np-button-big np-form-action"
+        />
+      </form>
+    </div>
+  </div>
+</main>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,59 @@
+<main class="np-box-container np-open-access">
+  <div class="np-box">
+    {% include "header_minimal" %}
+    <div class="np-box-content-container">
+      <form class="np-form np-box-content" action="{{ form.url }}" method="get" novalidate>
+        {% form_authenticity_token %}
+        <div class="np-form-headline">
+          {% t shared.welcome_to_school, school_name: current_school.name %}
+        </div>
+        <div class="np-form-subheadline">
+          {% t .headline, key: current_school.course_vocabulary %}
+        </div>
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_employee_id">
+            {% t shared.employee_id %}
+          </label>
+          <input
+            class="np-input"
+            autofocus="autofocus"
+            type="text"
+            name="employee_id"
+            id="learner_employee_id"
+            value="{{ form.employee_id }}"
+          />
+        </div>
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_first_name">
+            {% t shared.first_name %}
+          </label>
+          <input
+            class="np-input"
+            type="text"
+            name="first_name"
+            id="learner_first_name"
+            value="{{ form.first_name }}"
+          />
+        </div>
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_last_name">
+            {% t shared.last_name %}
+          </label>
+          <input
+            class="np-input"
+            type="text"
+            name="last_name"
+            id="learner_last_name"
+            value="{{ form.last_name }}"
+          />
+        </div>
+        <input
+          type="submit"
+          name="commit"
+          value="{% t shared.enter %}"
+          class="np-button np-button-big np-form-action"
+        />
+      </form>
+    </div>
+  </div>
+</main>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,40 @@
+<main class="np-box-container np-open-access">
+  <div class="np-box">
+    {% include "header_minimal" %}
+    <div class="np-box-content-container">
+      <form class="np-form np-box-content" action="{{ form.url }}" method="get" novalidate>
+        <div class="np-form-headline"> {% t shared.welcome_to_school, school_name: current_school.name %} </div>
+        <div class="np-form-subheadline"> {% t .headline, key: current_school.course_vocabulary %} </div>
+        {% form_authenticity_token %}
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_last_name">
+            {% t shared.last_name %}
+          </label>
+          <input
+            class="np-input"
+            autofocus="autofocus"
+            type="text"
+            name="last_name"
+            id="learner_last_name"
+            value="{{ form.last_name }}"
+          />
+        </div>
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_phone_number">
+            {% t shared.phone_number %}
+          </label>
+          <input
+            class="np-input"
+            type="text"
+            name="phone_number"
+            id="learner_phone_number"
+            value="{{ form.phone_number }}"
+          />
+        </div>
+        <button type="submit" class="np-button np-button-big np-form-action">
+          {% t shared.enter %}
+        </button>
+      </form>
+    </div>
+  </div>
+</main>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,74 @@
+<main class="np-box-container np-open-access">
+  <div class="np-box">
+    {% include "header_minimal" %}
+    <div class="np-box-content-container">
+      <form class="np-form np-box-content" action="{{ form.url }}" method="get" novalidate>
+        <div class="np-form-headline"> {% t shared.welcome_to_school, school_name: current_school.name %} </div>
+        <div class="np-form-subheadline"> {% t .headline, key: current_school.course_vocabulary %} </div>
+        {% form_authenticity_token %}
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_email">
+            {% t shared.email_address %}
+          </label>
+          <input
+            class="np-input"
+            autofocus="autofocus"
+            type="email"
+            name="email"
+            id="learner_email"
+            value="{{ form.email }}"
+          />
+        </div>
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_first_name">
+            {% t shared.first_name %}
+          </label>
+          <input
+            class="np-input"
+            type="text"
+            name="first_name"
+            id="learner_first_name"
+            value="{{ form.first_name }}"
+          />
+        </div>
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_last_name">
+            {% t shared.last_name %}
+          </label>
+          <input
+            class="np-input"
+            type="text"
+            name="last_name"
+            id="learner_last_name"
+            value="{{ form.last_name }}"
+          />
+        </div>
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_phone_number">
+            {% t shared.phone_number_optional %}
+          </label>
+          <input
+            class="np-input"
+            type="text"
+            name="phone_number"
+            id="learner_phone_number"
+            value="{{ form.phone_number }}"
+          />
+        </div>
+        <div class="np-form-field np-open-access-terms">
+          <input type="hidden" name="terms" value="0" />
+          <input id="terms" type="checkbox" name="terms" value="1" />
+          <label for="terms" class="np-open-access-terms-checkbox">
+            {{ current_school.custom_terms }}
+          </label>
+        </div>
+        <input
+          type="submit"
+          name="commit"
+          value="{% t shared.enter %}"
+          class="np-button np-button-big np-form-action"
+        />
+      </form>
+    </div>
+  </div>
+</main>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,148 @@
+{% include "header" %}
+{% include "course_version_outdated_alert", courses: courses.in_catalog %}
+{% include "main_hero_masthead" %}
+{% include "sub_navigation" %}
+<main class="catalog container-fluid np-max-width">
+  <div class="content-wrapper" style="max-width: 1440px;">
+  <div class="catalog-wrapper row">
+    <div class="catalog-filter col-sm-3 col-12">
+      {%include "catalog_filtter_courses"%}
+    </div>
+
+    <div class="catalog-courses container-fluid col-sm-9 col-12">
+      <div class="page-desc" style="margin-top: 32px;">
+          <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+          <path d="M31.4701 11.1176L16.4701 3.11758C16.3254 3.04054 16.164 3.00024 16.0001 3.00024C15.8361 3.00024 15.6747 3.04054 15.5301 3.11758L0.530054 11.1176C0.370059 11.2028 0.236255 11.33 0.142954 11.4854C0.0496529 11.6409 0.000366211 11.8188 0.000366211 12.0001C0.000366211 12.1814 0.0496529 12.3593 0.142954 12.5147C0.236255 12.6702 0.370059 12.7973 0.530054 12.8826L4.00005 14.7338V20.7863C3.99901 21.2775 4.17979 21.7517 4.50755 22.1176C6.14505 23.9413 9.8138 27.0001 16.0001 27.0001C18.0512 27.017 20.0871 26.6455 22.0001 25.9051V30.0001C22.0001 30.2653 22.1054 30.5196 22.2929 30.7072C22.4805 30.8947 22.7348 31.0001 23.0001 31.0001C23.2653 31.0001 23.5196 30.8947 23.7072 30.7072C23.8947 30.5196 24.0001 30.2653 24.0001 30.0001V24.9388C25.3041 24.1861 26.4824 23.2342 27.4926 22.1176C27.8203 21.7517 28.0011 21.2775 28.0001 20.7863V14.7338L31.4701 12.8826C31.63 12.7973 31.7639 12.6702 31.8572 12.5147C31.9505 12.3593 31.9997 12.1814 31.9997 12.0001C31.9997 11.8188 31.9505 11.6409 31.8572 11.4854C31.7639 11.33 31.63 11.2028 31.4701 11.1176ZM16.0001 25.0001C10.5913 25.0001 7.41005 22.3576 6.00005 20.7863V15.8001L15.5301 20.8826C15.6747 20.9596 15.8361 20.9999 16.0001 20.9999C16.164 20.9999 16.3254 20.9596 16.4701 20.8826L22.0001 17.9338V23.7263C20.4251 24.4613 18.4401 25.0001 16.0001 25.0001ZM26.0001 20.7813C25.4006 21.4465 24.7299 22.0438 24.0001 22.5626V16.8663L26.0001 15.8001V20.7813ZM23.5001 14.8676L23.4726 14.8513L16.4726 11.1176C16.239 10.9983 15.9679 10.9755 15.7178 11.0542C15.4676 11.1328 15.2583 11.3066 15.1351 11.5381C15.0118 11.7695 14.9844 12.0402 15.0587 12.2917C15.1331 12.5431 15.3032 12.7554 15.5326 12.8826L21.3751 16.0001L16.0001 18.8663L3.12505 12.0001L16.0001 5.13383L28.8751 12.0001L23.5001 14.8676Z" fill="#202227"/>
+        </svg>
+          <h4>Discover both foundational and advanced insights into each feature with Courses.</h4>
+      </div>
+          <div class="np-catalog-courses row row-with-thumbnails">
+            {%  assign isCoursesInprogress = false %} 
+            {% assign isProgressHeaderOutput = false %}
+            {% for course in courses.featured %}
+              {%  unless course.has_certificate?  %}             
+                {% if course.progress > 0 and course.progress < 100 %}
+                  {% if isProgressHeaderOutput == false %}
+                    <div class="np-resource-title addWidthMargin">In progress</div>
+                    {% assign isProgressHeaderOutput = true %}
+                  {% endif %}
+                  <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content catalog-content"
+                      data-categories='{% for category in course.categories %}{{ category.id }},{% endfor %}'>
+                        {% include "cards_course" with course %}
+                  </div>
+                  {%  assign isCoursesInprogress = true %} 
+                {% endif %}
+              {% endunless %}   
+            {% endfor %}         
+          </div>
+        {% if isCoursesInprogress == false  %}
+          <div class="np-empty-container">
+          </div>
+        {% endif %}
+        <div class="catalog-courses-container">
+            <div class="np-resource-title" style="margin-top: 40px;">
+             Courses
+          </div>
+          <div class="np-catalog-courses row row-with-thumbnails" style="margin-top: 0;">
+            {% for course in courses.in_catalog %}             
+                {%  unless course.has_certificate?  %}  
+                  {% if course.progress == 0 %}           
+                    <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content catalog-content"
+                    data-categories='{% for category in course.categories %}{{ category.id }},{% endfor %}'>
+                      {% include "cards_course" with course %}
+                    </div> 
+                  {% endif  %}      
+              {% endunless %}                 
+            {% endfor %}
+          </div>
+        </div>
+        <div class="np-homepage-featured np-max-width">
+          <div class="np-catalog-courses row row-with-thumbnails">
+            {%  assign isCoursesCompleted = false %} 
+            {% assign isCourseHeaderOutput = false %}
+            {% for course in courses.featured %}
+              {%  unless course.has_certificate?  %}             
+                {% if course.progress == 100 %}
+                  {% if isCourseHeaderOutput == false %}
+                    <div class="np-resource-title addWidthMargin">Completed courses</div>
+                    {% assign isCourseHeaderOutput = true %}
+                  {% endif %}
+                  <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content catalog-content"
+                      data-categories='{% for category in course.categories %}{{ category.id }},{% endfor %}'>
+                        {% include "cards_course" with course %}
+                  </div>
+                  {%  assign isCoursesCompleted = true %} 
+                {% endif %}
+              {% endunless %}   
+            {% endfor %}         
+          </div>
+        </div>
+    </div>
+  </div>
+  </div>
+</main>
+{% include "footer" %}
+<style>
+  .catalog-filter {
+  align-items: center;
+  display: flex;
+  flex-direction: column;
+}
+.np-homepage-featured-text {
+    align-items: flex-start;
+    display: flex;
+    /* flex-direction: column; */
+    padding: 0px;
+    text-align: left;
+   
+  }
+@media only screen and (max-width: 1030px) {
+  .catalog-filter {
+    width: 100%;
+  }
+  .filter-container {
+    width: 100% !important;
+  }
+  .course-card {
+    width: 100%;
+  }
+}
+</style>
+<script>
+   document.addEventListener('DOMContentLoaded', function() {
+    const allCheckboxes = document.querySelectorAll('.category-filter');
+    const categoryCheckboxes = document.querySelectorAll('.category-filter');
+    
+    const catalogContents = document.querySelectorAll('.catalog-content');
+
+    allCheckboxes.forEach(checkbox => {
+      checkbox.addEventListener('change', applyFilters);
+      
+      //checkbox.checked=true;
+      applyFilters() 
+    });
+
+    function applyFilters() {
+      
+      const selectedCategories = Array.from(categoryCheckboxes)
+        .filter(cb => cb.checked)
+        .map(cb => cb.value);
+
+      catalogContents.forEach(content => {
+        //console.log("catalogContents clicked")
+        const contentCategories = content.getAttribute('data-categories') ? content.getAttribute('data-categories').split(',') : [];
+        
+        // Check if element matches selected categories
+        const categoryMatch = selectedCategories.length === 0 || selectedCategories.some(cat => contentCategories.includes(cat));
+        
+        //console.log(categoryMatch)
+        // Display element only if it matches all selected filters
+        if (categoryMatch ) {
+          content.style.display = 'flex';
+        } else {
+          content.style.display = 'none';
+        }
+      });
+    }
+  });
+</script>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,65 @@
+
+
+{% include "header" %}
+{% include "course_version_outdated_alert", courses: courses.in_catalog %}
+{% include "main_hero_masthead" %}
+{% include "sub_navigation" %}
+<main class="np-main np-catalog np-subpage-container np-max-width">
+  <div class="catalog-courses content-wrapper">
+    <div class="page-desc" style="margin-top: 32px;">
+      <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M16 17C16 17.2652 15.8946 17.5196 15.7071 17.7071C15.5196 17.8946 15.2652 18 15 18H9C8.73478 18 8.48043 17.8946 8.29289 17.7071C8.10536 17.5196 8 17.2652 8 17C8 16.7348 8.10536 16.4804 8.29289 16.2929C8.48043 16.1054 8.73478 16 9 16H15C15.2652 16 15.5196 16.1054 15.7071 16.2929C15.8946 16.4804 16 16.7348 16 17ZM15 12H9C8.73478 12 8.48043 12.1054 8.29289 12.2929C8.10536 12.4804 8 12.7348 8 13C8 13.2652 8.10536 13.5196 8.29289 13.7071C8.48043 13.8946 8.73478 14 9 14H15C15.2652 14 15.5196 13.8946 15.7071 13.7071C15.8946 13.5196 16 13.2652 16 13C16 12.7348 15.8946 12.4804 15.7071 12.2929C15.5196 12.1054 15.2652 12 15 12ZM29 20.1838V28C29.0016 28.1763 28.9565 28.3499 28.8694 28.5032C28.7823 28.6564 28.6562 28.7839 28.5039 28.8728C28.3516 28.9616 28.1786 29.0086 28.0023 29.009C27.826 29.0094 27.6527 28.9632 27.5 28.875L24.5 27.1575L21.5 28.875C21.3473 28.9632 21.174 29.0094 20.9977 29.009C20.8214 29.0086 20.6484 28.9616 20.4961 28.8728C20.3438 28.7839 20.2177 28.6564 20.1306 28.5032C20.0435 28.3499 19.9984 28.1763 20 28V25H5C4.46957 25 3.96086 24.7893 3.58579 24.4142C3.21071 24.0391 3 23.5304 3 23V7C3 6.46957 3.21071 5.96086 3.58579 5.58579C3.96086 5.21071 4.46957 5 5 5H27C27.5304 5 28.0391 5.21071 28.4142 5.58579C28.7893 5.96086 29 6.46957 29 7V10.8162C29.6321 11.4216 30.1352 12.1487 30.4789 12.9536C30.8225 13.7586 30.9997 14.6248 30.9997 15.5C30.9997 16.3752 30.8225 17.2414 30.4789 18.0464C30.1352 18.8513 29.6321 19.5784 29 20.1838ZM20 23V20.1838C18.9103 19.1328 18.2216 17.7344 18.0527 16.2299C17.8839 14.7254 18.2456 13.2091 19.0753 11.9428C19.905 10.6764 21.1507 9.73945 22.5975 9.29348C24.0443 8.84751 25.6013 8.92055 27 9.5V7H5V23H20ZM27 21.5C26.208 21.8309 25.3583 22.0013 24.5 22.0013C23.6417 22.0013 22.792 21.8309 22 21.5V26.2775L24 25.1325C24.1511 25.0461 24.3222 25.0007 24.4963 25.0007C24.6703 25.0007 24.8414 25.0461 24.9925 25.1325L26.9925 26.2775L27 21.5ZM29 15.5C29 14.61 28.7361 13.74 28.2416 12.9999C27.7471 12.2599 27.0443 11.6831 26.2221 11.3425C25.3998 11.0019 24.495 10.9128 23.6221 11.0865C22.7492 11.2601 21.9474 11.6887 21.318 12.318C20.6887 12.9474 20.2601 13.7492 20.0865 14.6221C19.9128 15.495 20.0019 16.3998 20.3425 17.2221C20.6831 18.0443 21.2599 18.7471 21.9999 19.2416C22.74 19.7361 23.61 20 24.5 20C25.0909 20 25.6761 19.8836 26.2221 19.6575C26.768 19.4313 27.2641 19.0998 27.682 18.682C28.0998 18.2641 28.4313 17.768 28.6575 17.2221C28.8836 16.6761 29 16.0909 29 15.5Z" fill="black"/>
+      </svg>
+        <h4>Become a program expert and showcase your skills with Buildertrend Certifications.</h4>
+    </div>
+    <div class="catalog-courses-container">
+    <div class="np-catalog-courses row row-with-thumbnails">
+      {%  assign isCertificateProgressHeader = false %} 
+      {% for course in courses.in_catalog %}
+        {%  if course.has_certificate?  %}             
+          {% if course.progress > 0 and course.progress < 100 %}
+            {% if isCertificateProgressHeader == false %}
+              <div class="np-resource-title addWidthMargin">In progress</div>
+              {% assign isCertificateProgressHeader = true %}
+            {% endif %}
+            <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content catalog-content"
+                data-categories='{% for category in course.categories %}{{ category.id }},{% endfor %}'>
+                  {% include "cards_course" with course %}
+            </div>
+          {% endif %}
+        {% endif %}   
+      {% endfor %}         
+    </div>
+    <div class="np-resource-title" style="margin-top: 40px;">Certifications</div>
+    <div class="np-catalog-courses row row-with-thumbnails" style="margin-top: 0px;">
+      {% for course in courses.in_catalog %}             
+          {%  if course.has_certificate?  %}
+            {% if course.progress == 0 %}        
+          <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content catalog-content"
+          data-categories='{% for category in course.categories %}{{ category.id }},{% endfor %}'>
+            {% include "cards_course" with course %}
+          </div>    
+            {% endif %}  
+        {% endif %}                 
+      {% endfor %}
+    </div>
+    <div class="np-catalog-courses row row-with-thumbnails">
+      {%  assign isCertificateCompletedHeader = false %} 
+      {% for course in courses.in_catalog %}
+        {%  if course.has_certificate?  %}             
+          {% if course.progress == 100 %}
+            {% if isCertificateCompletedHeader == false %}
+              <div class="np-resource-title addWidthMargin">Completed certifications</div>
+              {% assign isCertificateCompletedHeader = true %}
+            {% endif %}
+            <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content catalog-content"
+                data-categories='{% for category in course.categories %}{{ category.id }},{% endfor %}'>
+                  {% include "cards_course" with course %}
+            </div>
+          {% endif %}
+        {% endif %}   
+      {% endfor %}         
+    </div>
+  </div>
+</main>
+{% include "footer" %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,10 @@
+{% include "header" %}
+<main class="np-main np-max-width np-page-container">
+  <div class="np-hidden-mobile" id="course-desktop">
+    {% include "course_desktop_view" %}
+  </div>
+  <div class="np-hidden-desktop" id="course-mobile">
+    {% include "course_mobile_view" %}
+  </div>
+</main>
+{% include "footer" %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,17 @@
+{% include "header" %}
+{% include "course_version_outdated_alert", courses: courses.enrolled %}
+{% include "sub_navigation" %}
+<main class="np-main np-courses np-subpage-container np-max-width">
+  <div class="np-homepage-hero">
+    <div class="np-homepage-hero-content np-container" style="max-width:850px;">
+      <div class="np-homepage-headline np-header-font-color" style="color:white;">
+        {{ homepage.headline }}
+      </div>
+    </div>
+    <div class="np-resource-title">
+      {% t shared.course_vocabulary.plural, key: current_school.course_vocabulary %}
+    </div>
+    <div class="np-resource-subtitle">{% t .headline, key: current_school.course_vocabulary %}</div>
+    {% include "courses_index", class: "col-xs-12 col-sm-6 col-lg-4 np-stretch-content" %}
+</main>
+{% include "footer" %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,28 @@
+{% include "header" %}
+{% include "course_version_outdated_alert", courses: courses.enrolled %}
+{% include "sub_navigation" %}
+<main class="np-main np-dashboard np-subpage-container np-max-width">
+  <div class="row np-flex-center">
+    <div class="col-xs-12 col-sm-8">
+      {% if features.learning_paths? %}
+        <div class="np-dashboard-resources-title">
+          {% t shared.learning_paths %}
+        </div>
+        {% include "learning_paths_index", items: learning_paths.enrolled %}
+      {% endif %}
+      <div class="np-dashboard-resources-title">
+        {% t shared.course_vocabulary.plural, key: current_school.course_vocabulary %}
+      </div>
+      {% include "courses_index", class: "col-xs-12 col-sm-6 np-stretch-content" %}
+    </div>
+    {% if features.training_events? %}
+      <div class="np-grid-spacing col-xs-12 col-sm-4">
+        <div class="np-dashboard-resources-title">
+          {% t .upcoming_events %}
+        </div>
+          {% include "training_events_dashboard" %}
+      </div>
+    {% endif %}
+  </div>
+</main>
+{% include "footer" %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,25 @@
+<main class="np-box-container">
+  <div class="np-box">
+    {% include "header_minimal" %}
+    <div class="np-box-content-container">
+      <form class="np-form np-box-content" action="{% route forgot_password_create %}" method="post" novalidate>
+        {% form_authenticity_token %}
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_email">
+            {% t shared.email_address %}
+          </label>
+          <input
+            autofocus="autofocus"
+            class="np-input"
+            id="learner_email"
+            name="learner[email]"
+            type="email"
+          >
+        </div>
+        <button type="submit" class="np-button np-button-big np-button-large-font np-form-action">
+          {% t .button_label %}
+        </button>
+      </form>
+    </div>
+  </div>
+</main>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,416 @@
+{% include "header" %}
+{% include "course_version_outdated_alert", courses: courses.featured %}
+{% assign strquizCategories = current_person.properties.qiuz_answers | strip %}
+{% assign quizCategories = current_person.properties.qiuz_answers | split: "_" %}
+{% assign coursesToDisplay = ""  %}
+{% assign lpsToDisplay = ""  %}  
+
+{% for course in courses.in_catalog %}
+  {% for cats in course.categories %}
+    {% if cats.name contains "[Quiz]" %}
+      {% assign catname = cats.name  | remove: "[Quiz] " %}    
+      {% for qc in quizCategories %}
+        {% if catname == qc %}
+          {% assign coursesToDisplay = coursesToDisplay | append: course.id | append: ";" %}        
+        {% endif %}
+      {% endfor %}      
+    {% endif %}    
+  {% endfor %}     
+{% endfor %}
+{% assign coursesToDisplayArr = coursesToDisplay | split: ";" %}
+{% assign uniqcoursesToDisplayArr = coursesToDisplayArr | uniq %}
+
+
+
+{% for learningpath in learning_paths.available %}
+  {% for lpcats in learningpath.categories %}
+    {% if lpcats.name contains "[Quiz]" %}
+      {% assign catname = lpcats.name  | remove: "[Quiz] " %}    
+      {% for qc in quizCategories %}
+        {% if catname == qc %}
+          {% assign lpsToDisplay = lpsToDisplay | append: learningpath.id | append: ";" %}        
+        {% endif %}
+      {% endfor %}      
+    {% endif %}    
+  {% endfor %}     
+{% endfor %}
+{% assign lpsToDisplayArr = lpsToDisplay | split: ";" %}
+{% assign uniqlpsToDisplayArr = lpsToDisplayArr | uniq %}
+
+   
+<main class="np-main np-homepage">
+  
+  {% include "main_hero_masthead" %}
+  {% include "sub_navigation" %}
+
+
+  {% if strquizCategories == "" %}
+    <div class="np-homepage-featured np-max-width">
+      <div class="np-homepage-featured-courses row">
+        {% assign isProgressHeaderOutput = false %}
+        {%  assign isCoursesInprogress = false %} 
+        {% for course in courses.in_catalog %}            
+          {% if course.progress > 0 and course.progress < 100 %}
+            {% if isProgressHeaderOutput == false %}
+              <div class="np-resource-title addWidthMargin" style="margin-top: 32px;">Pick up where you left off</div>
+              {% assign isProgressHeaderOutput = true %}
+            {% endif %}
+            <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content">
+              {% include "cards_course" with course %}
+            </div>
+            {%  assign isCoursesInprogress = true %} 
+          {% endif %}
+        {% endfor %}         
+      </div>
+    </div>
+    <section class="np-main np-learning-paths np-subpage-container np-max-width">
+      <div class="np-learning-paths-main">
+        <div class="np-learning-paths-resources"> 
+          {%  assign isLPInprogress = false %}          
+          {% for learning_path in learning_paths.enrolled %}  
+            {% if learning_path.progress > 0 and learning_path.progress < 100 %}  
+              {%  assign isLPInprogress = true %}          
+              <div class="np-learning-paths-resources-container-home">
+                {% include "cards_learning_path" with learning_path %}  
+              </div> 
+            {% endif %}             
+          {% endfor %}
+        </div>
+      </div>
+    </section>  
+    <div class="np-homepage-featured np-max-width">
+      <div class="np-homepage-featured-text">
+        <div class="np-homepage-headline">
+          Start with these courses
+        </div>
+      </div>
+      {% if courses.featured.any? %}
+        <div class="np-homepage-featured-courses row">
+          {% for course in courses.featured %}
+            <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content">
+              {% include "cards_course" with course %}
+            </div>
+          {% endfor %}
+        </div>
+      {% else %}
+        <div class="np-homepage-featured-empty">
+          <div class="np-zero-state-text">
+            {% t .empty, key: current_school.course_vocabulary %}
+          </div>
+          <img
+            class="np-zero-state-courses"
+            alt="{% t .empty, key: current_school.course_vocabulary %}"
+          />
+        </div>
+      {% endif %}
+    </div>    
+    <div class="np-dashboard-resources np-max-width">
+      <div class="np-homepage-featured-text">
+        <div class="np-homepage-headline">
+          Upcoming Virtual Training
+        </div>
+      </div>
+      {% if training_events.available.any? %}
+       
+        <div class="row row-with-thumbnails">
+          {% for training_event in training_events.available limit:3 %}
+          <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content">
+            {% include "cards_training_event" with training_event %}            
+          </div> 
+          {% endfor %}
+        </div>
+      {% else %}
+          {% include "training_events_zero_state" %}
+      {% endif %} 
+    </div> 
+    <section class="np-main np-learning-paths np-subpage-container np-max-width">
+      <div class="np-homepage-featured-text">
+        <div class="np-homepage-headline">
+          Start with this Learning Path
+        </div>
+      </div>
+      <div class="np-learning-paths-main">
+        <div class="np-learning-paths-resources">
+          {% assign startwithlearning_path = learning_paths.available | where: "id", "04575709-6d99-41bb-9014-6e7def46a320" %}
+          {% for learning_path in startwithlearning_path %}          
+            <div class="np-learning-paths-resources-container-home">
+              {% include "cards_learning_path" with learning_path %}  
+            </div>            
+          {% endfor %}
+        </div>
+      </div>
+    </section>
+  {% else %}  
+  <div class="np-homepage-featured np-max-width">
+    <div class="np-homepage-featured-courses row">
+      {% assign isProgressHeaderOutput = false %}
+      {%  assign isCoursesInprogress = false %} 
+      {% for course in courses.in_catalog %}            
+        {% if course.progress > 0 and course.progress < 100 %}
+          {% if isProgressHeaderOutput == false %}
+            <div class="np-resource-title addWidthMargin" style="margin-top: 32px;">Pick up where you left off</div>
+            {% assign isProgressHeaderOutput = true %}
+          {% endif %}
+          <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content">
+            {% include "cards_course" with course %}
+          </div>
+          {%  assign isCoursesInprogress = true %} 
+        {% endif %}
+      {% endfor %}         
+    </div>
+  </div>
+  <section class="np-main np-learning-paths np-subpage-container np-max-width">
+    <div class="np-learning-paths-main">
+      <div class="np-learning-paths-resources"> 
+        {%  assign isLPInprogress = false %}          
+        {% for learning_path in learning_paths.enrolled %}  
+          {% if learning_path.progress > 0 and learning_path.progress < 100 %}  
+            {%  assign isLPInprogress = true %}          
+            <div class="np-learning-paths-resources-container-home">
+              {% include "cards_learning_path" with learning_path %}  
+            </div> 
+          {% endif %}             
+        {% endfor %}
+      </div>
+    </div>
+  </section>  
+    <div class="np-dashboard-resources np-max-width">
+      <div class="np-homepage-featured-text">
+        <div class="np-homepage-headline">
+          Upcoming Virtual Training
+        </div>
+      </div>
+      {% if training_events.available.any? %}       
+        <div class="row row-with-thumbnails">
+          {% for training_event in training_events.available limit:3 %}
+          <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content">
+            {% include "cards_training_event" with training_event %}            
+          </div> 
+          {% endfor %}
+        </div>
+      {% else %}
+          {% include "training_events_zero_state" %}
+      {% endif %} 
+    </div>       
+    <div class="np-homepage-featured np-max-width">
+      <div class="np-resource-title" style="margin-top:40px;">
+          Recommended  Courses for you
+      </div>
+        <div class="np-catalog-courses row row-with-thumbnails" style="margin-top: 0;">
+          {% for courseid in uniqcoursesToDisplayArr limit: 9%}
+            {% assign displayCourses = courses.in_catalog | where: "id", courseid %}
+              {% for course in displayCourses %}            
+              <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content">
+                {% include "cards_course" with course %}
+              </div>            
+              {% endfor %}
+          {% endfor %}
+        </div>
+    </div>     
+    <section class="np-main np-learning-paths np-subpage-container np-max-width">
+      <div class="np-homepage-featured-text">
+        <div class="np-homepage-headline">
+          Recommended Learning Paths for you
+        </div>
+      </div>
+      <div class="np-learning-paths-main">
+        <div class="np-learning-paths-resources">
+          <div class="np-learning-paths-resources">
+            {% for lpsid in uniqlpsToDisplayArr %}
+              {% assign displayLps = learning_paths.available | where: "id", lpsid %}
+              {% for learning_path in displayLps %}          
+                <div class="np-learning-paths-resources-container-home">
+                  {% include "cards_learning_path" with learning_path %}  
+                </div>            
+              {% endfor %}
+            {% endfor %}         
+          </div>
+        </div>
+      </div>      
+    </section>
+  {% endif %}  
+  
+  <div class="popular_topic_wrapper np-max-width">
+    <div class="np-resource-title">
+        Popular Topics
+    </div>
+    <div class="popular-topic-cointainer">
+      <a class="popolar_topic" href="/app/ptestimates">
+        Estimates
+      </a>
+      <a class="popolar_topic" href="/app/ptowner-invoices">
+        Owner Invoices
+      </a>
+      <a class="popolar_topic" href="/app/ptschedule">
+        Schedule
+      </a>
+      <a class="popolar_topic" href="/app/ptdaily-logs">
+        Daily Logs
+      </a>
+    </div>
+  </div>
+</main>
+{% include "footer" %}
+<style>
+.yellow-banner{
+  background-color: #FFE2BE;
+  padding: 24px;
+  text-align: center;
+  font-size: 14px;
+  font-weight: 500;
+}
+.yellow-banner a{
+  color: #202227;
+}
+  .popular-topic-cointainer {
+    display: flex;
+    justify-content: space-between;
+    margin: 0;
+    gap: 32px; 
+  }
+  .popular_topic_wrapper {
+    display: flex;
+    flex-direction: column;
+  }
+
+  .popolar_topic {
+    border: 2px solid #001a43;
+    border-radius: 5px;
+    padding: 10px;
+    width: 100%;
+    text-align: center;
+    font-family: 'GT Walsheim', sans-serif;
+    font-size: 20px;
+    font-weight: 500;
+    cursor: pointer;
+    text-decoration: unset;
+    color: #011a43;
+  }
+
+  .np-subpage-container {
+    padding: 24px 20px 32px 20px;
+  }
+
+  .np-learning-paths-resources-container-home {
+    border-radius: 4px;
+    padding: 0;
+    margin: 0 -12px;
+  }
+  
+  .np-homepage-featured-courses {
+    justify-content: flex-start; 
+    margin: 0 -16px;
+}
+  .np-learning-paths {
+    background: unset;
+  }
+
+
+  .np-homepage-hero {
+    background: #001A43;
+  }
+  .np-homepage-hero-image{
+    flex-grow: 1;
+    flex-basis: 0;
+
+  }
+  .np-homepage-hero-content {
+    flex-basis: 60%;
+    flex-grow: 0;
+    position: relative;
+    text-align: left;
+  }
+  .np-homepage-featured{
+    margin-top: 0;
+  }
+  .np-homepage-featured-text {
+    align-items: flex-start;
+    display: flex;
+    padding: 0px;
+    text-align: left;
+    margin: 0;
+  }
+ 
+.np-homepage-subheadline {
+    font-size: 16px!important;
+    line-height: 24px;
+    margin-top: 12px;
+    color: #FFFFFF;
+    opacity: 1;
+}
+
+.np-homepage-hero .np-homepage-headline {
+    font-family: 'GT Walsheim', sans-serif;
+    font-size: 2.65rem;
+    line-height: 3.35rem;
+    font-weight: 700;
+  }
+
+.np-max-width{
+      max-width: 1148px;
+      padding: 0 24px;
+    }
+.np-homepage-headline{
+      margin: 40px 0;
+  }
+@media screen and (min-width: 768px) {
+    .np-max-width{
+      max-width: 1148px;
+      padding: 0 24px;
+    }  
+    .np-homepage-headline, .np-homepage-featured .np-homepage-headline{
+      font-size: 1.85rem;
+      font-weight: 500;
+      font-family: 'GT Walsheim', sans-serif;
+      line-height: 2.35rem;
+      color: #202227;
+  }
+    
+}
+  /* Media query to stack hero content and image on smaller screens */
+  @media (max-width: 900px) {
+    .np-homepage-hero {
+      display: flex;
+      flex-direction: column;
+      /* Stack elements vertically */
+      align-items: center;
+      /* Center align */
+    }
+
+    .np-homepage-hero-content {
+      width: 100%;
+      /* Take full width */
+      margin-right: 0;
+      /* Reset margin */
+      order: 1;
+      /* Ensure this comes first */
+      margin: auto
+    }
+
+    .np-homepage-hero-image {
+      width: 50% !important;
+      /* Take full width */
+      order: 2;
+      /* Ensure this comes second */
+      height: 300px;
+      /* Keep height or adjust if necessary */
+      background-size: cover;
+      /* Cover to maintain aspect ratio */
+      margin: 0;
+      /* Prevent additional margin */
+
+    }
+  }
+
+  
+</style>
+<script>
+  window.onload = function(){
+    const registered_label = document.querySelectorAll('.success');
+    registered_label.forEach( registered_label => {
+      if (registered_label.textContent.includes('registered')){
+        registered_label.classList.add('success_green');
+      }
+    })
+  };
+  </script> 
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,10 @@
+{% include "header" %}
+<main class="np-main np-max-width np-page-container">
+  <div class="np-hidden-mobile" id="learning-path-desktop">
+    {% include "learning_path_desktop_view" %}
+  </div>
+  <div class="np-hidden-desktop" id="learning-path-mobile">
+    {% include "learning_path_mobile_view" %}
+  </div>
+</main>
+{% include "footer" %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,10 @@
+{% include "header" %}
+<main class="np-main np-max-width np-page-container">
+  <div class="np-hidden-mobile" id="learning-path-desktop">
+    {% include "learning_path_summary_desktop_view" %}
+  </div>
+  <div class="np-hidden-desktop" id="learning-path-mobile">
+    {% include "learning_path_summary_mobile_view" %}
+  </div>
+</main>
+{% include "footer" %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,29 @@
+
+
+{% include "header" %}
+{% include "main_hero_masthead" %}
+{% include "sub_navigation" %}
+<main class="np-main np-learning-paths np-subpage-container np-max-width">
+  <div class="content-wrapper">
+  <div class="page-desc" style="margin-top: 32px;">
+    <svg xmlns="http://www.w3.org/2000/svg" width="28" height="18" viewBox="0 0 28 18" fill="none">
+    <path d="M27.4901 17.875C27.3752 17.9397 27.2488 17.9811 27.1179 17.9968C26.987 18.0125 26.8543 18.0021 26.7275 17.9663C26.6006 17.9306 26.4821 17.8701 26.3787 17.7883C26.2753 17.7066 26.1891 17.6052 26.1251 17.49L17.4151 2H15.0001V3C15.0001 3.26522 14.8947 3.51957 14.7072 3.70711C14.5196 3.89464 14.2653 4 14.0001 4C13.7348 4 13.4805 3.89464 13.2929 3.70711C13.1054 3.51957 13.0001 3.26522 13.0001 3V2H10.5851L1.87505 17.49C1.7451 17.7221 1.52828 17.893 1.27229 17.9652C1.0163 18.0374 0.742117 18.005 0.510053 17.875C0.277988 17.745 0.107054 17.5282 0.0348522 17.2722C-0.0373493 17.0162 -0.00490318 16.7421 0.125053 16.51L8.29005 2H1.00005C0.734836 2 0.480482 1.89464 0.292946 1.70711C0.10541 1.51957 5.28917e-05 1.26522 5.28917e-05 1C5.28917e-05 0.734784 0.10541 0.48043 0.292946 0.292893C0.480482 0.105357 0.734836 0 1.00005 0H27.0001C27.2653 0 27.5196 0.105357 27.7072 0.292893C27.8947 0.48043 28.0001 0.734784 28.0001 1C28.0001 1.26522 27.8947 1.51957 27.7072 1.70711C27.5196 1.89464 27.2653 2 27.0001 2H19.7101L27.8751 16.51C27.9398 16.6248 27.9812 16.7513 27.9969 16.8822C28.0125 17.013 28.0022 17.1457 27.9664 17.2726C27.9306 17.3994 27.8701 17.5179 27.7884 17.6213C27.7066 17.7247 27.6052 17.8109 27.4901 17.875ZM14.0001 7C13.7348 7 13.4805 7.10536 13.2929 7.29289C13.1054 7.48043 13.0001 7.73478 13.0001 8V10C13.0001 10.2652 13.1054 10.5196 13.2929 10.7071C13.4805 10.8946 13.7348 11 14.0001 11C14.2653 11 14.5196 10.8946 14.7072 10.7071C14.8947 10.5196 15.0001 10.2652 15.0001 10V8C15.0001 7.73478 14.8947 7.48043 14.7072 7.29289C14.5196 7.10536 14.2653 7 14.0001 7ZM14.0001 14C13.7348 14 13.4805 14.1054 13.2929 14.2929C13.1054 14.4804 13.0001 14.7348 13.0001 15V17C13.0001 17.2652 13.1054 17.5196 13.2929 17.7071C13.4805 17.8946 13.7348 18 14.0001 18C14.2653 18 14.5196 17.8946 14.7072 17.7071C14.8947 17.5196 15.0001 17.2652 15.0001 17V15C15.0001 14.7348 14.8947 14.4804 14.7072 14.2929C14.5196 14.1054 14.2653 14 14.0001 14Z" fill="black"/>
+    </svg>
+          <h4>Follow our recommended Course roadmap to develop your skills with Learning Paths.</h4>
+      </div>        
+      {% include "learning_paths_index", items: learning_paths.available %}
+   
+  </div>
+</main>
+{% include "footer" %}
+<style>
+  .np-resource-title {
+      font-size: 1.85rem;
+        font-weight: 500;
+        font-family: 'GT Walsheim', sans-serif;
+        line-height: 2.35rem;
+        color: #202227;
+        margin-bottom: 40px;
+    }
+  
+</style>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,53 @@
+<main class="np-main np-box-container">
+  <div class="np-box">
+    {% include "header_minimal" %}
+    <div class="np-box-content-container">
+      <form class="np-form np-box-content" action="{% route login %}" method="post" novalidate>
+        {% form_authenticity_token %}
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_email">
+            {% t shared.email_address %}
+          </label>
+          <input
+            class="np-input"
+            autofocus="autofocus"
+            type="email"
+            name="learner[email]"
+            id="learner_email"
+          >
+        </div>
+        <div class="np-form-field">
+          <label class="np-input-label" for="learner_password">
+            {% t shared.password %}
+          </label>
+          <input
+            class="np-input"
+            type="password"
+            name="learner[password]"
+            id="learner_password"
+          >
+        </div>
+        <button type="submit" class="np-button np-button-big np-button-large-font np-form-action">
+          {% t shared.sign_in %}
+        </button>
+        <a class="np-form-link np-button-color" href="{% route forgot_password_new %}">
+          {% t .forgot_password %}
+        </a>
+        {% if features.account_creation? %}
+          <a class="np-form-link np-button-color" href="{% route sign_up %}">
+            {% t shared.sign_up %}
+          </a>
+        {% endif %}
+        {% if features.request_access? %}
+          <a
+            class="np-form-link np-button-color"
+            target="_blank"
+            href="{{ current_school.request_access_link }}"
+          >
+            {{ current_school.request_access_label }}
+          </a>
+        {% endif %}
+      </form>
+    </div>
+  </div>
+</main>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1 @@
+{% body %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,10 @@
+<main class="np-main np-max-width np-subpage-container">
+  <div class="np-homepage-featured-text">
+    <div class="np-homepage-headline">
+      {% t .header %}
+    </div>
+  </div>
+  <div class="np-homepage-featured-empty">
+    <img src="/images/404.svg">
+  </div>
+</main>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,10 @@
+{% include "header" %}
+{% include "certificates_top_bar" %}
+<main class="np-main np-certificate np-max-width np-page-container clear-main-spacings">
+  <section class="np-certificate-content-spacing">
+    <div class="row">
+      {% include "certificates_preview" %}
+      {% include "certificates_info_column" %}
+    </div>
+  </section>
+</main>
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,28 @@
+{% include "header" %}
+{% include "course_version_outdated_alert", courses: courses.in_catalog %}
+<div class="np-allpage-hero" style="background-color: #001a43;">
+  <div class="np-container">
+    {% if current_person.signed_in? %}
+      {% include "main_hero_masthead" %}
+    {% else %}
+    
+    <div class="np-homepage-headline np-header-font-color" style="font-size: 3rem; color:white;">
+      Welcome back, {{ current_person.first_name }}
+    </div>
+    {% endif %}
+  </div>
+</div>
+{% include "sub_navigation" %}
+<main class="np-main np-catalog np-subpage-container np-max-width">
+  <div class="content-wrapper">
+  <div class="catalog-courses container-fluid">
+    <h2>Daily Logs</h2>
+      <div class="catalog-courses-container">
+    
+            {%include "courses_catalog"%}
+      
+      </div>
+    </div>
+    </div>
+</main>
+{% include "footer" %}
--- a/Custom_Templates/customer_templates/BuilderTrend
+++ b/Custom_Templates/customer_templates/BuilderTrend
@ -0,0 +1,29 @@
+{% include "header" %}
+{% include "course_version_outdated_alert", courses: courses.in_catalog %}
+<div class="np-allpage-hero" style="background-color: #001a43;">
+  <div class="np-container">
+    {% if current_person.signed_in? %}
+      {% include "main_hero_masthead" %}
+    {% else %}
+    
+    <div class="np-homepage-headline np-header-font-color" style="font-size: 3rem; color:white;">
+      Welcome back, {{ current_person.first_name }}
+    </div>
+    {% endif %}
+  </div>
+</div>
+{% include "sub_navigation" %}
+<main class="np-main np-catalog np-subpage-container np-max-width">
+  <div class="content-wrapper">
+  <div class="catalog-courses container-fluid">
+      <h2>Estimates</h2>
+      <div class="catalog-courses-container">
+    
+             {%include "courses_catalog" %} 
+      
+      </div>
+    </div>
+    </div>
+</main>
+
+{% include "footer" %}
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Norm Rasmussen	35a88af12d	back in the saddle. todos.	2025-01-02 16:58:31 -05:00
Norm Rasmussen	b927321d9a	Turns out that my last week of git pushes for github weren't working. My work account was the active GH account and my gitea account was getting the updates as expected. Good to know that with multiple git remotes, if there's no repo, there are also no warnings.	2024-12-30 11:55:40 -05:00
Norm Rasmussen	60a55e60ae	Backed up Walmart Supplier's templates. Downloaded BuilderTrend's as well as they have just been assigned to me.	2024-12-20 13:32:45 -05:00
Norm Rasmussen	c1d4234407	Api keys, course scripts for Spark. Todos.	2024-12-19 15:57:45 -05:00
Norm Rasmussen	123676993a	Anthology redirect	2024-12-18 15:41:44 -05:00