From 233d1843dc0c8e75bba70aa283ca5488da61e7ea Mon Sep 17 00:00:00 2001
From: Norm Rasmussen <norman.rasmussen@me.com>
Date: Fri, 10 Mar 2023 18:00:40 -0500
Subject: [PATCH] Artera notes. A few scripting things. Downloaded templates.

---
 Custom_Templates/customer_templates/.DS_Store |  Bin 12292 -> 14340 bytes
 .../Artera_sandbox/.DS_Store                  |  Bin 0 -> 6148 bytes
 .../_my_courses_filter.html.liquid            |   64 +-
 .../Artera_sandbox/dashboard.html.liquid      |    7 +-
 .../Artera_sandbox/homepage.html.liquid       |   15 +-
 .../_cards_course.html.liquid                 |    0
 .../_cards_featured_course.html.liquid        |    0
 .../_course_details.html.liquid               |    0
 .../_footer.html.liquid                       |    0
 .../_head.html.liquid                         |    0
 .../_header.html.liquid                       |    0
 .../_section_faqs.html.liquid                 |    0
 .../_section_instructors.html.liquid          |    0
 .../_section_popular_topics.html.liquid       |    0
 .../_section_professionals.html.liquid        |    0
 .../_sub_navigation.html.liquid               |    0
 .../catalog.html.liquid                       |    0
 .../community.html.liquid                     |    0
 .../homepage.html.liquid                      |    0
 .../styles.css.liquid                         |    0
 .../training_events.html.liquid               |    0
 .../videos.html.liquid                        |    0
 .../Norm_sandbox_2/_cards_course.html.liquid  |   49 +
 .../_cards_featured_course.html.liquid        |   44 +
 .../_course_details.html.liquid               |    0
 .../Norm_sandbox_2/_footer.html.liquid        |   80 +
 .../Norm_sandbox_2/_head.html.liquid          |   11 +
 .../Norm_sandbox_2/_header.html.liquid        |  183 ++
 .../Norm_sandbox_2/_section_faqs.html.liquid  |  109 +
 .../_section_instructors.html.liquid          |   91 +
 .../_section_popular_topics.html.liquid       |   15 +
 .../_section_professionals.html.liquid        |  118 ++
 .../_sub_navigation.html.liquid               |   44 +
 .../Norm_sandbox_2/catalog.html.liquid        |   39 +
 .../Norm_sandbox_2/community.html.liquid      |   32 +
 .../Norm_sandbox_2/styles.css.liquid          | 1781 +++++++++++++++++
 .../training_events.html.liquid               |   39 +
 .../Norm_sandbox_2/videos.html.liquid         |  117 ++
 38 files changed, 2816 insertions(+), 22 deletions(-)
 create mode 100644 Custom_Templates/customer_templates/Artera_sandbox/.DS_Store
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/_cards_course.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/_cards_featured_course.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/_course_details.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/_footer.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/_head.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/_header.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/_section_faqs.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/_section_instructors.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/_section_popular_topics.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/_section_professionals.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/_sub_navigation.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/catalog.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/community.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/homepage.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/styles.css.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/training_events.html.liquid (100%)
 rename Custom_Templates/customer_templates/{Academy Climbing => Norm_sandbox_1}/videos.html.liquid (100%)
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/_cards_course.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/_cards_featured_course.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/_course_details.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/_footer.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/_head.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/_header.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/_section_faqs.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/_section_instructors.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/_section_popular_topics.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/_section_professionals.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/_sub_navigation.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/catalog.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/community.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/styles.css.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/training_events.html.liquid
 create mode 100644 Custom_Templates/customer_templates/Norm_sandbox_2/videos.html.liquid

