diff --git a/css/styles.css b/css/styles.css
index b1491a75f6d7c1cd9fee5da981542c2e310ae093..2430c261d0cd2d8ec00727cca88f3b7e0f9f0373 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -3511,12 +3511,17 @@ button {
 .card.banner .card__media {
   margin-bottom: 0; }
 
-.card.banner .card__title a {
-  color: #fdd54f;
-  font-family: "BureauGrotCond Book","Barlow Condensed",impact,"avenir next condensed heavy","Droid Sans",sans-serif;
-  font-weight: 400;
-  letter-spacing: .045rem;
-  text-align: center; }
+.card.banner .card__title {
+  color: #fdd54f; }
+  .card.banner .card__title a {
+    color: #fdd54f;
+    font-family: "BureauGrotCond Book","Barlow Condensed",impact,"avenir next condensed heavy","Droid Sans",sans-serif;
+    font-weight: 400;
+    letter-spacing: .045rem;
+    text-align: center; }
+
+.card.banner .sub-title {
+  color: #fdd54f; }
 
 .uw-colour-bar__cbarorg-default__uw-gold--lvl1 {
   background-color: #fffaaa; }
diff --git a/js/component_scripts.min.js b/js/component_scripts.min.js
index ba3f6ea42c8ef589f811934a2768dcbb8334d8eb..04a5e1ca2cdfd40e1fc40cddc37bace988c1c300 100644
--- a/js/component_scripts.min.js
+++ b/js/component_scripts.min.js
@@ -302,7 +302,6 @@ else {
     attach: function (context, settings) {
       $(document).ready(function () {
 
-        console.log('HERE1');
         // Step through each FF on the page.
         $('.card.banner').each(function () {
 
diff --git a/source/_patterns/04-components/card/card--banner/_card--banner.scss b/source/_patterns/04-components/card/card--banner/_card--banner.scss
index 9a32b64fec01fc1e8029e5f6774aa48619d0026e..b062fe1cf8f88aa185b0de4325c7aa7405e4df54 100644
--- a/source/_patterns/04-components/card/card--banner/_card--banner.scss
+++ b/source/_patterns/04-components/card/card--banner/_card--banner.scss
@@ -21,6 +21,8 @@
   }
 
   .card__title {
+    color: $uw-gold;
+
     a {
       color: $uw-gold;
       font-family: "BureauGrotCond Book","Barlow Condensed",impact,"avenir next condensed heavy","Droid Sans",sans-serif;
@@ -29,4 +31,8 @@
       text-align: center;
     }
   }
+
+  .sub-title {
+    color: $uw-gold;
+  }
 }
\ No newline at end of file
diff --git a/source/_patterns/04-components/card/card--banner/card--banner.js b/source/_patterns/04-components/card/card--banner/card--banner.js
index dc64cac641f503fffec80b3c3bafeb62b1dfda4d..9e9a9d7c64c828d5a1919c7827b765f788d651fc 100644
--- a/source/_patterns/04-components/card/card--banner/card--banner.js
+++ b/source/_patterns/04-components/card/card--banner/card--banner.js
@@ -3,7 +3,6 @@
     attach: function (context, settings) {
       $(document).ready(function () {
 
-        console.log('HERE1');
         // Step through each FF on the page.
         $('.card.banner').each(function () {
 
diff --git a/source/_patterns/04-components/card/card--banner/card--banner.twig b/source/_patterns/04-components/card/card--banner/card--banner.twig
index cdc949e2918877bb8be4ad794f6f7fd0597f725d..9b151b0342945bf267d6d50406f3d008b4bcc41b 100644
--- a/source/_patterns/04-components/card/card--banner/card--banner.twig
+++ b/source/_patterns/04-components/card/card--banner/card--banner.twig
@@ -1,15 +1,15 @@
 {% embed '@layouts/carousel/carousel.twig' %}
   {% block content %}
-    {% for image in images %}
-      {% for img in image %}
-        {% include '@components/card/card.twig' with {
-          sources: img.sources,
-          img_element: img.img_element,
-          type: 'banner',
-          title: img.title,
-          header_level: 2,
-        } %}
-      {% endfor %}
+    {% for image in banners.images %}
+      {% include '@components/card/card.twig' with {
+        sources: image.sources,
+        img_element: image.img_element,
+        type: 'banner',
+        title: image.big_text,
+        sub_title: image.small_text,
+        header_level: 2,
+        url: image.link,
+      } %}
     {% endfor %}
   {% endblock %}
 {% endembed %}
\ No newline at end of file
diff --git a/source/_patterns/04-components/card/card--banner/card--banner.yml b/source/_patterns/04-components/card/card--banner/card--banner.yml
index e9549c06bb58181b2811274df218f2db76c87de5..44f6529d4db017a96eb7859d7df1ef1973e3ce05 100644
--- a/source/_patterns/04-components/card/card--banner/card--banner.yml
+++ b/source/_patterns/04-components/card/card--banner/card--banner.yml
@@ -1,6 +1,6 @@
-images:
-  -
-    image:
+banners:
+  images:
+    -
       sources:
         -
           srcset: '../../../../source/images/president/president_xlarge.jpg'
@@ -24,9 +24,10 @@ images:
           type: 'image/jpeg'
       img_element: '../../../../source/images/president/president_xlarge.jpg'
       alt: 'Alternative text'
-      title: 'Image1'
-  -
-    image:
+      big_text: 'Image1'
+      small_text: 'Caption 1'
+      link: 'http://google.ca'
+    -
       sources:
         - srcset: '../../../../source/images/president/president_xlarge.jpg'
           media: 'all and (min-width: 63.19rem)'
@@ -45,9 +46,8 @@ images:
           type: 'image/jpeg'
       img_element: '../../../../source/images/president/president_xlarge.jpg'
       alt: 'Alternative text'
-      title: 'Image2'
-  -
-    image:
+      big_text: 'Image2'
+    -
       sources:
         - srcset: '../../../../source/images/president/president_xlarge.jpg'
           media: 'all and (min-width: 63.19rem)'
@@ -66,4 +66,9 @@ images:
           type: 'image/jpeg'
       img_element: '../../../../source/images/president/president_xlarge.jpg'
       alt: 'Alternative text'
-      title: 'Image3'
+      big_text: 'Image3'
+      link: 'http://google.ca'
+  autoplay: 1
+  slide_speed: 7000
+  style: 'full-width'
+  transition_speed: 400
diff --git a/source/_patterns/04-components/card/card.twig b/source/_patterns/04-components/card/card.twig
index 08a4e850e2d6b331cc90509039f623f57cd8a946..20e42e62a7a73bb90f04d80ed5021ee3cdd2f6e7 100644
--- a/source/_patterns/04-components/card/card.twig
+++ b/source/_patterns/04-components/card/card.twig
@@ -23,10 +23,17 @@
 
       {% if title %}
         <h{{ header_level }} class="card__title">
-          <a href="{{ url }}">
-            {{ title }}
-          </a>
+          {% if url %}
+            <a href="{{ url }}">
+          {% endif %}
+          {{ title }}
+          {% if url %}
+            </a>
+          {% endif %}
         </h{{ header_level }}>
+        {% if sub_title %}
+          <span class="sub-title">{{ sub_title }}</span>
+        {% endif %}
       {% endif %}
 
       {% if author_name %}