diff --git a/.storybook/config.js b/.storybook/config.js
index 91e8d2965..e1e040b46 100644
--- a/.storybook/config.js
+++ b/.storybook/config.js
@@ -3,6 +3,7 @@
 
 import { addParameters, configure } from "@storybook/react";
 import "../packages/component-library/assets/global.styles.css";
+import { INITIAL_VIEWPORTS } from "@storybook/addon-viewport";
 import themeCIVIC from "./themeCIVIC";
 
 addParameters({
diff --git a/.storybook/themeCIVIC.js b/.storybook/themeCIVIC.js
index ea9d8dad0..46a7305ee 100644
--- a/.storybook/themeCIVIC.js
+++ b/.storybook/themeCIVIC.js
@@ -1,5 +1,5 @@
 import { create } from "@storybook/theming";
-import logo from "../packages/component-library/assets/civic-logo-c.svg";
+import logo from "../packages/component-library/assets/civic-logo-storybook.svg";
 
 export default create({
   base: "light",
diff --git a/packages/component-library/assets/civic-logo-storybook.svg b/packages/component-library/assets/civic-logo-storybook.svg
new file mode 100644
index 000000000..a144ddaf4
--- /dev/null
+++ b/packages/component-library/assets/civic-logo-storybook.svg
@@ -0,0 +1,12 @@
+<!--?xml version="1.0" encoding="UTF-8" standalone="no"?--><svg width="342.631" height="156.396" viewBox="0 0 343 157" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule: evenodd; clip-rule: evenodd; stroke-linejoin: round; stroke-miterlimit: 1.41421;"><path id="civic-logo2" width="342.631" height="156.396" style="fill:none;" d="M0.012 0 L342.643 0 L342.643 156.396 L0.012 156.396 Z" class="PpoHPhxp_0"></path><g id="logo-set"><path width="15.834" height="65.502" style="fill:#220f25;fill-rule:nonzero;" d="M109.2 36.639 L125.034 36.639 L125.034 102.14099999999999 L109.2 102.14099999999999 Z" class="PpoHPhxp_1"></path><path d="M140.534,36.639l16.501,0l10.5,40.001l10.334,-40.001l16.667,0l-20.001,65.502l-14,0l-20.001,-65.502Z" style="fill:#220f25;fill-rule:nonzero;" class="PpoHPhxp_2"></path><path width="15.834" height="65.502" style="fill:#220f25;fill-rule:nonzero;" d="M212.536 36.639 L228.37 36.639 L228.37 102.14099999999999 L212.536 102.14099999999999 Z" class="PpoHPhxp_3"></path><path d="M60.032,81.64c-6.834,-6.833 -6.834,-17.834 0,-24.5c3.333,-3.334 7.667,-5.001 12.334,-5.001c4.666,0 9,1.834 12.333,5.001l11.501,-11.501c-6.334,-6.333 -14.834,-9.833 -23.834,-9.833c-9.001,0 -17.501,3.5 -23.834,9.833c-13.167,13.167 -13.167,34.501 0,47.502c6.666,6.5 15.167,9.833 23.834,9.833c8.666,0 17.167,-3.333 23.834,-9.833l-11.501,-11.501c-6.833,6.667 -17.834,6.667 -24.667,0Z" style="fill:#220f25;fill-rule:nonzero;" class="PpoHPhxp_4"></path><path d="M264.032,81.64c-6.834,-6.833 -6.834,-17.834 0,-24.5c3.333,-3.334 7.667,-5.001 12.334,-5.001c4.666,0 9,1.834 12.333,5.001l11.501,-11.501c-6.334,-6.333 -14.834,-9.833 -23.834,-9.833c-9.001,0 -17.501,3.5 -23.834,9.833c-13.167,13.167 -13.167,34.501 0,47.502c6.666,6.5 15.167,9.833 23.834,9.833c8.666,0 17.167,-3.333 23.834,-9.833l-11.501,-11.501c-6.833,6.667 -17.834,6.667 -24.667,0Z" style="fill:#ee495c;fill-rule:nonzero;stroke:#ee495c;stroke-width:0.24px;" class="PpoHPhxp_5"></path><path d="M294.681,87.25c-8.491,8.512 -24.738,11.704 -36.798,-0.211c-6.483,-6.406 -12.338,-22.634 0.714,-35.951" style="fill:none;stroke:#220f25;stroke-width:16.5px;" class="PpoHPhxp_6"></path><path d="M326.54,123.475l-40.002,0l-15.167,15l-15,-15l-28.501,0l-213.339,0l0,-110.17l-10.334,-10.334l0,130.671l247.84,0l19.334,19.5l19.501,-19.5l46.001,0l-10.333,-10.167Z" style="fill:#220f25;fill-rule:nonzero;" class="PpoHPhxp_7"></path><path d="M4.197,2.971l10.334,10.334l312.009,0l0,110.17l10.333,10.167l0,-130.671l-332.676,0Z" style="fill:#ee495c;fill-rule:nonzero;" class="PpoHPhxp_8"></path></g><style>.PpoHPhxp_0{stroke-dasharray:999 1001;stroke-dashoffset:1000;animation:PpoHPhxp_draw 1320ms ease 0ms forwards;}.PpoHPhxp_1{stroke-dasharray:163 165;stroke-dashoffset:164;animation:PpoHPhxp_draw 1320ms ease 35ms forwards;}.PpoHPhxp_2{stroke-dasharray:267 269;stroke-dashoffset:268;animation:PpoHPhxp_draw 1320ms ease 70ms forwards;}.PpoHPhxp_3{stroke-dasharray:163 165;stroke-dashoffset:164;animation:PpoHPhxp_draw 1320ms ease 105ms forwards;}.PpoHPhxp_4{stroke-dasharray:274 276;stroke-dashoffset:275;animation:PpoHPhxp_draw 1320ms ease 140ms forwards;}.PpoHPhxp_5{stroke-dasharray:274 276;stroke-dashoffset:275;animation:PpoHPhxp_draw 1320ms ease 175ms forwards;}.PpoHPhxp_6{stroke-dasharray:81 83;stroke-dashoffset:82;animation:PpoHPhxp_draw 1320ms ease 210ms forwards;}.PpoHPhxp_7{stroke-dasharray:944 946;stroke-dashoffset:945;animation:PpoHPhxp_draw 1320ms ease 245ms forwards;}.PpoHPhxp_8{stroke-dasharray:915 917;stroke-dashoffset:916;animation:PpoHPhxp_draw 1320ms ease 280ms forwards;}@keyframes PpoHPhxp_draw{100%{stroke-dashoffset:0;}}@keyframes PpoHPhxp_fade{0%{stroke-opacity:1;}93.10344827586206%{stroke-opacity:1;}100%{stroke-opacity:0;}}
+ .PpoHPhxp_7, .PpoHPhxp_8 {
+                animation: opacfill 0.3s linear forwards;
+                animation-delay: 1.5s;
+                opacity: 0;
+            }
+
+           @keyframes opacfill {
+                0% { opacity: 0; }
+                100% { opacity: 1; }
+            }
+</style></svg>
\ No newline at end of file