diff --git a/Custom_Templates/customer_templates/.DS_Store b/Custom_Templates/customer_templates/.DS_Store
index 3e5d497bab0025b886192cbf010052b641d480b6..b2db0324f4f3b0faf4620e9ae32d3bc67da28762 100644
GIT binary patch
delta 592
zcmZokXem%&U|?W$DortDU@!nOIe-{M3-ADmb_NCoo{0+jqBTGcGf<F$p@<=yA(f$o
zp_n0g;zi}j20ARPj6g}2$>#*@CaWo$ZM?|LzL}kag@Z9*vVow;W(7firg}aGKZbmu
z)?9{opvFXoJcbm8B%nwIkZ+iiZWx@LpIZPl1qSe{&&_vnNy^Dj0xIT+v~yZt7kI=G
z$i}0mp209TKZQh142A_6Bst6or$_3s``ifGC+Y=e`=8z=<P!#<9)w4T)w4N9Se}Pb
zd-D?oUiOI-^(OlYXiv5hm@?T*Ty66l@!RZ@tdM{=;0DsJ$Z@~%;(O-F{5raf43iyo
a<awAN>B9n~d~%M?#LX8~6_^kvP67a01AS!x

delta 409
zcmZoEXh~3DU|?W$DortDV9)?EIe-{M3-ADmHU<U-?uiQeq7^_6Gf<F$A)O(Up_oB|
z!I>d-vLK`KWCIfxRz{#K%j6z4naLqa!mL0JgTQ7%#&2ws6&QUtvvaU;F#1fKpf|Zl
zeahq`>UtCR2~0K+5ZSCC;Lo)Azc3FEP}zifZICVoM}}mEM1~ZGREAuJO0X?CK>KnT
zl7M6$LwZiSVQ_MOZUM*&C?KdOH{Zo2DJMS(sGcLz&S`yJ;1Ne48%>`Ore%{q2#G7B
zDZ^A%kTF?KL2k2*!e6$@jS^y#VDAHikQ-=+E6^HvFaks5J@aIK6J2m{9hhuuBG1DJ
W32z1<Z7?~*Wa4I3l`l*{V}t>nolo2V

diff --git a/Custom_Templates/customer_templates/Artera_sandbox/.DS_Store b/Custom_Templates/customer_templates/Artera_sandbox/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..5008ddfcf53c02e82d7eee2e57c38e5672ef89f6
GIT binary patch
literal 6148
zcmeH~Jr2S!425mzP>H1@V-^m;4Wg<&0T*E43hX&L&p$$qDprKhvt+--jT7}7np#A3
zem<@ulZcFPQ@L2!n>{z**<q8>++&mCkOWA81W14cNZ<zv;LbK1Poaz?KmsK2CSc!(
z0ynLxE!0092;Krf2c+FF_Fe*7ECH>lEfg7;MkzE(HCqgga^y>{tEnwC%0;vJ&^%eQ
zLs35+`xjp>T0<F0fCPF1$Cyrb|F7^5{eNG?83~ZUUlGt@xh*qZDeu<Z%US-OSsOPv
j)R!Z4KLME7ReXlK;d!wEw5GODWMKRea10D2@KpjYNUI8I

literal 0
HcmV?d00001

diff --git a/Custom_Templates/customer_templates/Artera_sandbox/_my_courses_filter.html.liquid b/Custom_Templates/customer_templates/Artera_sandbox/_my_courses_filter.html.liquid
index 63c14480..6d3ba4bd 100644
--- a/Custom_Templates/customer_templates/Artera_sandbox/_my_courses_filter.html.liquid
+++ b/Custom_Templates/customer_templates/Artera_sandbox/_my_courses_filter.html.liquid
@@ -1,10 +1,14 @@
 <div class="my-courses-filters" style="display: none;">
   <div class="progress-filter-dropdown-container">
-    <button class="progress-filter-dropdown np-button">All Courses</button>
+    <button class="progress-filter-dropdown np-button">
+      <span style="margin-right: 10px">
+        Not Started
+      </span>
+      <i class="fas fa-angle-down"></i>
+    </button>
     <div class="progress-filter-dropdown-content">
-      <span class="progress-filter-item" id="all-courses" style="display: none;">All Courses</span>
-      <span class="progress-filter-item" id="not-started">Not Started</span>
       <span class="progress-filter-item" id="in-progress">In Progress</span>
+      <span class="progress-filter-item" id="not-started" style="display: none">Not Started</span>
       <span class="progress-filter-item" id="completed">Completed</span>
     </div>
   </div>
@@ -12,6 +16,9 @@
 
 <script>
   window.addEventListener('DOMContentLoaded', (event) => {
+    setDefaultFilter('.learning-paths-container', 'not-started')
+    setDefaultFilter('.courses-container', 'not-started')
+  
     document.querySelectorAll('.progress-filter-item').forEach((item) => {
       item.addEventListener('click', (clickEvent) => {
         changeFilterButtonName(clickEvent.target);
@@ -20,16 +27,32 @@
         filter(clickEvent.target);
       })
     })
+
+    document.querySelector('.progress-filter-dropdown').addEventListener('click', showDropdown)
+
+    window.addEventListener("click", hideDropdown);
   });
+
+  function hideDropdown(event) {
+    if (!event.target.matches('.progress-filter-dropdown')) {
+      var dropdowns = document.getElementsByClassName("progress-filter-dropdown-content");
+      var i;
+      for (i = 0; i < dropdowns.length; i++) {
+        var openDropdown = dropdowns[i];
+        if (openDropdown.classList.contains('progress-filter-dropdown-content-show')) {
+          openDropdown.classList.remove('progress-filter-dropdown-content-show');
+        }
+      }
+    }
+  }
+
+  function showDropdown() {
+    document.querySelector('.progress-filter-dropdown-content').classList.add('progress-filter-dropdown-content-show')
+  }
   
   function filter(filterOption) {
-    if (filterOption.id !== "all-courses" ) {
-      filterItems('.learning-paths-container', filterOption)
-      filterItems('.courses-container', filterOption)
-    } else {
-      showAllItems('.learning-paths-container')
-      showAllItems('.courses-container')
-    }
+    filterItems('.learning-paths-container', filterOption)
+    filterItems('.courses-container', filterOption)
   }
 
   function filterItems(itemsClass, filterOption) {
@@ -41,6 +64,15 @@
     })
   }
 
+  function setDefaultFilter(itemsClass, filterOption) {
+    document.querySelectorAll(itemsClass).forEach((item) => {
+      if (!item.id.includes(filterOption))
+        item.style.display = "none";
+      else
+        item.style.removeProperty('display');
+    })
+  }
+
   function showAllItems(itemsClass) {
     document.querySelectorAll(itemsClass).forEach((item) => {
       item.style.removeProperty('display');
@@ -58,7 +90,7 @@
   }
 
   function changeFilterButtonName(newName) {
-    document.querySelector(".progress-filter-dropdown").innerHTML = newName.innerHTML;
+    document.querySelector(".progress-filter-dropdown span").innerHTML = newName.innerHTML;
   }
 </script>
 
@@ -83,7 +115,6 @@
     display: inline-block;
   }
 
-  /* Dropdown Content (Hidden by Default) */
   .progress-filter-dropdown-content {
     display: none;
     position: absolute;
@@ -93,7 +124,6 @@
     z-index: 1;
   }
 
-  /* Links inside the dropdown */
   .progress-filter-item {
     color: black;
     padding: 12px 16px;
@@ -102,11 +132,13 @@
     cursor: pointer;
   }
 
-  /* Change color of dropdown links on hover */
+  .progress-filter-dropdown * {
+    pointer-events: none;
+  }
+
   .progress-filter-item:hover {background-color: #f1f1f1}
 
-  /* Show the dropdown menu on hover */
-  .progress-filter-dropdown-container:hover .progress-filter-dropdown-content {
+  .progress-filter-dropdown-content-show {
     display: block;
   }
 
diff --git a/Custom_Templates/customer_templates/Artera_sandbox/dashboard.html.liquid b/Custom_Templates/customer_templates/Artera_sandbox/dashboard.html.liquid
index 01ae374d..42c2692f 100644
--- a/Custom_Templates/customer_templates/Artera_sandbox/dashboard.html.liquid
+++ b/Custom_Templates/customer_templates/Artera_sandbox/dashboard.html.liquid
@@ -1,7 +1,8 @@
 {% include "header" %}
 {% include "course_version_outdated_alert", courses: courses.enrolled %}
 {% include "sub_navigation" %}
-
+{% assign courses_classes = "" %}
+{% if features.training_events? %}
   {% assign courses_classes = "col-xs-12 col-sm-6 np-stretch-content" %}
 {% else %}
   {% assign courses_classes = "col-xs-12 col-sm-4 np-stretch-content" %}
@@ -17,7 +18,7 @@
           </div>
           {% include "in_progress_learning_paths_index", items: learning_paths.enrolled %}
         </div>
-
+        
         <div class="learning-paths-container" id="not-started-learning-paths">
           <div class="np-dashboard-resources-title">
             Enrolled Learning Paths
@@ -87,4 +88,4 @@
         margin: 20px 0 20px;
     }
   }
-</style>
+</style>
\ No newline at end of file
diff --git a/Custom_Templates/customer_templates/Artera_sandbox/homepage.html.liquid b/Custom_Templates/customer_templates/Artera_sandbox/homepage.html.liquid
index 82305e11..dfaced88 100644
--- a/Custom_Templates/customer_templates/Artera_sandbox/homepage.html.liquid
+++ b/Custom_Templates/customer_templates/Artera_sandbox/homepage.html.liquid
@@ -52,6 +52,7 @@
 {% include "footer" %}
 
 <style>
+/*
   .np-homepage-hero-content {
     position: static;
     text-align: left;
@@ -70,7 +71,7 @@
     max-width: 50%;
     height: auto;
     max-height: max-content;
-  }
+  }*/
 
   .np-stretch-content:nth-child(n+2) {
     margin-top: 24px;
@@ -80,10 +81,14 @@
     margin: 0;
   }
 
-.tns-outer {
+  .tns-outer {
     position: relative;
   }
 
+  #tns1-mw {
+    min-height: 500px;
+  }
+
   .tns-controls {
     position: absolute;
     z-index: 100;
@@ -127,6 +132,10 @@
   }
 
   @media (min-width: 768px) {
+    .course-card {
+      height: 29rem;
+    }
+
     .np-homepage-hero-cta.np-button {
       border-radius: 30px;
       padding: 32px;
@@ -168,4 +177,4 @@
       }
     }
   });
-</script>
\ No newline at end of file
+</script>
diff --git a/Custom_Templates/customer_templates/Academy Climbing/_cards_course.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/_cards_course.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/_cards_course.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/_cards_course.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/_cards_featured_course.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/_cards_featured_course.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/_cards_featured_course.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/_cards_featured_course.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/_course_details.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/_course_details.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/_course_details.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/_course_details.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/_footer.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/_footer.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/_footer.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/_footer.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/_head.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/_head.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/_head.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/_head.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/_header.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/_header.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/_header.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/_header.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/_section_faqs.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/_section_faqs.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/_section_faqs.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/_section_faqs.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/_section_instructors.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/_section_instructors.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/_section_instructors.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/_section_instructors.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/_section_popular_topics.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/_section_popular_topics.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/_section_popular_topics.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/_section_popular_topics.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/_section_professionals.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/_section_professionals.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/_section_professionals.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/_section_professionals.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/_sub_navigation.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/_sub_navigation.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/_sub_navigation.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/_sub_navigation.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/catalog.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/catalog.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/catalog.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/catalog.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/community.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/community.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/community.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/community.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/homepage.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/homepage.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/homepage.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/homepage.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/styles.css.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/styles.css.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/styles.css.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/styles.css.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/training_events.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/training_events.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/training_events.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/training_events.html.liquid
diff --git a/Custom_Templates/customer_templates/Academy Climbing/videos.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_1/videos.html.liquid
similarity index 100%
rename from Custom_Templates/customer_templates/Academy Climbing/videos.html.liquid
rename to Custom_Templates/customer_templates/Norm_sandbox_1/videos.html.liquid
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_cards_course.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_cards_course.html.liquid
new file mode 100644
index 00000000..4a3248de
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_cards_course.html.liquid
@@ -0,0 +1,49 @@
+<a class="np-card" href="{% route course_enrollment, code: course.enrollment_code %}">
+  <div class="np-card-container">
+    {% if course.ribbon %}
+      <div class="np-card-ribbon">
+        {{ course.ribbon }}
+      </div>
+    {% endif %}
+      <video class='left-video' autoplay muted loop>
+                  <source src="{{course.promo_video_embed_url}}" type="video/mp4" alt="{{ course.name }}">
+              </video>
+    <div class="np-card-content-bottom">
+      <h3 class="np-card-content-title np-color-white">
+        {{ course.name }}
+      </h3>
+      <div class='np-card-content-description'>
+        {{ course.full_description }}
+      </div>
+    
+      <div class="np-card-content-progress np-button-color">
+        {% t shared.progress, count: course.progress %}
+      </div> 
+      <div class="np-card-content-category">
+        {{course.categories.first.name}}
+      </div>
+    </div>
+  </div>
+</a>
+<style>
+  .np-card {
+    text-decoration: none;
+    color: white;
+  }
+  .np-card-content-category {
+    border-top: 1px solid lightgray;
+    padding: 10px;
+  }
+  .np-card-content-description {
+    display: block;
+    color: lightgray;
+  }
+  .np-card-content-bottom {
+    padding: 15px;
+  }
+  .np-button-color {
+    color: lightslategray;
+    font-size: 15px;
+    padding-bottom: 10px;
+  }
+</style>
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_cards_featured_course.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_cards_featured_course.html.liquid
new file mode 100644
index 00000000..70cba72e
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_cards_featured_course.html.liquid
@@ -0,0 +1,44 @@
+<div class="np-card np-no-horizontal-padding">
+  <div class="np-card-container">
+    <div class="np-learning-path np-featured-course">
+      <div class="np-featured-course-img-container" style="overflow: hidden">
+          <video class='featured-video' autoplay muted loop style="margin-left: -60px;">
+            <source id="featured_video" src="{{course.promo_video_embed_url}}" type="video/mp4" alt="{{ course.name }}" />
+          </video>
+          <div class="np-card-image-content-top">           
+          </div>
+      </div>
+      <div class="np-card-text-wrapper">
+        <div class="np-card-content np-card-padding np-card-content-vertical">
+          <h3 class="np-card-content-title">
+            {{ course.name }}
+          </h3>
+          <div class="np-card-content-description">
+            {{ course.full_description }}
+          </div>
+
+          <div class="np-card-content-footer" style='display: flex; flex-direction: row; justify-content: space-between;'>
+            <a
+              class="np-top-button np-button-font-color np-button" href="{% route course_enrollment, code: course.enrollment_code %}"          
+              >
+                {% if course.enrolled? == false %}
+                  {% t shared.enroll %}
+                {% elsif course.started? == false %}
+                  {% t shared.start, key: current_school.course_vocabulary %}
+                {% elsif course.completed? %}
+                  {% t shared.course.view, key: current_school.course_vocabulary %}
+                {% else %}
+                  {% t shared.continue %}
+                {% endif %}
+            </a>
+            <div class="np-card-image-content-bottom" style="position: unset;">
+              <div class="np-card-content-progress np-button-color">
+              {% t shared.progress, count: course.progress %}
+              </div> 
+          </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_course_details.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_course_details.html.liquid
new file mode 100644
index 00000000..e69de29b
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_footer.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_footer.html.liquid
new file mode 100644
index 00000000..79a0481d
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_footer.html.liquid
@@ -0,0 +1,80 @@
+<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">
+          {% for website_navigation in navigations.footer_navigations %}
+            {% if website_navigation.external? %}
+              <li class="np-footer-navigation-item">
+                <a
+                  class="np-footer-navigation-link np-button-color"
+                  href="{{ website_navigation.path }}"
+                  {% if website_navigation.external? %} target="_blank" {% endif %}
+                >
+                  {{ website_navigation.name }}
+                </a>
+              </li>
+            {% endif %}
+          {% endfor %}
+        </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">
+      {% if website_footer.show_social_media_links? %}
+        <ul class="np-footer-social-links-list">
+          {% for social_media_link in website_footer.social_media_links %}
+            <li class="np-footer-social-links-item">
+              <a
+                class="np-footer-social-links-link np-button-color"
+                href="{{ social_media_link.link }}"
+                target="_blank" title="{{ social_media_link.name }}"
+              >
+                <i class="np-footer-social-links-icon
+                  np-button-color
+                  fab fa-{{ social_media_link.name }}"
+                ></i>
+              </a>
+            </li>
+          {% endfor %}
+        </ul>
+      {% endif %}
+    </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 np-fc-white np-opacity-50">
+          {% t .need_help %}
+        </div>
+        <div class="np-footer-support-item np-footer-support-email np-fc-white np-opacity-50">
+          {% t .email %}
+        </div>
+        <a
+          class="np-footer-support-item np-footer-support-link np-button-color"
+          href="mailto:{{ website_footer.school_customer_service_email }}"
+        >
+          support@menlosecurity.com
+        </a>
+      </div>
+    {% endif %}
+  </div>
+</footer>
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_head.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_head.html.liquid
new file mode 100644
index 00000000..bde9ff3c
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_head.html.liquid
@@ -0,0 +1,11 @@
+{% styles default %}
+{% styles colors %}
+{% styles custom %}
+
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@200;300;400;500&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css" integrity="sha512-wR4oNhLBHf7smjy0K4oqzdWumd+r5/+6QO/vDda76MW5iug4PT7v86FoEkySIJft3XA0Ae6axhIvHrqwm793Nw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js" type="text/javascript"></script>
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_header.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_header.html.liquid
new file mode 100644
index 00000000..56b76c56
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_header.html.liquid
@@ -0,0 +1,183 @@
+<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">
+        <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
+        >
+          <img
+            alt="{{ current_person.name }}"
+            class="np-header-avatar-image"
+            src="{{ current_person.avatar_url }}"
+          >
+        </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">
+            <a class="np-header-avatar-tooltip-navigation-link" onclick="buildURL(window.location.pathname)" style="cursor:pointer">
+              Default
+            </a>
+          {% unless current_school.sso_active? %}
+            <a
+              class="np-header-avatar-tooltip-navigation-link"
+              href="{% route account %}"
+            >
+              {% t .profile_settings %}
+            </a>
+          {% endunless %}
+            <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"
+        href="{% route login %}"
+      >
+        {% t shared.sign_in %}
+      </div>
+    {% 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 %}
+      <a
+        class="np-header-mobile-menu-content-button np-danger"
+        href="{% route logout %}"
+      >
+        {% t .sign_out %}
+      </a>
+    </div>
+  </div>
+</div>
+
+{% include "messages" %}
+
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_section_faqs.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_faqs.html.liquid
new file mode 100644
index 00000000..7e6d46fc
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_faqs.html.liquid
@@ -0,0 +1,109 @@
+ <div class="np-homepage-featured np-faq np-max-width">
+    <div class="np-homepage-featured-text">
+      <div class="np-homepage-headline">
+        Frequently Asked Questions
+      </div>
+    </div>
+    <div class="row np-faqs">
+        <div class="col-md-6">
+            <div class="np-accordion">
+                <div class="accordion-btn">
+                    <i class="fal fa-plus"></i>
+                    <div class="accordion-title"><strong>Q:</strong> I'm not in shape. Can I still go to a climbing gym?</div>
+                </div>
+                <div class="accordion-panel">
+                    <div class="accordion-panel-content">
+                        <p><strong>A:</strong> Absolutely. Climbing is a wonderful full-body and full-mind workout. If you're looking to get in shapre but tired of pumping iron, climbing is a fantastic option.</p>
+                    </div>
+                </div>
+            </div>
+            <div class="np-accordion">
+                <div class="accordion-btn">
+                    <i class="fal fa-plus"></i>
+                    <div class="accordion-title"><strong>Q:</strong> I'm scared of heights. Should I try climbing?</div>
+                </div>
+                <div class="accordion-panel">
+                    <div class="accordion-panel-content">
+                        <p><strong>A:</strong> Many climbers have a fear of heights! However, it goes away when you use your own strength and technique to get to the top of a wall. Start small by climbing in a gym first.</p>
+                    </div> 
+                </div>
+            </div>
+            <div class="np-accordion">
+                <div class="accordion-btn">
+                    <i class="fal fa-plus"></i>
+                    <div class="accordion-title"><strong>Q:</strong> Should I hire someone to belay me at a gym?</div>
+                </div>
+                <div class="accordion-panel">
+                    <div class="accordion-panel-content">
+                        <p><strong>A:</strong> You absolutely can as a quick introduction. However, what would be even better is to grab a friend and take a belay class at your local gym.</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="col-md-6">
+            <div class="np-accordion">
+                <div class="accordion-btn">
+                    <i class="fal fa-plus"></i>
+                    <div class="accordion-title"><strong>Q:</strong> What is bouldering?</div>
+                </div>
+                <div class="accordion-panel">
+                    <div class="accordion-panel-content">
+                        <p><strong>A:</strong> Great question! Bouldering is a form of climbing, done on shorter walls. You use a crash pad under your climb to cushion your fall. Be warned, bouldering is much more powerful and has a steeper learning curve.</p>
+                    </div>
+                </div>
+            </div>
+            <div class="np-accordion">
+                <div class="accordion-btn">
+                    <i class="fal fa-plus"></i>
+                    <div class="accordion-title"><strong>Q:</strong> What are those people with all that gear hanging from their harness doing?</div>
+                </div>
+                <div class="accordion-panel">
+                    <div class="accordion-panel-content">
+                        <p><strong>A:</strong> Chances are you saw a trad climber! Short for traditional climbing, that gear serves as removable protection. When the climbing pair is done with the climb, nothing is left on the rock.</p>
+                    </div> 
+                </div>
+            </div>
+            <div class="np-accordion">
+                <div class="accordion-btn">
+                    <i class="fal fa-plus"></i>
+                    <div class="accordion-title"><strong>Q:</strong> None of my friends are interested in climbing. How can I find partners?</div>
+                </div>
+                <div class="accordion-panel">
+                    <div class="accordion-panel-content">
+                        <p><strong>A:</strong>The best way to meet people is to join a gym a start climbing! Climbers are social and you'll start meeting people. You can also use online resources like Mountain Project's Partner Finder.</p>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    
+</div>
+/
+<style>
+    .fa-plus {
+        background-image: unset;
+        background: #0297FA;
+    }
+    .fa-minus {
+        background-image: unset;
+        background: #0297FA;    }
+</style>
+
+<script>
+    let accordions = document.getElementsByClassName("accordion-btn");
+
+    for (let i = 0; i < accordions.length; i++) {
+        accordions[i].addEventListener("click", function() {
+            this.querySelector('.fal').classList.toggle("fa-plus");
+            this.querySelector('.fal').classList.toggle("fa-minus");
+
+            let panel = this.nextElementSibling;
+            panel.classList.toggle("panel-open");
+            if (panel.style.maxHeight) {
+                panel.style.maxHeight = null;
+            } else {
+                panel.style.maxHeight = panel.scrollHeight + "px";
+            }
+        });
+    }
+</script>
\ No newline at end of file
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_section_instructors.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_instructors.html.liquid
new file mode 100644
index 00000000..c196253d
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_instructors.html.liquid
@@ -0,0 +1,91 @@
+<div class="np-homepage-featured np-homepage-featured-items np-max-width">
+    <div class="np-homepage-featured-text">
+    <div class="np-homepage-headline">
+    Recommended Gear
+    </div>
+</div>
+
+<div class="featured-photography-carousel np-carousel np-carousel-bg-blue" id="featured-photography-carousel">
+    <div class="np-carousel-card">
+        <div>
+            <img src=https://5prq858zcb-flywheel.netdna-ssl.com/wp-content/uploads/2016/12/50823_4WhiteBG-1-600x625.png" alt="Featured Photography" class='customer-carousel-image'/>
+        <div class="slide-label">Misty Mountain Cadillav Harness</div>
+    </div>
+    
+    </div>
+    <div class="np-carousel-card">
+    <div>
+            <img src="https://outdoorgearlab-mvnab3pwrvp3t0.stackpathdns.com/photos/18/97/311203_1848_XXXL.jpg" alt="Featured Photography" class='customer-carousel-image'/>
+        <div class="slide-label">Gri-Gri Belay Device</div>
+    </div>
+    
+    </div>
+    <div class="np-carousel-card">
+        <div>
+            <img src="https://lcdn.sportiva.com/pub/media/catalog/product/8/0/800_yellow_katanalace_1_7_4.jpg" alt="Featured Photography" class='customer-carousel-image'/>
+            <div class="slide-label">La Sportiva Katana Lace Shoes</div>
+        </div>       
+    </div>
+    <div class="np-carousel-card">
+    <div>
+            <img src="https://s3.amazonaws.com/static.northpass.com/demos/hsbc-old-logo.png" alt="Featured Photography" class='customer-carousel-image'/>
+        <div class="slide-label">Metolious Helmet</div>
+    </div>
+
+    </div>
+    <div class="np-carousel-card">
+    <div>
+            <img src="https://s3.amazonaws.com/static.northpass.com/demos/sandia-labs-logo.jpg" alt="Featured Photography" class='customer-carousel-image'/>
+        <div class="slide-label">Unknown</div>
+    </div>
+    
+        </div>
+    </div>
+</div>
+
+<script>
+    $(document).ready(function(){
+
+        $("#featured-photography-carousel").slick({
+            slidesToShow: 3.5,
+            prevArrow: '<i class="fal fa-chevron-left"></i>',
+            nextArrow: '<i class="fal fa-chevron-right"></i>',
+            infinite: false,
+            responsive: [
+                {
+                    breakpoint: 1350,
+                    settings: {
+                        slidesToShow: 2.3,
+                    }
+                },
+                {
+                    breakpoint: 1024,
+                    settings: {
+                        slidesToShow: 2,
+                    }
+                },
+                {
+                    breakpoint: 768,
+                    settings: {
+                        slidesToShow: 1,
+                    }
+                }
+            ]
+        });
+    });
+	
+</script>
+
+<style>
+.featured-photography-carousel .fa-chevron-right::before {
+    right: -6px !important;
+}
+.customer-carousel-image {
+    width: 292px;
+    height: 292px;
+    object-fit: contain;
+}
+.featured-photography-carousel .slick-initialized .slick-slide {
+    margin: 10px 10px;
+    }
+</style>
\ No newline at end of file
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_section_popular_topics.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_popular_topics.html.liquid
new file mode 100644
index 00000000..faf6a7ef
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_popular_topics.html.liquid
@@ -0,0 +1,15 @@
+ <div class="np-homepage-featured np-homepage-topics np-max-width">
+    <div class="np-homepage-featured-text">
+      <div class="np-homepage-headline">
+        Popular Topics
+      </div>
+    </div>
+     <div class="np-topics-list row">
+        <div class="col-xs-12 np-stretch-content"> 
+          {% assign categories_by_name = current_school.filterable_categories | sort: "name" %}
+            {% for category in categories_by_name %}
+                <a class="np-top-button np-button np-button-secondary" href="#">{{ category.name }}</a>
+            {% endfor %}
+        </div>
+    </div>
+  </div>
\ No newline at end of file
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_section_professionals.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_professionals.html.liquid
new file mode 100644
index 00000000..ae4e5a73
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_professionals.html.liquid
@@ -0,0 +1,118 @@
+<div class="np-homepage-featured np-homepage-tips-tricks np-max-width">
+    <div class="np-homepage-featured-text">
+    <div class="np-homepage-headline">
+        Professional Climbers 
+    </div>
+    </div>
+
+    <div class="tips-tricks-carousel np-carousel" id="tips-tricks-carousel">
+        <div class="np-carousel-card">
+            <video class='left-video' autoplay muted loop>
+                <source type="video/mp4" src="https://i.imgur.com/IizyBxj.mp4">
+            </video>
+            <div class='review'>
+                <div class='review-text'>
+                    “Enlightenment isn't found with a full stomach or a soft pillow.”
+                </div>
+                <div class='review-name'>
+                    Cory Richards
+                </div>
+                <div class='review-title'>
+                    Professional Mountain Climbers & Photographer
+                </div>
+            </div>
+        </div>
+        <div class="np-carousel-card">
+            <video class='left-video' autoplay muted loop>
+                <source type="video/mp4" src="https://i.imgur.com/HS7PW7n.mp4">
+            </video>
+            <div class='review'>
+                <div class='review-text'>
+                    “If you don't own your grunt work, can you really say you've done the climb?”                </div>
+                <div class='review-name'>
+                    Tommy Caldwell
+                </div>
+                <div class='review-title'>
+                    Multiple First Ascents in Yosemite National Park
+                </div>
+            </div>
+        </div>
+        <div class="np-carousel-card">
+            <video class='left-video' autoplay muted loop>
+                <source type="video/mp4" src="https://i.imgur.com/wMtE1Yt.mp4">
+            </video>
+            <div class='review'>
+                <div class='review-text'>
+                    “Fear is always there; it's a survival instinct. You just need to know how to manage it.               </div>
+                <div class='review-name'>
+                    Jimmy Chin
+                </div>
+                <div class='review-title'>
+                    World-class videographer, photographer, and climber.
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<style>
+    .left-video {
+        border-radius: 18px;
+        border: black 8px solid;
+        position: relative;
+        height: 380px;
+        width: 660px;
+        object-fit: fill;
+        left: 100px;
+        top: -100px;
+    }
+    .review {
+        background: black;
+        border-radius: 5px;
+        padding: 100px 150px;
+        width: 70%;
+    }
+    .review-text {
+        font-size: 24px;
+    }
+    .review-name {
+        font-size: 18px;
+        padding-top: 25px;
+        padding-bottom: 10px;
+        color: lightgrey;
+    }
+    .review-title {
+        color: lightgray;
+    }
+    .tips-tricks-carousel .slick-list {
+        height: 580px;
+    }
+    .tips-tricks-carousel .slick-initialized .slick-slide {
+        width: 100% !important;
+        margin: auto;
+        position: relative;
+        top: 100px;
+    }
+    .tips-tricks-carousel .np-carousel-card {
+        margin: auto !important;
+    }
+    .tips-tricks-carousel div.slick-list:nth-child(1) > div:nth-child(1) {
+        height: 700px;
+    }
+</style>
+
+<script>
+    $(document).ready(function(){
+        $("#tips-tricks-carousel").slick({
+            slidesToShow: 1,
+            slidesToScroll: 1,
+            cssEase: 'linear',
+            arrows: false,
+            infinite: true,
+            dots: true,
+            autoplay: true,
+            autoplaySpeed: 5000
+        });
+    });
+	
+</script>
\ No newline at end of file
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_sub_navigation.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_sub_navigation.html.liquid
new file mode 100644
index 00000000..a1ac085b
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_sub_navigation.html.liquid
@@ -0,0 +1,44 @@
+<main class="np-main np-catalog np-subpage-container np-max-width">
+  <div class="np-catalog-header-wrapper">
+    <div class="filter-buttons">
+      <button class="filter-buttons-button" id='home'>Home</button>
+      <button class="filter-buttons-button" id='catalog'>Course Catalog</button>
+      <button class="filter-buttons-button" id='videos'>Videos</button>
+      <button class="filter-buttons-button" id='instructors'>Professional Climbers</button>
+      <button class="filter-buttons-button" id='live-courses'>Live Courses</button>
+      <button class="filter-buttons-button" id='community'>Mountain Project</button>
+    </div>
+  </div>
+
+  <style>
+    .np-catalog-header-wrapper {
+      display: block;
+      width: 80%;
+      margin: auto;
+    }
+
+    .filter-buttons {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-evenly;
+    }
+
+    .filter-buttons-button {
+      background: none;
+      border: white 1px solid;
+      border-radius: 30px;
+      color: white;
+      padding: 15px 20px;
+      font-size: 18px;
+      cursor: pointer;
+    }
+  </style>
+
+  <script>
+    $('#home').click(function () { window.location.replace('/app') })
+    $('#catalog').click(function () { window.location.replace('/app/catalog') })
+    $('#videos').click(function () { window.location.replace('/app/videos') })
+    $('#instructors').click(function () { window.location.replace('/app/instructors') })
+    $('#live-courses').click(function () { window.location.replace('/app/live-courses') })
+    $('#community').click(function () { window.location.replace('/app/community') })
+  </script>
\ No newline at end of file
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/catalog.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/catalog.html.liquid
new file mode 100644
index 00000000..8ce1105b
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/catalog.html.liquid
@@ -0,0 +1,39 @@
+{% include "header" %}
+{% include "course_version_outdated_alert", courses: courses.in_catalog %}
+<div class="np-homepage-hero">
+  <div class="np-homepage-hero-image">
+  </div>
+  <div class="np-homepage-hero-content">
+    <div class="np-homepage-headline np-header-font-color">
+      Menlo Security Resrouces
+    </div>
+    <div class="np-homepage-subheadline np-header-font-color">
+      Resources to help you make the most of your Security Training
+    </div>
+  </div>
+</div>
+{% include "sub_navigation" %}
+  {% include "courses_catalog" %}
+</main>
+{% include "footer" %}
+
+<style>
+  .np-card-content-description {
+    height: 100px;
+  }
+  .np-card-content-title {
+    height: 58px;
+    overflow: clip;
+  }
+</style>
+
+
+<script>
+  window.onload = function() {
+    [].slice.call(document.getElementsByClassName("np-card-content-description")).forEach(function(element) {
+      if(element.innerText.length > 150){
+        element.innerText = element.innerText.slice(0,150) + '...'
+      }
+    });
+  }
+</script>
\ No newline at end of file
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/community.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/community.html.liquid
new file mode 100644
index 00000000..7140d448
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/community.html.liquid
@@ -0,0 +1,32 @@
+{% include 'header' %}
+<main class="np-main np-homepage">
+  <div class="np-homepage-hero">
+    <h1 class="community-headline">Explore</h1>
+  </div>
+  {% include 'sub_navigation' %}
+  <div class='discussion-container' style="border: 18px solid rgb(0, 0, 0); overflow: hidden; margin-left: 100px; margin-top: 35px; width: 1065px;">
+    <iframe scrolling="yes" src="https://www.mountainproject.com/partner-finder" style="border: 0px none; margin-left: 15px auto; height: 1954px; margin-top: -100px; width: 1060px;"></iframe>
+    </div>
+</main>
+{% include 'footer' %}
+
+<style>
+  .discussion-frame {
+    min-width: 100%;
+    margin-left: -10px;
+    display: flex;
+    justify-content: center;
+  }
+
+  .discussion-container {
+    display: flex;
+    justify-content: center;
+  }
+
+  .community-headline {
+    font-size: 32px;
+    line-height: 48px;
+    font-family: "Raleway", "Helvetic", "Arial" sans-serif;
+    color: #ffffff;
+  }
+</style>
\ No newline at end of file
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/styles.css.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/styles.css.liquid
new file mode 100644
index 00000000..5397df18
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/styles.css.liquid
@@ -0,0 +1,1781 @@
+/*
+ Put your custom overlay styles in here
+ You can use your northpass color palette in this file
+
+{{ color_palette.button_font_color }}
+{{ color_palette.button_color }}
+{{ color_palette.button_hover_color }}
+{{ color_palette.header_font_color }}
+{{ color_palette.header_font_hover_color }}
+{{ color_palette.header_color }}
+*/
+
+/**** TABLE OF CONTENTS ========
+
+1.0 - GLOBAL STYLING
+2.0 - PAGE SPECIFIC STYLING
+    2.1 - HOMEPAGE
+    2.2 - DASHBOARD
+    2.3 - CATALOG
+    2.4 - COURSE COVER PAGE
+    2.5 - TRAINING SESSION
+    2.6 - LOGIN PAGE
+    2.7 - LEARNING PATH COVER PAGE
+3.0 - COMPONENT SPECIFIC STYLING
+    3.1 - HEADER
+    3.2 - SUB NAV
+    3.3 - FOOTER
+    3.4 - BUTTONS
+    3.5 - HEADINGS, SUBHEADS & GENERAL TEXT
+    3.6 - COURSE CARD
+    3.7 - LEARNING PATH CARD
+    3.8 - TRAINING EVENT CARD
+    3.9 - COURSE BANNER  
+    3.10 - COURSE DETAILS
+    3.11 - COURSE OUTLINE
+    3.12 - FILTER DROPDOWN
+    3.13 - CAROUSEL - GLOBAL STYLES
+    3.14 - CAROUSEL - EVENTS
+    3.15 - CAROUSEL - COURSES
+    3.16 - CAROUSEL - INSTRUCTORS    
+    3.17 - HOMEPAGE SECTION - FEATURED PHOTOGRAPHY 
+    3.18 - HOMEPAGE SECTION - TIPS & TRICKS
+    3.19 - HOMEPAGE SECTION - FAQS
+    3.20 - HOMEPAGE SECTION - FEATURED COURSES
+*/
+
+/*
+    1.0 GLOBAL SYLING  
+*/
+body {
+  background: #1d1f21;
+  font-family: "Helvetica Neue", "Arial", sans-serif;
+}
+
+div {
+  color: #fff;
+}
+.np-color-white {
+  color: #fff;
+}
+.np-main {
+  background: #1d1f21;
+}
+
+.np-main .np-resource-title,
+.np-main .np-resource-subtitle,
+.np-top-title,
+.np-training-session-sessions-title,
+.np-content-instructors-content-name,
+.np-content-instructors-content-info {
+  color: #fff;
+}
+
+.np-main .np-resource-subtitle,
+.np-training-session-sessions-title,
+.np-content-instructors-content-info {
+  opacity: 0.5;
+}
+
+.np-resource-title {
+  font-weight: bold;
+}
+.np-card-image {
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+  justify-content: center;
+  position: relative;blank
+}
+
+.np-resource-header-card {
+  background: transparent;
+  box-shadow: none;
+  color: #fff;
+}
+
+.np-dashboard-border {
+  background: transparent;
+  border: 1px solid rgba(255, 255, 255, 0.15);
+}
+
+.np-dashboard-border .np-card-content,
+.np-dashboard-border.np-card-container {
+  background: transparent;
+  border: 1px solid rgba(255, 255, 255, 0.15);
+}
+.np-dashboard-resources .np-card:last-of-type {
+  padding-bottom: 1rem;
+}
+
+.np-card-content-divider {
+  border-top: 1px solid rgba(255, 255, 255, 0.15);
+  margin-top: 3rem;
+  padding-top: 3rem;
+}
+
+.np-top-cta {
+  background: #1d1f21;
+  border-radius: 0;
+}
+.np-text-light {
+  color: rgba(255, 255, 255, 0.5);
+}
+.np-flex-wrapper {
+  display: flex;
+}
+
+.choices__list--dropdown .choices__item {
+  color: #002532;
+}
+.dropdown [type="checkbox"]:checked + label:before {
+  background-color: #298e4e;
+}
+
+.dropdown-button-apply {
+  background: #0297FA !important;
+  color: #fff;
+}
+
+.np-zero-state-text {
+  color: #fff;
+  opacity: 0.5;
+}
+.np-dashboard-resources-container,
+.np-learning-paths-resources-container {
+  border: 1px solid rgba(255, 255, 255, 0.5);
+  border-radius: 0;
+}
+
+.np-course-version-outdated-popup-trigger,
+.np-popup-header-icon {
+  color: #2bb24c;
+}
+.np-popup-tooltip {
+  background-color: black;
+  color: #fff;
+  border: 2px solid rgba(255, 255, 255, 0.5);
+  border-radius: 0;
+  bottom: 30px;
+  box-shadow: 0 2px 8px 0 rgb(53 64 78 / 25%);
+}
+.np-popup-header {
+  background-color: black;
+  border-radius: 0;
+  color: #fff;
+}
+.np-popup-body,
+.np-popup-header-title {
+  color: #fff;
+}
+.np-popup-body-button {
+  background: #0297FA;
+  border-radius: 0;
+  text-transform: uppercase;
+}
+
+.np-alert.np-alert-info {
+  background: #0297FA;
+}
+
+@media (min-width: 768px) {
+  .np-md-flex-wrapper {
+    display: flex;
+  }
+}
+
+/* 
+    2.0 - PAGE SPECIFIC STYLING  
+*/
+
+/* 
+    2.1 - HOMEPAGE  
+*/
+.np-homepage-hero-image {
+  height: 250px;
+}
+
+.np-homepage-hero-content {
+  padding: 2.25rem 2.5rem;
+  bottom: 0;
+}
+.np-homepage-featured-text {
+  padding: 0 2rem 2rem;
+}
+.np-homepage-featured {
+  margin-top: 4rem;
+}
+.np-homepage-featured .np-homepage-headline,
+.np-homepage-featured .np-homepage-subheadline {
+  color: #fff;
+}
+
+.np-homepage-hero .np-homepage-headline {
+  font-size: 32px;
+  line-height: 48px;
+  font-family: "Helvetica Neue", "Arial", sans-serif;
+}
+.np-homepage-featured .np-homepage-subheadline {
+  opacity: 0.5;
+}
+
+.np-homepage-hero-cta,
+.np-button.np-homepage-hero-cta {
+  margin-top: 1.5rem;
+  background: #1d1f21;
+  text-transform: uppercase;
+  height: 40px;
+}
+
+.np-topics-list {
+  margin: 0 4%;
+}
+.np-topics-list .np-stretch-content {
+  flex-flow: row wrap;
+}
+.np-topics-list .np-button-secondary {
+  margin: 6px 0;
+  flex: 0 1 1;
+}
+
+.np-topics-list .np-button.np-top-button {
+  text-transform: none;
+  padding: 0 1rem;
+  white-space: normal;
+  text-align: center;
+}
+
+@media screen and (min-width: 768px) {
+  .np-homepage-featured-text {
+    padding: 0 4rem 2rem;
+  }
+  .np-homepage-hero-image {
+    height: auto;
+    min-height: 250px;
+  }
+  .np-homepage-hero-content {
+    padding: 5rem 4rem 2.25rem;
+    bottom: 0;
+  }
+
+  .np-homepage-hero-cta,
+  .np-button.np-homepage-hero-cta {
+    margin-top: 2.25rem;
+    height: 50px;
+  }
+
+  .np-homepage-hero .np-homepage-headline {
+    font-size: 36px;
+    line-height: 45px;
+  }
+  .np-homepage-hero .np-homepage-subheadline {
+    font-size: 18px;
+    line-height: 24px;
+  }
+  .np-button {
+    font-size: 0.875rem;
+    height: 40px;
+    color: #1d1f21;
+  }
+
+  .np-topics-list {
+    margin: 0 4.5%;
+  }
+  .np-topics-list .np-button-secondary {
+    margin: 6px;
+    flex: 0 1 calc(33.33% - 12px);
+    height: 52px;
+  }
+}
+
+@media screen and (min-width: 992px) {
+  .np-homepage-hero-image {
+    min-height: 250px;
+  }
+  .np-homepage-hero-content {
+    bottom: auto;
+  }
+
+  .np-homepage-hero .np-homepage-headline {
+    font-size: 58px;
+    line-height: 72px;
+  }
+  .np-homepage-hero .np-homepage-subheadline {
+    font-size: 24px;
+    line-height: 32px;
+  }
+  .np-topics-list .np-button-secondary {
+    flex: 0 1 calc(25% - 12px);
+  }
+  .np-homepage-featured {
+    margin-top: 6.25rem;
+  }
+}
+
+@media screen and (min-width: 1200px) {
+  .np-topics-list .np-button-secondary {
+    flex: 0 1 calc(20% - 12px);
+  }
+  .np-homepage-hero .np-homepage-headline {
+    font-size: 66px;
+    line-height: 82px;
+  }
+}
+
+/* 
+    2.2 - DASHBOARD PAGE  
+*/
+
+.np-dashboard {
+  background: #1D1F21;
+}
+
+.np-dashboard-resources-title {
+  color: #fff;
+  opacity: 0.5;
+  margin-bottom: 19px;
+}
+
+.np-dashboard .np-dashboard-resources-title,
+.np-dashboard .np-md-flex-wrapper {
+  margin-bottom: 19px;
+}
+.np-dashboard .dashboard-section-courses .np-dashboard-resources-title {
+  margin-bottom: 0;
+}
+.np-dashboard .np-learning-paths-resources .np-card {
+  padding-bottom: 2.187rem;
+}
+
+.np-dashboard-resources-category {
+  font-size: 20px;
+  line-height: 25px;
+  display: block;
+  font-weight: 500;
+  margin-top: 4px;
+}
+
+@media (min-width: 768px) {
+  .np-dashboard .np-md-flex-wrapper .np-dashboard-resources-title {
+    margin-bottom: 0;
+  }
+  .np-dashboard-resources-title {
+    font-size: 0.937rem;
+  }
+  .np-dashboard .np-md-flex-wrapper {
+    justify-content: space-between;
+    align-items: flex-end;
+  }
+}
+
+/* 
+    2.3 - CATALOG  
+*/
+
+.np-catalog .np-progress-filter-wrapper,
+.np-catalog .np-filter {
+  margin-bottom: 24px;
+}
+.catalog-filters {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+}
+
+@media (min-width: 768px) {
+  .np-catalog-header {
+    align-items: start;
+  }
+  .np-catalog .np-progress-filter-wrapper,
+  .np-catalog .np-filter {
+    margin: 0;
+  }
+}
+
+/* 
+    2.4 - COURSE COVER PAGE  
+*/
+#course-desktop .np-course-content {
+  background: #1d1f21;
+  padding: 0;
+}
+#course-mobile .np-card-container {
+  background: #1d1f21;
+  margin-top: 0;
+  border: 1px solid rgba(255, 255, 255, 0.15);
+}
+.np-content-instructors-content-name {
+  font-size: 1.062rem;
+  margin-bottom: 3px;
+}
+.np-content-instructors-content-info {
+  font-size: 0.937rem;
+}
+
+.np-content-categories-content-item {
+  background: #1d1f21;
+  color: #fff;
+}
+
+/*
+    2.5 TRAINING SESSION
+*/
+
+.np-training-session-tile,
+.np-training-session-tile:hover {
+  background-color: black;
+  border-radius: 0;
+  color: #fff;
+}
+
+.np-training-session-tile-icon,
+.np-training-session .np-top-vocabulary .np-training-session-icon,
+.np-button-color.np-training-session-icon {
+  color: #2bb24c;
+}
+.np-training-session-tile-chevron {
+  color: #fff;
+}
+
+.np-training-session .np-card-training-session-date-bar {
+  left: 0;
+  right: auto;
+  transform: rotate(180deg);
+}
+
+.np-training-session-zero-state {
+  border: 1px solid rgba(255, 255, 255, 0.5);
+  border-radius: 0px;
+}
+
+/*
+    2.6 LOGIN PAGE
+*/
+
+.np-account .np-form-action {
+  background: #0297FA;
+  text-transform: uppercase;
+}
+.np-input-label {
+  color: #fff;
+  font-size: 0.85rem;
+  margin-bottom: 0.35rem;
+  opacity: 0.75;
+}
+
+.np-account-avatar p {
+  color: #fff;
+}
+.terms-of-service a {
+  color: #2bb24c;
+}
+.np-account-avatar-choice .np-button-secondary {
+  background: transparent !important;
+  border: 1px solid rgba(255, 255, 255, 0.5);
+  color: #fff;
+  height: 40px !important;
+}
+
+.np-open-access .np-box,
+.np-open-access .np-box .np-header-color {
+  border-radius: 0;
+  background: #1d1f21;
+  box-shadow: none;
+}
+.np-open-access .np-alert.np-alert-error,
+.np-open-access .np-box .np-box-content-container .np-form-action {
+  background: #0297FA;
+}
+
+.np-open-access .np-box .np-box-content-container .np-form-headline {
+  color: #fff;
+  margin-bottom: 1.5rem;
+}
+
+.np-open-access .np-box .np-box-content-container .np-form-subheadline {
+  color: #fff;
+  opacity: 0.75;
+}
+
+.np-open-access .np-box .np-box-content-container .np-form-action {
+  background: #0297FA;
+  text-transform: uppercase;
+}
+
+/* 
+    2.7 - LEARNING PATH COVER PAGE  
+*/
+
+.np-learning-path-outline-inactive-item {
+  border: 1px solid rgba(255, 255, 255, 0.5);
+}
+
+.np-learning-path-outline-bar {
+  background: rgba(255, 255, 255, 0.5);
+  border-radius: 0;
+  width: 3px;
+}
+
+.np-top-image,
+.np-learning-path-outline-course-image {
+  border-radius: 0;
+}
+
+/* 
+    3.0 - COMPONENT SPECIFIC STYLING  
+*/
+
+/* 
+    3.1 - HEADER
+*/
+.np-header {
+  background: #fff;
+}
+
+.np-header.np-header-absolute {
+  position: absolute;
+  background: transparent;
+  border-bottom: none;
+}
+
+@media (min-width: 768px) {
+  .np-dashboard-header .np-resource-subtitle {
+    margin-bottom: 2.5rem;
+  }
+  .np-header-desktop-nav {
+    display: none;
+  }
+}
+
+@media (min-width: 1024px) {
+  .np-header-desktop-nav {
+    display: flex;
+  }
+}
+
+/* 
+    3.2 - SUB NAV  
+*/
+
+.np-sub-navigation {
+  background: #1d1f21;
+  margin-bottom: 1rem;
+  padding: 0 1rem 0;
+}
+
+.np-sub-navigation-content-item-link {
+  font-size: 22px;
+  justify-content: flex-end;
+  height: 30px;
+  color: #fff;
+  opacity: 0.5;
+}
+
+.np-sub-navigation-content-item-active .np-sub-navigation-content-item-link {
+  color: #fff;
+  opacity: 0.7;
+  font-weight: 500;
+  justify-content: flex-end;
+}
+
+.np-sub-navigation-content-item-active .np-sub-navigation-content-item-link,
+.np-sub-navigation-content-item-active .np-sub-navigation-content-item-bar {
+  opacity: 1;
+}
+
+.np-sub-navigation-content-item-bar {
+  background-color: #fff;
+  margin: 0 auto;
+  width: 100%;
+  opacity: 0;
+  display: block;
+  height: 0.2rem;
+}
+
+/* 
+    3.3 - FOOTER
+*/
+.np-footer + .np-powered-by {
+  background: #1d1f21;
+}
+.np-powered-by.show {
+  background: #1d1f21;
+}
+.np-footer-navigation-link,
+.np-footer-social-links-icon.np-button-color,
+.np-footer-support-link.np-button-color {
+  color: #1d1f21;
+}
+.np-footer-support-item {
+  color: #1d1f21;
+}
+
+/* 
+    3.4 - BUTTONS  
+*/
+
+.np-button {
+  border-radius: 0;
+}
+
+.np-top-button.np-button.np-button-secondary,
+.np-button.dropdown-button {
+  background-color: transparent !important;
+  background-image: none;
+  border: 1px solid rgba(255, 255, 255, 0.5);
+  color: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important
+  font-weight: 600;
+}
+
+.np-button.np-background-color,
+.np-button.np-top-button,
+.np-card-content-footer .np-button {
+  background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important
+  text-transform: uppercase;
+}
+
+button.enwYlE,
+button.enwYlE:hover {
+  background-color: transparent;
+  border: 1px solid rgba(255, 255, 255, 0.5);
+  border-radius: 0;
+  padding: 8px 12px;
+  color: #fff !important;
+}
+
+button.jryxug {
+  color: #fff;
+}
+.bpSgf,
+.fsgQJU {
+  color: rgba(255, 255, 255, 0.75) !important;
+}
+
+.mjmTc {
+  border-radius: 0 !important;
+}
+
+/* 3.5 - HEADINGS, SUBHEADS & GENERAL TEXT  */
+.np-card-heading {
+  font-size: 1.25rem;
+}
+.np-text-title {
+  color: #fff;
+  font-size: 0.937rem;
+}
+
+@media (min-width: 768px) {
+  .np-card-heading {
+    font-size: 1.5rem;
+    line-height: 1.875rem;
+  }
+  .np-card-text {
+    line-height: 1.75rem;
+  }
+}
+
+/* 
+    3.6 - COURSE CARD
+*/
+.np-card-container {
+  height: auto;
+  position: relative;
+  color: #fff;
+}
+
+.np-button.np-background-color, .np-button.np-top-button, .np-card-content-footer .np-button {
+  background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important
+}
+
+.np-card-container,
+.np-card-container-training-session {
+  background: #1d1f21;
+  border-radius: 0;
+  box-shadow: none;
+}
+
+.np-card-content np-card-content-vertical np-card-padding {
+  background: #1d1f21;
+}
+
+.np-card-padding,
+.np-card-padding-dynamic {
+  padding: 1.5rem;
+}
+
+.np-card-image-overlay {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  opacity: 0.9;
+}
+
+.np-card-image-content-top,
+.np-card-image-content-bottom {
+  position: absolute;
+  left: 1.5rem;
+  z-index: 1;
+}
+
+.np-card-image-content-top {
+  top: 1.5rem;
+}
+.np-card-image-content-bottom {
+  bottom: 1.5rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.np-card-image-content-bottom .np-card-content-progress {
+  color: #fff;
+  margin-top: 0;
+}
+.np-card-content {
+  background: black;
+}
+.np-card-content-footer {
+  margin-top: 1.2rem;
+}
+.np-card-content-footer .np-button {
+  width: 100%;
+  background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important;
+}
+
+@media screen and (min-width: 768px) {
+  .np-card-content-title {
+    font-size: 1.1rem;
+    flex: 1;
+  }
+
+  .np-card-image-content-top,
+  .np-card-image-content-bottom {
+    left: 1.5rem;
+    right: 1.5rem;
+  }
+
+  .np-card-image-content-top {
+    top: 1.5rem;
+  }
+  .np-card-image-content-bottom {
+    bottom: 1.5rem;
+  }
+  .np-card-padding,
+  .np-card-padding-dynamic {
+    padding: 1.5rem;
+  }
+}
+
+@media screen and (min-width: 1024px) {
+  .np-card-content-title {
+    font-size: 1.5rem;
+  }
+
+  .np-card-image-content-top,
+  .np-card-image-content-bottom {
+    left: 2rem;
+    right: 2rem;
+  }
+
+  .np-card-image-content-top {
+    top: 2rem;
+  }
+  .np-card-image-content-bottom {
+    bottom: 2rem;
+  }
+  .np-card-padding,
+  .np-card-padding-dynamic {
+    padding: 2rem;
+  }
+}
+
+/* 
+    3.7 - LEARNING PATH CARD  
+*/
+
+.np-learning-path .np-card-text-wrapper {
+  position: relative;
+  z-index: 2;
+}
+
+.np-learning-paths .np-card-content-description {
+  color: #fff;
+}
+.np-learning-path .np-card-content-title {
+  color: #fff;
+  flex: 2;
+}
+.np-learning-paths .np-learning-path .np-card-content-title {
+  flex: none;
+}
+.np-learning-path .np-card-content-progress {
+  color: #2bb24c;
+}
+.np-learning-path .np-card-content-footer .np-button {
+  width: auto;
+}
+
+@media (min-width: 768px) {
+  .np-learning-path-image {
+    width: 37%;
+  }
+  .np-card-content-title {
+    flex: 0;
+  }
+
+  .np-main:not(.np-training-events) .np-dashboard-resources .np-card {
+    padding-right: 0;
+    padding-left: 0;
+  }
+
+  .np-learning-paths .np-card-content {
+    padding: 2rem;
+    height: 100%;
+  }
+
+  .np-learning-path .np-card-content {
+    height: 100%;
+    display: flex;
+  }
+
+  .np-learning-path {
+    display: flex;
+  }
+}
+
+@media (min-width: 1024px) {
+  .np-learning-path {
+    display: flex;
+    min-height: 260px;
+  }
+}
+
+/* 
+    3.8 - TRAINING EVENTS CARD
+*/
+
+.np-event-card .np-card-container {
+  border: 2px solid rgba(255, 255, 255, 0.15);
+}
+
+.np-event-card .np-card-content {
+  padding: 1.062rem 1rem 1.062rem 1.25rem;
+  border-top: 2px solid rgba(255, 255, 255, 0.15);
+  flex: 0;
+}
+
+.np-card-content-training-event {
+  padding: 1rem 1rem 0.5rem;
+}
+.np-button.dropdown-calendar-button {
+  background: #0297FA;
+}
+.np-card-content-training-event .np-card-content-title,
+.np-card-content-training-event .np-card-content-subtitle {
+  color: #fff;
+}
+.np-card-content-training-event .np-card-content-subtitle {
+  opacity: 0.5;
+  flex: 1;
+}
+
+.np-card-training-session {
+  margin-top: 0.9rem;
+  border-radius: 0;
+  background: transparent;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-right: -10px;
+}
+
+.np-card-training-session .np-card-content-label {
+  background: rgba(255, 255, 255, 0.15);
+  border-radius: 0;
+  color: #fff;
+  padding: 3px 6px;
+  margin-bottom: 0;
+}
+
+.np-card-training-session-date-year,
+.np-card-training-session-date-month {
+  text-align: right;
+  color: #fff;
+}
+
+.np-training-session .np-card-training-session-date-year,
+.np-training-session .np-card-training-session-date-month {
+  text-align: left;
+}
+
+.np-card-training-session-date-day {
+  margin-right: 0;
+  margin-left: 5px;
+  color: #fff;
+}
+
+.np-card-training-session-date-year {
+  opacity: 0.5;
+}
+
+.np-card-training-session-date-bar {
+  border-bottom-right-radius: 0;
+  border-top-right-radius: 0;
+  right: 0;
+  left: auto;
+  width: 0;
+  height: 0;
+  border-top: 16px solid transparent;
+  border-bottom: 18px solid transparent;
+  border-right: 16px solid #2bb24c;
+  background: none;
+}
+
+.np-card-training-sessions-label {
+  color: #fff;
+}
+.np-event-card .np-card-container {
+  height: 100%;
+}
+.np-card-training-sessions {
+  background: transparent;
+  padding: 0;
+}
+.np-training-events .np-card-container {
+  background: transparent;
+  border-radius: 18px;
+  border: black 8px solid;
+}
+
+.np-training-events .np-card-container .np-card-content {
+  background: transparent;
+}
+
+.np-training-events .np-card-training-sessions .np-button {
+  background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important
+}
+
+.np-card-training-sessions .np-button .np-button-wide {
+  background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important
+  font-weight: 800;
+  text-transform: uppercase;
+  font-size: 0.875rem;
+  height: 40px;
+}
+
+.np-card-content np-card-content-vertical np-card-padding {
+  background: transparent;
+}
+
+@media (min-width: 768px) {
+  .np-card-content-training-event {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .np-card-content-training-event {
+    padding: 2rem 2rem 0.5rem;
+  }
+}
+
+/* 
+    3.9 - COURSE BANNER  
+*/
+.np-course-banner {
+  position: relative;
+  margin-bottom: 2.5rem;
+  padding: 0;
+}
+
+.np-course-banner-image {
+  display: block;
+  width: 100%;
+}
+
+.np-course-info.np-course-banner-info {
+  position: absolute;
+  bottom: 1.5rem;
+  left: 1.5rem;
+  width: 80%;
+}
+
+.np-course-banner .np-course-title {
+  font-size: 1.5rem;
+  margin-bottom: 2rem;
+  font-weight: bold;
+}
+
+@media (min-width: 768px) {
+  .np-course-banner-image {
+    margin: 0 0 0 auto;
+    width: 50%;
+  }
+
+  .np-course-banner-overlay {
+    background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%);
+      linear-gradient(90deg, #035262 0%, #035161 49.48%, rgba(3, 82, 98, 0) 73.44%);
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    left: 0;
+    top: 0;
+  }
+
+  .np-course-info.np-course-banner-info {
+    bottom: 2rem;
+    left: 2rem;
+    width: 75%;
+  }
+
+  .np-course-banner .np-course-title {
+    font-size: 3rem;
+    margin-bottom: 2.5rem;
+  }
+}
+
+@media (min-width: 1170px) {
+  .np-course-info.np-course-banner-info {
+    bottom: 5.25rem;
+    left: 6.25rem;
+    width: 60%;
+  }
+
+  .np-course-banner .np-course-title {
+    font-size: 4.125rem;
+    margin-bottom: 3.125rem;
+  }
+}
+
+/*
+    3.10 - COURSE DETAILS
+*/
+.np-course-details {
+  display: flex;
+}
+
+.np-course-detail {
+  font-size: 1.125rem;
+  color: #fff;
+  flex: 0 1 calc(33.33%);
+}
+
+.np-details-label {
+  text-transform: uppercase;
+  opacity: 0.5;
+  font-size: 0.75rem;
+  display: block;
+  font-weight: bold;
+  margin-top: 2px;
+}
+
+.np-divider {
+  border-top: none;
+}
+
+@media screen and (min-width: 768px) {
+  .np-course-detail {
+    font-size: 1.5rem;
+  }
+  .np-course-banner-info .np-course-details {
+    max-width: 430px;
+  }
+}
+
+@media (min-width: 1170px) {
+  .np-course-banner-info .np-course-detail {
+    font-size: 2rem;
+  }
+  .np-course-banner-info .np-details-label {
+    font-size: 1.062rem;
+    margin-top: 3px;
+  }
+}
+
+/*
+    3.11 - COURSE PROGRESS & CTA 
+*/
+.np-card-progress-bar-container,
+.np-progress-bar-container {
+  background: #263e47;
+  border-radius: 0;
+}
+
+.np-card-progress-bar {
+  border-radius: 0;
+  background-color: #2bb24c;
+}
+
+.np-top-cta-progress-title {
+  color: #fff;
+  text-transform: none;
+  margin-top: 0.7rem;
+  margin-bottom: 0.7rem;
+}
+.np-top-cta-progress-text {
+  color: #2bb24c;
+}
+
+.np-top-cta .np-top-button .np-button .np-button-big {
+  background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important
+}
+
+/*
+    3.12 - COURSE OUTLINE
+*/
+
+.np-course-outline-content {
+  margin-top: 20px;
+}
+.np-course-outline-content-section-name {
+  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
+}
+
+.np-course-outline-content-activity-list {
+  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
+  padding: 1rem 0;
+}
+
+.np-course-outline-content-activity-link {
+  color: #809299;
+  font-size: 0.937rem;
+}
+
+.np-course-outline-content-activity-link-completed {
+  color: #fff;
+  font-size: 0.937rem;
+  font-weight: 400;
+}
+
+.np-course-outline-content-activity-icon,
+.np-course-outline-content-activity-title {
+  color: rgba(255, 255, 255, 0.5);
+  font-size: 0.937rem;
+  padding: 0.15rem 1.25rem 0 0.75rem;
+}
+
+.np-course-outline-content-activity-icon.fa-check {
+  color: #2bb24c;
+}
+
+.np-course-outline-content-activity-icon.icon-course-not-started {
+  position: relative;
+  width: 20px;
+  height: 17px;
+  margin-left: 11px;
+  margin-right: 5px;
+}
+
+.np-course-outline-content-activity-icon.icon-course-not-started::before,
+.np-course-outline-content-activity-icon.icon-course-not-started::after {
+  content: "";
+  position: absolute;
+  width: 16px;
+  height: 2px;
+  background-color: rgba(255, 255, 255, 0.25);
+  left: 0;
+  top: 5px;
+}
+
+.np-course-outline-content-activity-icon.icon-course-not-started::before {
+  width: 9px;
+  top: 10px;
+}
+
+/*
+    3.12 - FILTER DROPDOWN
+*/
+
+.np-button.dropdown-button {
+  border: 2px solid rgba(255, 255, 255, 0.25);
+  padding: 9px 60px 9px 20px;
+  height: auto;
+  position: relative;
+  color: #fff;
+}
+
+.np-button.dropdown-button:before {
+  content: "";
+  position: absolute;
+  width: 20px;
+  height: 100%;
+  border-left: 2px solid rgba(255, 255, 255, 0.25);
+  right: 20px;
+  top: 0;
+}
+
+.np-button.dropdown-button:after {
+  content: "\f078";
+  font-family: "Font Awesome 5 Pro";
+  position: absolute;
+  width: 20px;
+  height: 100%;
+  color: rgba(255, 255, 255, 0.5);
+  right: 10px;
+  top: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 1rem;
+}
+
+.dropdown-menu {
+  border-radius: 0;
+  border: 1px solid rgba(255, 255, 255, 0.25);
+  color: #fff;
+  background-color: #1d1f21;
+  box-shadow: none;
+  top: 95%;
+}
+
+/*
+    3.13 - CAROUSEL - GLOBAL STYLES
+*/
+
+.np-carousel {
+  margin-bottom: 3rem;
+}
+.np-carousel-bg-blue {
+  background: black;
+}
+.np-carousel .slick-track {
+  display: flex;
+}
+.np-carousel .slick-slide {
+  height: auto;
+}
+.np-carousel .np-card {
+  height: 100%;
+}
+
+.np-carousel .slick-arrow {
+  color: #1d1f21;
+  font-size: 2.5rem;
+  opacity: 1;
+  transition: opacity 0.2s;
+  display: flex;
+  align-items: center;
+  top: 0;
+}
+
+.np-carousel .slick-arrow:before {
+  position: absolute;
+  width: 80px;
+  z-index: 500;
+  display: flex;
+  height: 100%;
+  align-items: center;
+  top: 0;
+}
+
+.np-carousel .slick-arrow.fa-chevron-left {
+  left: -8px;
+}
+
+.np-carousel .slick-arrow.fa-chevron-right {
+  right: -8px;
+  justify-content: flex-end;
+}
+
+.np-carousel .slick-arrow.fa-chevron-left:before {
+  background: linear-gradient(90deg, #242221 10%, rgba(0, 37, 50, 0) 100%);
+  cursor: pointer;
+}
+
+.np-carousel .slick-arrow.fa-chevron-right:before {
+  background: linear-gradient(90deg, #242221 10%, rgba(0, 37, 50, 0) 100%);
+  justify-content: flex-end;
+  cursor: pointer;
+}
+
+.np-carousel .slick-arrow.slick-disabled {
+  opacity: 0;
+  cursor: text;
+}
+.np-carousel-card .np-card {
+  padding-bottom: 0;
+}
+
+.np-carousel .slick-dots {
+  display: flex;
+  justify-content: space-between;
+  padding: 0;
+  margin: 0 auto;
+  max-width: 200px;
+}
+.np-carousel .slick-dots li button {
+  display: none;
+}
+
+.np-carousel .slick-dots li::marker {
+  color: #f47c5a;
+  font-size: 1.7rem;
+}
+
+@media (min-width: 768px) {
+  .np-carousel .slick-track {
+    margin-left: 0;
+  }
+
+  .np-carousel .slick-arrow.fa-chevron-right:before {
+    background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important;
+  }
+
+  .np-carousel .slick-arrow.fa-chevron-left:before {
+    background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important;
+  }
+}
+
+@media (min-width: 1024px) {
+  .np-carousel .slick-arrow:before {
+    width: 100px;
+  }
+}
+
+/*
+    3.14 - CAROUSEL - EVENTS
+*/
+.events-carousel {
+  background: black;
+  padding: 1.5rem 0;
+  margin: 0 1.1rem 3rem;
+}
+.events-carousel .slick-track {
+  padding: 0 8px;
+}
+.events-carousel .np-card {
+  padding: 0 0.8rem;
+}
+.events-carousel .slick-arrow.fa-chevron-right {
+  right: -26px;
+}
+.events-carousel .slick-arrow.fa-chevron-left {
+  left: -26px;
+}
+
+@media (min-width: 768px) {
+  .events-carousel .np-card {
+    padding: 0 1rem;
+  }
+  .events-carousel {
+    padding: 2rem 0;
+    margin: 0 0 3rem;
+  }
+  .events-carousel .slick-arrow.fa-chevron-right {
+    right: -8px;
+  }
+  .events-carousel .slick-arrow.fa-chevron-left {
+    left: -8px;
+  }
+}
+
+@media (min-width: 1170px) {
+  .events-carousel .np-card {
+    padding: 0 1rem;
+  }
+}
+
+/*
+    3.15 - CAROUSEL - COURSES
+*/
+
+@media (min-width: 768px) {
+  .courses-carousel {
+    margin-left: -1rem;
+    margin-right: -1rem;
+  }
+
+  .courses-carousel .np-carousel-card .np-card {
+    padding-right: 1rem;
+    padding-left: 1rem;
+  }
+}
+
+@media (min-width: 1024px) {
+  .courses-carousel {
+    margin-left: -2rem;
+    margin-right: -2rem;
+  }
+  .courses-carousel .np-carousel-card .np-card {
+    padding-right: 2rem;
+    padding-left: 2rem;
+  }
+}
+
+/*
+    3.16 - CAROUSEL - INSTRUCTORS
+*/
+.instructors-carousel .instructor-slide {
+  display: flex !important;
+  align-items: center;
+}
+.instructors-carousel .instructor-image {
+  border-radius: 50%;
+  width: 100px;
+  height: 100px;
+  min-width: 100px;
+  background: black;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-right: 16px;
+}
+
+.instructors-carousel .instructor-image img {
+  border-radius: 50%;
+  width: 80px;
+  height: 80px;
+}
+
+.instructors-carousel .instructor-name {
+  font-size: 18px;
+  line-height: 22px;
+  font-weight: bold;
+}
+
+.instructors-carousel .instructor-email {
+  font-size: 14px;
+  line-height: 18px;
+  font-weight: 500;
+  color: #2bb24c;
+  text-decoration: none;
+}
+
+.instructors-carousel .instructor-joined {
+  font-size: 14px;
+  line-height: 20px;
+  font-weight: 500;
+  opacity: 0.5;
+  margin-top: 16px;
+}
+
+@media (min-width: 1024px) {
+  .instructors-carousel {
+    margin-top: 32px;
+  }
+
+  .instructors-carousel .instructor-image {
+    width: 160px;
+    height: 160px;
+    min-width: 160px;
+    margin-right: 22px;
+  }
+
+  .instructors-carousel .instructor-image img {
+    width: 120px;
+    height: 120px;
+  }
+  .instructors-carousel .instructor-name {
+    font-size: 20px;
+    line-height: 25px;
+  }
+  .instructors-carousel .instructor-email {
+    font-size: 16px;
+    line-height: 20px;
+  }
+  .instructors-carousel .instructor-joined {
+    font-size: 16px;
+    margin-top: 20px;
+  }
+}
+
+/*
+    3.17 - HOMEPAGE SECTION - FEATURED PHOTOGRAPHY
+*/
+
+.featured-photography-carousel {
+  margin: 0 22px 3rem;
+  padding: 2rem 0;
+}
+.featured-photography-carousel .slick-track {
+  padding: 0 2rem;
+}
+.featured-photography-carousel .slick-arrow {
+  margin: 0 -10px;
+}
+
+.featured-photography-carousel .slide-label {
+  font-size: 0.9375rem;
+  margin-top: 8px;
+  font-weight: 600;
+}
+
+@media (min-width: 768px) {
+  .featured-photography-carousel {
+    margin: 0 2rem 3rem;
+  }
+  .featured-photography-carousel .slick-arrow {
+    margin: 0;
+  }
+}
+
+@media (min-width: 1024px) {
+  .featured-photography-carousel {
+    margin: 0 4.0625rem 3rem;
+  }
+}
+
+/*
+    3.18 - HOMEPAGE SECTION - TIPS & TRICKS
+*/
+
+.tips-tricks-carousel {
+  margin: 0 4% 3rem;
+}
+
+.tips-tricks-carousel .quote-block {
+  padding: 1.5rem;
+  font-size: 16px;
+  line-height: 20px;
+  font-weight: 500;
+  position: relative;
+  max-width: 752px;
+  margin: 0 2.5rem;
+}
+
+.tips-tricks-carousel.np-carousel .slick-arrow.fa-chevron-left:before,
+.tips-tricks-carousel.np-carousel .slick-arrow.fa-chevron-right:before {
+  background: none;
+}
+
+.tips-tricks-carousel .fa-quote-left {
+  font-size: 32px;
+  position: absolute;
+  top: 0px;
+  left: -20px;
+  background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+}
+
+.tips-tricks-carousel .quote-author-info {
+  font-size: 17px;
+  padding-right: 1.5rem;
+  text-align: right;
+  margin: 1rem 2.5rem 0;
+}
+
+.tips-tricks-carousel .quote-author-info span {
+  font-size: 15px;
+  font-weight: 500;
+  opacity: 0.5;
+}
+
+@media (min-width: 1024px) {
+  .tips-tricks-carousel {
+    margin: 0 4.0625rem 3rem;
+  }
+
+  .tips-tricks-carousel .np-carousel-card {
+    display: flex !important;
+    align-items: center;
+    margin: 0 120px 0 180px;
+  }
+
+  .tips-tricks-carousel .quote-block {
+    padding: 3.75rem;
+    font-size: 24px;
+    line-height: 30px;
+    margin: 0;
+  }
+
+  .tips-tricks-carousel .fa-quote-left {
+    font-size: 50px;
+    top: 15px;
+    left: -30px;
+  }
+
+  .tips-tricks-carousel .quote-author-info {
+    font-size: 20px;
+    margin: 0;
+    margin-left: 48px;
+    padding: 0;
+    text-align: left;
+  }
+
+  .tips-tricks-carousel .quote-author-info span {
+    font-size: 16px;
+  }
+}
+
+@media (min-width: 1024px) and (max-width: 1440px) {
+  .tips-tricks-carousel {
+    margin: 0 4.514vw 3rem;
+  }
+
+  .tips-tricks-carousel .np-carousel-card {
+    margin: 0 8.333vw 0 12.5vw;
+  }
+
+  .tips-tricks-carousel .quote-block {
+    padding: 3.472vw;
+    font-size: 1.667vw;
+    line-height: 2.083vw;
+    max-width: 52.222vw;
+  }
+
+  .tips-tricks-carousel .fa-quote-left {
+    font-size: 3.472vw;
+    top: 1.042vw;
+    left: -2.083vw;
+  }
+
+  .tips-tricks-carousel .quote-author-info {
+    font-size: 1.389vw;
+    margin-left: 3.333vw;
+  }
+  .tips-tricks-carousel .quote-author-info span {
+    font-size: 1.111vw;
+  }
+}
+
+/*
+    3.19 - HOMEPAGE SECTION - FAQ
+*/
+
+.np-faq {
+  margin-bottom: 3rem;
+}
+.np-accordion {
+  margin: 0 22px 32px;
+}
+
+.accordion-btn {
+  background-color: black;
+  color: #fff;
+  cursor: pointer;
+  width: 100%;
+  min-height: 76px;
+  padding: 0 18px 0 92px;
+  text-align: left;
+  border: none;
+  outline: none;
+  transition: 0.4s;
+  position: relative;
+  display: flex;
+  align-items: center;
+}
+
+.fa-plus {
+  background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important;
+}
+.fa-minus {
+  background: linear-gradient(-134deg, #faccbe -10%, #f47c5a 100%) !important;
+}
+
+.fa-plus,
+.fa-minus {
+  font-size: 2.5rem;
+  color: #fff;
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 76px;
+  height: 76px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: 0.4s;
+}
+
+.accordion-title,
+.accordion-panel-content {
+  line-height: 1.375rem;
+  position: relative;
+}
+.accordion-panel-content {
+  padding: 18px;
+}
+.accordion-panel-content p {
+  margin-top: 0;
+}
+
+.accordion-panel-content:before {
+  content: "";
+  width: 75px;
+  height: 1px;
+  background: #2bb24c;
+  position: absolute;
+  top: 0;
+  left: 18px;
+}
+
+.accordion-panel {
+  background-color: black;
+  max-height: 0;
+  overflow: hidden;
+  transition: max-height 0.4s ease-out;
+  margin-left: 76px;
+}
+
+@media (min-width: 768px) {
+  .np-faqs {
+    margin: 0 4.0625rem;
+  }
+  .np-accordion {
+    margin: 0 8px 32px;
+  }
+}
+
+/*
+    3.20 - HOMEPAGE SECTION - FEATURED COURSES
+*/
+
+.np-homepage-featured-courses .np-card-container {
+  margin-bottom: 32px;
+  border: white 2px solid;
+}
+.np-homepage-featured-courses .col-xs-12:last-child .np-card-container {
+  margin-bottom: 0;
+}
+.np-featured-course {
+  display: block;
+}
+.np-featured-course.np-learning-path .np-card-content-progress {
+  color: #fff;
+}
+.np-featured-course .np-card-content-title {
+  flex: 0;
+  margin: 0 0 2px;
+  overflow: none;
+}
+.np-featured-course .np-card-content-subtitle {
+  opacity: 0.5;
+}
+.np-featured-course .np-card-content-description {
+  color: #fff;
+  display: block;
+  line-height: 20px;
+  font-size: 1rem;
+}
+.np-featured-course .np-card-image-content-top {
+  width: 90%;
+}
+.np-featured-course-img-container {
+  position: relative;
+}
+.np-featured-course .np-card-text-wrapper {
+  flex: 2;
+}
+.np-featured-course-img-container .featured-video{
+  height: 275px;
+  display: block;
+}
+
+@media (min-width: 992px) {
+  .np-featured-course {
+    display: flex;
+  }
+  .np-featured-course-img-container img {
+    position: absolute;
+    width: auto;
+    height: 100%;
+  }
+  .np-featured-course-img-container {
+    width: 40%;
+  }
+}
+
+@media (min-width: 1200px) {
+  .np-featured-course-img-container {
+    width: 33.33%;
+  }
+}
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/training_events.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/training_events.html.liquid
new file mode 100644
index 00000000..08b79045
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/training_events.html.liquid
@@ -0,0 +1,39 @@
+{% include "header" %}
+<div class="np-homepage-hero">
+  <div class="np-homepage-hero-image">
+  </div>
+  <div class="np-homepage-hero-content">
+    <div class="np-homepage-headline np-header-font-color">
+      Menlo Learning Program
+    </div>
+    <div class="np-homepage-subheadline np-header-font-color">
+      Resources to help you make the most of your Security Training
+    </div>
+  </div>
+</div>
+{% include "sub_navigation" %}
+<main class="np-main np-training-events np-subpage-container np-max-width">
+  <div class="row">
+    <div class="iframe_div">
+      <iframe
+	style= "border: 3px solid #B2D7C7;"
+	width="100%" height="1000"
+	src="https://calendar.google.com/calendar/u/0/embed?src=pmtpcalendar@gmail.com&ctz=America/New_York"
+	title="Wild Health Public Calendar"
+      	 >
+      </iframe>
+    </div>
+</main>
+{% include "footer" %}
+
+<style>
+.iframe_div {
+  display: block;
+  overflow: hidden;
+  width: 99%;
+  height: 999px;
+  border-radius: 12px;
+  transform: translateZ(0px);
+  border: 3px solid #B2D7C7;
+}
+</style>
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/videos.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/videos.html.liquid
new file mode 100644
index 00000000..4a385f1f
--- /dev/null
+++ b/Custom_Templates/customer_templates/Norm_sandbox_2/videos.html.liquid
@@ -0,0 +1,117 @@
+{% include "header" %}
+{% include "course_version_outdated_alert", courses: courses.in_catalog %}
+<div class="np-homepage-hero">
+<div class="np-homepage-hero-image">
+</div>
+<div class="np-homepage-hero-content">
+    <div class="np-homepage-headline np-header-font-color">
+        Video Tutorials
+    </div>
+    <div class="np-homepage-subheadline np-header-font-color">
+        Beginner to advanced level training for the die-hard climber 
+    </div>
+</div>
+</div>
+{% include "sub_navigation" %}
+<div class='video-carousel'>
+    <div class='video-carousel-title'>
+        Getting Started
+    </div>
+    <div class='video-carousel-carousel-1'>
+        {% for course in courses.in_catalog %}
+            <div class='col-xs-12 col-md-6 col-lg-4 np-stretch-content'>
+                {% include "cards_course" with course %}
+            </div>
+        {% endfor %}
+    </div>
+</div>
+<div class='video-carousel'>
+    <div class='video-carousel-title'>
+        Bouldering
+    </div>
+    <div class='video-carousel-carousel-2'>
+        {% for course in courses.in_catalog %}
+            <div class='col-xs-12 col-md-6 col-lg-4 np-stretch-content'>
+                {% include "cards_course" with course %}
+            </div>
+        {% endfor %}
+    </div>
+</div>
+<div class='video-carousel'>
+    <div class='video-carousel-title'>
+        Roped Climbing
+    </div>
+    <div class='video-carousel-carousel-3'>
+        {% for course in courses.in_catalog %}
+            <div class='col-xs-12 col-md-6 col-lg-4 np-stretch-content'>
+                {% include "cards_course" with course %}
+            </div>
+        {% endfor %}
+    </div>
+</div>
+{% include "footer" %}
+<style>
+    .video-carousel {
+        max-width: 85%;
+        margin: auto;
+        margin-top: 70px;
+    }
+    .video-carousel-title {
+        font-size: 26px;
+        padding: 15px 0;
+    }
+    .slick-slider {
+        display: flex;
+    }
+    .slick-arrow {
+        background: none;
+        border: none;
+        color: white;
+        font-size: 82px;
+        font-weight: 100;
+        position: relative;
+        cursor: pointer;
+    }
+    .slick-prev {
+        left: -20px;
+    }
+    .slick-next {
+        right: -20px;
+    }
+    .np-card-content-description {
+    height: 100px;
+  }
+  .np-card-content-title {
+    height: 85px;
+    overflow: clip;
+  }
+</style>
+
+<script>
+    $(".np-sub-navigation-content-item:contains('Videos')").addClass('np-sub-navigation-content-item-active')
+    $(".video-carousel-carousel-1").slick({
+        prevArrow: '<button type="button" class="slick-prev"><i class="fas fa-chevron-left"></i></button>',
+        nextArrow: '<button type="button" class="slick-next"><i class="fas fa-chevron-right"></i></button>',
+        infinite: false,
+        slidesToShow: 3,
+    })
+    $(".video-carousel-carousel-2").slick({
+        prevArrow: '<button type="button" class="slick-prev"><i class="fas fa-chevron-left"></i></button>',
+        nextArrow: '<button type="button" class="slick-next"><i class="fas fa-chevron-right"></i></button>',
+        infinite: false,
+        slidesToShow: 3,
+    })
+    $(".video-carousel-carousel-3").slick({
+        prevArrow: '<button type="button" class="slick-prev"><i class="fas fa-chevron-left"></i></button>',
+        nextArrow: '<button type="button" class="slick-next"><i class="fas fa-chevron-right"></i></button>',
+        infinite: false,
+        slidesToShow: 3,
+    })
+    window.onload = function() {
+        [].slice.call(document.getElementsByClassName("np-card-content-description")).forEach(function(element) {
+        if(element.innerText.length > 150){
+            element.innerText = element.innerText.slice(0,150) + '...'
+        }
+        });
+    }
+</script>
\ No newline at end of file